Added chat maximize support.

src/styles/components/_chat.scss

@@ -28,13 +28,17 @@ pointer-events: none;
 z-index:45;
 overflow:hidden;
 }
+#chat.maximized {
+left:0px;
+width:auto;
+}
 .chatpane {
 height:100%;
 position:absolute;
 top:0px;
 left:0px;
 bottom:0px;
-width:260px;
+right:0px;
 -webkit-transition: left 200ms ease-in-out;
 -moz-transition: left 200ms ease-in-out;
 -ms-transition: left 200ms ease-in-out;

static/js/directives/chat.js

@@ -145,6 +145,9 @@ define(['underscore', 'text!partials/chat.html', 'text!partials/chatroom.html'],
                             }
 
                         };
+                        subscope.toggleMax = function() {
+                            scope.toggleMax();
+                        };
                         subscope.sendChat = function(to, message, status, mid, noloop) {
                             //console.log("send chat", to, scope.peer);
                             var peercall = mediaStream.webrtc.findTargetCall(to);
@@ -313,6 +316,10 @@ define(['underscore', 'text!partials/chat.html', 'text!partials/chatroom.html'],
                         subscope.$destroy();
                     }, 0);
                 };
+                scope.toggleMax = function() {
+                    //TODO(longsleep): Angularize this.
+                    iElement.parent().toggleClass("maximized");
+                };
 
                 scope.$on("room", function(event, room) {
                     if (room !== null) {

static/partials/chatroom.html

@@ -1,5 +1,5 @@
 <div ng-controller="ChatroomController" class="chat room-{{index}}" ng-class="{'newmessage': newmessage, 'visible': visible, 'chat-p2p': 'p2pstate', 'with_pictures': isgroupchat}">
-    <div class="chatheader"><span ng-show="p2pstate" class="fa fa-exchange" title="{{_('Peer to peer')}}"/><span>{{settings.title}} {{id|displayName}}</span> <div class="ctrl"><i title="{{_('Close chat')}}" ng-show="id" ng-click="hide()" class="fa fa-times"></i></div></div>
+    <div class="chatheader"><span ng-show="p2pstate" class="fa fa-exchange" title="{{_('Peer to peer')}}"/><span>{{settings.title}} {{id|displayName}}</span> <div class="ctrl"><i ng-click="toggleMax()" class="fa fa-expand"></i><i title="{{_('Close chat')}}" ng-show="id" ng-click="hide()" class="fa fa-times"></i></div></div>
     <div class="outputbox">
         <div class="output nicescroll"></div>
     </div>