Minor changes

This commit is contained in:
Mattias Erming 2014-05-02 23:54:31 +02:00
parent cfb7edd659
commit bf9f113e2f
8 changed files with 87 additions and 66 deletions

View File

@ -12,16 +12,12 @@ h2 {
margin: 0; margin: 0;
} }
a { a {
color: #1abc9c;
text-decoration: none; text-decoration: none;
}
a,
.user {
color: #16a085;
transition: all .25s; transition: all .25s;
} }
a:hover, a:hover {
.user:hover { text-decoration: underline;
color: #1abc9c;
} }
a:focus, a:focus,
button:focus, button:focus,
@ -74,7 +70,7 @@ button::-moz-focus-inner {
} }
#sidebar button { #sidebar button {
border-radius: 2px; border-radius: 2px;
color: #16a085; color: #1abc9c;
display: block; display: block;
font-size: 15px; font-size: 15px;
font-weight: bold; font-weight: bold;
@ -88,7 +84,6 @@ button::-moz-focus-inner {
} }
#sidebar button:hover { #sidebar button:hover {
background-color: #f1f2f3; background-color: #f1f2f3;
color: #1abc9c;
} }
#sidebar button.active { #sidebar button.active {
background-color: #ebedef; background-color: #ebedef;
@ -138,6 +133,9 @@ button::-moz-focus-inner {
font: 13px "Consolas", monospace; font: 13px "Consolas", monospace;
height: 100%; height: 100%;
} }
#chat .lobby .from {
display: none;
}
#chat .lobby .messages, #chat .lobby .messages,
#chat .query .messages { #chat .query .messages {
right: 0; right: 0;
@ -150,7 +148,7 @@ button::-moz-focus-inner {
#chat .users { #chat .users {
bottom: 35px; bottom: 35px;
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: scroll;
position: absolute; position: absolute;
top: 0; top: 0;
} }
@ -159,6 +157,12 @@ button::-moz-focus-inner {
padding: 2px 0; padding: 2px 0;
right: 160px; right: 160px;
} }
#chat .messages .user {
color: #95a5a6;
}
#chat .messages .user:before {
content: '* ';
}
#chat .show-more { #chat .show-more {
display: none; display: none;
margin: 6px 8px 4px; margin: 6px 8px 4px;
@ -174,11 +178,32 @@ button::-moz-focus-inner {
#chat .type { #chat .type {
color: #bdc3c7; color: #bdc3c7;
} }
#chat .motd .type, #chat .users .user,
#chat .notice .type, #chat .normal .user {
#chat .whois .type { color: #e74c3c;
transition: all .25s;
}
#chat .normal .user:before {
content: '<';
}
#chat .normal .user:after {
content: '>';
}
#chat .type {
display: none; display: none;
} }
#chat .join .type,
#chat .kick .type,
#chat .mode .type,
#chat .nick .type,
#chat .part .type,
#chat .topic .type,
#chat .quit .type {
display: inherit;
}
#chat .nick .text {
color: #95a5a6;
}
#chat .users { #chat .users {
background: #fff; background: #fff;
border-left: 4px solid #bdc3c7; border-left: 4px solid #bdc3c7;

View File

@ -17,10 +17,10 @@
<aside id="sidebar"> <aside id="sidebar">
<div id="menu"> <div id="menu">
<h2>Shout Client</h2> <h2>Shout Client</h2>
<button data-target="#start">Start</button>
<button data-target="#settings">Settings</button> <button data-target="#settings">Settings</button>
</div> </div>
<div id="networks"> <div id="networks"></div>
</div>
<footer id="footer"> <footer id="footer">
<a href="<%= homepage %>" target="_blank" class="btn"> <a href="<%= homepage %>" target="_blank" class="btn">
<strong><%= name %></strong> <strong><%= name %></strong>
@ -30,11 +30,10 @@
</aside> </aside>
<div id="main"> <div id="main">
<div id="windows"> <div id="windows">
<div id="settings" class="window"> <div id="start" class="window"></div>
</div> <div id="settings" class="window"></div>
</div>
<div id="chat">
</div> </div>
<div id="chat"></div>
</div> </div>
</div> </div>
@ -95,9 +94,9 @@
<span class="time"> <span class="time">
{{time}} {{time}}
</span> </span>
<button class="user"> <span class="from">
{{from}} <button class="user">{{from}}</button>
</button> </span>
<span class="text"> <span class="text">
{{#if type}} {{#if type}}
<em class="type">{{type}}</em> <em class="type">{{type}}</em>

View File

@ -51,6 +51,7 @@ $(function() {
.last() .last()
.scrollGlue({speed: 200}) .scrollGlue({speed: 200})
.end() .end()
.end()
.find(".input") .find(".input")
.tabComplete({list: commands}) .tabComplete({list: commands})
.end(); .end();
@ -84,9 +85,10 @@ $(function() {
$("#networks") $("#networks")
.html(render("networks", {networks: data.networks})) .html(render("networks", {networks: data.networks}))
.find(".channel") .parent()
.last() .find("button")
.addClass("active") .first()
.trigger("click")
.end(); .end();
break; break;
@ -111,9 +113,9 @@ $(function() {
var target = button.data("target"); var target = button.data("target");
sidebar.find(".active").removeClass("active"); sidebar.find(".active").removeClass("active");
button.addClass("active") button.addClass("active")
$(target) $(target).css({
.css({"z-index": z++}) "z-index": z++
.find(".input") }).find("input")
.focus() .focus()
.end(); .end();
}); });
@ -131,13 +133,16 @@ $(function() {
if (name == "-!-" || name.indexOf(".") != -1) { if (name == "-!-" || name.indexOf(".") != -1) {
return; return;
} }
console.log({id: id, text: "/whois " + name});
socket.emit("input", { socket.emit("input", {
id: id, id: id,
text: "/whois " + name, text: "/whois " + name,
}); });
}); });
chat.on("focus", ".input", function() {
$(this).closest(".window").find(".messages").scrollToBottom();
});
chat.on("submit", "form", function() { chat.on("submit", "form", function() {
var form = $(this); var form = $(this);
var input = form.find(".input"); var input = form.find(".input");
@ -152,9 +157,6 @@ $(function() {
}); });
}); });
chat.on("focus", ".input", function() {
var input = $(this).parents().eq(1).find(".messages").scrollToBottom();
});
Handlebars.registerHelper( Handlebars.registerHelper(
"partial", function(id) { "partial", function(id) {

View File

@ -6,11 +6,11 @@ Handlebars.registerHelper(
rows.push(block.fn(i)); rows.push(block.fn(i));
}); });
var html = ""; var html = "";
var hide = rows var hidden = rows
.slice(0, Math.max(0, rows.length - limit)) .slice(0, Math.max(0, rows.length - limit))
.join(""); .join("");
if (hide != "") { if (hidden != "") {
html = "<script type='text/html' class='hidden'>" + hide + "</script>"; html = "<script type='text/html' class='hidden'>" + hidden + "</script>";
} }
html += rows.slice(-limit).join(""); html += rows.slice(-limit).join("");
return html; return html;

View File

@ -1,27 +1,3 @@
/*!
* uniqueClass
* https://gist.github.com/erming/11212325
*/
(function($) {
$.fn.uniqueClass = function(name) {
return this.addClass(name).siblings().removeClass(name).end();
};
})(jQuery);
/*!
* bringToTop
* https://gist.github.com/erming/11193183
*/
(function($) {
var highest = 1;
$.fn.bringToTop = function() {
return this.css('z-index', highest++).uniqueClass('active')
.find(".input")
.focus()
.end();
};
})(jQuery);
/*! /*!
* inputHistory * inputHistory
* https://github.com/erming/inputHistory * https://github.com/erming/inputHistory

View File

@ -6,7 +6,7 @@ module.exports = Msg;
function Msg(attr) { function Msg(attr) {
_.merge(this, _.extend({ _.merge(this, _.extend({
time: moment().format("HH:mm"), time: moment().format("HH:mm"),
type: "", type: "normal",
from: "", from: "",
text: "", text: "",
}, attr)); }, attr));

View File

@ -14,7 +14,7 @@ function Network(attr) {
// Add lobby // Add lobby
this.channels.unshift( this.channels.unshift(
new Chan({name: "Status", type: "lobby"}) new Chan({name: this.host, type: "lobby"})
); );
}; };

View File

@ -359,7 +359,7 @@ function event(e, data) {
if (w.indexOf(network.client.me) == 0) type = "highlight"; if (w.indexOf(network.client.me) == 0) type = "highlight";
}); });
var msg = new Msg({ var msg = new Msg({
type: type, type: type || "normal",
from: data.from, from: data.from,
text: text, text: text,
}); });
@ -541,13 +541,22 @@ function event(e, data) {
chan: chan, chan: chan,
}); });
} }
var prefix = {
hostname: "from",
realname: "is",
channels: "on",
server: "using",
};
var i = 0; var i = 0;
for (var k in data) { for (var k in data) {
if (i++ == 5) break; var key = prefix[k];
if (!key) {
continue;
}
var msg = new Msg({ var msg = new Msg({
type: "whois", type: "whois",
from: "-!-", from: data.nickname,
text: k + ": " + data[k], text: key + " " + data[k],
}); });
chan.messages.push(msg); chan.messages.push(msg);
sockets.emit("msg", { sockets.emit("msg", {
@ -555,6 +564,16 @@ function event(e, data) {
msg: msg, msg: msg,
}); });
} }
var msg = new Msg({
type: "whois",
from: data.nickname,
text: "End of /WHOIS list.",
});
chan.messages.push(msg);
sockets.emit("msg", {
id: chan.id,
msg: msg,
});
} }
break; break;
} }