Channel tools box; memberlist/right bar structure refactor

diff --git a/client/assets/css/style.css b/client/assets/css/style.css
index 475450d349fffdef5de9bb804610f755bf1d1c7d..27680efba39f3c5c3b694dda335cc695a7ec8469 100644 (file)
--- a/client/assets/css/style.css
+++ b/client/assets/css/style.css
@@ -39,7 +39,7 @@ html, body { height:100%; }
  */
 #kiwi .toolbar { position:absolute; top:0px; width:100%; display:none; }
 #kiwi .panels { position:absolute; left:0px; right:200px; bottom:100px; top:100px; }
-#kiwi .memberlists { position:absolute; right:0px; width:200px; bottom:100px; top:100px; overflow-y:auto; }
+#kiwi .right_bar { position:absolute; right:0px; width:200px; bottom:100px; top:100px; overflow-y:auto; }
 #kiwi .controlbox { position: absolute; bottom:0px; width:100%; display:none; }
 #kiwi .memberlists_resize_handle {
     position: absolute; width:10px; z-index:1; cursor:w-resize;
@@ -81,6 +81,14 @@ html, body { height:100%; }
     text-align: center;
 }
 
+#kiwi .channel_tools {
+}
+#kiwi .channel_tools i {
+    width: 49%;
+    display: inline-block;
+    text-align: center;
+    cursor: pointer;
+}
 
 #kiwi .panel_container { overflow-y:auto; height:100%; }
 #kiwi .panel {
@@ -120,8 +128,8 @@ html, body { height:100%; }
 
 
 /* A member/nick list per channel */
-#kiwi .memberlists { border-left: 1px solid #8A8A8A; }
-#kiwi .memberlists.disabled { display:none; }
+#kiwi .right_bar { border-left: 1px solid #8A8A8A; }
+#kiwi .right_bar.disabled { display:none; }
 #kiwi .memberlists ul { display:none; }
 
 /* The active channels nicklist */

diff --git a/client/assets/themes/basic/style.css b/client/assets/themes/basic/style.css
index f676b3c57c8e820a7414fd823938e7a0ea086fe7..e0aae246c40008001a5a19ae18d505aa9e976aa0 100644 (file)
--- a/client/assets/themes/basic/style.css
+++ b/client/assets/themes/basic/style.css
@@ -73,6 +73,20 @@
 }
 #kiwi .status_message.err { color:#D8000C; background:#FFBABA; }
 
+#kiwi .channel_tools {
+    margin-bottom: 5px;
+    padding: 0 5%;
+}
+#kiwi .channel_tools i {
+    width: 47%;
+    font-size: 1.6em;
+    line-height: 1.6em;
+}
+#kiwi .channel_tools i:hover {
+    transition: color 0.3s;
+    color: #88C56A;
+}
+
 #kiwi .messages {  }
 #kiwi .messages.active { }
 #kiwi .messages a { text-decoration:underline; }
@@ -150,7 +164,7 @@
 
 
 
-#kiwi .memberlists {
+#kiwi .right_bar {
     background-color: #DADADA;
     border-left: 1px dashed #8A8A8A;
 }

diff --git a/client/assets/themes/cli/style.css b/client/assets/themes/cli/style.css
index e85c6e54ff5a05a48de8a36deba6880c2d4c9805..a800c3c0784074cb0682edabfe11bca9d77aa4b6 100644 (file)
--- a/client/assets/themes/cli/style.css
+++ b/client/assets/themes/cli/style.css
@@ -94,7 +94,7 @@
 }
 
 
-#kiwi .memberlists { background:#252525; }
+#kiwi .right_bar { background:#252525; }
 #kiwi .memberlists ul li { padding: 0.2em 1em; }
 #kiwi .memberlists ul li a.nick { color:#6d6d6d; }
 #kiwi .memberlists ul li:hover {
@@ -111,6 +111,20 @@
 #kiwi .userbox a i { font-size:1.1em; margin-right:5px; }
 #kiwi .userbox .divider-horizontal { display:none; }
 
+#kiwi .channel_tools {
+    border-bottom: 1px solid #8A8A8A;
+    margin-bottom: 10px;
+    padding: 0 5%;
+}
+#kiwi .channel_tools i {
+    width: 47%;
+    font-size: 1.6em;
+    line-height: 1.6em;
+}
+#kiwi .channel_tools i:hover {
+    transition: color 0.3s;
+    color: #88C56A;
+}
 
 #kiwi .messages .msg > div { color:#6d6d6d; font-family: Inconsolata, Consolas, 'courier new', monospace; }
 #kiwi .messages .msg { border: none; padding: 2px 5px; }

diff --git a/client/assets/themes/mini/style.css b/client/assets/themes/mini/style.css
index c181abc80ec20be70a013a37e91c02c6f8b4ac81..24f8ab6eef8e3b0972d59864ce5b3b8be48044fc 100644 (file)
--- a/client/assets/themes/mini/style.css
+++ b/client/assets/themes/mini/style.css
@@ -117,7 +117,7 @@
 
 
 
-#kiwi .memberlists {
+#kiwi .right_bar {
     background-color: #DADADA;
     border-left: 1px solid #8A8A8A;
     display:none;

diff --git a/client/assets/themes/relaxed/style.css b/client/assets/themes/relaxed/style.css
index 7e9f65d0056ceb4f5fe1cd92f7e5883f83314abb..a9d73676098cd45951a41d8266a98ce591cccacf 100644 (file)
--- a/client/assets/themes/relaxed/style.css
+++ b/client/assets/themes/relaxed/style.css
@@ -98,6 +98,21 @@
 }
 #kiwi .status_message.err { color:#D8000C; background:#FFBABA; }
 
+#kiwi .channel_tools {
+    border-bottom: 1px solid #8A8A8A;
+    margin-bottom: 10px;
+    padding: 0 5%;
+}
+#kiwi .channel_tools i {
+    width: 47%;
+    font-size: 1.6em;
+    line-height: 1.6em;
+}
+#kiwi .channel_tools i:hover {
+    transition: color 0.3s;
+    color: #88C56A;
+}
+
 #kiwi .messages { color: #333333; }
 #kiwi .messages.active { }
 #kiwi .messages a { text-decoration:none; }
@@ -175,11 +190,11 @@
 #kiwi .messages .msg .media.reddit .thumbnail { float:left; margin-right: 0.5em; }
 
 
-#kiwi .memberlists {
+#kiwi .right_bar {
     background-color: #DADADA;
     border-left: 1px solid #8A8A8A;
 }
-#kiwi.narrow .memberlists { display:none; }
+#kiwi.narrow .right_bar { display:none; }
 #kiwi .memberlists ul { list-style: none; }
 #kiwi .memberlists ul.active { }
 #kiwi .memberlists ul li { padding: 0.2em 1em; }

diff --git a/client/build.js b/client/build.js
index 8bb25dcec66512b36416543820ff37a151a51223..aaa06f471cbaec0a9c5d5a6d27cb20e69b1a5654 100644 (file)
--- a/client/build.js
+++ b/client/build.js
@@ -82,6 +82,7 @@ var source_files = [
     __dirname + '/src/views/tabs.js',\r
     __dirname + '/src/views/topicbar.js',\r
     __dirname + '/src/views/userbox.js',\r
+    __dirname + '/src/views/channeltools.js',\r
     __dirname + '/src/views/channelinfo.js'\r
 ];\r
 \r

diff --git a/client/src/index.html.tmpl b/client/src/index.html.tmpl
index f0d82f5b74b04a0aa5fab55699ecce987bffd62a..43a09ff04c2b3cbcb97547735be954cd1d101ba2 100644 (file)
--- a/client/src/index.html.tmpl
+++ b/client/src/index.html.tmpl
@@ -42,7 +42,13 @@
                 <div class="panel_container container1"></div>\r
             </div>\r
 \r
-            <div class="memberlists disabled"></div>\r
+            <div class="right_bar disabled">\r
+                <div class="channel_tools">\r
+                    <i class="icon-info-sign channel_info" title="Channel Info"></i>\r
+                    <i class="icon-signout channel_part" ttle="Leave Channel"></i>\r
+                </div>\r
+                <div class="memberlists"></div>\r
+            </div>\r
 \r
             <div class="controlbox">\r
                 <div class="input">\r

diff --git a/client/src/models/application.js b/client/src/models/application.js
index ebf8edbcec3f4fe380a9e285ee196a3b4e9b3681..4a43c087975fdeddb497294345809182ed6d8e91 100644 (file)
--- a/client/src/models/application.js
+++ b/client/src/models/application.js
@@ -123,6 +123,7 @@ _kiwi.model.Application = function () {
             this.topicbar = new _kiwi.view.TopicBar({el: this.view.$el.find('.topic')[0]});\r
 \r
             new _kiwi.view.AppToolbar({el: _kiwi.app.view.$el.find('.toolbar .app_tools')[0]});\r
+            new _kiwi.view.ChannelTools({el: _kiwi.app.view.$el.find('.channel_tools')[0]});\r
 \r
             this.message = new _kiwi.view.StatusMessage({el: this.view.$el.find('.status_message')[0]});\r
 \r

diff --git a/client/src/views/application.js b/client/src/views/application.js
index 1825af78b53a8b2ffbcdda6494a856b3c8a63e97..5d6a045d09597652aeffcf7723321503bbf483eb 100644 (file)
--- a/client/src/views/application.js
+++ b/client/src/views/application.js
@@ -9,7 +9,7 @@ _kiwi.view.Application = Backbone.View.extend({
 
         this.elements = {
             panels:        this.$el.find('.panels'),
-            memberlists:   this.$el.find('.memberlists'),
+            right_bar:     this.$el.find('.right_bar'),
             toolbar:       this.$el.find('.toolbar'),
             controlbox:    this.$el.find('.controlbox'),
             resize_handle: this.$el.find('.memberlists_resize_handle')
@@ -134,7 +134,7 @@ _kiwi.view.Application = Backbone.View.extend({
     doLayout: function () {
         var el_kiwi = this.$el;
         var el_panels = this.elements.panels;
-        var el_memberlists = this.elements.memberlists;
+        var el_right_bar = this.elements.right_bar;
         var el_toolbar = this.elements.toolbar;
         var el_controlbox = this.elements.controlbox;
         var el_resize_handle = this.elements.resize_handle;
@@ -160,7 +160,7 @@ _kiwi.view.Application = Backbone.View.extend({
 
         // Apply the CSS sizes
         el_panels.css(css_heights);
-        el_memberlists.css(css_heights);
+        el_right_bar.css(css_heights);
         el_resize_handle.css(css_heights);
 
         // If we have channel tabs on the side, adjust the height
@@ -176,11 +176,11 @@ _kiwi.view.Application = Backbone.View.extend({
         }
 
         // Set the panels width depending on the memberlist visibility
-        if (el_memberlists.css('display') != 'none') {
+        if (el_right_bar.css('display') != 'none') {
             // Panels to the side of the memberlist
-            el_panels.css('right', el_memberlists.outerWidth(true));
+            el_panels.css('right', el_right_bar.outerWidth(true));
             // The resize handle sits overlapping the panels and memberlist
-            el_resize_handle.css('left', el_memberlists.position().left - (el_resize_handle.outerWidth(true) / 2));
+            el_resize_handle.css('left', el_right_bar.position().left - (el_resize_handle.outerWidth(true) / 2));
         } else {
             // Memberlist is hidden so panels to the right edge
             el_panels.css('right', 0);

diff --git a/client/src/views/channeltools.js b/client/src/views/channeltools.js
new file mode 100644 (file)
index 0000000..ffbfda0
--- /dev/null
+++ b/client/src/views/channeltools.js
@@ -0,0 +1,16 @@
+_kiwi.view.ChannelTools = Backbone.View.extend({
+    events: {
+        'click .channel_info': 'infoClick',
+        'click .channel_part': 'partClick'
+    },
+
+    initialize: function () {},
+
+    infoClick: function (event) {
+        new _kiwi.model.ChannelInfo({channel: _kiwi.app.panels().active});
+    },
+
+    partClick: function (event) {
+        _kiwi.gateway.part(null, _kiwi.app.panels().active.get('name'));
+    }
+});
\ No newline at end of file

diff --git a/client/src/views/memberlist.js b/client/src/views/memberlist.js
index fb262ce0e760156f64446bf02083a9a22a154308..1453855969823c01fe6f6263234e11a034a60005 100644 (file)
--- a/client/src/views/memberlist.js
+++ b/client/src/views/memberlist.js
@@ -1,8 +1,10 @@
 _kiwi.view.MemberList = Backbone.View.extend({
     tagName: "ul",
     events: {
-        "click .nick": "nickClick"
+        "click .nick": "nickClick",
+        "click .channel_info": "channelInfoClick"
     },
+
     initialize: function (options) {
         this.model.bind('all', this.render, this);
         $(this.el).appendTo('#kiwi .memberlists');
@@ -59,6 +61,13 @@ _kiwi.view.MemberList = Backbone.View.extend({
             });
         }).call(this);
     },
+
+
+    channelInfoClick: function(event) {
+        new _kiwi.model.ChannelInfo({channel: this.model.channel});
+    },
+
+
     show: function () {
         $('#kiwi .memberlists').children().removeClass('active');
         $(this.el).addClass('active');

diff --git a/client/src/views/panel.js b/client/src/views/panel.js
index 34b5bd932f88d41b34ff2b2b2fe679086e285c02..3827def17f4e7b7aee188fdb86ec2948f7752394 100644 (file)
--- a/client/src/views/panel.js
+++ b/client/src/views/panel.js
@@ -41,11 +41,11 @@ _kiwi.view.Panel = Backbone.View.extend({
         // Show this panels memberlist
         var members = this.model.get("members");
         if (members) {
-            $('#kiwi .memberlists').removeClass('disabled');
+            $('#kiwi .right_bar').removeClass('disabled');
             members.view.show();
         } else {
             // Memberlist not found for this panel, hide any active ones
-            $('#kiwi .memberlists').addClass('disabled').children().removeClass('active');
+            $('#kiwi .right_bar').addClass('disabled').children().removeClass('active');
         }
 
         // Remove any alerts and activity counters for this panel

diff --git a/client/src/views/resizehandler.js b/client/src/views/resizehandler.js
index d03455c448e79d7a86f0195e870be3b801fae0cc..96400a8c50a616929a33ff7ab11173004e8b3f30 100644 (file)
--- a/client/src/views/resizehandler.js
+++ b/client/src/views/resizehandler.js
@@ -23,7 +23,7 @@ _kiwi.view.ResizeHandler = Backbone.View.extend({
         if (!this.dragging) return;
 
         this.$el.css('left', event.clientX - (this.$el.outerWidth(true) / 2));
-        $('#kiwi .memberlists').css('width', this.$el.parent().width() - (this.$el.position().left + this.$el.outerWidth()));
+        $('#kiwi .right_bar').css('width', this.$el.parent().width() - (this.$el.position().left + this.$el.outerWidth()));
         _kiwi.app.view.doLayout();
     }
 });
\ No newline at end of file

diff --git a/server/settingsgenerator.js b/server/settingsgenerator.js
index 076a9b789fce4215afc512e2da05b4bead936540..d79753564a1fcf4a0cead80395ca1dea5f612d83 100644 (file)
--- a/server/settingsgenerator.js
+++ b/server/settingsgenerator.js
@@ -248,6 +248,7 @@ function addScripts(vars, debug) {
             'src/views/tabs.js',
             'src/views/topicbar.js',
             'src/views/userbox.js',
+            'src/views/channeltools.js',
             'src/views/channelinfo.js'
         ]
     ]);