From afda79db4bc526d4fc7712b6484773c1c1658306 Mon Sep 17 00:00:00 2001 From: Mattias Erming Date: Fri, 20 Jun 2014 02:26:48 +0200 Subject: [PATCH] Add MOTD toggle --- client/css/style.css | 35 ++++++++++++++++++++++++++++++++++- client/index.html | 7 +++++-- client/js/chat.js | 40 ++++++++++++++++++++++++++++------------ lib/plugins/motd.js | 9 +++++++++ 4 files changed, 76 insertions(+), 15 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 34a0ae21..35bf8cf0 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -339,7 +339,7 @@ button { } #chat .row { display: table-row; - word-break: break-word; + word-break: break-all; word-wrap: break-word; } #chat .row span { @@ -396,6 +396,39 @@ button { text-align: right; width: 46px; } +#chat .motd { + opacity: 0; + position: absolute; +} +#chat .motd-toggle .motd { + opacity: 1; + position: inherit; +} +#chat .toggle { + background: #f9f9f9; + border: 1px solid #eee; + border-radius: 2px; + color: #999; + float: left; + font-size: 14px; + line-height: 0px; + margin: 2px 9px 0 0; + overflow: hidden; +} +#chat .toggle:hover { + border-color: #ddd; +} +#chat .toggle .tri { + border: 3px solid transparent; + border-top-color: #666; + float: left; + margin: 5px 4px 1px; +} +#chat .toggle.open .tri { + border-top-color: transparent; + border-bottom-color: #666; + margin: 1px 4px 5px; +} #chat .sidebar { bottom: 0; display: none; diff --git a/client/index.html b/client/index.html index 16f356c9..2b237e73 100644 --- a/client/index.html +++ b/client/index.html @@ -143,11 +143,14 @@ {{from}} - {{#if type}} + {{#contains type "toggle"}} + + {{/contains}} {{type}} - {{/if}} {{{uri text}}} diff --git a/client/js/chat.js b/client/js/chat.js index bf7ef4af..ccec21ae 100644 --- a/client/js/chat.js +++ b/client/js/chat.js @@ -168,7 +168,7 @@ $(function() { setTimeout(function() { // Enable transitions. - $("body").removeClass("preload"); + //$("body").removeClass("preload"); }, 500); var pop = new Audio(); @@ -341,6 +341,14 @@ $(function() { }); }); + chat.on("click", ".toggle", function() { + var chat = $(this) + .toggleClass("open") + .closest(".chat") + .toggleClass($(this).data("type")) + .end(); + }); + var toggle = "click"; if (touchDevice) { toggle = "touchstart"; @@ -390,17 +398,7 @@ $(function() { return e[c]; }); } - - Handlebars.registerHelper( - "equal", function(a, b, opt) { - a = parseInt(a); - b = parseInt(b); - if (a == b) { - return opt.fn(this); - } - } - ); - + Handlebars.registerHelper( "uri", function(text) { var urls = []; @@ -425,4 +423,22 @@ $(function() { return new Handlebars.SafeString(render(id, this)); } ); + + Handlebars.registerHelper( + "equal", function(a, b, opt) { + a = a.toString(); + b = b.toString(); + if (a == b) { + return opt.fn(this); + } + } + ); + + Handlebars.registerHelper( + "contains", function(a, b, opt) { + if (a.indexOf(b) !== -1) { + return opt.fn(this); + } + } + ); }); diff --git a/lib/plugins/motd.js b/lib/plugins/motd.js index 92824176..c1607b6f 100644 --- a/lib/plugins/motd.js +++ b/lib/plugins/motd.js @@ -6,6 +6,15 @@ module.exports = function(client, sockets) { client.on("motd", function(data) { var rows = data.motd; var chan = network.channels[0]; + var msg = new Msg({ + type: "motd-toggle", + from: "-!-" + }); + chan.addMsg(msg); + sockets.in("chat").emit("msg", { + id: chan.id, + msg: msg, + }); rows.forEach(function(text) { var msg = new Msg({ type: "motd",