Start on panels

js/background.js

@@ -56,6 +56,32 @@
                 request.respond(500, 'Bad encrypted websocket message');
             });
         });
+        var opened = false;
+        var panel = 0;
+
+        chrome.browserAction.onClicked.addListener(function () {
+            if (opened === false) {
+                opened = true;
+                chrome.windows.create({
+                    url: 'index2.html',
+                    type: 'panel',
+                    focused: true,
+                    width: 260, // 280 for chat
+                    height: 440 // 420 for chat
+                }, function (window) {
+                    var isPanelEnabled = window.alwaysOnTop;
+                    panel = window.id;
+                });
+            } else if (opened === true) {
+                chrome.windows.update(panel, { focused: true });
+            }
+            chrome.windows.onRemoved.addListener(function (windowId) {
+                if (windowId === panel) {
+                    panel = 0;
+                    opened = false;
+                }
+            });
+        });
     };
 
     function onMessageReceived(pushMessage) {
@@ -196,5 +222,4 @@
             console.log('got delivery receipt for unknown message', pushMessage.source, timestamp);
         });
     };
-
 })();

js/conversation_panel.js

@@ -0,0 +1,57 @@
+/*global $, Whisper, Backbone, textsecure, extension*/
+/* vim: ts=4:sw=4:expandtab:
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+(function () {
+  'use strict';
+
+    window.Whisper = window.Whisper || {};
+
+    function loadConversation (id) {
+        var conversation = new Whisper.Conversation({ id: id });
+        conversation.fetch().then(function () {
+            new Whisper.ConversationView({ model: conversation}).render().$el.appendTo($('#conversation-container'));
+        });
+
+        // clean 'er up
+        conversationInfo = undefined;
+    };
+
+    var conversationInfo = {
+        id: '',
+        idPairs: {}
+    };
+
+    extension.on('loadConversation', function (message) {
+        debugger;
+        if (conversationInfo.id) {
+            if (message.windowId === conversationInfo.id) {
+                loadConversation(message.conversationId);
+            }
+        } else {
+            conversationInfo.idPairs[message.windowId] = message.conversationId;
+        }
+    });
+
+    chrome.windows.getCurrent(function (windowInfo) {
+        window.document.title = conversationInfo.id = windowInfo.id;
+
+        var conversationId = conversationInfo.idPairs[conversationInfo.id];
+
+        if (typeof conversationId !== 'undefined') {
+            loadConversation(conversationId);
+        }
+    });
+}());

js/views/conversation_list_item_view.js

@@ -19,6 +19,7 @@ var Whisper = Whisper || {};
 (function () {
   'use strict';
 
+  // list of conversations, showing user/group and last message sent
   Whisper.ConversationListItemView = Backbone.View.extend({
     tagName: 'div',
     className: 'contact',
@@ -36,11 +37,28 @@ var Whisper = Whisper || {};
     },
 
     open: function(e) {
+      var modelId = this.model.id;
+
       this.$el.addClass('selected');
 
       if (!this.view) {
         this.view = new Whisper.ConversationView({ model: this.model });
       }
+
+      chrome.windows.create({
+        url: 'conversation.html#' + modelId,
+        type: 'panel',
+        focused: true,
+        width: 280,
+        height: 420
+      }, function (windowInfo) {
+	debugger;
+        extension.trigger('loadConversation', {
+          windowId: windowInfo.id,
+          conversationId: modelId
+        });
+      });
+
       this.model.collection.trigger('selected', this.view);
     },
 

js/views/conversation_view.js

@@ -37,8 +37,8 @@
             this.view = new Whisper.MessageListView({
                 collection: this.model.messageCollection
             });
-            this.$el.find('.discussion-container').append(this.view.el);
-
+            $('#conversation-container').append(this.view.el);
+//new ...({el: $(#conversation-container)})
             this.model.fetchMessages({reset: true});
         },
 
@@ -83,7 +83,20 @@
             }
         },
 
+        /*addAll: function() {
+            this.collection.each(this.addOne);
+        },
+        addOne: function(model) {
+            var view = new Whisper.Message({model: model});
+            view.render();
+            $(this.el).append(view.el);
+            model.bind('remove', view.remove);
+        },*/
+
         render: function() {
+            //this.$el.empty();
+            //this.addAll();
+
             this.delegateEvents();
             this.view.delegateEvents();
             this.view.scrollToBottom();

js/views/inbox_view.js

@@ -22,9 +22,7 @@
         initialize: function () {
             this.gutter = $('#gutter');
             this.contacts = $('#contacts');
-            this.resize();
 
-            window.addEventListener('resize', this.resize.bind(this));
             this.conversations = new Whisper.ConversationCollection();
 
             new Whisper.ConversationListView({
@@ -70,23 +68,8 @@
             });
             this.setContent(view.render().$el.show());
         },
-        resize: function (e) {
-            var windowheight = window.innerHeight,
-                form = $('.send-message-area').outerHeight(),
-                gutter_offset = this.gutter.offset().top,
-                contacts_offset = this.contacts.offset().top;
-            if (window.innerWidth < 480) {
-                this.gutter.css('height', windowheight - gutter_offset - form);
-                this.contacts.css('height', windowheight - contacts_offset - form);
-            } else {
-                this.gutter.css('height', windowheight - gutter_offset);
-                this.contacts.css('height', windowheight - contacts_offset);
-            }
-            $('.discussion').css('height', windowheight - gutter_offset - form);
-        },
         setContent: function (content) {
             $(content).insertAfter(this.gutter);
-            this.resize();
         }
     });