Moving nick list toggle into the right bar
authorDarren <darren@darrenwhitlen.com>
Tue, 29 Apr 2014 14:45:43 +0000 (15:45 +0100)
committerDarren <darren@darrenwhitlen.com>
Tue, 29 Apr 2014 14:45:43 +0000 (15:45 +0100)
client/assets/css/style.css
client/assets/themes/basic/style.css
client/assets/themes/cli/style.css
client/assets/themes/relaxed/style.css
client/src/views/apptoolbar.js
client/src/views/rightbar.js

index 00de4618087a2fbf343259a93f52447d48a7db98..0364b19f73f748b0c93bd5a575f75da01d372282 100644 (file)
@@ -39,7 +39,8 @@ 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 .right_bar { 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:visible; }
+#kiwi .right-bar-content { overflow-y:auto; position:relative; height:100% ;}
 #kiwi .controlbox { position: absolute; bottom:0px; width:100%; display:none; }
 #kiwi .memberlists_resize_handle {
     position: absolute; width:10px; z-index:1; cursor:w-resize;
@@ -84,7 +85,7 @@ html, body { height:100%; }
 #kiwi .channel_tools {
 }
 #kiwi .channel_tools i {
-    width: 49%;
+    width: 32%;
     display: inline-block;
     text-align: center;
     cursor: pointer;
@@ -127,12 +128,28 @@ html, body { height:100%; }
 #kiwi .messages .msg .media .media_content { white-space: normal; }
 
 
-/* A member/nick list per channel */
 #kiwi .right_bar { border-left: 1px solid #8A8A8A; }
-#kiwi .right_bar.disabled { display:none; }
-#kiwi .memberlists ul { display:none; }
+#kiwi .right_bar.disabled { width:0; }
+#kiwi .right_bar.disabled .channel_tools,
+#kiwi .right_bar.disabled .memberlists { display:none; }
+
+#kiwi .right-bar-toggle {
+    position: absolute;
+    top: 10px;
+    left: -2.3em;
+    width: 1.3em;
+    font-size: 25px;
+    font-weight: bold;
+    text-align: center;
+    line-height: 1.3em;
+    background: #e3e3e3;
+    border: 1px solid;
+    border-radius: 50%;
+    cursor: pointer;
+}
 
 /* The active channels nicklist */
+#kiwi .memberlists ul { display:none; }
 #kiwi .memberlists ul.active { display:block; }
 #kiwi .memberlists ul li { overflow-y:auto; overflow-x:hidden; cursor:pointer; }
 #kiwi .memberlists ul li a.nick { }
index 2ca440bfaef277b64d8a22844092c4764e3b5967..dd5565b6909b95127e00659f97a2ebec926c5688 100644 (file)
@@ -79,7 +79,7 @@
     padding: 0 5%;
 }
 #kiwi .channel_tools i {
-    width: 47%;
+    width: 30%;
     font-size: 1.6em;
     line-height: 1.6em;
 }
index f321a04e4ff1df7a01bf57668c27ffa0a14b9f96..e86ea47e51ed09aca6239ffb2bdc58558d822aba 100644 (file)
     padding: 0 5%;
 }
 #kiwi .channel_tools i {
-    width: 47%;
+    width: 30%;
     font-size: 1.6em;
     line-height: 1.6em;
 }
index 783abc614201cf61cd7f6be560aa028e9adb67cc..56d7b8d4ee605ac1fb6cb8ee248d81f1933ecff1 100644 (file)
     padding: 0 5%;
 }
 #kiwi .channel_tools i {
-    width: 47%;
+    width: 30%;
     font-size: 1.6em;
     line-height: 1.6em;
 }
index 82b496527c1695d3c9b2e5564f3e338e3cfcb4a3..fd097c824b3629da0a67c66b6709be976474c61f 100644 (file)
@@ -1,8 +1,7 @@
 _kiwi.view.AppToolbar = Backbone.View.extend({
     events: {
         'click .settings': 'clickSettings',
-        'click .startup': 'clickStartup' ,
-        'click .hiderightbar': 'clickHideRightBar'
+        'click .startup': 'clickStartup'
     },
 
     initialize: function () {
@@ -20,12 +19,5 @@ _kiwi.view.AppToolbar = Backbone.View.extend({
     clickStartup: function (event) {
         event.preventDefault();
         _kiwi.app.startup_applet.view.show();
-    },
-
-    clickHideRightBar: function (event) {
-        event.preventDefault();
-
-        _kiwi.app.rightbar.toggle();
-        _kiwi.app.view.doLayout();
     }
 });
index 67c5c2fb6fd18bf17138e698f6886f4a827386d7..1f1b4ed335efbb74fb9c7dc4e84e30be2899621a 100644 (file)
@@ -1,13 +1,22 @@
 _kiwi.view.RightBar = Backbone.View.extend({
+    events: {
+        'click .right-bar-toggle': 'onClickToggle',
+        'click .right-bar-toggle-inner': 'onClickToggle'
+    },
+
     initialize: function() {
         this.keep_hidden = false;
-        this.hidden = false;
+        this.hidden = this.$el.hasClass('disabled');
+
+        this.updateIcon();
     },
 
 
     hide: function() {
         this.hidden = true;
         this.$el.addClass('disabled');
+
+        this.updateIcon();
     },
 
 
@@ -16,6 +25,8 @@ _kiwi.view.RightBar = Backbone.View.extend({
 
         if (!this.keep_hidden)
             this.$el.removeClass('disabled');
+
+        this.updateIcon();
     },
 
 
@@ -28,5 +39,31 @@ _kiwi.view.RightBar = Backbone.View.extend({
         } else {
             this.$el.removeClass('disabled');
         }
+
+        this.updateIcon();
+    },
+
+
+    updateIcon: function() {
+        var $toggle = this.$('.right-bar-toggle'),
+            $icon = $toggle.find('i');
+
+        if (!this.hidden && this.keep_hidden) {
+            $toggle.show();
+        } else {
+            $toggle.hide();
+        }
+
+        if (this.keep_hidden) {
+            $icon.removeClass('icon-double-angle-right').addClass('icon-user');
+        } else {
+            $icon.removeClass('icon-user').addClass('icon-double-angle-right');
+        }
+    },
+
+
+    onClickToggle: function(event) {
+        this.toggle();
+        _kiwi.app.view.doLayout();
     }
 });
\ No newline at end of file