(function($) { 'use strict'; /** * Pages. * @constructor * @property {string} pageScrollElement - Scroll Element in Page. * @property {object} $body - Cache Body. */ var Pages = function() { this.pageScrollElement = 'html, body'; this.$body = $('body'); this.setUserOS(); this.setUserAgent(); }; /** @function setUserOS * @description SET User Operating System eg: mac,windows,etc * @returns {string} - Appends OSName to Pages.$body */ Pages.prototype.setUserOS = function() { var OSName = ""; if (navigator.appVersion.indexOf("Win") != -1) OSName = "windows"; if (navigator.appVersion.indexOf("Mac") != -1) OSName = "mac"; if (navigator.appVersion.indexOf("X11") != -1) OSName = "unix"; if (navigator.appVersion.indexOf("Linux") != -1) OSName = "linux"; this.$body.addClass(OSName); }; /** @function setUserAgent * @description SET User Device Name to mobile | desktop * @returns {string} - Appends Device to Pages.$body */ Pages.prototype.setUserAgent = function() { if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) { this.$body.addClass('mobile'); } else { this.$body.addClass('desktop'); if (navigator.userAgent.match(/MSIE 9.0/)) { this.$body.addClass('ie9'); } } }; /** @function isVisibleXs * @description Checks if the screen size is XS - Extra Small i.e below W480px * @returns {$Element} - Appends $('#pg-visible-xs') to Body */ Pages.prototype.isVisibleXs = function() { (!$('#pg-visible-xs').length) && this.$body.append('
'); return $('#pg-visible-xs').is(':visible'); }; /** @function isVisibleSm * @description Checks if the screen size is SM - Small Screen i.e Above W480px * @returns {$Element} - Appends $('#pg-visible-sm') to Body */ Pages.prototype.isVisibleSm = function() { (!$('#pg-visible-sm').length) && this.$body.append('
'); return $('#pg-visible-sm').is(':visible'); }; /** @function isVisibleMd * @description Checks if the screen size is MD - Medium Screen i.e Above W1024px * @returns {$Element} - Appends $('#pg-visible-md') to Body */ Pages.prototype.isVisibleMd = function() { (!$('#pg-visible-md').length) && this.$body.append('
'); return $('#pg-visible-md').is(':visible'); }; /** @function isVisibleLg * @description Checks if the screen size is LG - Large Screen i.e Above W1200px * @returns {$Element} - Appends $('#pg-visible-lg') to Body */ Pages.prototype.isVisibleLg = function() { (!$('#pg-visible-lg').length) && this.$body.append('
'); return $('#pg-visible-lg').is(':visible'); }; /** @function getUserAgent * @description Get Current User Agent. * @returns {string} - mobile | desktop */ Pages.prototype.getUserAgent = function() { return $('body').hasClass('mobile') ? "mobile" : "desktop"; }; /** @function setFullScreen * @description Make Browser fullscreen. */ Pages.prototype.setFullScreen = function(element) { // Supports most browsers and their versions. var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullscreen; if (requestMethod) { // Native full screen. requestMethod.call(element); } else if (typeof window.ActiveXObject !== "undefined") { // Older IE. var wscript = new ActiveXObject("WScript.Shell"); if (wscript !== null) { wscript.SendKeys("{F11}"); } } }; /** @function getColor * @description Get Color from CSS * @param {string} color - pages color class eg: primary,master,master-light etc. * @param {int} opacity * @returns {rgba} */ Pages.prototype.getColor = function(color, opacity) { opacity = parseFloat(opacity) || 1; var elem = $('.pg-colors').length ? $('.pg-colors') : $('
').appendTo('body'); var colorElem = elem.find('[data-color="' + color + '"]').length ? elem.find('[data-color="' + color + '"]') : $('
').appendTo(elem); var color = colorElem.css('background-color'); var rgb = color.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); var rgba = "rgba(" + rgb[1] + ", " + rgb[2] + ", " + rgb[3] + ', ' + opacity + ')'; return rgba; }; /** @function initSidebar * @description Initialize side bar to open and close * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires ui/sidebar.js */ Pages.prototype.initSidebar = function(context) { $('[data-pages="sidebar"]', context).each(function() { var $sidebar = $(this); $sidebar.sidebar($sidebar.data()) }) }; /** @function initDropDown * @description Initialize Boot-Strap dropdown Menue * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires bootstrap.js */ Pages.prototype.initDropDown = function(context) { // adjust width of each dropdown to match content width $('.dropdown-default', context).each(function() { var btn = $(this).find('.dropdown-menu').siblings('.dropdown-toggle'); var offset = 0; var menuWidth = $(this).find('.dropdown-menu').actual('outerWidth'); if (btn.actual('outerWidth') < menuWidth) { btn.width(menuWidth - offset); $(this).find('.dropdown-menu').width(btn.actual('outerWidth')); } else { $(this).find('.dropdown-menu').width(btn.actual('outerWidth')); } }); }; /** @function initFormGroupDefault * @description Initialize Pages form group input * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. */ Pages.prototype.initFormGroupDefault = function(context) { $('.form-group.form-group-default', context).click(function() { $(this).find('input').focus(); }); if (!this.initFormGroupDefaultRun) { $('body').on('focus', '.form-group.form-group-default :input', function() { $('.form-group.form-group-default').removeClass('focused'); $(this).parents('.form-group').addClass('focused'); }); $('body').on('blur', '.form-group.form-group-default :input', function() { $(this).parents('.form-group').removeClass('focused'); if ($(this).val()) { $(this).closest('.form-group').find('label').addClass('fade'); } else { $(this).closest('.form-group').find('label').removeClass('fade'); } }); // Only run the above code once. this.initFormGroupDefaultRun = true; } $('.form-group.form-group-default .checkbox, .form-group.form-group-default .radio', context).hover(function() { $(this).parents('.form-group').addClass('focused'); }, function() { $(this).parents('.form-group').removeClass('focused'); }); }; /** @function initSlidingTabs * @description Initialize Bootstrap Custom Sliding Tabs * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires bootstrap.js */ Pages.prototype.initSlidingTabs = function(context) { $('a[data-toggle="tab"]', context).on('show.bs.tab', function(e) { e = $(e.target).parent().find('a[data-toggle=tab]'); var hrefCurrent = e.data('target'); if(hrefCurrent === undefined){ hrefCurrent = e.attr('href'); } if (!$(hrefCurrent).is('.slide-left, .slide-right')) return; $(hrefCurrent).addClass('sliding'); setTimeout(function() { $(hrefCurrent).removeClass('sliding'); }, 100); }); }; /** @function reponsiveTabs * @description Responsive handlers for Bootstrap Tabs */ Pages.prototype.reponsiveTabs = function() { //Dropdown FX $('[data-init-reponsive-tabs="dropdownfx"]').each(function() { var drop = $(this); drop.addClass("hidden-sm-down"); var content = ''; drop.after(content); var select = drop.next()[0]; $(select).on('change', function (e) { var optionSelected = $("option:selected", this); var valueSelected = this.value; var tabLink = drop.find('a[data-target="'+valueSelected+'"]'); if(tabLink.length == 0){ tabLink = drop.find('a[data-target="'+valueSelected+'"]') } tabLink.tab('show') }); $(select).wrap(''); new SelectFx(select); }); }; /** @function initNotificationCenter * @description Initialize Pages Header Notifcation Dropdown */ Pages.prototype.initNotificationCenter = function() { $('body').on('click', '.notification-list .dropdown-menu', function(event) { event.stopPropagation(); }); $('body').on('click', '.toggle-more-details', function(event) { var p = $(this).closest('.heading'); p.closest('.heading').children('.more-details').stop().slideToggle('fast', function() { p.toggleClass('open'); }); }); }; /** @function initProgressBars * @description Initialize Pages ProgressBars */ Pages.prototype.initProgressBars = function() { $(window).on('load', function() { // Hack: FF doesn't play SVG animations set as background-image $('.progress-bar-indeterminate, .progress-circle-indeterminate, .mapplic-pin').hide().show(0); }); }; /** @function initInputFile * @description Initialize File Input for Bootstrap Buttons and Input groups */ Pages.prototype.initInputFile = function() { $(document).on('change', '.btn-file :file', function() { var input = $(this), numFiles = input.get(0).files ? input.get(0).files.length : 1, label = input.val().replace(/\\/g, '/').replace(/.*\//, ''); input.trigger('fileselect', [numFiles, label]); }); $('.btn-file :file').on('fileselect', function(event, numFiles, label) { var input = $(this).parents('.input-group').find(':text'), log = numFiles > 1 ? numFiles + ' files selected' : label; if( input.length ) { input.val(log); } else { $(this).parent().html(log); } }); }; /** @function initHorizontalMenu * @description Initialize Horizontal Dropdown Menu */ Pages.prototype.initHorizontalMenu = function(){ var animationTimer; var hMenu = $("[data-pages-init='horizontal-menu']"); autoHideLi(); $(document).on('click', '.menu-bar > ul > li', function(){ if($(this).children("ul").length == 0){ return; } if($(window).width() < 992) { var menubar = $('.menu-bar'); var el = $(this); var li = menubar.find('li'); var sub = $(this).children('ul'); if(el.hasClass("open active")){ el.find('.arrow').removeClass("open active"); sub.slideUp(200, function() { el.removeClass("open active"); }); }else{ menubar.find('li.open').find('ul').slideUp(200); menubar.find('li.open').find('a').find('.arrow').removeClass('open active'); menubar.find('li.open').removeClass("open active"); el.find('.arrow').addClass("open active"); sub.slideDown(200, function() { el.addClass("open active"); }); } } else { if($(this).hasClass('opening')){ _hideMenu($(this)); } else{ _showMenu($(this)); } } }); var resizeTimer; $(window).on('resize', function(e) { clearTimeout(resizeTimer); resizeTimer = setTimeout(function() { autoHideLi(); }, 250); }); $('.content').on('click', function () { $('.horizontal-menu .bar-inner > ul > li').removeClass('open'); $('.menu-bar > ul > li').removeClass('open opening').children("ul").removeAttr("style"); $("body").find(".ghost-nav-dropdown").remove(); }); $('[data-toggle="horizontal-menu"]').on('click touchstart', function(e) { e.preventDefault(); $('body').toggleClass('horizontal-menu-open'); if(!$('.horizontal-menu-backdrop').length){ $('.header').append('
'); $('.horizontal-menu-backdrop').fadeToggle('fast'); } else { $('.horizontal-menu-backdrop').fadeToggle('fast', function(){ $(this).remove(); }); } $('.menu-bar').toggleClass('open'); }); function autoHideLi(){ var hMenu = $("[data-pages-init='horizontal-menu']"); var extraLiHide = parseInt(hMenu.data("hideExtraLi")) || 0; if(hMenu.length == 0){ return } var hMenuRect = hMenu[0].getBoundingClientRect(); var liTotalWidth = 0; var liCount = 0; hMenu.children('ul').children('li.more').remove(); hMenu.children('ul').children('li').each(function( index ) { $(this).removeAttr("style"); liTotalWidth = liTotalWidth + $(this).outerWidth(true); liCount++; }); if($(window).width() < 992) { return; } var possibleLi = parseInt(hMenuRect.width / (liTotalWidth / liCount)) - 1; possibleLi = possibleLi - extraLiHide; if(liCount > possibleLi){ var wrapper = createWrapperLI(hMenu); for(var i = possibleLi; i < liCount; i++){ var currentLi = hMenu.children('ul').children('li').eq(i); var clone = currentLi.clone(); clone.children("ul").addClass("sub-menu"); wrapper.children("ul").append(clone); currentLi.hide(); } } } function createWrapperLI(hMenu){ var li =hMenu.children('ul').append("
    • "); li = hMenu.children('ul').children('li.more'); return li; } function _hideMenu($el){ var ul = $($el.children("ul")[0]); var ghost = $("
      "); if(ul.length == 0){ return; } var rect = ul[0].getBoundingClientRect(); ghost.css({ "width":rect.width+"px", "height":rect.height+"px", "z-index":"auto" }); $el.append(ghost); var timingSpeed = ul.children("li").css('transition-duration'); timingSpeed = parseInt(parseFloat(timingSpeed) * 1000); $el.addClass('closing'); window.clearTimeout(animationTimer); animationTimer = window.setTimeout(function(){ ghost.height(0); $el.removeClass('open opening closing'); },timingSpeed - 80); } function _showMenu($el){ var ul = $($el.children("ul")[0]); var ghost = $("
      "); $el.children(".ghost-nav-dropdown").remove(); $el.addClass('open').siblings().removeClass('open opening'); if(ul.length == 0){ return; } var rect = ul[0].getBoundingClientRect(); ghost.css({ "width":rect.width+"px", "height":"0px" }); $el.append(ghost); ghost.height(rect.height); var timingSpeed = ghost.css('transition-duration'); timingSpeed = parseInt(parseFloat(timingSpeed) * 1000); window.clearTimeout(animationTimer); animationTimer = window.setTimeout(function(){ $el.addClass('opening'); ghost.remove() },timingSpeed); } }; /** @function initTooltipPlugin * @description Initialize Bootstrap tooltip * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires bootstrap.js */ Pages.prototype.initTooltipPlugin = function(context) { $.fn.tooltip && $('[data-toggle="tooltip"]', context).tooltip(); }; /** @function initSelect2Plugin * @description Initialize select2 dropdown * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires select2.js version 4.0.x */ Pages.prototype.initSelect2Plugin = function(context) { $.fn.select2 && $('[data-init-plugin="select2"]', context).each(function() { $(this).select2({ minimumResultsForSearch: ($(this).attr('data-disable-search') == 'true' ? -1 : 1) }).on('select2:open', function() { $.fn.scrollbar && $('.select2-results__options').scrollbar({ ignoreMobile: false }) }); }); }; /** @function initScrollBarPlugin * @description Initialize Global Scroller * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @requires jquery-scrollbar.js */ Pages.prototype.initScrollBarPlugin = function(context) { $.fn.scrollbar && $('.scrollable', context).scrollbar({ ignoreOverlay: false }); }; /** @function initListView * @description Initialize iOS like List view plugin * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @example data-init-list-view="ioslist" * @requires jquery-ioslist.js */ Pages.prototype.initListView = function(context) { $.fn.ioslist && $('[data-init-list-view="ioslist"]', context).ioslist(); $.fn.scrollbar && $('.list-view-wrapper', context).scrollbar({ ignoreOverlay: false }); }; /** @function initSwitcheryPlugin * @description Initialize iOS like List view plugin * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @example data-init-plugin="switchery" * @requires Switchery.js */ Pages.prototype.initSwitcheryPlugin = function(context) { // Switchery - ios7 switch window.Switchery && $('[data-init-plugin="switchery"]', context).each(function() { var el = $(this); new Switchery(el.get(0), { color: (el.data("color") != null ? $.Pages.getColor(el.data("color")) : $.Pages.getColor('success')), size : (el.data("size") != null ? el.data("size") : "default") }); }); }; /** @function initSelectFxPlugin * @description Initialize iOS like List view plugin * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. * @example select[data-init-plugin="cs-select"] */ Pages.prototype.initSelectFxPlugin = function(context) { window.SelectFx && $('select[data-init-plugin="cs-select"]', context).each(function() { var el = $(this).get(0); $(el).wrap('
      '); new SelectFx(el); }); }; /** @function initUnveilPlugin * @description To load retina images to img tag * @param {(Element|JQuery)} [context] - A DOM Element, Document, or jQuery to use as context. */ Pages.prototype.initUnveilPlugin = function(context) { // lazy load retina images $.fn.unveil && $("img", context).unveil(); }; /** @function initValidatorPlugin * @description Inintialize and Overide exsisting jquery-validate methods. * @requires jquery-validate.js */ Pages.prototype.initValidatorPlugin = function() { /** * Open the socket. * @override */ $.validator && $.validator.setDefaults({ ignore: "", // validate hidden fields, required for cs-select showErrors: function(errorMap, errorList) { var $this = this; $.each(this.successList, function(index, value) { var parent = $(this).closest('.form-group-attached'); if (parent.length) return $(value).popover("hide"); }); return $.each(errorList, function(index, value) { var parent = $(value.element).closest('.form-group-attached'); if (!parent.length) { return $this.defaultShowErrors(); } var _popover; _popover = $(value.element).popover({ trigger: "manual", placement: "top", html: true, container: parent.closest('form'), content: value.message }); var parent = $(value.element).closest('.form-group'); parent.addClass('has-error'); $(value.element).popover("show"); }); }, onfocusout: function(element) { var parent = $(element).closest('.form-group'); if ($(element).valid()) { parent.removeClass('has-error'); parent.next('.error').remove(); } }, onkeyup: function(element) { var parent = $(element).closest('.form-group'); if ($(element).valid()) { $(element).removeClass('error'); parent.removeClass('has-error'); parent.next('label.error').remove(); parent.find('label.error').remove(); } else { parent.addClass('has-error'); } }, errorPlacement: function(error, element) { var parent = $(element).closest('.form-group'); if (parent.hasClass('form-group-default')) { parent.addClass('has-error'); error.insertAfter(parent); } else { error.insertAfter(element); } } }); }; /** @function setBackgroundImage * @description load images to div using data API */ Pages.prototype.setBackgroundImage = function() { $('[data-pages-bg-image]').each(function() { var _elem = $(this); var defaults = { pagesBgImage: "", lazyLoad: 'true', progressType: '', progressColor:'', bgOverlay:'', bgOverlayClass:'', overlayOpacity:0, }; var data = _elem.data(); $.extend( defaults, data ); var url = defaults.pagesBgImage; var color = defaults.bgOverlay; var opacity = defaults.overlayOpacity; var overlay = $('
      '); overlay.addClass(defaults.bgOverlayClass); overlay.css({ 'background-color': color, 'opacity': 1 }); _elem.append(overlay); var img = new Image(); img.src = url; img.onload = function(){ _elem.css({ 'background-image': 'url(' + url + ')' }); _elem.children('.bg-overlay').css({'opacity': opacity}); } }) }; /** @function secondarySidebar * @description dropdown Toggle and responive toggle for secondary sidebar */ Pages.prototype.secondarySidebar =function(){ $('[data-init="secondary-sidebar"]').each(function() { $(this).on('click', '.main-menu li a', function(e) { if ($(this).parent().children('.sub-menu') === false) { return; } var el = $(this); var parent = $(this).parent().parent(); var li = $(this).parent(); var sub = $(this).parent().children('.sub-menu'); if(li.hasClass("open active")){ el.children('.arrow').removeClass("open active"); sub.slideUp(200, function() { li.removeClass("open active"); }); }else{ parent.children('li.open').children('.sub-menu').slideUp(200); parent.children('li.open').children('a').children('.arrow').removeClass('open active'); parent.children('li.open').removeClass("open active"); el.children('.arrow').addClass("open active"); sub.slideDown(200, function() { li.addClass("open active"); }); } //e.preventDefault(); }); }); $('[data-init="secondary-sidebar-toggle"]').each(function() { $(this).on("click", function(e) { var toggleRect = $(this).get(0).getBoundingClientRect(); var menu = $('[data-init="secondary-sidebar"]'); if(menu.hasClass("open")){ menu.removeClass("open"); menu.removeAttr("style"); } else{ menu.addClass("open"); var menuRect = menu.get(0).getBoundingClientRect(); menu.css({ top : toggleRect.bottom, 'max-height': ($(window).height() - toggleRect.bottom), left: $(window).width() / 2 - menuRect.width/ 2, 'visibility': 'visible' }); } }) }); }; /** @function init * @description Inintialize all core components. */ Pages.prototype.init = function() { // init layout this.initSidebar(); this.setBackgroundImage(); this.initDropDown(); this.initFormGroupDefault(); this.initSlidingTabs(); this.initNotificationCenter(); this.initProgressBars(); this.initHorizontalMenu(); // init plugins this.initTooltipPlugin(); this.initSelect2Plugin(); this.initScrollBarPlugin(); this.initSwitcheryPlugin(); this.initSelectFxPlugin(); this.initUnveilPlugin(); this.initValidatorPlugin(); this.initListView(); this.initInputFile(); this.reponsiveTabs(); this.secondarySidebar(); }; $.Pages = new Pages(); $.Pages.Constructor = Pages; })(window.jQuery); (function(window) { 'use strict'; /** * based on from https://github.com/inuyaksa/jquery.nicescroll/blob/master/jquery.nicescroll.js */ function hasParent(e, p) { if (!e) return false; var el = e.target || e.srcElement || e || false; while (el && el != p) { el = el.parentNode || false; } return (el !== false); } /** * extend obj function */ function extend(a, b) { for (var key in b) { if (b.hasOwnProperty(key)) { a[key] = b[key]; } } return a; } /** * SelectFx function */ function SelectFx(el, options) { this.el = el; this.options = extend({}, this.options); extend(this.options, options); this._init(); } /** * Pure-JS alternative to jQuery closest() */ function closest(elem, selector) { var matchesSelector = elem.matches || elem.webkitMatchesSelector || elem.mozMatchesSelector || elem.msMatchesSelector; while (elem) { if (matchesSelector.bind(elem)(selector)) { return elem; } else { elem = elem.parentElement; } } return false; } /** * jQuery offset() in pure JS */ function offset(el) { return { left: el.getBoundingClientRect().left + window.pageXOffset - el.ownerDocument.documentElement.clientLeft, top: el.getBoundingClientRect().top + window.pageYOffset - el.ownerDocument.documentElement.clientTop } } /** * jQuery after() in pure JS */ function insertAfter(newNode, referenceNode) { referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); } /** * SelectFx options */ SelectFx.prototype.options = { // if true all the links will open in a new tab. // if we want to be redirected when we click an option, we need to define a data-link attr on the option of the native select element newTab: true, // when opening the select element, the default placeholder (if any) is shown stickyPlaceholder: true, // default container is body container: 'body', // callback when changing the value onChange: function(el) { var event = document.createEvent('HTMLEvents'); event.initEvent('change', true, false); el.dispatchEvent(event); } }; /** * init function * initialize and cache some vars */ SelectFx.prototype._init = function() { // check if we are using a placeholder for the native select box // we assume the placeholder is disabled and selected by default var selectedOpt = document.querySelector('option[selected]'); this.hasDefaultPlaceholder = selectedOpt && selectedOpt.disabled; // get selected option (either the first option with attr selected or just the first option) this.selectedOpt = selectedOpt || this.el.querySelector('option'); // create structure this._createSelectEl(); // all options this.selOpts = [].slice.call(this.selEl.querySelectorAll('li[data-option]')); // total options this.selOptsCount = this.selOpts.length; // current index this.current = this.selOpts.indexOf(this.selEl.querySelector('li.cs-selected')) || -1; // placeholder elem this.selPlaceholder = this.selEl.querySelector('span.cs-placeholder'); // init events this._initEvents(); this.el.onchange = function() { var index = this.selectedIndex; var inputText = this.children[index].innerHTML.trim(); } }; /** * creates the structure for the select element */ SelectFx.prototype._createSelectEl = function() { var self = this, options = '', createOptionHTML = function(el) { var optclass = '', classes = '', link = ''; if (el.selectedOpt && !this.foundSelected && !this.hasDefaultPlaceholder) { classes += 'cs-selected '; this.foundSelected = true; } // extra classes if (el.getAttribute('data-class')) { classes += el.getAttribute('data-class'); } // link options if (el.getAttribute('data-link')) { link = 'data-link=' + el.getAttribute('data-link'); } if (classes !== '') { optclass = 'class="' + classes + '" '; } return '
    • ' + el.textContent + '
    • '; }; [].slice.call(this.el.children).forEach(function(el) { if (el.disabled) { return; } var tag = el.tagName.toLowerCase(); if (tag === 'option') { options += createOptionHTML(el); } else if (tag === 'optgroup') { options += '
    • ' + el.label + '
        '; [].slice.call(el.children).forEach(function(opt) { options += createOptionHTML(opt); }); options += '
    • '; } }); var opts_el = '
        ' + options + '
      '; this.selEl = document.createElement('div'); this.selEl.className = this.el.className; this.selEl.tabIndex = this.el.tabIndex; this.selEl.innerHTML = '' + this.selectedOpt.textContent + '' + opts_el; this.el.parentNode.appendChild(this.selEl); this.selEl.appendChild(this.el); // backdrop to support dynamic heights of the dropdown var backdrop = document.createElement('div'); backdrop.className = 'cs-backdrop'; this.selEl.appendChild(backdrop); }; /** * initialize the events */ SelectFx.prototype._initEvents = function() { var self = this; // open/close select this.selPlaceholder.addEventListener('click', function() { self._toggleSelect(); }); // clicking the options this.selOpts.forEach(function(opt, idx) { opt.addEventListener('click', function() { self.current = idx; self._changeOption(); // close select elem self._toggleSelect(); }); }); // close the select element if the target it´s not the select element or one of its descendants.. document.addEventListener('click', function(ev) { var target = ev.target; if (self._isOpen() && target !== self.selEl && !hasParent(target, self.selEl)) { self._toggleSelect(); } }); // keyboard navigation events this.selEl.addEventListener('keydown', function(ev) { var keyCode = ev.keyCode || ev.which; switch (keyCode) { // up key case 38: ev.preventDefault(); self._navigateOpts('prev'); break; // down key case 40: ev.preventDefault(); self._navigateOpts('next'); break; // space key case 32: ev.preventDefault(); if (self._isOpen() && typeof self.preSelCurrent != 'undefined' && self.preSelCurrent !== -1) { self._changeOption(); } self._toggleSelect(); break; // enter key case 13: ev.preventDefault(); if (self._isOpen() && typeof self.preSelCurrent != 'undefined' && self.preSelCurrent !== -1) { self._changeOption(); self._toggleSelect(); } break; // esc key case 27: ev.preventDefault(); if (self._isOpen()) { self._toggleSelect(); } break; } }); }; /** * navigate with up/dpwn keys */ SelectFx.prototype._navigateOpts = function(dir) { if (!this._isOpen()) { this._toggleSelect(); } var tmpcurrent = typeof this.preSelCurrent != 'undefined' && this.preSelCurrent !== -1 ? this.preSelCurrent : this.current; if (dir === 'prev' && tmpcurrent > 0 || dir === 'next' && tmpcurrent < this.selOptsCount - 1) { // save pre selected current - if we click on option, or press enter, or press space this is going to be the index of the current option this.preSelCurrent = dir === 'next' ? tmpcurrent + 1 : tmpcurrent - 1; // remove focus class if any.. this._removeFocus(); // add class focus - track which option we are navigating classie.add(this.selOpts[this.preSelCurrent], 'cs-focus'); } }; /** * open/close select * when opened show the default placeholder if any */ SelectFx.prototype._toggleSelect = function() { var backdrop = this.selEl.querySelector('.cs-backdrop'); var container = document.querySelector(this.options.container); var mask = container.querySelector('.dropdown-mask'); var csOptions = this.selEl.querySelector('.cs-options'); var csPlaceholder = this.selEl.querySelector('.cs-placeholder'); var csPlaceholderWidth = csPlaceholder.offsetWidth; var csPlaceholderHeight = csPlaceholder.offsetHeight; var csOptionsWidth = csOptions.scrollWidth; if (this._isOpen()) { if (this.current !== -1) { // update placeholder text this.selPlaceholder.textContent = this.selOpts[this.current].textContent; } var dummy = this.selEl.data; var parent = dummy.parentNode; //parent.appendChild(this.selEl); insertAfter(this.selEl, dummy); this.selEl.removeAttribute('style'); parent.removeChild(dummy); // Hack for FF // http://stackoverflow.com/questions/12088819/css-transitions-on-new-elements var x = this.selEl.clientHeight; // reset backdrop backdrop.style.transform = backdrop.style.webkitTransform = backdrop.style.MozTransform = backdrop.style.msTransform = backdrop.style.OTransform = 'scale3d(1,1,1)'; classie.remove(this.selEl, 'cs-active'); mask.style.display = 'none'; csOptions.style.overflowY = 'hidden'; csOptions.style.width = 'auto'; var parentFormGroup = closest(this.selEl, '.form-group'); parentFormGroup && classie.removeClass(parentFormGroup, 'focused'); } else { if (this.hasDefaultPlaceholder && this.options.stickyPlaceholder) { // everytime we open we wanna see the default placeholder text this.selPlaceholder.textContent = this.selectedOpt.textContent; } var dummy; if (this.selEl.parentNode.querySelector('.dropdown-placeholder')) { dummy = this.selEl.parentNode.querySelector('.dropdown-placeholder'); } else { dummy = document.createElement('div'); classie.add(dummy, 'dropdown-placeholder'); //this.selEl.parentNode.appendChild(dummy); insertAfter(dummy, this.selEl); } dummy.style.height = csPlaceholderHeight + 'px'; dummy.style.width = this.selEl.offsetWidth + 'px'; this.selEl.data = dummy; this.selEl.style.position = 'absolute'; var offsetselEl = offset(this.selEl); this.selEl.style.left = offsetselEl.left + 'px'; this.selEl.style.top = offsetselEl.top + 'px'; container.appendChild(this.selEl); // decide backdrop's scale factor depending on the content height var contentHeight = csOptions.offsetHeight; var originalHeight = csPlaceholder.offsetHeight; var contentWidth = csOptions.offsetWidth; var originalWidth = csPlaceholder.offsetWidth; var scaleV = contentHeight / originalHeight; var scaleH = (contentWidth > originalWidth) ? contentWidth / originalWidth : 1.05; //backdrop.style.transform = backdrop.style.webkitTransform = backdrop.style.MozTransform = backdrop.style.msTransform = backdrop.style.OTransform = 'scale3d(' + scaleH + ', ' + scaleV + ', 1)'; backdrop.style.transform = backdrop.style.webkitTransform = backdrop.style.MozTransform = backdrop.style.msTransform = backdrop.style.OTransform = 'scale3d(' + 1 + ', ' + scaleV + ', 1)'; if (!mask) { mask = document.createElement('div'); classie.add(mask, 'dropdown-mask'); container.appendChild(mask); } mask.style.display = 'block'; classie.add(this.selEl, 'cs-active'); var resizedWidth = (csPlaceholderWidth < csOptionsWidth) ? csOptionsWidth : csPlaceholderWidth; this.selEl.style.width = resizedWidth + 'px'; this.selEl.style.height = originalHeight + 'px'; csOptions.style.width = '100%'; setTimeout(function() { csOptions.style.overflowY = 'auto'; }, 300); } }; /** * change option - the new value is set */ SelectFx.prototype._changeOption = function() { // if pre selected current (if we navigate with the keyboard)... if (typeof this.preSelCurrent != 'undefined' && this.preSelCurrent !== -1) { this.current = this.preSelCurrent; this.preSelCurrent = -1; } // current option var opt = this.selOpts[this.current]; // update current selected value this.selPlaceholder.textContent = opt.textContent; // change native select element´s value this.el.value = opt.getAttribute('data-value'); // remove class cs-selected from old selected option and add it to current selected option var oldOpt = this.selEl.querySelector('li.cs-selected'); if (oldOpt) { classie.remove(oldOpt, 'cs-selected'); } classie.add(opt, 'cs-selected'); // if there´s a link defined if (opt.getAttribute('data-link')) { // open in new tab? if (this.options.newTab) { window.open(opt.getAttribute('data-link'), '_blank'); } else { window.location = opt.getAttribute('data-link'); } } // callback this.options.onChange(this.el); }; /** * returns true if select element is opened */ SelectFx.prototype._isOpen = function(opt) { return classie.has(this.selEl, 'cs-active'); }; /** * removes the focus class from the option */ SelectFx.prototype._removeFocus = function(opt) { var focusEl = this.selEl.querySelector('li.cs-focus'); if (focusEl) { classie.remove(focusEl, 'cs-focus'); } }; /** * add to global namespace */ window.SelectFx = SelectFx; })(window); /* ============================================================ * Pages Circular Progress * ============================================================ */ (function($) { 'use strict'; // CIRCULAR PROGRESS CLASS DEFINITION // ====================== var Progress = function(element, options) { this.$element = $(element); this.options = $.extend(true, {}, $.fn.circularProgress.defaults, options); // start adding to to DOM this.$container = $('
      '); this.$element.attr('data-color') && this.$container.addClass('progress-circle-' + this.$element.attr('data-color')); this.$element.attr('data-thick') && this.$container.addClass('progress-circle-thick'); this.$pie = $('
      '); this.$pie.$left = $('
      '); this.$pie.$right = $('
      '); this.$pie.append(this.$pie.$left).append(this.$pie.$right); this.$container.append(this.$pie).append('
      '); this.$element.after(this.$container); // end DOM adding this.val = this.$element.val(); var deg = perc2deg(this.val); if (this.val <= 50) { this.$pie.$right.css('transform', 'rotate(' + deg + 'deg)'); } else { this.$pie.css('clip', 'rect(auto, auto, auto, auto)'); this.$pie.$right.css('transform', 'rotate(180deg)'); this.$pie.$left.css('transform', 'rotate(' + deg + 'deg)'); } }; Progress.VERSION = "1.0.0"; Progress.prototype.value = function(val) { if (typeof val == 'undefined') return; var deg = perc2deg(val); this.$pie.removeAttr('style'); this.$pie.$right.removeAttr('style'); this.$pie.$left.removeAttr('style'); if (val <= 50) { this.$pie.$right.css('transform', 'rotate(' + deg + 'deg)'); } else { this.$pie.css('clip', 'rect(auto, auto, auto, auto)'); this.$pie.$right.css('transform', 'rotate(180deg)'); this.$pie.$left.css('transform', 'rotate(' + deg + 'deg)'); } }; // CIRCULAR PROGRESS PLUGIN DEFINITION // ======================= function Plugin(option) { return this.filter(':input').each(function() { var $this = $(this); var data = $this.data('pg.circularProgress'); var options = typeof option == 'object' && option; if (!data) $this.data('pg.circularProgress', (data = new Progress(this, options))); if (typeof option == 'string') data[option](); else if (options.hasOwnProperty('value')) data.value(options.value); }) } var old = $.fn.circularProgress; $.fn.circularProgress = Plugin; $.fn.circularProgress.Constructor = Progress; $.fn.circularProgress.defaults = { value: 0 }; // CIRCULAR PROGRESS NO CONFLICT // ==================== $.fn.circularProgress.noConflict = function() { $.fn.circularProgress = old; return this; }; // CIRCULAR PROGRESS DATA API //=================== $(window).on('load', function() { $('[data-pages-progress="circle"]').each(function() { var $progress = $(this); $progress.circularProgress($progress.data()) }) }); function perc2deg(p) { return parseInt(p / 100 * 360); } // TODO: Add API to change size, stroke width, color })(window.jQuery); /* ============================================================ * Pages Notifications * ============================================================ */ (function($) { 'use strict'; var Notification = function(container, options) { var self = this; // Element collection self.container = $(container); // 'body' recommended self.notification = $('
      '); self.options = $.extend(true, {}, $.fn.pgNotification.defaults, options); if (!self.container.find('.pgn-wrapper[data-position=' + this.options.position + ']').length) { self.wrapper = $('
      '); self.container.append(self.wrapper); } else { self.wrapper = $('.pgn-wrapper[data-position=' + this.options.position + ']'); } self.alert = $('
      '); self.alert.addClass('alert-' + self.options.type); if (self.options.style == 'bar') { new BarNotification(); } else if (self.options.style == 'flip') { new FlipNotification(); } else if (self.options.style == 'circle') { new CircleNotification(); } else if (self.options.style == 'simple') { new SimpleNotification(); } else { // default = 'simple' new SimpleNotification(); } // Notification styles function SimpleNotification() { self.notification.addClass('pgn-simple'); self.alert.append(self.options.message); if (self.options.showClose) { var close = $('') .append('') .append('Close'); self.alert.prepend(close); } } function BarNotification() { self.notification.addClass('pgn-bar'); self.alert.addClass('alert-' + self.options.type); var container = $('
      '); container.append('' + self.options.message + ''); if (self.options.showClose) { var close = $('') .append('') .append('Close'); container.append(close) } self.alert.append(container); } function CircleNotification() { self.notification.addClass('pgn-circle'); var table = '
      '; if (self.options.thumbnail) { table += '
      ' + self.options.thumbnail + '
      '; } table += '
      '; if (self.options.title) { table += '

      ' + self.options.title + '

      '; } table += '

      ' + self.options.message + '

      '; table += '
      '; if (self.options.showClose) { table += ''; } self.alert.append(table); self.alert.after('
      '); } function FlipNotification() { self.notification.addClass('pgn-flip'); self.alert.append("" + self.options.message + ""); if (self.options.showClose) { var close = $('') .append('') .append('Close'); self.alert.prepend(close); } } self.notification.append(self.alert); function alignWrapperToContainer(){ var containerPosition = self.container.position(); var containerHeight = self.container.height(); var containerWidth = self.container.width(); var containerTop = containerPosition.top; var containerBottom = self.container.parent().height() - (containerTop + containerHeight); var containerLeft = containerPosition.left; var containerRight = self.container.parent().width() - (containerLeft + containerWidth); if(/top/.test(self.options.position)){ self.wrapper.css('top', containerTop) } if(/bottom/.test(self.options.position)){ self.wrapper.css('bottom', containerBottom) } if(/left/.test(self.options.position)){ self.wrapper.css('left', containerLeft) } if(/right/.test(self.options.position)){ self.wrapper.css('right', containerRight) } } if($('body').hasClass('horizontal-menu')){ alignWrapperToContainer(); $(window).on('resize', alignWrapperToContainer) } // bind to Bootstrap closed event for alerts self.alert.on('closed.bs.alert', function() { self.notification.remove(); self.options.onClosed(); // refresh layout after removal }); return this; // enable chaining }; Notification.VERSION = "1.0.0"; Notification.prototype.show = function() { // TODO: add fadeOut animation on show as option this.wrapper.prepend(this.notification); this.options.onShown(); if (this.options.timeout != 0) { var _this = this; // settimeout removes scope. use .bind(this) setTimeout(function() { this.notification.fadeOut("slow", function() { $(this).remove(); _this.options.onClosed(); }); }.bind(this), this.options.timeout); } }; $.fn.pgNotification = function(options) { return new Notification(this, options); }; $.fn.pgNotification.defaults = { style: 'simple', message: null, position: 'top-right', type: 'info', showClose: true, timeout: 4000, onShown: function() {}, onClosed: function() {} } })(window.jQuery); /* ============================================================ * Pages Cards * ============================================================ */ (function($) { 'use strict'; // CARDS CLASS DEFINITION // ====================== var Card = function(element, options) { this.$element = $(element); this.options = $.extend(true, {}, $.fn.card.defaults, options); this.$loader = null; this.$body = this.$element.find('.card-block'); }; Card.VERSION = "1.0.0"; // Button actions Card.prototype.collapse = function() { var icon = this.$element.find('.collapse-icon'); var heading = this.$element.find('.card-header'); this.$body.stop().slideToggle("fast"); if (this.$element.hasClass('card-collapsed')) { this.$element.removeClass('card-collapsed'); icon.removeClass().addClass('fa-chevron-down'); $.isFunction(this.options.onExpand) && this.options.onExpand(this); return } this.$element.addClass('card-collapsed'); icon.removeClass().addClass('fa-chevron-right'); $.isFunction(this.options.onCollapse) && this.options.onCollapse(this); }; Card.prototype.close = function() { this.$element.remove(); $.isFunction(this.options.onClose) && this.options.onClose(this); }; Card.prototype.error = function(error) { if (error) { var _this = this; this.$element.pgNotification({ style: 'bar', message: error, position: 'top', timeout: 0, type: 'danger', onShown: function() { _this.$loader.find('> div').fadeOut() }, onClosed: function() { _this.refresh(false) } }).show(); } }; // CARD PLUGIN DEFINITION // ======================= function Plugin(option) { return this.each(function() { var $this = $(this); var data = $this.data('pg.card'); var options = typeof option == 'object' && option; if (!data) $this.data('pg.card', (data = new Card(this, options))); if (typeof option == 'string') data[option](); else if (options.hasOwnProperty('refresh')) data.refresh(options.refresh); else if (options.hasOwnProperty('error')) data.error(options.error); }) } var old = $.fn.card; $.fn.card = Plugin; $.fn.card.Constructor = Card; $.fn.card.defaults = { progress: 'circle', progressColor: 'master', refresh: false, error: null, overlayColor: '255,255,255', overlayOpacity: 0.8, refreshButton: '[data-toggle="refresh"]', maximizeButton: '[data-toggle="maximize"]', collapseButton: '[data-toggle="collapse"]', closeButton: '[data-toggle="close"]' // onRefresh: function(portlet) {}, // onCollapse: function(portlet) {}, // onExpand: function(portlet) {}, // onMaximize: function(portlet) {}, // onRestore: function(portlet) {}, // onClose: function(portlet) {} }; // CARD NO CONFLICT // ==================== $.fn.card.noConflict = function() { $.fn.card = old; return this; } })(window.jQuery); /* ============================================================ * Pages Mobile View * ============================================================ */ (function($) { 'use strict'; var MobileView = function(element, options) { var self = this; self.options = $.extend(true, {}, $.fn.pgMobileViews.defaults, options); self.element = $(element); self.element.on('click', function(e) { e.preventDefault(); var data = self.element.data(); var el = $(data.viewPort); var toView = data.toggleView; if (data.toggleView != null) { el.children().last().children('.view').hide(); $(data.toggleView).show(); } else{ toView = el.last(); } el.toggleClass(data.viewAnimation); self.options.onNavigate(toView, data.viewAnimation); return false; }); return this; // enable chaining }; $.fn.pgMobileViews = function(options) { return new MobileView(this, options); }; $.fn.pgMobileViews.defaults = { //Returns Target View & Animation Type onNavigate: function(view, animation) {} }; // MOBILE VIEW DATA API //=================== $(window).on('load', function() { $('[data-navigate="view"]').each(function() { var $mobileView = $(this); $mobileView.pgMobileViews(); }) }); })(window.jQuery); /* ============================================================ * Pages Quickview Plugin * ============================================================ */ (function($) { 'use strict'; // QUICKVIEW CLASS DEFINITION // ====================== var Quickview = function(element, options) { this.$element = $(element); this.options = $.extend(true, {}, $.fn.quickview.defaults, options); this.bezierEasing = [.05, .74, .27, .99]; var _this = this; $(this.options.notes).on('click', '.list > ul > li', function(e) { var note = $(this).find('.note-preview'); var note = $(this).find('.note-preview'); $(_this.options.noteEditor).html(note.html()); $(_this.options.notes).toggleClass('push'); }); $(this.options.notes).on('click', '.list > ul > li .checkbox', function(e) { e.stopPropagation(); }); $(this.options.notes).on('click', _this.options.backButton, function(e) { $(_this.options.notes).find('.toolbar > li > a').removeClass('active'); $(_this.options.notes).toggleClass('push'); }); $(this.options.deleteNoteButton).click(function(e) { e.preventDefault(); $(this).toggleClass('selected'); $(_this.options.notes).find('.list > ul > li .checkbox').fadeToggle("fast"); $(_this.options.deleteNoteConfirmButton).fadeToggle("fast").removeClass('hide'); }); $(this.options.newNoteButton).click(function(e) { e.preventDefault(); $(_this.options.noteEditor).html(''); }); $(this.options.deleteNoteConfirmButton).click(function() { var checked = $(_this.options.notes).find('input[type=checkbox]:checked'); checked.each(function() { $(this).parents('li').remove(); }); }); $(this.options.notes).on('click', '.toolbar > li > a', function(e) { //e.preventDefault(); var command = $(this).attr('data-action'); document.execCommand(command, false, null); $(this).toggleClass('active'); }); }; Quickview.VERSION = "1.0.0"; // QUICKVIEW PLUGIN DEFINITION // ======================= function Plugin(option) { return this.each(function() { var $this = $(this); var data = $this.data('pg.quickview'); var options = typeof option == 'object' && option; if (!data) $this.data('pg.quickview', (data = new Quickview(this, options))); if (typeof option == 'string') data[option](); }) } var old = $.fn.quickview; $.fn.quickview = Plugin; $.fn.quickview.Constructor = Quickview; $.fn.quickview.defaults = { notes: '#note-views', alerts: '#alerts', chat: '#chat', notesList: '.list', noteEditor: '.quick-note-editor', deleteNoteButton: '.delete-note-link', deleteNoteConfirmButton: '.btn-remove-notes', newNoteButton: '.new-note-link', backButton: '.close-note-link' }; // QUICKVIEW NO CONFLICT // ==================== $.fn.quickview.noConflict = function() { $.fn.quickview = old; return this; }; // QUICKVIEW DATA API //=================== $(window).on('load', function() { $('[data-pages="quickview"]').each(function() { var $quickview = $(this); $quickview.quickview($quickview.data()) }) }); $(document).on('click.pg.quickview.data-api touchstart', '[data-toggle="quickview"]', function(e) { var elem = $(this).attr('data-toggle-element'); $(elem).toggleClass('open'); e.preventDefault(); }) })(window.jQuery); /* ============================================================ * Pages Sidebar * ============================================================ */ (function($) { 'use strict'; // SIDEBAR CLASS DEFINITION // ====================== var Sidebar = function(element, options) { this.$element = $(element); this.$body = $('body'); this.options = $.extend(true, {}, $.fn.sidebar.defaults, options); this.bezierEasing = [.05, .74, .27, .99]; this.cssAnimation = true; this.css3d = true; this.sideBarWidth = this.$element.width(); this.sideBarWidthCondensed = - this.$element.offset().left; this.$sidebarMenu = this.$element.find(".sidebar-menu > ul"); this.$pageContainer = $(this.options.pageContainer); if (!this.$sidebarMenu.length) return; // apply perfectScrollbar plugin only for desktops ($.Pages.getUserAgent() == 'desktop') && this.$sidebarMenu.scrollbar({ ignoreOverlay: false, disableBodyScroll :(this.$element.data("disableBodyScroll") == true)? true : false }); if (!Modernizr.csstransitions) this.cssAnimation = false; if (!Modernizr.csstransforms3d) this.css3d = false; // Bind events // Toggle sub menus // In Angular Binding is done using a pg-sidebar directive (typeof angular === 'undefined') && $(document).on('click', '.sidebar-menu a', function(e) { if ($(this).parent().children('.sub-menu') === false) { return; } var el = $(this); var parent = $(this).parent().parent(); var li = $(this).parent(); var sub = $(this).parent().children('.sub-menu'); if(li.hasClass("open active")){ el.children('.arrow').removeClass("open active"); sub.slideUp(200, function() { li.removeClass("open active"); }); }else{ parent.children('li.open').children('.sub-menu').slideUp(200); parent.children('li.open').children('a').children('.arrow').removeClass('open active'); parent.children('li.open').removeClass("open active"); el.children('.arrow').addClass("open active"); sub.slideDown(200, function() { li.addClass("open active"); }); } //e.preventDefault(); }); // Toggle sidebar $('.sidebar-slide-toggle').on('click touchend', function(e) { e.preventDefault(); $(this).toggleClass('active'); var el = $(this).attr('data-pages-toggle'); if (el != null) { $(el).toggleClass('show'); } }); var _this = this; function sidebarMouseEnter(e) { var menuOpenCSS = (this.css3d == true ? 'translate3d(' + _this.sideBarWidthCondensed + 'px, 0,0)' : 'translate(' + _this.sideBarWidthCondensed + 'px, 0)'); if ($.Pages.isVisibleSm() || $.Pages.isVisibleXs()) { return false } if ($('.close-sidebar').data('clicked')) { return; } if (_this.$body.hasClass('menu-pin')) return; _this.$element.css({ 'transform': menuOpenCSS }); _this.$body.addClass('sidebar-visible'); } function sidebarMouseLeave(e) { var menuClosedCSS = (_this.css3d == true ? 'translate3d(0, 0,0)' : 'translate(0, 0)'); if ($.Pages.isVisibleSm() || $.Pages.isVisibleXs()) { return false } if (typeof e != 'undefined') { var target = $(e.target); if (target.parent('.page-sidebar').length) { return; } } if (_this.$body.hasClass('menu-pin')) return; if ($('.sidebar-overlay-slide').hasClass('show')) { $('.sidebar-overlay-slide').removeClass('show'); $("[data-pages-toggle]").removeClass('active') } _this.$element.css({ 'transform': menuClosedCSS }); _this.$body.removeClass('sidebar-visible'); } this.$element.bind('mouseenter mouseleave', sidebarMouseEnter); this.$pageContainer.bind('mouseover', sidebarMouseLeave); function toggleMenuPin(){ var width = $(window).width(); if(width < 1200){ if($('body').hasClass('menu-pin')){ $('body').removeClass('menu-pin'); $('body').addClass('menu-unpinned') } } else { if($('body').hasClass('menu-unpinned')){ $('body').addClass('menu-pin') } } } $(document).bind('ready', toggleMenuPin); $(window).bind('resize', toggleMenuPin); }; // Toggle sidebar for mobile view Sidebar.prototype.toggleSidebar = function(toggle) { var timer; var bodyColor = $('body').css('background-color'); $('.page-container').css('background-color', bodyColor); if (this.$body.hasClass('sidebar-open')) { this.$body.removeClass('sidebar-open'); timer = setTimeout(function() { this.$element.removeClass('visible'); }.bind(this), 400); } else { clearTimeout(timer); this.$element.addClass('visible'); setTimeout(function() { this.$body.addClass('sidebar-open'); }.bind(this), 10); setTimeout(function(){ // remove background color $('.page-container').css({'background-color': ''}); },1000); } }; Sidebar.prototype.togglePinSidebar = function(toggle) { if (toggle == 'hide') { this.$body.removeClass('menu-pin'); } else if (toggle == 'show') { this.$body.addClass('menu-pin'); } else { this.$body.toggleClass('menu-pin'); } }; // SIDEBAR PLUGIN DEFINITION // ======================= function Plugin(option) { return this.each(function() { var $this = $(this); var data = $this.data('pg.sidebar'); var options = typeof option == 'object' && option; if (!data) $this.data('pg.sidebar', (data = new Sidebar(this, options))); if (typeof option == 'string') data[option](); }) } var old = $.fn.sidebar; $.fn.sidebar = Plugin; $.fn.sidebar.Constructor = Sidebar; $.fn.sidebar.defaults = { pageContainer: '.page-container' }; // SIDEBAR PROGRESS NO CONFLICT // ==================== $.fn.sidebar.noConflict = function() { $.fn.sidebar = old; return this; }; // SIDEBAR PROGRESS DATA API //=================== $(document).on('click.pg.sidebar.data-api', '[data-toggle-pin="sidebar"]', function(e) { var $this = $(this); var $target = $('[data-pages="sidebar"]'); $target.data('pg.sidebar').togglePinSidebar(); return false; }); $(document).on('click.pg.sidebar.data-api touchstart', '[data-toggle="sidebar"]', function(e) { var $this = $(this); var $target = $('[data-pages="sidebar"]'); $target.data('pg.sidebar').toggleSidebar(); return false }) })(window.jQuery); (function($) { 'use strict'; // Initialize layouts and plugins (typeof angular === 'undefined') && $.Pages.init(); })(window.jQuery);