supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Moving back to mustache templating

Browse Source
This commit is contained in:
Mattias Erming 2014-04-01 20:09:08 +02:00
parent 6e03377d7d
commit c3aee3d025
2 changed files with 40 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
client/index.html
View File

@ -57,12 +57,7 @@
<script type="text/html" id="network">
{{#networks}}
<div id="network-{{id}}" class="network list-group">
{{#each channels}}
<a href="{{name}}" id="channel-{{id}}" class="channel list-group-item">
<span class="badge pull-right"></span>
{{name}}
</a>
{{/each}}
{{> channels}}
</div>
{{/networks}}
</script>
@ -85,23 +80,15 @@
<a href="#" class="right">Users</a>
</div>
<h1>{{name}}</h1>
<button class="close btn btn-danger btn-sm ">Leave</button>
<button class="close btn btn-danger btn-sm ">
Leave
</button>
</div>
<div class="users">
{{#each users}}
<a href="{{name}}" class="user">
{{mode}}{{name}}
</a>
{{/each}}
{{> users}}
</div>
<div class="messages">
{{#each messages}}
<div class="message {{type}}">
<span class="time">{{time}}</span>
<a href="{{from}}" class="user">{{mode}}{{from}}</a>
<span class="text">{{type}} {{{link message}}}</span>
</div>
{{/each}}
{{> messages}}
</div>
<form onSubmit="return false;">
<input type="text" class="input" data-target="{{id}}"/>
@ -124,16 +111,16 @@
<div class="message {{type}}">
<span class="time">{{time}}</span>
<a href="{{from}}" class="user">{{mode}}{{from}}</a>
<span class="text">{{type}} {{{link message}}}</span>
<span class="text">{{type}} {{message}}</span>
</div>
{{/messages}}
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.0/jquery.cookie.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0-alpha.2/handlebars.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/URI.js/1.11.2/URI.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script src="/js/lib/jquery.scrollGlue.js"></script>
<script src="/js/lib/bootstrap.js"></script>

50
client/js/chat.js
View File

@ -10,9 +10,18 @@ $(function() {
var sidebar = $("#sidebar");
var tpl = [];
function render(id, json) {
tpl[id] = tpl[id] || Handlebars.compile($(id).html());
return tpl[id](json);
function render(id, json, partials) {
tpl[id] = tpl[id] || $(id).html();
if (!json) {
// If no data is supplied, return the template instead.
// Handy when fetching partials.
return tpl[id];
}
return Mustache.render(
tpl[id],
json,
partials || {}
);
}
function event(type, json) {
@ -20,13 +29,17 @@ $(function() {
case "network":
var html = "";
var partials = {
users: render("#user"),
messages: render("#message")
};
json.forEach(function(network) {
html += render("#window", network);
html += render("#window", network, partials);
});
$("#windows")[0].innerHTML = html;
sidebar.find("#list").html(
render("#network", {networks: json})
render("#network", {networks: json}, {channels: render("#channel")})
).find(".channel")
.first()
.addClass("active");
@ -38,8 +51,7 @@ $(function() {
break;
case "channel":
var id = json.data.id;
console.log(json.data);
var id = json.data.id;
if (json.action == "remove") {
$("#channel-" + id + ", #window-" + id).remove();
return;
@ -63,9 +75,9 @@ $(function() {
break;
case "user":
var target;
if (typeof json.target !== "undefined") {
target = chat.find("#window-" + json.target);
var target = chat.find("#window-" + json.target);
if (target.size() == 0) {
return;
}
target = target.find(".users");
@ -73,9 +85,9 @@ $(function() {
break;
case "message":
var target;
if (typeof json.target !== "undefined") {
target = $("#window-" + json.target);
var target = $("#window-" + json.target);
if (target.size() == 0) {
return;
}
var message = json.data;
@ -188,9 +200,9 @@ $(function() {
};
});
Handlebars.registerHelper("link", function(text) {
var text = Handlebars.Utils.escapeExpression(text);
return URI.withinString(text, function(url) {
return "<a href='" + url + "' target='_blank'>" + url + "</a>";
});
});
//Handlebars.registerHelper("link", function(text) {
// var text = Handlebars.Utils.escapeExpression(text);
// return URI.withinString(text, function(url) {
// return "<a href='" + url + "' target='_blank'>" + url + "</a>";
// });
//});