/** ********************************************** ** @Author Dorin Grigoras @Website www.stepofweb.com @Last Update Saturday, July 02, 2016 NOTE! Do not change anything here if you want to be able to update in the future! Please use your custom script (eg. custom.js). TABLE CONTENTS ------------------------------- 01. Top Nav 02. Animate 03. Superslides 04. OWL Carousel 05. Popover 06. Lightbox 07. ScrollTo 08. Parallax 09. Masonry Filter 10. Toggle 11. Background Image 12. Global Search 13. Quick Cart 14. Placeholder 15. Summernote HTML Editor 16. Mixitup Filter 17. Lazy Load GOOGLE MAP AFTER RESIZE COUNT TO FITVIDS WAIT FOR IMAGES [used by masonry] *************************************************** **/ /* Init */ jQuery(window).ready(function () { Atropos(); }); /** Core **************************************************************** **/ function Atropos() { _topNav(); _animate(); _superslide(); _owl_carousel(); _popover(); _lightbox(); _scrollTo(); _parallax(); _masonry(); _toggle(); _bgimage(); _globalSearch(); _quickCart(); _placeholder(); _htmlEditor(); _mixitup(); _lazyload(); /** Bootstrap Tooltip **/ jQuery("a[data-toggle=tooltip]").tooltip(); /** Fitvids [Youtube|Vimeo] **/ if(jQuery(".fullwidthbanner iframe").length < 1 && jQuery(".fullscreenbanner iframe").length < 1 && jQuery(".fullscreenvideo").length < 1) { // disable fitvids if revolution slider video is present! jQuery("body").fitVids(); } /** price slider **/ if(jQuery().slider && jQuery(".price-slider").length > 0) { jQuery("#Slider2").slider(slider_config); } /** mobile - hide on click! **/ jQuery(document).bind("click", function() { if(jQuery("div.navbar-collapse").hasClass('in')) { jQuery("button.btn-mobile").trigger('click'); } }); } /** Load Script USAGE var pageInit = function() {} loadScript(plugin_path + "script.js", function); Load multiple scripts and call a final function loadScript(plugin_path + "script1.js", function(){ loadScript(plugin_path + "script2.js", function(){ loadScript(plugin_path + "script3.js", function(){ loadScript(plugin_path + "script4.js", function); }); }); }); **************************************************************** **/ var _arr = {}; function loadScript(scriptName, callback) { if (!_arr[scriptName]) { _arr[scriptName] = true; var body = document.getElementsByTagName('body')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = scriptName; // then bind the event to the callback function // there are several events for cross browser compatibility // script.onreadystatechange = callback; script.onload = callback; // fire the loading body.appendChild(script); } else if (callback) { callback(); } }; /** 01. Top Nav **************************************************************** **/ function _topNav() { var addActiveClass = false; jQuery("#topMain li.dropdown > a, #topMain li.dropdown-submenu > a").bind("click", function(e) { if(jQuery(this).attr('href') == '#') { e.preventDefault(); } e.stopPropagation(); if(jQuery(window).width() > 979) { return; } addActiveClass = jQuery(this).parent().hasClass("resp-active"); jQuery("#topMain").find(".resp-active").removeClass("resp-active"); if(!addActiveClass) { jQuery(this).parents("li").addClass("resp-active"); } return; }); // Drop Downs - do not hide on click jQuery("#topHead .dropdown-menu, #topNav .mega-menu .dropdown-menu").bind("click", function(e) { e.stopPropagation(); }); jQuery(window).scroll(function() { if(jQuery(window).width() > 1006) { topMain(); // on scroll } }); if(jQuery(window).width() > 1006) { topMain(); // on load } // #topHead Fixes window._headHeight = 81; window._headHeightSmall = 30; function _topNavCalibrate() { if(jQuery("#topHead").length > 0) { window._headHeight = jQuery("header#topHead").outerHeight() + jQuery("header#topNav").outerHeight() - 10; window._headHeightSmall = 66; jQuery('#wrapper').css({"padding-top":window._headHeight + "px"}); jQuery('#topHead').removeClass('fixed').addClass('fixed'); if(jQuery('#header_shadow').length > 0) { jQuery('#header_shadow').css({"top":window._headHeight + "px"}); } } else { if(jQuery(window).width() < 1006) { jQuery('#wrapper').css({"margin-top":"-30px"}); jQuery('#header_shadow').css({"top":"40px"}); } else { jQuery('#wrapper').css({"margin-top":"0px"}); // From mobile back to desktop - do not leave the shadow behing if(jQuery(window).scrollTop() > 3) { jQuery('#header_shadow').css({"top":"60px"}); } else { jQuery('#header_shadow').css({"top":"80px"}); } } } } // recalibrate menu (mobile = slim mode) on resize jQuery(window).resize(function() { _topNavCalibrate(); }); _topNavCalibrate(); // scoll is on top! window.topNavSmall = false; function topMain() { var _scrollTop = jQuery(document).scrollTop(); if(window.topNavSmall === false && _scrollTop > 0) { jQuery('header#topNav div.nav-main-collapse').addClass('topFix'); jQuery('#topNav').stop().animate({ 'height':'106px'},400); jQuery('header#topNav div.nav-main-collapse').stop().animate({ 'margin-top':'16px'},400); jQuery('header#topNav button').stop().animate({ 'margin-top':'0'},100); jQuery('header#topNav a.logo').stop().animate({ 'margin-bot':'6px'},400); if(jQuery('#header_shadow').length > 0) { jQuery('#header_shadow').stop().animate({ 'top':window._headHeightSmall + 'px'},400);/* just a little visible */ } window.topNavSmall = true; } if(window.topNavSmall === true && _scrollTop < 3) { jQuery('header#topNav div.nav-main-collapse').removeClass('topFix'); jQuery('#topNav').stop().animate({ 'height':'106px'},400); jQuery('header#topNav div.nav-main-collapse').stop().animate({ 'margin-top':'16px'},400); jQuery('header#topNav button').stop().animate({ 'margin-top':'8px'},100); jQuery('header#topNav a.logo').stop().animate({ 'line-height':'50px', 'margin-top':'0'},400); if(jQuery('#header_shadow').length > 0) { jQuery('#header_shadow').stop().animate({ 'top':window._headHeight + 'px'},400); } window.topNavSmall = false; } } } /** 02. Animate **************************************************************** **/ function _animate() { // Animation [appear] jQuery("[data-animation]").each(function() { var _t = jQuery(this); if(jQuery(window).width() > 767) { _t.appear(function() { var delay = (_t.attr("data-animation-delay") ? _t.attr("data-animation-delay") : 1); if(delay > 1) _t.css("animation-delay", delay + "ms"); _t.addClass(_t.attr("data-animation")); setTimeout(function() { _t.addClass("animation-visible"); }, delay); }, {accX: 0, accY: -150}); } else { _t.addClass("animation-visible"); } }); // Bootstrap Progress Bar jQuery("[data-appear-progress-animation]").each(function() { var $_t = jQuery(this); if(jQuery(window).width() > 767) { $_t.appear(function() { _delay = 1; if($_t.attr("data-appear-progress-animation-delay")) { _delay = $_t.attr("data-appear-progress-animation-delay"); } if(_delay > 1) { $_t.css("animation-delay", _delay + "ms"); } $_t.addClass($_t.attr("data-appear-progress-animation")); setTimeout(function() { $_t.addClass("animation-visible"); }, _delay); }, {accX: 0, accY: -150}); } else { $_t.addClass("animation-visible"); } }); jQuery("[data-appear-progress-animation]").each(function() { var $_t = jQuery(this); $_t.appear(function() { var _delay = ($_t.attr("data-appear-animation-delay") ? $_t.attr("data-appear-animation-delay"): 1); if(_delay > 1) { $_t.css("animation-delay", _delay + "ms"); } $_t.addClass($_t.attr("data-appear-animation")); setTimeout(function() { $_t.animate({"width": $_t.attr("data-appear-progress-animation")}, 1000, "easeOutQuad", function() { $_t.find(".progress-bar-tooltip").animate({"opacity": 1}, 500, "easeOutQuad"); }); }, _delay); }, {accX: 0, accY: -50}); }); // Count To jQuery(".countTo [data-to]").each(function() { var $_t = jQuery(this); $_t.appear(function() { $_t.countTo(); }, {accX:0, accY:-150}); }); /* Knob Circular Bar */ if(jQuery().knob) { jQuery(".knob").knob(); } /* Animation */ jQuery('.animate_from_top').each(function () { jQuery(this).appear(function() { jQuery(this).delay(150).animate({opacity:1,top:"0px"},1000); }); }); jQuery('.animate_from_bottom').each(function () { jQuery(this).appear(function() { jQuery(this).delay(150).animate({opacity:1,bottom:"0px"},1000); }); }); jQuery('.animate_from_left').each(function () { jQuery(this).appear(function() { jQuery(this).delay(150).animate({opacity:1,left:"0px"},1000); }); }); jQuery('.animate_from_right').each(function () { jQuery(this).appear(function() { jQuery(this).delay(150).animate({opacity:1,right:"0px"},1000); }); }); jQuery('.animate_fade_in').each(function () { jQuery(this).appear(function() { jQuery(this).delay(350).animate({opacity:1,right:"0px"},1000); }); }); } /** 03. Superslides **************************************************************** **/ function _superslide() { if(jQuery("#slider").length > 0) { var data_autoplay = jQuery("#slider").attr('data-autoplay'), data_mouseover_stop = jQuery("#slider").attr('data-mouseover-stop'); if(data_autoplay) { if(data_autoplay == '') { var data_autoplay = false; } else { var data_autoplay = parseInt(data_autoplay); } } else { var data_autoplay = false; } if(!data_autoplay) { data_mouseover_stop = false; } jQuery("#slider").superslides({ animation: "fade", // slide|fade pagination: true, // true|false play: data_autoplay, // false to disable autoplay -OR- miliseconds (eg.: 1000 = 1s) animation_speed: 600, // animation transition elements: { preserve: '.preserve', nav: '.slides-navigation', container: '.slides-container', pagination: '.slides-pagination' } }); if(data_mouseover_stop == 'true') { // Stop on mouse over ! jQuery('#slider').on('mouseenter', function() { jQuery(this).superslides('stop'); // console.log('Stopped') }); jQuery('#slider').on('mouseleave', function() { jQuery(this).superslides('start'); // console.log('_start') }); } jQuery(window).load(function () { jQuery("#slider").css({"background":"none"}); }); } } /** 04. OWL Carousel **************************************************************** **/ function _owl_carousel() { var total = jQuery("div.owl-carousel").length, count = 0; jQuery("div.owl-carousel").each(function() { var slider = jQuery(this); var options = slider.attr('data-plugin-options'); var defaults = { items: 5, itemsCustom: false, itemsDesktop: [1199,4], itemsDesktopSmall: [980,3], itemsTablet: [768,2], itemsTabletSmall: false, itemsMobile: [479,1], singleItem: true, itemsScaleUp: false, slideSpeed: 200, paginationSpeed: 800, rewindSpeed: 1000, autoPlay: false, stopOnHover: false, navigation: false, navigationText: [ '', '' ], rewindNav: true, scrollPerPage: false, pagination: true, paginationNumbers: false, responsive: true, responsiveRefreshRate: 200, responsiveBaseWidth: window, baseClass: "owl-carousel", theme: "owl-theme", lazyLoad: false, lazyFollow: true, lazyEffect: "fade", autoHeight: false, jsonPath: false, jsonSuccess: false, dragBeforeAnimFinish: true, mouseDrag: true, touchDrag: true, transitionStyle: false, addClassActive: false, beforeUpdate: false, afterUpdate: false, beforeInit: false, afterInit: false, beforeMove: false, afterMove: false, afterAction: false, startDragging: false, afterLazyLoad: false } var config = jQuery.extend({}, defaults, options, slider.data("plugin-options")); slider.owlCarousel(config).addClass("owl-carousel-init"); }); } /** 05. Popover **************************************************************** **/ function _popover() { jQuery("a[data-toggle=popover]").bind("click", function(e) { jQuery('.popover-title .close').remove(); e.preventDefault(); }); var isVisible = false, clickedAway = false; jQuery("a[data-toggle=popover], button[data-toggle=popover]").popover({ html: true, trigger: 'manual' }).click(function(e) { jQuery(this).popover('show'); clickedAway = false; isVisible = true; e.preventDefault(); }); jQuery(document).click(function(e) { if(isVisible & clickedAway) { jQuery("a[data-toggle=popover], button[data-toggle=popover]").popover('hide'); isVisible = clickedAway = false; } else { clickedAway = true; } }); jQuery("a[data-toggle=popover], button[data-toggle=popover]").popover({ html: true, trigger: 'manual' }).click(function(e) { $(this).popover('show'); $('.popover-title').append(''); $('.close').click(function(e){ jQuery("a[data-toggle=popover], button[data-toggle=popover]").popover('hide'); }); e.preventDefault(); }); // jQuery("a[data-toggle=popover], button[data-toggle=popover]").popover(); } /** 06. LightBox **************************************************************** **/ function _lightbox() { if(typeof(jQuery.magnificPopup) == "undefined") { return false; } jQuery.extend(true, jQuery.magnificPopup.defaults, { tClose: 'Close', tLoading: 'Loading...', gallery: { tPrev: 'Previous', tNext: 'Next', tCounter: '%curr% / %total%' }, image: { tError: 'Image not loaded!' }, ajax: { tError: 'Content not loaded!' } }); jQuery(".lightbox").each(function() { var _t = jQuery(this), options = _t.attr('data-plugin-options'), config = {}, defaults = { type: 'image', fixedContentPos: false, fixedBgPos: false, mainClass: 'mfp-no-margins mfp-with-zoom', image: { verticalFit: true }, zoom: { enabled: false, duration: 300 }, gallery: { enabled: false, navigateByImgClick: true, preload: [0,1], arrowMarkup: '', tPrev: 'Previou', tNext: 'Next', tCounter: '%curr% / %total%' }, }; if(_t.data("plugin-options")) { config = jQuery.extend({}, defaults, options, _t.data("plugin-options")); } jQuery(this).magnificPopup(config); }); } /** 07. ScrollTo **************************************************************** **/ function _scrollTo() { jQuery("a.scrollTo").bind("click", function(e) { e.preventDefault(); var href = jQuery(this).attr('href'); if(href != '#') { jQuery('html,body').animate({scrollTop: jQuery(href).offset().top - 60}, 1000, 'easeInOutExpo'); } }); jQuery("a.toTop").bind("click", function(e) { e.preventDefault(); jQuery('html,body').animate({scrollTop: 0}, 1000, 'easeInOutExpo'); }); } /** 08. Parallax **************************************************************** **/ function _parallax() { if(typeof(jQuery.stellar) == "undefined") { jQuery(".parallax").addClass("parallax-init"); return false; } jQuery(window).load(function () { if(jQuery(".parallax").length > 0) { if(!Modernizr.touch) { jQuery(window).stellar({ responsive: true, scrollProperty: 'scroll', parallaxElements: false, horizontalScrolling: false, horizontalOffset: 0, verticalOffset: 0 }); } else { jQuery(".parallax").addClass("disabled"); } } jQuery(".parallax").addClass("parallax-init"); // responsive jQuery(window).afterResize(function() { jQuery.stellar('refresh'); }); }); } /** 09. Masonry Filter **************************************************************** **/ function _masonry() { jQuery(window).load(function() { jQuery("span.js_loader").remove(); jQuery("li.masonry-item").addClass('fadeIn'); jQuery(".masonry-list").each(function() { var _c = jQuery(this); _c.waitForImages(function() { // waitForImages Plugin - bottom of this file _c.masonry({ itemSelector: '.masonry-item' }); }); }); }); jQuery("ul.isotope-filter").each(function() { var _el = jQuery(this), destination = jQuery("ul.sort-destination[data-sort-id=" + jQuery(this).attr("data-sort-id") + "]"); if(destination.get(0)) { jQuery(window).load(function() { destination.isotope({ itemSelector: "li", layoutMode: 'sloppyMasonry' }); _el.find("a").click(function(e) { e.preventDefault(); var $_t = jQuery(this), sortId = $_t.parents(".sort-source").attr("data-sort-id"), filter = $_t.parent().attr("data-option-value"); _el.find("li.active").removeClass("active"); $_t.parent().addClass("active"); destination.isotope({ filter: filter }); jQuery(".sort-source-title[data-sort-id=" + sortId + "] strong").html($_t.html()); return false; }); }); } }); jQuery(window).load(function() { jQuery("ul.isotope").addClass('fadeIn'); }); } /** 10. Toggle **************************************************************** **/ function _toggle() { var $_t = this, previewParClosedHeight = 25; jQuery("div.toggle.active > p").addClass("preview-active"); jQuery("div.toggle.active > div.toggle-content").slideDown(400); jQuery("div.toggle > label").click(function(e) { var parentSection = jQuery(this).parent(), parentWrapper = jQuery(this).parents("div.toogle"), previewPar = false, isAccordion = parentWrapper.hasClass("toogle-accordion"); if(isAccordion && typeof(e.originalEvent) != "undefined") { parentWrapper.find("div.toggle.active > label").trigger("click"); } parentSection.toggleClass("active"); if(parentSection.find("> p").get(0)) { previewPar = parentSection.find("> p"); var previewParCurrentHeight = previewPar.css("height"); var previewParAnimateHeight = previewPar.css("height"); previewPar.css("height", "auto"); previewPar.css("height", previewParCurrentHeight); } var toggleContent = parentSection.find("> div.toggle-content"); if(parentSection.hasClass("active")) { jQuery(previewPar).animate({height: previewParAnimateHeight}, 350, function() {jQuery(this).addClass("preview-active");}); toggleContent.slideDown(350); } else { jQuery(previewPar).animate({height: previewParClosedHeight}, 350, function() {jQuery(this).removeClass("preview-active");}); toggleContent.slideUp(350); } }); } /** 11. Background Image class="boxed" should be added to body. Add to body - example: data-background="assets/images/boxed_background/1.jpg" **************************************************************** **/ function _bgimage() { if(jQuery('body').hasClass('boxed')) { backgroundImageSwitch(); } function backgroundImageSwitch() { var data_background = jQuery('body').attr('data-background'); if(data_background) { jQuery.backstretch(data_background); jQuery('body').addClass('transparent'); // remove backround color of boxed class } } } /** 12. Global Search **************************************************************** **/ function _globalSearch() { jQuery('li.search, li.search input').bind("click", function(e) { e.stopPropagation(); }); jQuery('li.search input').bind("click", function() { return false; }); jQuery('li.search').bind("click", function() { if(jQuery(this).hasClass('open')) { disable_overlay(); enable_scroll(); jQuery(this).removeClass('open'); } else { enable_overlay(); disable_scroll(); jQuery(this).addClass('open'); jQuery('li.quick-cart').removeClass('open'); // close quick cart } }); // 'esc' key jQuery(document).keydown(function(e) { var code = e.keyCode ? e.keyCode : e.which; if(code == 27) { jQuery('li.search, li.quick-cart').removeClass('open'); disable_overlay(); enable_scroll(); } }); jQuery(document).bind("click", function() { if(jQuery('li.search').hasClass('open')) { jQuery('li.search, li.quick-cart').removeClass('open'); disable_overlay(); enable_scroll(); } }); } /** 13. Quick Cart **************************************************************** **/ function _quickCart() { jQuery('li.quick-cart').bind("click", function() { jQuery('li.quick-cart .quick-cart-content').bind("click", function(e) { e.stopPropagation(); }); if(jQuery(this).hasClass('open')) { disable_overlay(); enable_scroll(); jQuery(this).removeClass('open'); } else { enable_overlay(); disable_scroll(); jQuery(this).addClass('open'); jQuery('li.search').removeClass('open'); // close search } return false; }); // 'esc' key jQuery(document).keydown(function(e) { var code = e.keyCode ? e.keyCode : e.which; if(code == 27) { jQuery('li.search, li.quick-cart').removeClass('open'); disable_overlay(); enable_scroll(); } }); jQuery(document).bind("click", function() { if(jQuery('li.quick-cart').hasClass('open')) { jQuery('li.search, li.quick-cart').removeClass('open'); disable_overlay(); enable_scroll(); } }); } /** 14. Placeholder **************************************************************** **/ function _placeholder() { //check for IE if(navigator.appVersion.indexOf("MSIE")!=-1) { jQuery('[placeholder]').focus(function() { var input = jQuery(this); if (input.val() == input.attr('placeholder')) { input.val(''); input.removeClass('placeholder'); } }).blur(function() { var input = jQuery(this); if (input.val() == '' || input.val() == input.attr('placeholder')) { input.addClass('placeholder'); input.val(input.attr('placeholder')); } }).blur(); } } /** 15. Summernote HTML Editor **************************************************************** **/ function _htmlEditor() { /** SUMMERNOTE - textarea html editor **/ if(jQuery('textarea.summernote').length > 0 && jQuery().summernote) { jQuery('textarea.summernote').each(function() { jQuery(this).summernote({ height: jQuery(this).attr('data-height') || 200, toolbar: [ /* [groupname, [button list]] */ ['fontsize', ['fontsize']], ['style', ['bold', 'italic', 'underline','strikethrough', 'clear']], ['para', ['ul', 'ol', 'paragraph']], ['table', ['table']], ['media', ['link', 'picture', 'video']], ['misc', ['codeview']] ] }); }); } } /** 16. Mixitup Filter **************************************************************** **/ function _mixitup() { var _container = jQuery('.mix-grid'); if(_container.length > 0) { loadScript(plugin_path + 'mixitup/jquery.mixitup.min.js', function() { if(jQuery().mixitup) { _container.mixitup(); jQuery("ul.mix-filter a").bind("click", function(e) { e.preventDefault(); }); } }); } } /** 17. Lazy Load **************************************************************** **/ function _lazyload() { var _container = jQuery('img.lazy'); if(_container.length > 0) { loadScript(plugin_path + 'lazyload/jquery.lazyload.min.js', function() { if(jQuery().lazyload) { _container.each(function () { var _t = jQuery(this), _effect = _t.attr('data-effect') || 'fadeIn'; _t.lazyload({ effect : _effect }); }); } }); } } /** **************************************************************************************************************** **/ /** **************************************************************************************************************** **/ /** **************************************************************************************************************** **/ /** **************************************************************************************************************** **/ // scroll function wheel(e) { e.preventDefault(); } function disable_scroll() { if (window.addEventListener) { window.addEventListener('DOMMouseScroll', wheel, false); } window.onmousewheel = document.onmousewheel = wheel; } function enable_scroll() { if (window.removeEventListener) { window.removeEventListener('DOMMouseScroll', wheel, false); } window.onmousewheel = document.onmousewheel = document.onkeydown = null; } // overlay function enable_overlay() { jQuery("span.global-overlay").remove(); // remove first! jQuery('body').append(''); } function disable_overlay() { jQuery("span.global-overlay").remove(); } /** MEDIA ELEMENTS *************************************************** **/ if(jQuery().mediaelementplayer && jQuery('video').length > 0 && jQuery(".fullscreenbanner video").length < 1 && jQuery(".fullwidthbanner video").length < 1) { // exclude revolution slider videos jQuery('video').mediaelementplayer({ // if the