diff --git a/public/static/css/styles.css b/public/static/css/styles.css index 85343ca..0a56038 100644 --- a/public/static/css/styles.css +++ b/public/static/css/styles.css @@ -30,13 +30,20 @@ body { background-color: rgba(0, 0, 0, 0.55); } -#gui #chat span { +#gui #chat-messages > span { display: block; margin-top: 5px; } -#gui #chat b { - font-weight: 100; +#gui #chat span > span { + color: #afa; +} + +#gui #chat span > span.teama { + color: #f76; +} + +#gui #chat span > span.teamb { color: #8af; } diff --git a/public/static/js/wingbase/gui/chat.js b/public/static/js/wingbase/gui/chat.js index 971d5c2..4229a3b 100644 --- a/public/static/js/wingbase/gui/chat.js +++ b/public/static/js/wingbase/gui/chat.js @@ -2,6 +2,7 @@ GUI.prototype.Chat = class { constructor(gui) { this.gui = gui; + this.element = this.gui.query('#chat'); this.messageElement = this.gui.query('#chat-messages'); this.inputElement = this.gui.query('#chat input'); @@ -13,8 +14,10 @@ GUI.prototype.Chat = class { } addMessage(messageData) { + console.log(messageData); let message = { type: messageData.type, + team: messageData.team || 'c', source: messageData.source || '?', text: messageData.message, createTime: Date.now() @@ -28,16 +31,17 @@ GUI.prototype.Chat = class { }); span.classList.add('server'); } else { + let el = `` span = this.gui.createElement(this.messageElement, 'span', { - html: `<${message.source.bold()}> ${message.text}` + html: `<${el}${message.source}> ${message.text}` }); } - + this.element.scrollTop = this.element.scrollHeight; setTimeout(_ => { - //this.messageElement.removeChild(span); - }, 15000); + this.messageElement.removeChild(span); + }, 20000); } tick() { diff --git a/server/game/room/index.js b/server/game/room/index.js index 811fe5d..02cd113 100644 --- a/server/game/room/index.js +++ b/server/game/room/index.js @@ -28,7 +28,7 @@ class Room { this.world.addPlayer(player); this.sendWorld(player); wingbase.log(`${player.name} joined ${this.name}.`); - this.message('roomEnter', player.name); + this.message('roomEnter', player.name, 'team' + player.team); } remove(player) { @@ -43,7 +43,7 @@ class Room { wingbase.gameServer.deleteRoom(this.name); } - this.message('roomLeave', player.name); + this.message('roomLeave', player.name, 'team' + player.team); } setTeam(player, team) { @@ -75,28 +75,28 @@ class Room { chat(player, message) { wingbase.log(`${this.name}/${player.name}: ${message}`); - + this.chatCooldown++; this.io.to(this.name).emit('chat', { type: 'player', + team: player.team, source: player.name, message: escapeHtml(message.slice(0, 100)) }); } - message(type, values) { + message(type, values, classes) { if (!(values instanceof Array)) values = [values]; let messageList = messages[type]; let message = messageList[Math.random() * messageList.length | 0]; - // TODO: format name to class. - - message = message.replace('@', `${values[0]}`); + let c = classes || ''; + let m = message.replace('@', `${values[0]}`); this.broadcast('chat', { type: 'server', - message: message + message: m }); }