[Search] Search menu & display tweaks

Clicking on names of options in the search
menu will now toggle the checkboxes. The
filter options display now says when no
filters are selected. Slightly moved the
search menu to the left.

platform/commonUI/general/res/css/tree.css

@@ -355,7 +355,7 @@ ul.tree {
       .search-holder .search .search-bar .search-menu-holder {
         float: right;
         margin-top: 17px;
-        left: -25px; }
+        left: -50px; }
         /* line 151, ../sass/search/_search.scss */
         .search-holder .search .search-bar .search-menu-holder .search-menu {
           border-top: 0; }
@@ -391,7 +391,7 @@ ul.tree {
       .search-holder .search .search-bar .search-menu-holder:after {
         position: absolute;
         top: -6px;
-        left: 10px;
+        left: 35px;
         display: inline-block;
         border-right: 6px solid transparent;
         border-bottom: 6px solid #5e5e5e;

platform/commonUI/general/res/sass/search/_search.scss

@@ -146,7 +146,7 @@
             .search-menu-holder {
                 float: right;
                 margin-top: $textInputHeight - 2px;
-                left: -25px;
+                left: -50px;
                 
                 .search-menu {
                     border-top: 0;
@@ -202,7 +202,7 @@
             .search-menu-holder:after {
                 position: absolute;
                 top: -6px;
-                left: 10px;
+                left: 35px;
                 display: inline-block;
                 border-right: 6px solid transparent;
                 //border-bottom: 6px solid white;

platform/search/res/templates/search.html

@@ -62,13 +62,14 @@
                 <ul>
                     <!-- First element is special - it's a reset option -->
                     <li class="search-menu-item special"
-                        title="Select all filters.">
+                        title="Select all filters."
+                        ng-click="ngModel.checkAll = !ngModel.checkAll; controller.checkAll()">
                         
                         <label class="checkbox custom search-menu-checkbox">
                             <input type="checkbox"
                                    class="checkbox"
                                    ng-model="ngModel.checkAll"
-                                   ng-change="controller.checkAll(); controller.updateOptions()" />
+                                   ng-change="controller.checkAll()" />
                             <em></em>
                         </label>
                         
@@ -80,7 +81,8 @@
                     
                     <!-- The filter options, by type -->
                     <li class="search-menu-item"
-                        ng-repeat="type in types">
+                        ng-repeat="type in types"
+                        ng-click="ngModel.checked[type.key] = !ngModel.checked[type.key]; controller.updateOptions()">
                         
                         <label class="checkbox custom search-menu-checkbox">
                             <input type="checkbox"
@@ -110,7 +112,7 @@
          ng-if="filtersString !== '' && ngModel.search">
         
         <a class="ui-symbol clear-filters-icon"
-           ng-click="ngModel.checkAll = true; controller.checkAll(); controller.updateOptions()">
+           ng-click="ngModel.checkAll = true; controller.checkAll()">
             x
         </a>
         

platform/search/src/controllers/SearchController.js

@@ -94,6 +94,49 @@ define(function () {
             });
         }
         
+        function updateOptions() {
+            var type,
+                i;
+
+            // Update all-checked status
+            $scope.ngModel.checkAll = true;
+            for (type in $scope.ngModel.checked) {
+                if (!$scope.ngModel.checked[type]) {
+                    $scope.ngModel.checkAll = false;
+                } else {
+                    if ($scope.filtersString === '') {
+                        $scope.filtersString += type;
+                    } else {
+                        $scope.filtersString += ', ' + type;
+                    }
+                }
+            }
+
+            // Update the current filters string
+            $scope.filtersString = '';
+            if ($scope.ngModel.checkAll !== true) {
+                for (i = 0; i < types.length; i += 1) {
+                    // If the type key corresponds to a checked option...
+                    if ($scope.ngModel.checked[types[i].key]) {
+                        // ... add it to the string list of current filter options
+                        if ($scope.filtersString === '') {
+                            $scope.filtersString += types[i].name;
+                        } else {
+                            $scope.filtersString += ', ' + types[i].name;
+                        }
+                    }
+                }
+                // If there's still nothing in the filters string, there are no 
+                //   filters selected
+                if ($scope.filtersString === '') {
+                    $scope.filtersString = 'NONE';
+                }
+            }
+
+            // Re-filter results
+            $scope.results = filter(fullResults.hits);
+        }
+        
         // On initialization, fill the scope's types with type keys
         types.forEach(function (type) {
             // We only want some types, the ones that are probably human readable
@@ -183,43 +226,7 @@ define(function () {
             /**
              * Re-filters the search restuls. Called when ngModel.checked changes. 
              */
-            updateOptions: function () {
+            updateOptions: updateOptions,
-                var type,
-                    i;
-                
-                // Update all-checked status
-                $scope.ngModel.checkAll = true;
-                for (type in $scope.ngModel.checked) {
-                    if (!$scope.ngModel.checked[type]) {
-                        $scope.ngModel.checkAll = false;
-                    } else {
-                        if ($scope.filtersString === '') {
-                            $scope.filtersString += type;
-                        } else {
-                            $scope.filtersString += ', ' + type;
-                        }
-                    }
-                }
-                
-                // Update the current filters string
-                $scope.filtersString = '';
-                if ($scope.ngModel.checkAll !== true) {
-                    for (i = 0; i < types.length; i += 1) {
-                        // If the type key corresponds to a checked option...
-                        if ($scope.ngModel.checked[types[i].key]) {
-                            // ... add it to the string list of current filter options
-                            if ($scope.filtersString === '') {
-                                $scope.filtersString += types[i].name;
-                            } else {
-                                $scope.filtersString += ', ' + types[i].name;
-                            }
-                        }
-                    }
-                }
-                
-                // Re-filter results
-                $scope.results = filter(fullResults.hits);
-            },
             
             /**
              * Resets options. 
@@ -229,6 +236,8 @@ define(function () {
                 for (type in $scope.ngModel.checked) {
                     $scope.ngModel.checked[type] = $scope.ngModel.checkAll;
                 }
+                
+                updateOptions();
             }
         };
     }