https://dreamjobsafrica.com/wp-content/themes/superio/js/sliding-menu.js?ver=0.3.0

1/*! =========================================================
2 * Sliding Menu v0.3.0
3 * http://github.danielcardoso.net/sliding-menu/
4 * ==========================================================
5 * Copyright (c) 2014-2019 DanielCardoso.net.
6 * Licensed under MIT.
7 * ======================================================== */
8if (typeof jQuery === 'undefined') {
9    throw new Error('Sliding Menu requires jQuery');
10}
11(function (factory) {
12    'use strict';
13    if (typeof define === 'function' && define.amd) {
14        define(['jquery'], factory);
15    } else {
16        factory(jQuery);
17    }
18}(function ($) {
19    'use strict';
20    var slidingMenuUsedIds, SlidingMenu;
21
22    slidingMenuUsedIds = [];
23
24    SlidingMenu = function (element, options) {
25        this.options = undefined;
26        this.$el = undefined;
27        this.currentPanel = undefined;
28
29        this.init(element, options);
30    };
31
32    SlidingMenu.NAME = 'Sliding Menu';
33
34    SlidingMenu.VERSION = '0.3.0';
35
36    SlidingMenu.MAIN_CLASS = 'sliding-menu';
37
38    SlidingMenu.PANEL_CLASS = SlidingMenu.MAIN_CLASS + '__panel';
39
40    SlidingMenu.ICON_CLASS = SlidingMenu.MAIN_CLASS + '__icon';
41
42    SlidingMenu.NAVIGATION_CLASS = SlidingMenu.MAIN_CLASS + '__nav';
43
44    SlidingMenu.BACK_CLASS = SlidingMenu.MAIN_CLASS + '__back';
45
46    SlidingMenu.SEPARATOR_CLASS = SlidingMenu.MAIN_CLASS + '__separator';
47
48    SlidingMenu.SET_ICON_CLASS = 'sm-set-icon';
49
50    SlidingMenu.DEFAULTS = {
51        // Adicional class for menu element
52        className: '',
53        // Default slide animation speed
54        transitionDuration: 250,
55        // A JSON object to build the menu from. Check our JSON example.
56        dataJSON: false,
57        // The link to the selected panel. Set to false to use the root panel
58        initHref: false,
59        // Label for the back button. Set to true to use the link's own label
60        backLabel: 'Back'
61    };
62
63    SlidingMenu.prototype.init = function (element, options) {
64        this.$el = $(element);
65
66        if (this.$el.hasClass(SlidingMenu.MAIN_CLASS)) {
67            return;
68        }
69
70        this.options = this.getOptions(options);
71        this.events();
72        this.process();
73    };
74
75    SlidingMenu.prototype.$ = function (selector) {
76        return this.$el.find(selector);
77    };
78
79    SlidingMenu.prototype.events = function () {
80        this.$el.on('click', 'a, .' + SlidingMenu.NAVIGATION_CLASS, $.proxy(this._onClickItem, this));
81    };
82
83    SlidingMenu.prototype._onClickItem = function (event) {
84        var linker, targetPanel, movePanelTo;
85
86        linker = $(event.currentTarget);
87
88        if (linker.attr('data-id') !== undefined) {
89
90            movePanelTo = linker.hasClass(SlidingMenu.BACK_CLASS);
91            targetPanel = this.$('.' + SlidingMenu.PANEL_CLASS + '[data-id="' + linker.attr('data-id') + '"]');
92
93            if (this.currentPanel.attr('data-id') !== targetPanel.attr('data-id')) {
94                this.currentPanel.stop(true, true).animate({
95                    left: movePanelTo ? '100%' : '-100%'
96                }, this.options.transitionDuration);
97
98                targetPanel.stop(true, true).css('left', movePanelTo ? '-100%' : '100%').animate({
99                    left: 0
100                }, this.options.transitionDuration);
101
102                this.$el.stop(true, true).animate({
103                    height: targetPanel.height()
104                }, this.options.transitionDuration);
105            } else {
106                targetPanel.css({
107                    'left': 0
108                });
109                this.$el.height(targetPanel.height());
110            }
111
112            this.currentPanel = targetPanel;
113        }
114
115        if (!linker.hasClass(SlidingMenu.NAVIGATION_CLASS)) {
116            this.$('li.active').removeClass('active');
117            linker.closest('li').addClass('active');
118        }
119    };
120
121    SlidingMenu.prototype.process = function () {
122        var data;
123
124        if (this.options.dataJSON === true) {
125            data = this.processJSON(this.options.dataJSON);
126        } else {
127            data = this.processHTML();
128        }
129
130        this.setMenuContent(data);
131    };
132
133    SlidingMenu.prototype.processJSON = function (data, parent, backLabel) {
134        var root, panels;
135
136        root = {
137            id: SlidingMenu.PANEL_CLASS + '-' + this.getNewId(),
138            root: parent ? false : true,
139            children: []
140        };
141        panels = [];
142
143        if (parent) {
144            root.children.push({
145                panelId: parent.id,
146                href: false,
147                label: this.options.backLabel === true ? backLabel : this.options.backLabel,
148                _styleClass: SlidingMenu.BACK_CLASS + ' ' + SlidingMenu.NAVIGATION_CLASS
149            });
150        }
151
152        $(data).each($.proxy(function (index, item) {
153            var panel;
154
155            root.children.push(item);
156
157            if (item.children) {
158                panel = this.processJSON(item.children, root, item.label);
159                item.panelId = panel[0].id;
160                item._styleClass = SlidingMenu.NAVIGATION_CLASS;
161                panels = panels.concat(panel);
162
163                // Delete all childrens
164                delete item.children;
165            }
166        }, this));
167
168        return [root].concat(panels);
169    };
170
171    SlidingMenu.prototype.processHTML = function (parentElem, parentObj, backLabel) {
172        var root, panels;
173
174        root = {
175            id: SlidingMenu.PANEL_CLASS + '-' + this.getNewId(),
176            root: parentElem ? false : true,
177            children: []
178        };
179        panels = [];
180
181        if (parentElem !== undefined) {
182            root.children.push({
183                panelId: parentObj.id,
184                href: false,
185                label: this.options.backLabel === true ? backLabel : this.options.backLabel,
186                _styleClass: SlidingMenu.BACK_CLASS + ' ' + SlidingMenu.NAVIGATION_CLASS
187            });
188        } else {
189            parentElem = this.$el.children('ul');
190        }
191
192        parentElem.children('li').each($.proxy(function (key, item) {
193            var itemObj, itemLink, panel, subPanel;
194
195            item = $(item);
196
197            if (!item.hasClass('separator')) {
198                itemLink = item.children('a');
199
200                itemObj = {
201                    icon: itemLink.find('.' + SlidingMenu.SET_ICON_CLASS).attr('class') || undefined,
202                    href: itemLink.attr('href'),
203                    label: itemLink.html(),
204                    classNames: {
205                        parent: this.trimWhiteSpaces(item.attr('class') || ''),
206                        element: this.trimWhiteSpaces(itemLink.attr('class') || '')
207                    }
208                };
209
210                if (itemObj.icon !== undefined) {
211                    itemObj.icon = (itemObj.icon).replace(SlidingMenu.SET_ICON_CLASS, '');
212                }
213
214                subPanel = item.children('ul');
215                if (subPanel.length !== 0) {
216                    panel = this.processHTML(subPanel, root, itemObj.label);
217
218                    itemObj.panelId = panel[0].id;
219                    itemObj._styleClass = SlidingMenu.NAVIGATION_CLASS;
220                    panels = panels.concat(panel);
221                }
222            } else {
223                itemObj = {
224                    separator: true
225                };
226            }
227
228            root.children.push(itemObj);
229        }, this));
230
231        return [root].concat(panels);
232    };
233
234    SlidingMenu.prototype.setMenuContent = function (json) {
235        var rootPanel;
236
237        this.$el
238            .empty()
239            .addClass(SlidingMenu.MAIN_CLASS + ' ' + this.options.className);
240
241        $(json).each($.proxy(function (index, item) {
242            var panel;
243            panel = $('<ul/>');
244
245            if (item.root) {
246                rootPanel = '.' + SlidingMenu.PANEL_CLASS + '[data-id="' + item.id + '"]';
247            }
248
249            // panel.attr('id', item.id);
250            panel.attr('data-id', item.id);
251            panel.addClass(SlidingMenu.PANEL_CLASS);
252
253            $(item.children).each(function (index, item) {
254                var li, link, icon;
255
256                li = $('<li/>');
257
258                if (item.separator !== true) {
259                    link = item.panelId ? $('<button/>') : $('<a/>');
260
261                    if (item.classNames !== undefined) {
262                        li.addClass(item.classNames.parent);
263                        link.addClass(item.classNames.element);
264                    }
265
266                    link.addClass(item._styleClass);
267
268                    if (item.panelId) {
269                        link.attr({
270                            'type': 'button',
271                            'data-id': item.panelId
272                        });
273                    } else {
274                        link.attr({
275                            'href': item.href
276                        });
277                    }
278
279                    link.html(item.label);
280
281                    if (item.icon) {
282                        icon = $('<i/>');
283                        icon.addClass(SlidingMenu.ICON_CLASS + ' ' + item.icon);
284
285                        link.prepend(icon);
286                    }
287                    li.append(link);
288                } else {
289                    li.addClass(SlidingMenu.SEPARATOR_CLASS);
290                }
291
292                panel.append(li);
293            });
294
295            this.$el.append(panel);
296        }, this));
297
298        rootPanel = this.$(rootPanel);
299
300        rootPanel.addClass(SlidingMenu.PANEL_CLASS + '-root');
301        this.currentPanel = rootPanel;
302
303        if (this.options.initHref !== false) {
304            this.changeVisiblePanel();
305        } else {
306            this.currentPanel.css('left', 0);
307        }
308
309        this.$el.height(this.currentPanel.height());
310    };
311
312    SlidingMenu.prototype.changeVisiblePanel = function () {
313        var selectedLink, selectedPanel;
314
315        selectedLink = this.getHyperlinkByHref(this.options.initHref)
316
317        if (selectedLink.length !== 0) {
318            selectedLink.closest('li').addClass('active');
319            selectedPanel = this.getPanelByHref(this.options.initHref);
320            this.currentPanel = selectedPanel;
321        } else {
322            console.warn(SlidingMenu.NAME + ': the link "' + this.options.initHref + '" does not exists. Please ' +
323                'check the ' + (this.options.dataJSON !== false ? 'JSON object' : 'HTML structure') + '.');
324        }
325
326        this.options.initHref = false;

327        this.currentPanel.css('left', 0);
328    };
329
330    SlidingMenu.prototype.trimWhiteSpaces = function (text) {
331        return text.trim();
332    };
333
334    SlidingMenu.prototype.getDefaults = function () {
335        return SlidingMenu.DEFAULTS;
336    };
337
338    SlidingMenu.prototype.getOptions = function (options) {
339        return $.extend({}, this.getDefaults(), this.$el.data(), options);
340    };
341
342    SlidingMenu.prototype.getHyperlinkByHref = function (href) {
343        return this.$('a[href="' + href + '"]') || undefined;
344    };
345
346    SlidingMenu.prototype.getPanelByHref = function (href) {
347        var linkElement = this.getHyperlinkByHref(href);
348        return linkElement !== undefined ? linkElement.closest('ul') : undefined;
349    };
350
351    /**
352     * Create a new ID
353     * @return {Number} New id generated
354     */
355    SlidingMenu.prototype.getNewId = function () {
356        var id;
357
358        do {
359            id = Math.random().toString(36).substring(2, 9);
360        } while (slidingMenuUsedIds.indexOf(id) >= 0);
361
362        slidingMenuUsedIds.push(id);
363
364        return id;
365    };
366
367    // PLUGIN DEFINITION
368    // =======================
369    //
370    function Plugin(option) {
371        return this.each(function () {
372            var $this, data, options;
373
374            $this = $(this);
375            data = $this.data('dc.slidingMenu');
376            options = typeof option === 'object' && option;
377
378            if (!data && /destroy|hide/.test(option)) {
379                return;
380            }
381            if (!data) {
382                $this.data('dc.slidingMenu', (data = new SlidingMenu(this, options)));
383            }
384            if (typeof option === 'string') {
385                data[option]();
386            }
387        });
388    }
389
390    var old = $.fn.slidingMenu;
391    $.fn.slidingMenu = Plugin;
392    $.fn.slidingMenu.Constructor = SlidingMenu;
393
394    // SLIDINGMENU NO CONFLICT
395    // =================
396
397    $.fn.slidingMenu.noConflict = function () {
398        $.fn.slidingMenu = old;
399        return this;
400    };
401}));