Topicbar usability improvements
authorDarren <darren@darrenwhitlen.com>
Sat, 27 Oct 2012 13:02:12 +0000 (14:02 +0100)
committerDarren <darren@darrenwhitlen.com>
Sat, 27 Oct 2012 13:02:12 +0000 (14:02 +0100)
client/assets/dev/view.js
client/index.html

index 64889d29cc89b72689bad617d3bdb0bb657cfae2..e00421dedca47807c838b364fae6aef6a5a6252e 100644 (file)
@@ -582,7 +582,16 @@ kiwi.view.TopicBar = Backbone.View.extend({
 \r
     initialize: function () {\r
         kiwi.app.panels.bind('active', function (active_panel) {\r
-            this.setCurrentTopic(active_panel.get('topic'));\r
+            // If it's a channel topic, update and make editable\r
+            if (active_panel.isChannel()) {\r
+                this.setCurrentTopic(active_panel.get('topic') || '');\r
+                this.$el.find('div').attr('contentEditable', true);\r
+\r
+            } else {\r
+                // Not a channel topic.. clear and make uneditable\r
+                this.$el.find('div').attr('contentEditable', false)\r
+                    .text('');\r
+            }\r
         }, this);\r
     },\r
 \r
@@ -590,13 +599,16 @@ kiwi.view.TopicBar = Backbone.View.extend({
         var inp = $(ev.currentTarget),\r
             inp_val = inp.text();\r
         \r
-        if (kiwi.app.panels.active.isChannel()) {\r
-            if (ev.keyCode !== 13) return;\r
+        // Only allow topic editing if this is a channel panel\r
+        if (!kiwi.app.panels.active.isChannel()) {\r
+            return false;\r
+        }\r
 \r
+        // If hit return key, update the current topic\r
+        if (ev.keyCode === 13) {\r
             kiwi.gateway.topic(kiwi.app.panels.active.get('name'), inp_val);\r
+            return false;\r
         }\r
-        \r
-        return false;\r
     },\r
 \r
     setCurrentTopic: function (new_topic) {\r
@@ -914,7 +926,7 @@ kiwi.view.Application = Backbone.View.extend({
         }\r
 \r
         // If we're typing into an input box somewhere, ignore\r
-        if ((ev.target.tagName.toLowerCase() === 'input') || (ev.target.id === 'edittopic')) {\r
+        if ((ev.target.tagName.toLowerCase() === 'input') || $(ev.target).attr('contenteditable')) {\r
             return;\r
         }\r
 \r
index 94a04a2371bdc0e44aa6f9a4c509c1a95320c309..ab95be9fda678281d6bcf5ace56ef14c6718fd4b 100644 (file)
@@ -28,7 +28,7 @@
             </div>
 
             <div id="topic">
-                <div id="edittopic" contenteditable="true" ></div>
+                <div contenteditable="true" ></div>
             </div>
 
             <div id="status_message"></div>