menu_toggle.directive.js
1.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
angular.module('sbAdminApp')
.run(['$templateCache', function ($templateCache) {
$templateCache.put('partials/menu-toggle.tmpl.html',
'<md-button class="md-button-toggle"\n' +
' ng-click="toggle()"\n' +
' aria-controls="docs-menu-{{section.name}}"\n' +
' flex layout="row"\n' +
' aria-expanded="{{isOpen()}}">\n' +
' <i class="material-icons">{{section.icon}}</i>\n' +
' {{section.name}}\n' +
' <span aria-hidden="true" class=" pull-right fa fa-chevron-down md-toggle-icon"\n' +
' ng-class="{\'toggled\' : isOpen()}"></span>\n' +
'</md-button>\n' +
'<ul ng-show="isOpen()" id="docs-menu-{{section.name}}" class="menu-toggle-list">\n' +
' <li ng-repeat="page in section.pages">\n' +
' <menu-link section="page"></menu-link>\n' +
' </li>\n' +
'</ul>\n' +
'');
}])
.directive('menuToggle', ['$timeout', function ($timeout ) {
return {
scope: {
section: '='
},
templateUrl: 'partials/menu-toggle.tmpl.html',
link: function (scope, element) {
var controller = element.parent().controller();
scope.isOpen = function () {
return controller.isOpen(scope.section);
};
scope.toggle = function () {
controller.toggleOpen(scope.section);
};
var parentNode = element[0].parentNode.parentNode.parentNode;
if (parentNode.classList.contains('parent-list-item')) {
var heading = parentNode.querySelector('h2');
element[0].firstChild.setAttribute('aria-describedby', heading.id);
}
}
};
}])