diff --git a/res/app/components/stf/nav-menu/nav-menu-directive.js b/res/app/components/stf/nav-menu/nav-menu-directive.js index 7e5aec98..4e1d4727 100644 --- a/res/app/components/stf/nav-menu/nav-menu-directive.js +++ b/res/app/components/stf/nav-menu/nav-menu-directive.js @@ -1,31 +1,42 @@ +// Based from https://ryankaskel.com/blog/2013/05/27/a-different-approach-to-angularjs-navigation-menus + + module.exports = function ($location) { return function (scope, element, attrs) { var links = element.find('a') var onClass = attrs.navMenu || 'current' var routePattern + var routeBasePattern = /\/#[^/]*/ // TODO: add regex to remove last part of the url var link var url var currentLink - var urlMap = {} + var urlMap = [] var i if (!$location.$$html5) { - routePattern = /^#[^/]*/ + routePattern = /\/#[^/]*/ } for (i = 0; i < links.length; i++) { link = angular.element(links[i]) - url = link.attr('href') + url = link.attr('ng-href') if ($location.$$html5) { - urlMap[url] = link + urlMap.push({url: url, link: link}) } else { - urlMap[url.replace(routePattern, '')] = link + urlMap.push({url: url.replace(routePattern, ''), link: link}) } } - scope.$on('$routeChangeStart', function () { - var pathLink = urlMap[$location.path()] + function activateLink() { + var location = $location.path() + var pathLink = '' + + for (i = 0; i < urlMap.length; ++i) { + if (urlMap[i].url == location) { + pathLink = urlMap[i].link + } + } if (pathLink) { if (currentLink) { @@ -34,6 +45,9 @@ module.exports = function ($location) { currentLink = pathLink; currentLink.addClass(onClass); } - }) + } + + activateLink() + scope.$on('$routeChangeStart', activateLink) } } \ No newline at end of file diff --git a/res/app/device-control/index.js b/res/app/device-control/index.js index 60e09358..7795e076 100644 --- a/res/app/device-control/index.js +++ b/res/app/device-control/index.js @@ -6,7 +6,7 @@ module.exports = angular.module('device-control', [ require('stf/screen').name ]) .config(['$routeProvider', function ($routeProvider) { - $routeProvider.when('/devices/:serial', { + $routeProvider.when('/control/:serial', { template: require('./device-control.jade'), controller: 'DeviceControlCtrl' }) diff --git a/res/app/menu/menu-controller.js b/res/app/menu/menu-controller.js index 1e1feadf..62a5c844 100644 --- a/res/app/menu/menu-controller.js +++ b/res/app/menu/menu-controller.js @@ -1,16 +1,3 @@ module.exports = function MenuCtrl($scope) { - $scope.isActive = function (viewLocation) { - var pattern = '/' + viewLocation, - re = new RegExp(pattern); - return re.test($location.path()); - }; - - $scope.isActive = function (path) { - console.log($location.path()) - console.log($location.path().substr(0, path.length)) - - return $location.path().substr(0, path.length) == path; - } - } diff --git a/res/app/menu/menu.jade b/res/app/menu/menu.jade index 09fbf46c..23e15510 100644 --- a/res/app/menu/menu.jade +++ b/res/app/menu/menu.jade @@ -1,15 +1,15 @@ .navbar.stf-menu .container-fluid.stf-top-bar a.stf-logo(href="/") STF 2 - ul.nav.stf-nav(nav-menu) + ul.nav.stf-nav(nav-menu='current') li(ng-cloak) - a(href='/#!/control') + a(ng-href='/#!/control') span.fa.fa-mobile | {{"Control"|translate}} - a(href='/#!/devices') + a(ng-href='/#!/devices') span.fa.fa-sitemap | {{"Devices"|translate}} - a(href='/#!/settings') + a(ng-href='/#!/settings') span.fa.fa-gears | {{"Settings"|translate}} ul.nav.stf-nav.stf-feedback.pull-right(ng-cloak)