Shuo/client/js/chat.js

192 lines
3.9 KiB
JavaScript
Raw Normal View History

2014-03-06 15:11:25 +00:00
$(function() {
2014-04-19 21:40:36 +00:00
var chat = $("#chat");
var sidebar = $("#sidebar");
2014-04-07 21:19:20 +00:00
var commands = [
"/connect",
"/deop",
"/devoice",
"/disconnect",
"/join",
"/kick",
"/leave",
"/mode",
"/msg",
2014-04-07 21:19:20 +00:00
"/nick",
2014-05-03 17:21:11 +00:00
"/notice",
2014-04-07 21:19:20 +00:00
"/op",
"/part",
"/query",
"/quit",
2014-05-07 19:30:14 +00:00
"/send",
2014-04-07 21:19:20 +00:00
"/server",
"/topic",
"/voice",
"/whois",
];
2014-03-06 15:11:25 +00:00
var socket = io.connect("");
var events = [
"join",
"msg",
"networks",
"nick",
"part",
"users",
].forEach(function(e) {
socket.on(e, function(data) {
event(e, data);
2014-03-12 13:10:53 +00:00
});
2014-03-07 03:18:53 +00:00
});
2014-04-08 14:18:06 +00:00
2014-03-19 17:30:06 +00:00
var tpl = [];
2014-05-02 17:46:18 +00:00
function render(name, data) {
tpl[name] = tpl[name] || Handlebars.compile($("#templates ." + name).html());
return tpl[name](data);
2014-03-19 17:30:06 +00:00
}
2014-03-22 23:42:07 +00:00
function event(e, data) {
switch (e) {
case "join":
2014-05-02 17:46:18 +00:00
chat.append(render("windows", {windows: [data.chan]}))
.find(".messages")
.last()
2014-05-02 23:35:51 +00:00
.scrollGlue({speed: 400})
2014-05-02 17:46:18 +00:00
.end()
2014-05-02 21:54:31 +00:00
.end()
.find(".input")
2014-05-03 17:54:51 +00:00
.tabComplete({list: commands});
2014-05-02 17:46:18 +00:00
2014-04-26 15:26:30 +00:00
$("#network-" + data.id)
2014-05-02 17:46:18 +00:00
.append(render("channels", {channels: [data.chan]}))
2014-04-26 15:26:30 +00:00
.find(".channel")
2014-03-18 23:08:11 +00:00
.last()
2014-05-03 17:54:51 +00:00
.trigger("click");
break;
case "msg":
2014-04-26 15:26:30 +00:00
$("#window-" + data.id)
.find(".messages")
2014-05-02 17:46:18 +00:00
.append(render("messages", {messages: [data.msg]}));
break;
case "networks":
2014-04-26 15:26:30 +00:00
var channels = $.map(data.networks, function(n) { return n.channels; });
2014-05-02 17:46:18 +00:00
chat.html(render("windows", {windows: channels}))
.find(".input")
2014-04-28 18:05:19 +00:00
.tabComplete({list: commands})
2014-04-07 21:19:20 +00:00
.end()
2014-04-26 15:26:30 +00:00
.find(".hidden")
.prev(".show-more")
2014-04-28 18:05:19 +00:00
.show();
2014-04-30 00:00:27 +00:00
chat.find(".messages")
.scrollGlue({speed: 400})
.end();
2014-04-26 15:26:30 +00:00
var networks = $("#networks")
.html(render("networks", {networks: data.networks}));
var target = null;
if (location.hash) {
var id = location.hash;
target = sidebar
.find("button[data-target='" + id + "']");
} else {
target = sidebar
.find("button")
.first()
}
target.trigger("click");
2014-03-17 16:24:32 +00:00
break;
case "part":
2014-04-26 15:26:30 +00:00
$("#channel-" + data.id)
.add("#window-" + data.id)
.remove();
break;
case "users":
2014-04-26 15:26:30 +00:00
$("#window-" + data.id)
.find(".users")
2014-05-03 17:54:51 +00:00
.html(render("users", {users: data.users}));
2014-03-12 13:10:53 +00:00
break;
}
2014-03-07 03:18:53 +00:00
}
2014-05-02 17:46:18 +00:00
var z = 1;
sidebar.on("click", "button", function() {
var button = $(this);
var target = button.data("target");
location.hash = target;
2014-05-02 17:46:18 +00:00
sidebar.find(".active").removeClass("active");
button.addClass("active")
2014-05-03 17:54:51 +00:00
.find(".badge")
2014-05-04 11:05:06 +00:00
.removeClass("highlight")
2014-05-03 17:54:51 +00:00
.empty();
var window = $(target)
.css("z-index", z++)
2014-05-03 17:54:51 +00:00
.find("input")
.focus();
});
chat.on("append", ".messages", function() {
var messages = $(this);
2014-05-04 11:05:06 +00:00
var id = messages.closest(".window").find(".input").parent().data("target");
2014-05-03 19:22:14 +00:00
var badge = $("#channel-" + id + ":not(.active) .badge");
if (badge.length != 0) {
var i = (parseInt(badge.html()) || 0) + 1;
badge.html(i);
2014-05-04 11:05:06 +00:00
if (messages.children().last().hasClass("highlight")) {
badge.addClass("highlight");
}
2014-05-03 17:54:51 +00:00
}
2014-03-06 15:11:25 +00:00
});
2014-05-02 17:46:18 +00:00
chat.on("click", ".show-more .btn", function() {
var target = $(this).parent();
var html = $.parseHTML(target.next(".hidden").remove().html());
target.replaceWith(html);
});
2014-04-23 22:03:35 +00:00
chat.on("click", ".user", function() {
var user = $(this);
2014-05-04 11:05:06 +00:00
var id = user.closest(".window").find(".input").parent().data("target");
2014-05-02 17:46:18 +00:00
var name = user.html().replace(/[\s+@]/g, "");
2014-05-03 17:54:51 +00:00
if (name.match(/[#.]|-!-/) != null) {
2014-04-10 21:34:53 +00:00
return;
}
2014-04-09 20:54:04 +00:00
socket.emit("input", {
id: id,
text: "/whois " + name,
2014-04-09 20:54:04 +00:00
});
2014-03-31 22:02:28 +00:00
});
2014-04-23 22:03:35 +00:00
2014-05-02 21:54:31 +00:00
chat.on("focus", ".input", function() {
$(this).closest(".window").find(".messages").scrollToBottom();
});
2014-05-02 17:46:18 +00:00
chat.on("submit", "form", function() {
var form = $(this);
var input = form.find(".input");
var text = input.val();
if (text == "") {
return;
}
input.val("");
2014-04-23 22:03:35 +00:00
socket.emit("input", {
2014-05-02 17:46:18 +00:00
id: form.data("target"),
text: text,
2014-04-23 22:03:35 +00:00
});
});
2014-05-02 17:46:18 +00:00
Handlebars.registerHelper(
"partial", function(id) {
2014-04-21 10:27:43 +00:00
return new Handlebars.SafeString(render(id, this));
2014-05-02 17:46:18 +00:00
}
);
2014-03-22 23:42:07 +00:00
});