[Browse] Separate tree expand/collapser

platform/commonUI/browse/bundle.json

@@ -25,6 +25,10 @@
                     "urlService"
                 ]
             },
+            {
+                "key": "BrowseTreeController",
+                "implementation": "BrowseTreeController.js"
+            },
             {
                 "key": "BrowseObjectController",
                 "implementation": "BrowseObjectController.js",

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

@@ -22,27 +22,29 @@
 
 <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-class="treeClass ? 'browse-showtree' : 'browse-hidetree'">
+    <div class="holder browse-area s-browse-area abs browse-wrapper"
+         ng-controller="BrowseTreeController as tree"
+         ng-class="tree.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">
+                <div class="holder abs l-mobile">
-	                <mct-representation key="'create-button'" mct-object="navigatedObject">
+                    <mct-representation key="'create-button'" mct-object="navigatedObject">
-	                </mct-representation>
+                    </mct-representation>
-	                <div class='holder search-holder abs'
+                    <div class='holder search-holder abs'
-	                     ng-class="{active: treeModel.search}">
+                         ng-class="{active: treeModel.search}">
-	                    <mct-representation key="'search'"
+                        <mct-representation key="'search'"
-	                                 mct-object="domainObject"
+                                     mct-object="domainObject"
-	                                 ng-model="treeModel">
+                                     ng-model="treeModel">
-	                    </mct-representation>
+                        </mct-representation>
-	                </div>
+                    </div>
-	                <div class='tree-holder abs mobile-tree-holder'
+                    <div class='tree-holder abs mobile-tree-holder'
-	                     ng-hide="treeModel.search">
+                         ng-hide="treeModel.search">
-	                    <mct-representation key="'tree'"
+                        <mct-representation key="'tree'"
-	                                        mct-object="domainObject"
+                                            mct-object="domainObject"
-	                                        ng-model="treeModel">
+                                            ng-model="treeModel">
-	                    </mct-representation>
+                        </mct-representation>
-	                </div>
+                    </div>
-	            </div>
+                </div>
             </div>
 
             <mct-splitter class="mobile-hide"></mct-splitter>
@@ -52,7 +54,8 @@
                     <mct-representation mct-object="navigatedObject" key="'browse-object'">
                     </mct-representation>
                 </div>
-                <div class="key-properties ui-symbol icon mobile-menu-icon desktop-hide" ng-click="treeSlide()">m</div>
+                <div class="key-properties ui-symbol icon mobile-menu-icon desktop-hide"
+                     ng-click="tree.toggle()">m</div>
             </div>
         </mct-split-pane>
     </div>

platform/commonUI/browse/src/BrowseController.js

@@ -142,12 +142,6 @@ define(
                 selectedObject: navigationService.getNavigation()
             };
 
-            // SlideMenu boolean used to hide and show
-            // tree menu
-            $scope.treeSlide = function () {
-                $scope.treeClass = !$scope.treeClass;
-            };
-
             // Listen for changes in navigation state.
             navigationService.addListener(setNavigation);
 
@@ -158,12 +152,6 @@ define(
             $scope.$on("$destroy", function () {
                 navigationService.removeListener(setNavigation);
             });
-
-            // If the user has selected an object (and is portrait
-            // on a phone), then hide the tree menu
-            $scope.$on("select-obj", function () {
-                $scope.treeSlide();
-            });
         }
 
         return BrowseController;

platform/commonUI/browse/src/BrowseTreeController.js

@@ -0,0 +1,55 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define,Promise*/
+
+/**
+ * This bundle implements Browse mode.
+ * @namespace platform/commonUI/browse
+ */
+define(
+    [],
+    function () {
+        "use strict";
+
+        function BrowseTreeController() {
+            this.state = true;
+        }
+
+        BrowseTreeController.prototype.toggle = function () {
+            this.state = !this.state;
+        };
+
+        BrowseTreeController.prototype.hide = function () {
+            this.state = false;
+        };
+
+        BrowseTreeController.prototype.show = function () {
+            this.state = true;
+        };
+
+        BrowseTreeController.prototype.visible = function () {
+            return this.state;
+        };
+
+        return BrowseTreeController;
+    }
+);