Client-side stuff

This commit is contained in:
Mattias Erming 2014-06-26 17:47:36 -07:00
parent 8e4cdc3e9f
commit fd2011764a
8 changed files with 5143 additions and 18 deletions

File diff suppressed because one or more lines are too long

2006
client/components/uri.js Normal file

File diff suppressed because it is too large Load diff

View file

@ -36,10 +36,11 @@ button {
padding: 0;
}
#sidebar {
bottom: 0;
background: #262c36;
bottom: 0;
left: 0;
padding-bottom: 60px;
overflow: auto;
overflow-x: hidden;
position: absolute;
top: 0;
width: 220px;
@ -61,9 +62,8 @@ button {
color: #fff;
}
#channels {
max-height: 100%;
overflow: auto;
padding: 30px 40px;
min-height: 100%;
padding: 30px 40px 80px;
}
#channels .network + .network {
margin-top: 30px;
@ -94,12 +94,11 @@ button {
transition: all .1s;
}
#footer {
bottom: 0;
height: 80px;
line-height: 80px;
position: absolute;
margin-top: -80px;
text-align: center;
width: 100%;
width: 220px;
}
#footer button {
font: 18px Octicons;

View file

@ -86,6 +86,57 @@
</div>
</div>
<div id="templates">
<script type="text/html" class="networks">
{{#each networks}}
<section class="network">
{{partial "channels"}}
</section>
{{/each}}
</script>
<script type="text/html" class="channels">
{{#each channels}}
<button class="chan">
<span class="badge"></span>
Network
</button>
{{/each}}
</script>
<script type="text/html" class="users">
<div id="meta">
<h1>{{name}}</h1>
<div class="count">
{{users.length}}
users
</div>
</div>
<div id="users">
{{#each users}}
<button>{{mode}}{{name}}</button>
{{/each}}
</div>
</script>
<script type="text/html" class="messages">
{{#each messages}}
<div class="msg">
<span class="time">
{{time}}
</span>
<span class="from">
<button>{{from}}</button>
</span>
<span class="text">
<em class="type">{{type}}</em>
{{{uri text}}}
</span>
</div>
{{/each}}
</script>
</div>
<script src="js/components.min.js"></script>
<script src="js/shout.js"></script>

File diff suppressed because one or more lines are too long

View file

@ -1,4 +1,118 @@
$(function() {
var socket = io();
socket.emit("h", "hello");
new Shout();
});
function Shout() {
var client = this;
var socket = io();
var events = [
"auth",
"init",
"join",
"msg",
"network",
"nick",
"part",
"quit",
"users"
].forEach(function(e) {
socket.on(e, function() {
client[e].call(client, socket);
});
});
}
Shout.prototype.auth = function(socket) {
socket.on("auth", function(json) {
console.log(json);
});
};
Shout.prototype.init = function(socket) {
socket.on("init", function(json) {
console.log(json);
});
};
Shout.prototype.join = function(socket) {
socket.on("join", function(json) {
console.log(json);
});
};
Shout.prototype.msg = function(socket) {
socket.on("msg", function(json) {
console.log(json);
});
};
Shout.prototype.network = function(socket) {
socket.on("network", function(json) {
console.log(json);
});
};
Shout.prototype.nick = function(socket) {
socket.on("nick", function(json) {
console.log(json);
});
};
Shout.prototype.part = function(socket) {
socket.on("part", function(json) {
console.log(json);
});
};
Shout.prototype.quit = function(socket) {
socket.on("quit", function(json) {
console.log(json);
});
};
Shout.prototype.users = function(socket) {
socket.on("quit", function(json) {
console.log(json);
});
};
var tpl = [];
function render(name, data) {
tpl[name] = tpl[name] || Handlebars.compile($("#templates ." + name).html());
return tpl[name](data);
}
function escape(text) {
var e = {
"<": "&lt;",
">": "&gt;"
};
return text.replace(/[<>]/g, function (c) {
return e[c];
});
}
Handlebars.registerHelper(
"partial", function(id) {
return new Handlebars.SafeString(render(id, this));
}
);
Handlebars.registerHelper(
"uri", function(text) {
var urls = [];
text = URI.withinString(text, function(url) {
urls.push(url);
return "$(" + (urls.length - 1) + ")";
});
text = escape(text);
for (var i in urls) {
var url = escape(urls[i]);
text = text.replace(
"$(" + i + ")",
"<a href='" + url.replace(/^www/, "//www") + "' target='_blank'>" + url + "</a>"
);
}
return text;
}
);

View file

@ -8,7 +8,6 @@ var clients = [];
var inputs = [
"action",
"connect",
"invite",
"join",
"kick",
@ -19,6 +18,7 @@ var inputs = [
"part",
"quit",
"raw",
"server",
"topic",
"whois"
];
@ -49,10 +49,12 @@ module.exports = function() {
var init = function(socket, client) {
if (!client) {
socket.emit("auth");
socket.on("auth", auth);
} else {
}
};
var auth = function(data) {
// ..
var auth = function() {
var socket = this;
};