https://waterinlimburg.nl/communities/common/themes/mett%20respons…/javascripts/framework/dynamic_menu.js

1
2// Create a dynamic mett menu from a certain rootID
3var DynamicMenu = function (aRootID, aFixSubMenu, aHandler)
4{
5	var theReturnObject =
6	{
7		mRootID: -1,
8		mMenu: null,
9		mMenuContainer: null,
10		mMainItemUrl: null,
11
12		init: function (aRootID, aFixSubMenu)
13		{
14			if(typeof aRootID == "undefined" || aRootID == null || aRootID < 1) {
15				return;
16			}
17
18			$("div[id$='_multiLevelMainMenu']").remove();
19			$("#mobileMenu").empty();
20
21			this.mRootID = aRootID;
22
23			this.mMenu = $('<ul class="firstRow"></div>');
24			this.mMenuContainer = $('<div class="dynamic_multiLevelMainMenu"><ul class="secondRow"></ul></div>');
25
26			this.getChildren();
27		},
28
29		resumeInit: function ()
30		{
31			this.mMenuContainer.prepend(this.mMenu);
32
33			$("#mainMenu > .row:first").prepend(this.mMenuContainer);
34
35			if (aFixSubMenu) {
36				this.fixSubMenu();
37			}
38
39			this.fixBreadCrumbs();
40
41			// Create mobile version
42			$("#mobileMenu").append($("#mainMenu .dynamic_multiLevelMainMenu").clone());
43			$("#mainMenu [data-mobile-only='true']").remove();
44
45			setTimeout(function ()
46			{
47				$("#mobileSlideOut").initializeMobileMenu();
48				$(window).resize();
49			}, 100);
50
51			if (typeof aHandler == "function") {
52				aHandler();
53			}
54		},
55
56		getChildren: function ()
57		{
58			var theThis = this;
59
60			this.mMainItemUrl = null;
61
62			$.ajax({url: "/api/pageTree/childrenOf?section_id=" + this.mRootID + "&showHiddenPages=false&token=" + $("input[name='__RequestVerificationToken']").val() + "&preventCache=" + new Date().getTime().toString()}).done(function(aData)
63			{
64				var theRootDepth = 0,
65					theCurrentTopItem = null,
66					theCurrentSubMenu = null,
67					theLastDepth = 0,
68					theLastSubMenu = null,
69					theLastSubItem = null;
70
71				theRootDepth = aData[0].Url.split("/").length;
72				theThis.mMainItemUrl = aData[0].Url + "/";
73				
74				// Remove non-visible items
75				aData = aData.filter(x => x.section_showInMenu == true);
76
77				if (aData[0].section_title.toLowerCase() !== "home" && aData[0].section_menuTitle.toLowerCase() !== "home") {
78					var homeItem = [],
79						pathArray = window.location.pathname.split("/");
80					
81					homeItem.Url = "/" + pathArray[1];
82					homeItem.section_communityID = settings.communityID;
83					homeItem.section_description = "Home";
84					homeItem.section_inTrash = false;
85					homeItem.section_isEnabled = true;
86					homeItem.section_menuTitle = "Home";
87					homeItem.section_name = "home";
88					homeItem.section_showInMenu = true;
89					homeItem.section_title = "Home";
90					homeItem.section_id = theThis.mRootID;
91					homeItem.section_parentID = 0;
92					
93					aData.unshift(homeItem);
94				}
95
96				$.each(aData, function (aIndex)
97				{
98					if (this.section_name != "Shortcuts" && this.Url != "" && this.Url != "/")
99					{
100						var theCurrentDepth = this.Url.split("/").length;
101
102						if (theCurrentDepth <= theRootDepth + 1) {
103							theCurrentTopItem = $("<li></li>");
104							theCurrentTopItem.data("section-id", this.section_id);
105							theCurrentTopItem.append('<a href="' + this.Url + '/default.aspx">' + this.section_menuTitle + '</a>');
106
107							if ((aIndex > 0 && document.location.href.toLowerCase().indexOf(this.Url.toLowerCase() + "/") > -1) || document.location.href.toLowerCase().indexOf(this.Url.toLowerCase() + "/default.aspx") > -1) {
108								theCurrentTopItem.find("a:first").addClass("active");
109							}
110
111							theThis.mMenu.append(theCurrentTopItem);
112
113							theCurrentSubMenu = null;
114							theLastSubMenu = null;
115						} else {
116							// Skip if parent is not visible in menu
117							if (theCurrentTopItem.data("section-id") != this.section_parentID) {
118								return;
119							}
120
121							if (theCurrentDepth == theLastDepth) {
122								theCurrentSubMenu = theLastSubMenu;
123							} else if (theCurrentDepth > theLastDepth) {
124								theCurrentSubMenu = $("<ul></ul>");
125
126								var theArrow = $('<a href="/" class="arrow icon-down-open-big before" title="Subpagina\'s tonen of verbergen"><span>Subpagina\'s tonen of verbergen</span></a>');
127								var theDropDown = $('<div class="dropDown"></div>');
128								theDropDown.append(theCurrentSubMenu);
129
130								if (theCurrentDepth >

130 theRootDepth + 2 || !settings.menu.enableDHTMLMenu) {
131									theArrow.attr("data-mobile-only", "true");
132									theDropDown.attr("data-mobile-only", "true");
133								}
134
135								if (theLastSubMenu == null) {
136									theCurrentTopItem.append(theArrow);
137									theCurrentTopItem.append(theDropDown);
138								} else {
139									theLastSubItem.append(theArrow);
140									theLastSubItem.append(theDropDown);
141								}
142							} else if (theCurrentDepth < theLastDepth) {
143								theCurrentSubMenu = theLastSubMenu;
144
145								for (var i = theCurrentDepth; i < theLastDepth; i++) {
146									theCurrentSubMenu = theCurrentSubMenu.parents("ul:first");
147								}
148							}
149
150							var theCurrentSubItem = $("<li></li>");
151							theCurrentSubItem.append('<a href="' + this.Url + '/default.aspx">' + this.section_menuTitle + '</a>');
152
153							if (document.location.href.toLowerCase().indexOf(this.Url.toLowerCase()) > -1) {
154								theCurrentSubItem.addClass("active");
155							}
156
157							theCurrentSubMenu.append(theCurrentSubItem);
158
159							theLastSubMenu = theCurrentSubMenu;
160							theLastSubItem = theCurrentSubItem;
161						}
162
163						theLastDepth = theCurrentDepth;
164					}
165				});
166
167				theThis.resumeInit();
168			});
169		},
170
171		fixSubMenu: function ()
172		{
173			var theParentItems = $("#subMenu ul:first > li"),
174				theChildItems = $("#subMenu ul:first > li ul:first > li");
175
176			if (theChildItems.length > 0) {
177				$("#subMenu ul:first").append(theChildItems);
178			}
179
180			if (theParentItems.length > 0) {
181				theParentItems.remove();
182			}
183		},
184
185		fixBreadCrumbs: function ()
186		{
187			var theThis = this,
188				breadCrumbs = $("#path a"),
189				breadCrumbsParent = $("#path > span");
190
191			if (this.mMainItemUrl != null && breadCrumbs.length > 0)
192			{
193				breadCrumbs.each(function ()
194				{
195					var currentBreadCrumb = $(this);
196
197					if (currentBreadCrumb.attr("href").toLowerCase().indexOf(theThis.mMainItemUrl.toLowerCase()) == -1) {
198						currentBreadCrumb.parent().remove();
199					}
200				});
201
202				while (breadCrumbsParent.html().indexOf(" &gt; ") == 0)
203				{
204					breadCrumbsParent.html(breadCrumbsParent.html().substring(6));
205				}
206			}
207		}
208	};
209
210	theReturnObject.init(aRootID, aFixSubMenu);
211
212	return theReturnObject;
213};
214
215// Keep this outside of any function, so it executes before initialize
216if (typeof dynamicMenuRootID != "undefined" && dynamicMenuRootID != null && dynamicMenuRootID > 0)
217{
218	if (typeof fixSubMenu == "undefined" || fixSubMenu == null) {
219		var fixSubMenu = false;
220	}
221
222	if (typeof dynamicMenuHandler == "undefined" || dynamicMenuHandler == null) {
223		var dynamicMenuHandler = false;
224	}
225
226	new DynamicMenu(dynamicMenuRootID, fixSubMenu, dynamicMenuHandler);
227}