https://www.bitrix24.fr/bitrix/templates/bitrix24_2017/components/bitrix/menu/main.menu/script.js

1;(function() {
2	let Menu = function() {
3		this.Header = BX.namespace('BX.SB.Bitrix24.Template.Header');
4
5		this.attributes = {
6			main: 'data-dropdown-main',
7			hover: 'data-hover',
8			selected: 'data-selected',
9			dropdownHoverSections: 'data-dropdown-hovers',
10			dropdownHover: 'data-dropdown-hover',
11			initializer: 'data-initializer',
12			diving: 'data-diving',
13		};
14
15		this.nodes = {
16			menu: document.querySelector('[' + this.attributes.main + ']') || null,
17		};
18
19		this.tree = {};
20
21		if (this.nodes.menu)
22		{
23			if (this.Header.isInitialized === true)
24			{
25				this.initialization();
26			}
27			else
28			{
29				BX.addCustomEvent('BX.SB.Bitrix24.Template.Header:onInitialize', this.initialization.bind(this));
30			}
31		}
32	};
33
34	Menu.prototype = {
35		toggle: function(parameters, event) {
36			event = event || window.event;
37
38			let isTouchEventAllowed = this.Header.Menu.isOpened();
39
40			if (
41				!isTouchEventAllowed
42				&& event
43				&& parameters.initializer
44				&& parameters.initializer.getAttribute(this.attributes.diving) === 'mobile'
45				&& parameters.initializer.contains(event.target)
46			)
47			{
48				event.preventDefault();
49			}
50
51			if (isTouchEventAllowed && parameters.event !== 'touch')
52			{
53				return false;
54			}
55
56			(parameters.hovers || []).forEach((hover) => {
57				if (!hover.contains(parameters.target) || parameters.event === 'close')
58				{
59					hover.removeAttribute(this.attributes.hover);
60				}
61			});
62
63			switch (parameters.event)
64			{
65				case 'touch':
66					if (parameters.target && (isTouchEventAllowed || parameters.initializer))
67					{
68						if (
69							BX.Type.isElementNode(parameters.initializer)
70							&& BX.Type.isElementNode(event.target)
71						)
72						{
73							let closeEventHandler = function(event) {
74								event = event || window.event;
75
76								if (BX.Type.isElementNode(event.target) && !this.Header.nodes.header.contains(event.target))
77								{
78									BX.Event.unbind(window, 'click', closeEventHandler);
79
80									this.toggle({
81										//initializer: parameters.initializer,
82										target: parameters.target,
83										hovers: parameters.hovers,
84										event: 'close',
85									}, event);
86								}
87							}.bind(this);
88
89							if (
90								parameters.initializer.contains(event.target) &&
91								parameters.target.hasAttribute(this.attributes.hover)
92							)
93							{
94								parameters.target.removeAttribute(this.attributes.hover);
95								BX.Event.unbind(window, 'click', closeEventHandler);
96							}
97							else
98							{
99								parameters.target.setAttribute(this.attributes.hover, 'true');
100								BX.Event.bind(window, 'click', closeEventHandler);
101							}
102						}
103						else
104						{
105							parameters.target.hasAttribute(this.attributes.hover)
106								? parameters.target.removeAttribute(this.attributes.hover)
107								: parameters.target.setAttribute(this.attributes.hover, 'true');
108						}
109					}
110					break;
111
112				case 'change':
113					if (parameters.target)
114					{
115						parameters.target.setAttribute(this.attributes.hover, 'true');
116					}
117					break;
118			}
119		},
120		initialization: function() {
121			let sections = this.Header.nodes.header.querySelectorAll('[' + this.attributes.dropdownHoverSections + ']');
122			sections = Array.prototype.slice.call(sections);
123			sections.forEach((section) => {
124				let eventType = section.getAttribute(this.attributes.dropdownHoverSections) || '';
125
126				let hovers = BX.findChildren(
127					section,
128					{attrs: Object.fromEntries([[this.attributes.dropdownHover, '']])},
129					false,
130					true
131				);
132
133				hovers.forEach((hover, index, list) => {
134					BX.Event.bind(hover, 'click', this.toggle.bind(this, {
135						target: hover,
136						hovers: list,
137						initializer: hover.querySelector('[' + this.attributes.initializer + ']') || null,
138						event: 'touch',
139					}));
140
141					if (eventType !== 'click')
142					{
143						BX.Event.bind(hover, 'mouseenter', this.toggle.bind(this, {
144							target: hover,
145							hovers: list,
146							event: 'change',
147						}));
148
149						BX.Event.bind(hover, 'mouseleave', this.toggle.bind(this, {
150							target: hover,
151							hovers: list,
152							event: 'leave',
153						}));
154					}
155				});
156			});
157		},
158	};
159
160	BX.ready(function() {
161		new Menu();
162	});
163})();