refs #4987 added possibility to search for websites

2 files changed, 65 insertions, 46 deletions

diff --git a/plugins/ZenMode/angularjs/quick-access/quick-access-directive.js b/plugins/ZenMode/angularjs/quick-access/quick-access-directive.js
index c917d4fcc7..72d1ea3f2c 100644
--- a/plugins/ZenMode/angularjs/quick-access/quick-access-directive.js
+++ b/plugins/ZenMode/angularjs/quick-access/quick-access-directive.js
@@ -12,7 +12,7 @@
  *
  * Will execute the "executeMyFunction" function in the current scope once the yes button is pressed.
  */
-angular.module('piwikApp.directive').directive('piwikQuickAccess', function($rootElement, $timeout) {
+angular.module('piwikApp.directive').directive('piwikQuickAccess', function($rootElement, $timeout, siteSelectorModel) {
 
     return {
         restrict: 'A',
@@ -23,61 +23,63 @@ angular.module('piwikApp.directive').directive('piwikQuickAccess', function($roo
 
             var menuIndex = -1;
 
-            function getMenuEntries()
+            function highlightPreviousItem()
             {
-                var menuEntries = [];
-
-                $rootElement.find('#topLeftBar .topBarElem a, #topRightBar .topBarElem a').each(function (index, element) {
-                    menuEntries.push({name: $(element).text(), index: ++menuIndex, category: 'menu'});
-                    $(element).attr('quick_access', menuIndex);
-                });
-
-                return menuEntries;
+                if (0 >= (scope.search.index - 1)) {
+                    scope.search.index = 0;
+                } else {
+                    scope.search.index--;
+                }
             }
-            function getReportEntries()
+
+            function highlightNextItem()
             {
-                var reportEntries = [];
+                var numTotal = element.find('li.result').length;
 
-                $rootElement.find('.Menu-tabList a').each(function (index, element) {
-                    reportEntries.push({name: $(element).text(), menu: 'Report', index: ++menuIndex});
-                    $(element).attr('quick_access', menuIndex);
-                });
+                if (numTotal <= (scope.search.index + 1)) {
+                    scope.search.index = numTotal - 1;
+                } else {
+                    scope.search.index++;
+                }
+            }
 
-                return reportEntries;
+            function executeMenuItem()
+            {
+                var results = element.find('li.result');
+                if (results && results.length && results[scope.search.index]) {
+                    var selectedMenuElement = $(results[scope.search.index]);
+                    $timeout(function () {
+                        selectedMenuElement.click();
+                    }, 20);
+                }
             }
 
-            scope.menuEntries = getMenuEntries();
+            siteSelectorModel.loadInitialSites();
+
+            scope.menuItems = getMenuItems();
             scope.reportEntries = getReportEntries();
+            scope.sitesModel = siteSelectorModel;
 
             scope.onKeypress = function (event) {
 
                 if (38 == event.which) {
-
-                    if (0 >= (this.search.index - 1)) {
-                        this.search.index = 0;
-                    } else {
-                        this.search.index--;
-                    }
+                    highlightPreviousItem();
                 } else if (40 == event.which) {
-                    // down
-                    var numTotal = element.find('li.result').length;
-
-                    if (numTotal <= (this.search.index + 1)) {
-                        this.search.index = numTotal - 1;
-                    } else {
-                        this.search.index++;
-                    }
+                    highlightNextItem();
                 } else if (13 == event.which) {
-                    var results = element.find('li.result');
-                    if (results && results.length && results[this.search.index]) {
-                        var selectedMenuElement = $(results[this.search.index]);
-                        $timeout(function () {
-                            selectedMenuElement.click();
-                        }, 20);
-                    }
+                    executeMenuItem();
                 }
             };
 
+            scope.search = function (searchTerm) {
+                this.search.index = 0;
+                this.sitesModel.searchSite(searchTerm);
+            };
+
+            scope.selectSite = function (idsite) {
+                this.sitesModel.loadSite(idsite);
+            };
+
             scope.selectMenuItem = function (index) {
                 var target = $rootElement.find('[quick_access=' + index + ']');
 
diff --git a/plugins/ZenMode/angularjs/quick-access/quick-access.html b/plugins/ZenMode/angularjs/quick-access/quick-access.html
index 35c2cb2620..dc9ef07dbc 100644
--- a/plugins/ZenMode/angularjs/quick-access/quick-access.html
+++ b/plugins/ZenMode/angularjs/quick-access/quick-access.html
@@ -1,13 +1,30 @@
 <div class="quick-access" title="Search for menu entries, reports and websites (Shortcut: alt + /)">
-    <input ng-keydown="onKeypress($event)" ng-change="search.index=0" ng-model="search.term" type="text" placeholder="Search for anything"/>
+    <input ng-keydown="onKeypress($event)" ng-change="search(search.term)" ng-model="search.term" type="text" placeholder="Search for anything"/>
     <ul ng-show="search.term">
-        <li class="quick-access-category" ng-click="search.term='menu'">Menu</li>
-        <li class="no-result" ng-hide="menuEntries | filter:search.term | length">---</li>
-        <li class="result" ng-class="{selected: $index == search.index}" ng-click="selectMenuItem(entry.index)" ng-repeat="entry in menuEntries | filter:search.term"><a>{{ entry.name | trim }}</a></li>
+        <li class="quick-access-category"
+            ng-click="search.term='menu'">Menu</li>
+        <li class="no-result"
+            ng-hide="menuItems | filter:search.term | length">---</li>
+        <li class="result"
+            ng-class="{selected: $index == search.index}"
+            ng-click="selectMenuItem(entry.index)"
+            ng-repeat="entry in menuItems | filter:search.term"><a>{{ entry.name | trim }}</a></li>
         <li class="quick-access-category">{{ 'SitesManager_Sites' | translate }}</li>
-        <li class="no-result">---</li>
+        <li class="no-result"
+            ng-hide="sitesModel.sites | length">---</li>
+        <li class="no-result"
+            ng-show="sitesModel.isLoading">{{ 'MultiSites_LoadingWebsites' | translate }}</li>
+        <li class="result"
+            ng-show="!sitesModel.isLoading"
+            ng-class="{selected: ((menuItems | filter:search.term | length) + $index) == search.index}"
+            ng-click="selectSite(site.idsite)"
+            ng-repeat="site in sitesModel.sites"><a>{{ site.name | trim }}</a></li>
         <li class="quick-access-category">{{ 'General_Reports' | translate }}</li>
-        <li class="no-result" ng-hide="reportEntries | filter:search.term | length">---</li>
-        <li class="result" ng-class="{selected: ((menuEntries | filter:search.term | length) + $index) == search.index}" ng-click="selectMenuItem(entry.index)" ng-repeat="entry in reportEntries | filter:search.term"><a>{{ entry.name | trim }}</a></li>
+        <li class="no-result"
+            ng-hide="reportEntries | filter:search.term | length">---</li>
+        <li class="result"
+            ng-class="{selected: ((menuItems | filter:search.term | length) + $index + (sitesModel.sites | length)) == search.index}"
+            ng-click="selectMenuItem(entry.index)"
+            ng-repeat="report in reportEntries | filter:search.term"><a>{{ report.name | trim }}</a></li>
     </ul>
 </div>
\ No newline at end of file