[Frontend] Manual re-do of collapse/expand panes

open #90
Implementing PaneController;
Added inspection pane and toggle button in
browse-object.html;

platform/commonUI/browse/res/templates/browse-object.html

@@ -41,9 +41,22 @@
             </mct-representation>
         </div>
     </div>
+    <mct-split-pane class='t-object-and-inspector contents abs' anchor='right'>
+        <div class='split-pane-component t-object pane left'>
+            <mct-representation key="representation.selected.key"
+                                mct-object="representation.selected.key && domainObject"
+                                class="abs object-holder">
+            </mct-representation>
+            <a class="ui-symbol icon mobile-hide"
+               style="position: absolute; z-index: 1000; right: 0;"
+               ng-click="ngModel.toggle()">F</a>
+        </div><!--/ t-object -->
 
-    <mct-representation key="representation.selected.key"
-                        mct-object="representation.selected.key && domainObject"
-                        class="abs object-holder">
-    </mct-representation>
+        <mct-splitter class="mobile-hide" ng-class="{ hidden: !ngModel.visible()}"></mct-splitter>
+
+        <div class='split-pane-component t-inspector pane right mobile-hide'
+            ng-class="{ hidden:!ngModel.visible() }">
+            Inspector goes here
+        </div>
+    </mct-split-pane><!--/ t-object-and-inspector -->
 </span>

platform/commonUI/browse/res/templates/browse.html

@@ -23,9 +23,10 @@
 <div class="abs holder-all browse-mode" ng-controller="BrowseController">
     <mct-include key="'topbar-browse'"></mct-include>
     <div class="holder browse-area s-browse-area abs browse-wrapper"
-         ng-controller="PaneController as treePane"
-         ng-class="treePane.visible() ? 'browse-showtree' : 'browse-hidetree'">
-        <mct-split-pane class='contents abs' anchor='left'>
+         ng-controller="PaneController as modelPaneTree"
+         ng-class="modelPaneTree.visible() ? 'browse-showtree' : 'browse-hidetree'">
+        <mct-split-pane class='contents abs'
+                        anchor='left'>
             <div class='split-pane-component treeview pane left'>
                 <div class="holder abs l-mobile">
                     <mct-representation key="'create-button'"
@@ -50,17 +51,18 @@
                 </div>
             </div>
 
-            <mct-splitter class="mobile-hide"></mct-splitter>
+            <mct-splitter class="mobile-hide" ng-class="{ hidden: !modelPaneTree.visible()}"></mct-splitter>
 
             <div class='split-pane-component items pane right-repr'>
-                <div class='holder abs l-mobile' id='content-area'>
+                <a class="ui-symbol icon mobile-menu-icon"
+                   style="position: absolute; z-index: 1000"
+                   ng-click="modelPaneTree.toggle()">m</a>
+                <div class='holder abs l-mobile' id='content-area' ng-controller="PaneController as modelPaneInspect">
                     <mct-representation mct-object="navigatedObject"
-                                        key="'browse-object'">
+                                        key="'browse-object'"
+                                        ng-model="modelPaneInspect">
                     </mct-representation>
                 </div>
-                <a class="ui-symbol icon mobile-menu-icon"
-                     style="position: absolute; z-index: 1000"
-                     ng-click="treePane.toggle()">m</a>
             </div>
         </mct-split-pane>
     </div>

platform/commonUI/browse/src/BrowseController.js

@@ -153,12 +153,6 @@ define(
             $scope.$on("$destroy", function () {
                 navigationService.removeListener(setNavigation);
             });
-
-            // Models for panes
-            $scope.paneModelTree = {};
-            $scope.paneModelInspect = {};
-
-
         }
 
         return BrowseController;