2
0
Fork 0
mirror of https://github.com/thelounge/thelounge synced 2024-12-18 16:33:16 +00:00
thelounge/client/js/chat.js

210 lines
4.3 KiB
JavaScript
Raw Normal View History

2014-03-06 15:11:25 +00:00
$(function() {
var socket = io.connect("");
2014-03-12 13:10:53 +00:00
$.each([
2014-03-14 21:57:54 +00:00
"NETWORKS",
"CHANNELS",
"MESSAGES",
"USERS"
2014-03-12 13:10:53 +00:00
], function(i, type) {
socket.on(type, function(data) {
render(type, data);
});
2014-03-07 03:18:53 +00:00
});
2014-03-06 15:11:25 +00:00
var chat = $("#chat");
var sidebar = $("#sidebar");
2014-03-14 19:21:00 +00:00
2014-03-06 15:11:25 +00:00
// Templates
var networks = $("#networks").html();
var channels = $("#channels").html();
var messages = $("#messages").html();
var users = $("#users").html()
2014-03-12 13:10:53 +00:00
function render(type, data) {
var target;
if (typeof data.target !== "undefined") {
target = $(".window[data-id='" + data.target + "']");
}
switch (type) {
2014-03-14 21:57:54 +00:00
case "NETWORKS":
2014-03-12 13:10:53 +00:00
var partials = {
users: users,
messages: messages
};
chat.html("");
data.forEach(function(network) {
chat.append(Mustache.render(channels, network, partials));
});
sidebar.html(
Mustache.render(networks, {
networks: data
})
2014-03-14 19:21:00 +00:00
).find(".channel")
.last()
.addClass("active");
2014-03-12 13:10:53 +00:00
chat.find(".messages").sticky().scrollToBottom();
chat.find(".window")
// Sort windows by `data-id` value.
.sort(function(a, b) { return ($(a).data("id") - $(b).data("id")); })
.last()
2014-03-14 19:21:00 +00:00
.bringToTop();
2014-03-12 13:10:53 +00:00
break;
2014-03-14 21:57:54 +00:00
case "USERS":
2014-03-12 13:10:53 +00:00
target = target.find(".users");
target.html(Mustache.render(users, {users: data.data}));
break;
2014-03-14 21:57:54 +00:00
case "MESSAGES":
2014-03-15 16:14:05 +00:00
var message = data.data;
if (message.type == "error") {
target = target.parent().find(".active");
}
2014-03-12 13:10:53 +00:00
target = target.find(".messages");
2014-03-15 16:14:05 +00:00
target.append(Mustache.render(messages, {messages: message}));
2014-03-12 13:10:53 +00:00
break;
}
2014-03-07 03:18:53 +00:00
}
2014-03-15 15:51:21 +00:00
sidebar.on("click", ".channel", function(e) {
e.preventDefault();
sidebar.find(".active").removeClass("active");
var item = $(this)
.addClass("active")
.find(".badge")
.html("")
.end();
var id = item.data("id");
chat.find(".window[data-id='" + id + "']")
.bringToTop();
});
2014-03-06 15:11:25 +00:00
chat.on("submit", "form", function() {
var input = $(this).find(".input");
var text = input.val();
if (text != "") {
input.val("");
socket.emit("input", {
id: input.data("target"),
text: text
});
}
});
2014-03-15 15:51:21 +00:00
2014-03-14 21:57:54 +00:00
chat.on("click", ".close", function() {
var btn = $(this);
btn.prop("disabled", true);
socket.emit("input", {
id: btn.closest(".window").data("id"),
2014-03-15 15:51:21 +00:00
text: "/LEAVE"
2014-03-14 21:57:54 +00:00
});
});
2014-03-15 15:51:21 +00:00
2014-03-15 15:07:49 +00:00
chat.on("append", ".window", function() {
var id = $(this).data("id");
var badge = sidebar.find(".channel[data-id='" + id + "']:not(.active) .badge");
badge.html((parseInt(badge.html()) + 1) || "1");
});
2014-03-15 15:51:21 +00:00
chat.on("click", ".user", function(e) {
2014-03-14 21:57:54 +00:00
e.preventDefault();
2014-03-15 15:51:21 +00:00
});
chat.on("dblclick", ".user", function() {
var user = $(this);
var id = user.closest(".window").data("id");
var name = user.attr("href");
var channel = sidebar
.find(".channel[data-id='" + id + "']")
.siblings(".channel[data-name='" + name + "']");
if (channel.size() != 0) {
channel.trigger("click");
return;
}
socket.emit("input", {
id: id,
text: "/QUERY " + name
});
2014-03-06 15:11:25 +00:00
});
});
2014-03-09 18:39:25 +00:00
(function($) {
2014-03-06 15:11:25 +00:00
var highest = 1;
$.fn.bringToTop = function() {
2014-03-14 19:21:00 +00:00
return this.css('z-index', highest++)
.addClass("active")
.find(".input")
.focus()
.end()
.siblings()
.removeClass("active")
.end();
2014-03-06 15:11:25 +00:00
};
2014-03-09 18:39:25 +00:00
})(jQuery);
// Sticky plugin
// https://github.com/erming/sticky
(function($) {
var append = $.fn.append;
$.fn.append = function() {
return append.apply(this, arguments).trigger("append");
};
$.fn.sticky = function() {
var self = this;
if (self.size() > 1) {
return self.each(function() {
$(this).sticky();
});
}
2014-03-14 02:00:01 +00:00
var timer;
var resizing = false;
$(window).on("resize", function() {
// This will prevent the scroll event from triggering
// while resizing the window.
resizing = true;
clearTimeout(timer);
timer = setTimeout(function() {
resizing = false;
}, 100);
if (sticky) {
self.scrollToBottom();
}
});
2014-03-09 18:39:25 +00:00
var sticky = false;
self.on("scroll", function() {
2014-03-14 02:00:01 +00:00
if (!resizing) {
sticky = self.isScrollAtBottom();
}
2014-03-09 18:39:25 +00:00
});
self.trigger("scroll");
self.on("append", function() {
if (sticky) {
self.scrollToBottom();
}
});
return this;
};
2014-03-06 18:53:02 +00:00
$.fn.scrollToBottom = function() {
2014-03-15 01:19:50 +00:00
this.scrollTop(this.prop("scrollHeight"));
2014-03-06 18:53:02 +00:00
};
2014-03-09 18:39:25 +00:00
$.fn.isScrollAtBottom = function() {
if ((this.scrollTop() + this.outerHeight()) >= this.prop("scrollHeight")) {
2014-03-06 18:53:02 +00:00
return true;
}
};
2014-03-09 18:39:25 +00:00
})(jQuery);