From 73930688ccd3a564c47fe71fbfdb869f3b99048a Mon Sep 17 00:00:00 2001 From: Pavel Djundik Date: Fri, 11 Mar 2016 23:18:20 +0200 Subject: [PATCH 1/3] Remove dedicated close button next to user button --- client/css/style.css | 23 ----------------------- client/js/lounge.js | 9 --------- client/themes/morning.css | 6 ++---- client/themes/zenburn.css | 6 ++---- client/views/chat.tpl | 13 ------------- 5 files changed, 4 insertions(+), 53 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 412451c1..5773c220 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -603,29 +603,6 @@ button, margin-left: 8px; } -#windows .header .right { - float: right; - margin-right: -10px; - margin-top: -2px; -} - -#windows .header .button { - background: #f4f4f4; - background-image: linear-gradient(#f4f4f4, #ececec); - border: 1px solid #d7d7d7; - border-bottom-color: #b7b7b7; - border-radius: 2px; - color: #555; - font: 12px Lato, sans-serif; - height: 25px; - line-height: 0; - padding: 0 10px; -} - -#windows .header .button:hover { - opacity: 1; -} - #windows .window .header { display: none; } diff --git a/client/js/lounge.js b/client/js/lounge.js index 66a3d04f..cbea41ef 100644 --- a/client/js/lounge.js +++ b/client/js/lounge.js @@ -738,15 +738,6 @@ $(function() { }); }); - chat.on("click", ".close", function() { - var id = $(this) - .closest(".chan") - .data("id"); - sidebar.find(".chan[data-id='" + id + "']") - .find(".close") - .click(); - }); - chat.on("msg", ".messages", function(e, target, msg) { var button = sidebar.find(".chan[data-target='" + target + "']"); var isQuery = button.hasClass("query"); diff --git a/client/themes/morning.css b/client/themes/morning.css index 27e01d65..37a20709 100644 --- a/client/themes/morning.css +++ b/client/themes/morning.css @@ -132,15 +132,13 @@ QUIT #d0907d } /* Buttons */ -#chat .show-more-button, -#windows .header .button { +#chat .show-more-button { background: #2e3642; border-color: #242a33; color: #ccc; } -#chat .show-more-button:hover, -#windows .header .button:hover { +#chat .show-more-button:hover { color: #fff; } diff --git a/client/themes/zenburn.css b/client/themes/zenburn.css index 6d9abac3..526f2d15 100644 --- a/client/themes/zenburn.css +++ b/client/themes/zenburn.css @@ -162,15 +162,13 @@ body { } /* Buttons */ -#chat .show-more-button, -#windows .header .button { +#chat .show-more-button { background: #434443; border-color: #101010; color: #dcdccc; } -#chat .show-more-button:hover, -#windows .header .button:hover { +#chat .show-more-button:hover { color: #fff; } diff --git a/client/views/chat.tpl b/client/views/chat.tpl index 68f4cf15..7bd8793e 100644 --- a/client/views/chat.tpl +++ b/client/views/chat.tpl @@ -5,19 +5,6 @@ {{#equal type "channel"}} {{/equal}} -
- -
{{name}} {{{parse topic}}} From 5579f407e73f1f9161058100ef9e48319d965f15 Mon Sep 17 00:00:00 2001 From: Pavel Djundik Date: Fri, 11 Mar 2016 23:27:07 +0200 Subject: [PATCH 2/3] Change close button in sidebar behaviour --- client/css/style.css | 38 +++++++++++--------------------------- 1 file changed, 11 insertions(+), 27 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 5773c220..9448af21 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -334,21 +334,6 @@ button, content: "\f0f6"; } -#sidebar .chan:hover .badge { - opacity: 0; - position: absolute; - z-index: 1; - right: 10px; -} - -#sidebar .chan:hover .close { - opacity: .2; -} - -#sidebar .chan:hover .name { - margin-right: 16px; -} - #sidebar .chan .name { position: relative; z-index: 0; @@ -378,7 +363,7 @@ button, margin-left: 5px; padding: 3px 6px; float: right; - transition: opacity .2s; + transition: opacity .2s, background-color .2s, color .2s; } #sidebar .badge.highlight { @@ -386,6 +371,7 @@ button, color: #49505a; } +#sidebar .chan.active .badge, #sidebar .badge:empty { opacity: 0; } @@ -393,11 +379,12 @@ button, #sidebar .close { border-radius: 3px; margin-right: 5px; + visibility: hidden; opacity: 0; position: absolute; z-index: 2; right: 0; - transition: all .2s; + transition: opacity .2s, background-color .2s; } #sidebar .close:before { @@ -412,9 +399,14 @@ button, color: #fff; } -#sidebar .close:hover { +#sidebar .chan.active .close { + visibility: visible; + opacity: .4; +} + +#sidebar .chan.active .close:hover { background-color: rgba(0, 0, 0, .1); - opacity: .7 !important; + opacity: 1; } #sidebar .tse-scrollbar { @@ -1566,14 +1558,6 @@ button, width: 215px; } - #sidebar .close { - display: none; - } - - #sidebar .chan:hover .badge { - opacity: 1; - } - #sidebar .empty:before { margin-top: 0; } From d3a8b2b217e48ffc6bca2b12c01f63a715081c8e Mon Sep 17 00:00:00 2001 From: Maxime Poulin Date: Sat, 19 Mar 2016 14:20:11 -0400 Subject: [PATCH 3/3] Add a menu where the Leave button was --- client/css/style.css | 22 ++++++++++++++++------ client/js/lounge.js | 40 +++++++++++++++++++++++++++------------- client/views/chat.tpl | 3 ++- 3 files changed, 45 insertions(+), 20 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 9448af21..31cad81e 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -189,7 +189,8 @@ button, } #viewport .lt, -#viewport .rt { +#viewport .rt, +#chat button.menu { color: #ccc; display: none; float: left; @@ -213,10 +214,23 @@ button, -moz-osx-font-smoothing: grayscale; } +#chat button.menu:before { + font: 14px FontAwesome; + content: "\f142"; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + #viewport .rt { display: block; float: right; - margin: 6px -12px 0 12px; + margin: 6px -12px 0 0; +} + +#chat button.menu { + display: block; + float: right; + margin: 6px -8px 0 12px; } #viewport.rt #chat .sidebar { @@ -1576,10 +1590,6 @@ button, display: block; } - #viewport .rt { - margin-left: 18px; - } - #windows .window .header { display: block; } diff --git a/client/js/lounge.js b/client/js/lounge.js index cbea41ef..2593424c 100644 --- a/client/js/lounge.js +++ b/client/js/lounge.js @@ -491,27 +491,32 @@ $(function() { } }); - function positionContextMenu(e) { - var top, left; + function positionContextMenu(that, e) { + var offset; var menuWidth = contextMenu.outerWidth(); var menuHeight = contextMenu.outerHeight(); - if ((window.innerWidth - e.pageX) < menuWidth) { - left = window.innerWidth - menuWidth; - } else { - left = e.pageX; + if (that.hasClass("menu")) { + offset = that.offset(); + offset.left -= menuWidth - that.outerWidth(); + offset.top += that.outerHeight(); + return offset; } - if ((window.innerHeight - e.pageY) < menuHeight) { - top = window.innerHeight - menuHeight; - } else { - top = e.pageY; + offset = {left: e.pageX, top: e.pageY}; + + if ((window.innerWidth - offset.left) < menuWidth) { + offset.left = window.innerWidth - menuWidth; } - return {left: left, top: top}; + if ((window.innerHeight - offset.top) < menuHeight) { + offset.top = window.innerHeight - menuHeight; + } + + return offset; } - viewport.on("contextmenu", ".user, .network .chan", function(e) { + function showContextMenu(that, e) { var target = $(e.currentTarget); var output = ""; @@ -538,9 +543,18 @@ $(function() { contextMenuContainer.show(); contextMenu .html(output) - .css(positionContextMenu(e)); + .css(positionContextMenu($(that), e)); return false; + } + + viewport.on("contextmenu", ".user, .network .chan", function(e) { + return showContextMenu(this, e); + }); + + viewport.on("click", "#chat .menu", function(e) { + e.currentTarget = $(e.currentTarget).closest(".chan")[0]; + return showContextMenu(this, e); }); contextMenuContainer.on("click contextmenu", function() { diff --git a/client/views/chat.tpl b/client/views/chat.tpl index 7bd8793e..cf929e92 100644 --- a/client/views/chat.tpl +++ b/client/views/chat.tpl @@ -1,10 +1,11 @@ {{#each channels}} -
+
{{#equal type "channel"}} {{/equal}} + {{name}} {{{parse topic}}}