| 9 |
lars |
1 |
/**
|
|
|
2 |
Core script to handle the entire theme and core functions
|
|
|
3 |
**/
|
|
|
4 |
|
|
|
5 |
var Layout = function () {
|
|
|
6 |
|
|
|
7 |
var layoutImgPath = 'layouts/layout3/img/';
|
|
|
8 |
|
|
|
9 |
var layoutCssPath = 'layouts/layout3/css/';
|
|
|
10 |
|
|
|
11 |
var resBreakpointMd = App.getResponsiveBreakpoint('md');
|
|
|
12 |
|
|
|
13 |
//* BEGIN:CORE HANDLERS *//
|
|
|
14 |
// this function handles responsive layout on screen size resize or mobile device rotate.
|
|
|
15 |
|
|
|
16 |
// Handles header
|
|
|
17 |
var handleHeader = function () {
|
|
|
18 |
// handle search box expand/collapse
|
|
|
19 |
$('.page-header').on('click', '.search-form', function (e) {
|
|
|
20 |
$(this).addClass("open");
|
|
|
21 |
$(this).find('.form-control').focus();
|
|
|
22 |
|
|
|
23 |
$('.page-header .search-form .form-control').on('blur', function (e) {
|
|
|
24 |
$(this).closest('.search-form').removeClass("open");
|
|
|
25 |
$(this).unbind("blur");
|
|
|
26 |
});
|
|
|
27 |
});
|
|
|
28 |
|
|
|
29 |
// handle hor menu search form on enter press
|
|
|
30 |
$('.page-header').on('keypress', '.hor-menu .search-form .form-control', function (e) {
|
|
|
31 |
if (e.which == 13) {
|
|
|
32 |
$(this).closest('.search-form').submit();
|
|
|
33 |
return false;
|
|
|
34 |
}
|
|
|
35 |
});
|
|
|
36 |
|
|
|
37 |
// handle header search button click
|
|
|
38 |
$('.page-header').on('mousedown', '.search-form.open .submit', function (e) {
|
|
|
39 |
e.preventDefault();
|
|
|
40 |
e.stopPropagation();
|
|
|
41 |
$(this).closest('.search-form').submit();
|
|
|
42 |
});
|
|
|
43 |
|
|
|
44 |
// handle scrolling to top on responsive menu toggler click when header is fixed for mobile view
|
|
|
45 |
$('body').on('click', '.page-header-top-fixed .page-header-top .menu-toggler', function(){
|
|
|
46 |
App.scrollTop();
|
|
|
47 |
});
|
|
|
48 |
};
|
|
|
49 |
|
|
|
50 |
// Handles main menu
|
|
|
51 |
var handleMainMenu = function () {
|
|
|
52 |
|
|
|
53 |
// handle menu toggler icon click
|
|
|
54 |
$(".page-header .menu-toggler").on("click", function(event) {
|
|
|
55 |
if (App.getViewPort().width < resBreakpointMd) {
|
|
|
56 |
var menu = $(".page-header .page-header-menu");
|
|
|
57 |
if (menu.is(":visible")) {
|
|
|
58 |
menu.slideUp(300);
|
|
|
59 |
} else {
|
|
|
60 |
menu.slideDown(300);
|
|
|
61 |
}
|
|
|
62 |
|
|
|
63 |
if ($('body').hasClass('page-header-top-fixed')) {
|
|
|
64 |
App.scrollTop();
|
|
|
65 |
}
|
|
|
66 |
}
|
|
|
67 |
});
|
|
|
68 |
|
|
|
69 |
// handle sub dropdown menu click for mobile devices only
|
|
|
70 |
$(".hor-menu .menu-dropdown > a, .hor-menu .dropdown-submenu > a").on("click", function(e) {
|
|
|
71 |
if (App.getViewPort().width < resBreakpointMd) {
|
|
|
72 |
if ($(this).next().hasClass('dropdown-menu')) {
|
|
|
73 |
e.stopPropagation();
|
|
|
74 |
if ($(this).parent().hasClass("opened")) {
|
|
|
75 |
$(this).parent().removeClass("opened");
|
|
|
76 |
} else {
|
|
|
77 |
$(this).parent().addClass("opened");
|
|
|
78 |
}
|
|
|
79 |
}
|
|
|
80 |
}
|
|
|
81 |
});
|
|
|
82 |
|
|
|
83 |
// close main menu on final link click for mobile mode
|
|
|
84 |
$(".hor-menu li > a").on("click", function(e) {
|
|
|
85 |
if (App.getViewPort().width < resBreakpointMd) {
|
|
|
86 |
if (!$(this).parent('li').hasClass('classic-menu-dropdown') && !$(this).parent('li').hasClass('mega-menu-dropdown')
|
|
|
87 |
&& !$(this).parent('li').hasClass('dropdown-submenu')) {
|
|
|
88 |
$(".page-header .page-header-menu").slideUp(300);
|
|
|
89 |
App.scrollTop();
|
|
|
90 |
}
|
|
|
91 |
}
|
|
|
92 |
});
|
|
|
93 |
|
|
|
94 |
// hold mega menu content open on click/tap.
|
|
|
95 |
$(document).on('click', '.mega-menu-dropdown .dropdown-menu, .classic-menu-dropdown .dropdown-menu', function (e) {
|
|
|
96 |
e.stopPropagation();
|
|
|
97 |
});
|
|
|
98 |
|
|
|
99 |
// handle fixed mega menu(minimized)
|
|
|
100 |
$(window).scroll(function() {
|
|
|
101 |
var offset = 75;
|
|
|
102 |
if ($('body').hasClass('page-header-menu-fixed')) {
|
|
|
103 |
if ($(window).scrollTop() > offset){
|
|
|
104 |
$(".page-header-menu").addClass("fixed");
|
|
|
105 |
} else {
|
|
|
106 |
$(".page-header-menu").removeClass("fixed");
|
|
|
107 |
}
|
|
|
108 |
}
|
|
|
109 |
|
|
|
110 |
if ($('body').hasClass('page-header-top-fixed')) {
|
|
|
111 |
if ($(window).scrollTop() > offset){
|
|
|
112 |
$(".page-header-top").addClass("fixed");
|
|
|
113 |
} else {
|
|
|
114 |
$(".page-header-top").removeClass("fixed");
|
|
|
115 |
}
|
|
|
116 |
}
|
|
|
117 |
});
|
|
|
118 |
};
|
|
|
119 |
|
|
|
120 |
// Handle sidebar menu links
|
|
|
121 |
var handleMainMenuActiveLink = function(mode, el) {
|
|
|
122 |
var url = location.hash.toLowerCase();
|
|
|
123 |
|
|
|
124 |
var menu = $('.hor-menu');
|
|
|
125 |
|
|
|
126 |
if (mode === 'click' || mode === 'set') {
|
|
|
127 |
el = $(el);
|
|
|
128 |
} else if (mode === 'match') {
|
|
|
129 |
menu.find("li > a").each(function() {
|
|
|
130 |
var path = $(this).attr("href").toLowerCase();
|
|
|
131 |
// url match condition
|
|
|
132 |
if (path.length > 1 && url.substr(1, path.length - 1) == path.substr(1)) {
|
|
|
133 |
el = $(this);
|
|
|
134 |
return;
|
|
|
135 |
}
|
|
|
136 |
});
|
|
|
137 |
}
|
|
|
138 |
|
|
|
139 |
if (!el || el.size() == 0) {
|
|
|
140 |
return;
|
|
|
141 |
}
|
|
|
142 |
|
|
|
143 |
if (el.attr('href').toLowerCase() === 'javascript:;' || el.attr('href').toLowerCase() === '#') {
|
|
|
144 |
return;
|
|
|
145 |
}
|
|
|
146 |
|
|
|
147 |
// disable active states
|
|
|
148 |
menu.find('li.active').removeClass('active');
|
|
|
149 |
menu.find('li > a > .selected').remove();
|
|
|
150 |
menu.find('li.open').removeClass('open');
|
|
|
151 |
|
|
|
152 |
el.parents('li').each(function () {
|
|
|
153 |
$(this).addClass('active');
|
|
|
154 |
|
|
|
155 |
if ($(this).parent('ul.navbar-nav').size() === 1) {
|
|
|
156 |
$(this).find('> a').append('<span class="selected"></span>');
|
|
|
157 |
}
|
|
|
158 |
});
|
|
|
159 |
};
|
|
|
160 |
|
|
|
161 |
// Handles main menu on window resize
|
|
|
162 |
var handleMainMenuOnResize = function() {
|
|
|
163 |
// handle hover dropdown menu for desktop devices only
|
|
|
164 |
var width = App.getViewPort().width;
|
|
|
165 |
var menu = $(".page-header-menu");
|
|
|
166 |
|
|
|
167 |
if (width >= resBreakpointMd) {
|
|
|
168 |
$(".page-header-menu").css("display", "block");
|
|
|
169 |
} else if (width < resBreakpointMd) {
|
|
|
170 |
$(".page-header-menu").css("display", "none");
|
|
|
171 |
}
|
|
|
172 |
};
|
|
|
173 |
|
|
|
174 |
var handleContentHeight = function() {
|
|
|
175 |
return;
|
|
|
176 |
var height;
|
|
|
177 |
|
|
|
178 |
if ($('body').height() < App.getViewPort().height) {
|
|
|
179 |
height = App.getViewPort().height -
|
|
|
180 |
$('.page-header').outerHeight() -
|
|
|
181 |
($('.page-container').outerHeight() - $('.page-content').outerHeight()) -
|
|
|
182 |
$('.page-prefooter').outerHeight() -
|
|
|
183 |
$('.page-footer').outerHeight();
|
|
|
184 |
|
|
|
185 |
$('.page-content').css('min-height', height);
|
|
|
186 |
}
|
|
|
187 |
};
|
|
|
188 |
|
|
|
189 |
// Handles the go to top button at the footer
|
|
|
190 |
var handleGoTop = function () {
|
|
|
191 |
var offset = 100;
|
|
|
192 |
var duration = 500;
|
|
|
193 |
|
|
|
194 |
if (navigator.userAgent.match(/iPhone|iPad|iPod/i)) { // ios supported
|
|
|
195 |
$(window).bind("touchend touchcancel touchleave", function(e){
|
|
|
196 |
if ($(this).scrollTop() > offset) {
|
|
|
197 |
$('.scroll-to-top').fadeIn(duration);
|
|
|
198 |
} else {
|
|
|
199 |
$('.scroll-to-top').fadeOut(duration);
|
|
|
200 |
}
|
|
|
201 |
});
|
|
|
202 |
} else { // general
|
|
|
203 |
$(window).scroll(function() {
|
|
|
204 |
if ($(this).scrollTop() > offset) {
|
|
|
205 |
$('.scroll-to-top').fadeIn(duration);
|
|
|
206 |
} else {
|
|
|
207 |
$('.scroll-to-top').fadeOut(duration);
|
|
|
208 |
}
|
|
|
209 |
});
|
|
|
210 |
}
|
|
|
211 |
|
|
|
212 |
$('.scroll-to-top').click(function(e) {
|
|
|
213 |
e.preventDefault();
|
|
|
214 |
$('html, body').animate({scrollTop: 0}, duration);
|
|
|
215 |
return false;
|
|
|
216 |
});
|
|
|
217 |
};
|
|
|
218 |
|
|
|
219 |
//* END:CORE HANDLERS *//
|
|
|
220 |
|
|
|
221 |
return {
|
|
|
222 |
|
|
|
223 |
// Main init methods to initialize the layout
|
|
|
224 |
// IMPORTANT!!!: Do not modify the core handlers call order.
|
|
|
225 |
|
|
|
226 |
initHeader: function() {
|
|
|
227 |
handleHeader(); // handles horizontal menu
|
|
|
228 |
handleMainMenu(); // handles menu toggle for mobile
|
|
|
229 |
App.addResizeHandler(handleMainMenuOnResize); // handle main menu on window resize
|
|
|
230 |
|
|
|
231 |
if (App.isAngularJsApp()) {
|
|
|
232 |
handleMainMenuActiveLink('match'); // init sidebar active links
|
|
|
233 |
}
|
|
|
234 |
},
|
|
|
235 |
|
|
|
236 |
initContent: function() {
|
|
|
237 |
handleContentHeight(); // handles content height
|
|
|
238 |
},
|
|
|
239 |
|
|
|
240 |
initFooter: function() {
|
|
|
241 |
handleGoTop(); //handles scroll to top functionality in the footer
|
|
|
242 |
},
|
|
|
243 |
|
|
|
244 |
init: function () {
|
|
|
245 |
this.initHeader();
|
|
|
246 |
this.initContent();
|
|
|
247 |
this.initFooter();
|
|
|
248 |
},
|
|
|
249 |
|
|
|
250 |
setMainMenuActiveLink: function(mode, el) {
|
|
|
251 |
handleMainMenuActiveLink(mode, el);
|
|
|
252 |
},
|
|
|
253 |
|
|
|
254 |
closeMainMenu: function() {
|
|
|
255 |
$('.hor-menu').find('li.open').removeClass('open');
|
|
|
256 |
|
|
|
257 |
if (App.getViewPort().width < resBreakpointMd && $('.page-header-menu').is(":visible")) { // close the menu on mobile view while laoding a page
|
|
|
258 |
$('.page-header .menu-toggler').click();
|
|
|
259 |
}
|
|
|
260 |
},
|
|
|
261 |
|
|
|
262 |
getLayoutImgPath: function() {
|
|
|
263 |
return App.getAssetsPath() + layoutImgPath;
|
|
|
264 |
},
|
|
|
265 |
|
|
|
266 |
getLayoutCssPath: function() {
|
|
|
267 |
return App.getAssetsPath() + layoutCssPath;
|
|
|
268 |
}
|
|
|
269 |
};
|
|
|
270 |
|
|
|
271 |
}();
|
|
|
272 |
|
|
|
273 |
if (App.isAngularJsApp() === false) {
|
|
|
274 |
jQuery(document).ready(function() {
|
|
|
275 |
Layout.init(); // init metronic core componets
|
|
|
276 |
});
|
|
|
277 |
}
|