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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
/**
small screen navbar component, adds toggle, makes menu collapsable
*/
/**
* @method plugAndToggleSetupHelper
* @param {Node} plug the node in which we want to plug Y.Plug.Collapse
* @param {Node} toggle node which will toggle plug
* @param {Boolean} state [state=false] initial collapse state
* @static
*/
Y.namespace('navbar').plugAndToggleSetupHelper = function (pluggable, toggle, state) {
if(!pluggable || !toggle) {
Y.log('missing pluggable or toggle', 'warn');
return;
}
if (typeof state === 'undefined') {
state = false;
}
pluggable.plug(Y.Plugin.Collapse, {
state: state
});
toggle.on('click', function(e) {
e.preventDefault();
pluggable.collapse.toggle();
});
};
(function() {
var navbars = Y.all('.ues-navbar');
if (navbars.size()) {
navbars.each(function(node) {
var header = node.one('.ues-navbar-header');
if(!header) {
throw new Error('missing header dom');
}
var menu = node.one('.ues-navbar-collapse:not(.search)');
var search = node.one('.ues-navbar-collapse.search');
if(menu) {
var menuToggle = Y.Node.create('<div class="ues-icon-menu"></div>');
header.appendChild(menuToggle);
Y.navbar.plugAndToggleSetupHelper(menu, menuToggle);
}
if(search) {
var searchToggle = Y.Node.create('<div class="ues-icon-search-bordered"></div>');
header.appendChild(searchToggle);
Y.navbar.plugAndToggleSetupHelper(search, searchToggle);
}
// if both menu and search, let one close the other on open
if(menu && search) {
Y.each([[menu, search], [search, menu]], function (n) {
n[0].collapse.before('stateChange', function (e) {
if(e.newVal) {
n[1].collapse.close();
}
});
});
}
});
}
})();
|