diff --git a/client/css/style.css b/client/css/style.css
index 62e59212..ac77a00e 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -435,7 +435,8 @@ button {
}
#chat,
#windows .header {
- font: 13px Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
+ font: 12px Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
+ line-height: 1.4;
}
#chat button:hover {
opacity: .6;
@@ -499,19 +500,18 @@ button {
padding-bottom: 10px;
}
#chat .msg .type {
- color: #ccc;
- color: #d0dbe2;
+ color: #ddd;
display: none;
}
#chat .time,
#chat .from,
#chat .text {
display: table-cell;
- padding: 3px 0;
+ padding: 2px 0;
vertical-align: top;
}
#chat .time {
- color: #d0dbe2;
+ color: #ddd;
text-align: right;
width: 46px;
min-width: 46px;
@@ -710,16 +710,7 @@ button {
position: absolute;
right: 0px;
}
-#form input {
- border: 1px solid #cfdae1;
- font: 13px Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
- border-radius: 2px;
- height: 100%;
- outline: none;
- padding: 0 10px;
- -webkit-appearance: none;
- width: 100%;
-}
+
#form .inner {
bottom: 7px;
left: 7px;
@@ -728,11 +719,38 @@ button {
top: 6px;
}
#form .input {
+ font: 12px Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
left: 0;
height: 34px;
margin-right: 60px;
position: relative;
}
+#form #nick {
+ background: #f6f6f6;
+ color: #aaa;
+ position: absolute;
+ font: inherit;
+ font-size: 11px;
+ margin: 5px;
+ line-height: 26px;
+ height: 24px;
+ padding: 0 10px;
+ border-radius: 1px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+#form #input {
+ border: 1px solid #cfdae1;
+ font: inherit;
+ border-radius: 2px;
+ height: 100%;
+ outline: none;
+ padding: 0 10px;
+ -webkit-appearance: none;
+ width: 100%;
+}
#form #submit {
background: #f4f4f4;
background-image: linear-gradient(#f4f4f4, #ececec);
diff --git a/client/index.html b/client/index.html
index 7d26e949..ac2891da 100644
--- a/client/index.html
+++ b/client/index.html
@@ -239,6 +239,7 @@
Send
+
diff --git a/client/js/shout.js b/client/js/shout.js
index 5a68ac58..7e860e04 100644
--- a/client/js/shout.js
+++ b/client/js/shout.js
@@ -63,12 +63,10 @@ $(function() {
console.log(e);
});
- socket.on("connect_error", function() {
- refresh();
- });
-
- socket.on("disconnect", function() {
- refresh();
+ $.each(["connect_error", "disconnect"], function(i, e) {
+ socket.on(e, function() {
+ refresh();
+ });
});
socket.on("auth", function(data) {
@@ -231,7 +229,12 @@ $(function() {
});
socket.on("nick", function(data) {
- console.log(data);
+ var id = data.network;
+ var nick = data.nick;
+ var network = sidebar.find("#network-" + id).data("nick", nick);
+ if (network.find(".active").length) {
+ setNick(nick);
+ }
});
socket.on("part", function(data) {
@@ -419,6 +422,15 @@ $(function() {
.sticky()
.end();
+ if (self.hasClass("chan")) {
+ var nick = self
+ .closest(".network")
+ .data("nick");
+ if (nick) {
+ setNick(nick);
+ }
+ }
+
if (screen.width > 768 && chan.hasClass("chan")) {
input.focus();
}
@@ -726,6 +738,16 @@ $(function() {
});
}
+ function setNick(nick) {
+ var width = $("#nick")
+ .html(nick + ":")
+ .width();
+ if (width) {
+ width += 34;
+ input.css("padding-left", width);
+ }
+ }
+
document.addEventListener(
"visibilitychange",
function() {
diff --git a/client/js/shout.templates.js b/client/js/shout.templates.js
index 496496b6..b05d8cf8 100644
--- a/client/js/shout.templates.js
+++ b/client/js/shout.templates.js
@@ -116,6 +116,8 @@ templates['network'] = template({"1":function(depth0,helpers,partials,data) {
+ escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
+ "\" class=\"network\" data-id=\""
+ escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
+ + "\" data-nick=\""
+ + escapeExpression(((helper = (helper = helpers.nick || (depth0 != null ? depth0.nick : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"nick","hash":{},"data":data}) : helper)))
+ "\">\n "
+ escapeExpression(((helpers.partial || (depth0 && depth0.partial) || helperMissing).call(depth0, "chan", {"name":"partial","hash":{},"data":data})))
+ "\n\n";
diff --git a/client/templates/network.tpl b/client/templates/network.tpl
index e823e159..feec605d 100644
--- a/client/templates/network.tpl
+++ b/client/templates/network.tpl
@@ -1,5 +1,5 @@
{{#each networks}}
-
+
{{/each}}
diff --git a/package.json b/package.json
index 7d56e57b..7e549df2 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "shout",
"description": "The self-hosted web IRC client",
- "version": "0.34.1",
+ "version": "0.35.0",
"author": "Mattias Erming",
"preferGlobal": true,
"bin": {
diff --git a/src/models/network.js b/src/models/network.js
index 908ad1c6..d0db0735 100644
--- a/src/models/network.js
+++ b/src/models/network.js
@@ -20,7 +20,8 @@ function Network(attr) {
}
Network.prototype.toJSON = function() {
- return _.omit(this, "irc");
+ var json = _.extend(this, {nick: (this.irc || {}).me || ""});
+ return _.omit(json, "irc");
};
function prettify(host) {
diff --git a/src/plugins/irc-events/nick.js b/src/plugins/irc-events/nick.js
index 4ade101f..d437b783 100644
--- a/src/plugins/irc-events/nick.js
+++ b/src/plugins/irc-events/nick.js
@@ -5,10 +5,11 @@ module.exports = function(irc, network) {
var client = this;
irc.on("nick", function(data) {
var self = false;
- if (data["new"] == irc.me) {
+ var nick = data["new"];
+ if (nick == irc.me) {
var lobby = network.channels[0];
var msg = new Msg({
- text: "You're now known as " + data["new"],
+ text: "You're now known as " + nick,
});
lobby.messages.push(msg);
client.emit("msg", {
@@ -16,13 +17,17 @@ module.exports = function(irc, network) {
msg: msg
});
self = true;
+ client.emit("nick", {
+ network: network.id,
+ nick: nick
+ });
}
network.channels.forEach(function(chan) {
var user = _.findWhere(chan.users, {name: data.nick});
if (typeof user === "undefined") {
return;
}
- user.name = data["new"];
+ user.name = nick;
chan.sortUsers();
client.emit("users", {
chan: chan.id,
@@ -31,7 +36,7 @@ module.exports = function(irc, network) {
var msg = new Msg({
type: Msg.Type.NICK,
from: data.nick,
- text: data["new"],
+ text: nick,
self: self
});
chan.messages.push(msg);
diff --git a/src/plugins/irc-events/welcome.js b/src/plugins/irc-events/welcome.js
index 2212daac..4c4d5bef 100644
--- a/src/plugins/irc-events/welcome.js
+++ b/src/plugins/irc-events/welcome.js
@@ -6,13 +6,18 @@ module.exports = function(irc, network) {
network.connected = true;
irc.write("PING " + network.host);
var lobby = network.channels[0];
+ var nick = data;
var msg = new Msg({
- text: "You're now known as " + data
+ text: "You're now known as " + nick
});
lobby.messages.push(msg);
client.emit("msg", {
chan: lobby.id,
msg: msg
});
+ client.emit("nick", {
+ network: network.id,
+ nick: nick
+ });
});
};