/*================================================ * * Template name : Mono * Version : 5.6.3 * Author : FlaTheme * Author URL : http://themeforest.net/user/flatheme * * Table of Contents : * 1. Preloaders * 2. Scroll Animations * 3. Background Image * 4. Header Menu * 5. Fullscreen Menu * 6. SmoothScroll * 7. ScrollToTop * 8. Portfolio Masonry * 9. Portfolio Grid * 10. Slider * 11. Blog Masonry * 12. Masonry * 13. Lightbox * 14. Parallax * 15. Countdown * 16. Counter * 17. Accordion * 18. Popover * 19. Tooltip * 20. Easy Pie Chart * 21. Google Maps * 22. Contact Form * 23. Shop * ===============================================*/ "use strict"; var $htmlBody = $("html,body"); var $body = $("body"); var $windowWidth = $(window).width(); /*=============================================== 1. Preloaders ===============================================*/ $(window).on("load", function () { $body.addClass("loaded"); }); if ($body.attr("data-preloader") === "1") { $body.append($("
")); } else if ($body.attr("data-preloader") === "2") { $body.append($("
")); } else if ($body.attr("data-preloader") === "3") { $body.append($("
")); } else if ($body.attr("data-preloader") === "4") { $body.append($("
")); } /*=============================================== 2. Scroll Animations ===============================================*/ sal({ duration: 500 }); /*=============================================== 3. Background Image ===============================================*/ $(".bg-image").each(function() { var bgData = $(this).attr("data-bg-src"); $(this).css('background-image', 'url(' +bgData+ ')'); }); /*=============================================== 4. Header Menu ===============================================*/ // // Auto Hide // // var c, currentScrollTop = 0, header = $(".header.sticky-autohide"); $(window).on("scroll", function () { var a = $(window).scrollTop(); currentScrollTop = a; if (c < currentScrollTop && a > 210) { if (!headerMenu.hasClass("show")) { header.addClass("hide"); } } else if (c > currentScrollTop && !(a <= 210)) { header.removeClass("hide"); } c = currentScrollTop; }); if ($(".header.sticky-autohide:not(.header-lg, .header-xl, .absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header.sticky-autohide"); } if ($(".header-lg.sticky-autohide:not(.absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header-lg.sticky-autohide"); } if ($(".header-xl.sticky-autohide:not(.absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header-xl.sticky-autohide"); } // // Sticky // // if ($(".header.sticky:not(.header-lg, .header-xl, .absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header.sticky"); } if ($(".header-lg.sticky:not(.absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header-lg.sticky"); } if ($(".header-xl.sticky:not(.absolute-light, .absolute-dark)").length) { $("
").insertBefore(".header-xl.sticky"); } // // Absolute // // if ($(".absolute-light").length) { $(window).on("scroll", function() { var headerFixed = $(".header.sticky-autohide, .header.sticky"); if ($(window).scrollTop() > 10) { headerFixed.removeClass("absolute-light"); } else { headerFixed.addClass("absolute-light"); } }); } if ($(".absolute-dark").length) { $(window).on("scroll", function() { var headerFixed = $(".header.sticky-autohide, .header.sticky"); if ($(window).scrollTop() > 10) { headerFixed.removeClass("absolute-dark"); } else { headerFixed.addClass("absolute-dark"); } }); } // // Open/Close Header Menu // // var headerMenu = $(".header-menu"); var headerToggle = $(".header-toggle"); headerToggle.on("click", function(e) { if (headerMenu.hasClass("show")) { headerMenu.removeClass("show"); headerToggle.removeClass("toggle-close"); } else { headerMenu.addClass("show"); headerToggle.addClass("toggle-close"); } e.stopPropagation(); }); $(document).on("click", function(e) { if ( $(e.target).closest(".nav-dropdown-toggle, .nav-subdropdown-toggle").length === 0 ) { if (headerMenu.hasClass("show")) { headerMenu.removeClass("show"); headerToggle.removeClass("toggle-close"); } } }); var navDropdown = $(".nav-dropdown"); var navSubdropdown = $(".nav-subdropdown"); navDropdown.each(function() { var $this = $(this); $this.parent(".nav-item").children(".nav-link").addClass("nav-dropdown-toggle"); }); navSubdropdown.each(function() { var $this = $(this); $this.parent(".nav-dropdown-item").children(".nav-dropdown-link").addClass("nav-subdropdown-toggle"); }); // // Dropdown Menu // // var navDropdownToggle = $(".nav-dropdown-toggle"); var navSubdropdownToggle = $(".nav-subdropdown-toggle"); navDropdownToggle.each(function() { var $this = $(this); if ($this.parent(".nav-item").children(".nav-dropdown").length) { var navDropdown = $this.parent(".nav-item").children(".nav-dropdown"); $this.on("click", function(e) { if ($this.hasClass("active")) { $this.removeClass("active"); navDropdown.removeClass("show"); } else { $this.addClass("active"); navDropdown.addClass("show"); } e.preventDefault(); }); } }); // // Subdropdown Menu // // navSubdropdownToggle.each(function() { var $this = $(this); if ($this.parent(".nav-dropdown-item").children(".nav-subdropdown").length) { var navSubDropdown = $this.parent(".nav-dropdown-item").children(".nav-subdropdown"); $this.on("click", function(e) { if ($this.hasClass("active")) { $this.removeClass("active"); navSubDropdown.removeClass("show"); } else { $this.addClass("active"); navSubDropdown.addClass("show"); } e.preventDefault(); }); } }); // // ScrollSpy // // $body.scrollspy({ target: '.header-menu' }); /*=============================================== 5. Fullscreen Menu ===============================================*/ var fm = $(".fullscreen-menu"); if (fm.length) { var fmToggle = $(".fm-toggle"); var fmClose = $(".fm-close"); // // Open // // fmToggle.on("click", function(e) { if (fm.hasClass("fm-show")) { fm.removeClass("fm-show"); } else { fm.addClass("fm-show"); } e.stopPropagation(); }); // // Close // // fmClose.on("click", function(e) { fm.removeClass("fm-show"); fmToggle.removeClass("fm-toggle-hide"); }); } /*=============================================== 6. SmoothScroll ===============================================*/ $('a[href*="#"]').not('[href="#"]').not('[data-toggle="tab"]').on("click", function(e) { if ( location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname ) { var target = $(this.hash); target = target.length ? target : $('[name=' + this.hash.slice(1) + ']'); if (target.length) { event.preventDefault(); $htmlBody.animate({scrollTop: target.offset().top}, 550, "easeInOutQuart"); } } }); /*=============================================== 7. Scroll To Top ===============================================*/ var scrollTopBtn = $(".scrolltotop"); if (scrollTopBtn.length) { // // Show/Hide button // // $(window).on("scroll", function(){ if ($(this).scrollTop() > 700) { // 700px from top scrollTopBtn.addClass("scrolltotop-show"); } else { scrollTopBtn.removeClass("scrolltotop-show"); } }); // // Animate button // // scrollTopBtn.on("click", function(){ $htmlBody.animate({scrollTop : 0}, 550, "easeInOutQuart"); return false; }); } /*=============================================== 8. Portfolio Masonry ===============================================*/ var pMasonry = $(".portfolio-wrapper:not(.row)"); if (pMasonry.length) { pMasonry.imagesLoaded(function() { var $pWrapper = $(".portfolio-wrapper").isotope({ itemSelector: ".portfolio-item", transitionDuration: 300 // 0.3 second }); var filter = $(".filter ul li"); // Portfolio Filter // filter.on("click", function() { var filterValue = $(this).attr("data-filter"); $pWrapper.isotope({ filter: filterValue }); filter.removeClass("active"); $(this).addClass("active"); }); }); } /*=============================================== 9. Portfolio Grid ===============================================*/ var pGrid = $(".portfolio-wrapper.row"); if (pGrid.length) { var mixer = mixitup('.portfolio-wrapper.row', { selectors: { target: '.portfolio-item' }, animation: { duration: 300 } }); } /*=============================================== 10. Slider ===============================================*/ $(".owl-carousel").each( function() { var $carousel = $(this); var $defaults = { rewind: true, navText: ["",""], autoHeight: true, autoplayTimeout: 4000, autoplaySpeed: 400, autoplayHoverPause: true, navSpeed: 350, dotsSpeed: 350 } var $options = { items: $carousel.data("owl-items"), margin: $carousel.data("owl-margin"), loop: $carousel.data("owl-loop"), center: $carousel.data("owl-center"), nav: $carousel.data("owl-nav"), rewind: $carousel.data("owl-rewind"), dots: $carousel.data("owl-dots"), autoplay: $carousel.data("owl-autoplay") } var $responsive = { responsive: { 0 : { items: $carousel.data("owl-xs") }, 576 : { items: $carousel.data("owl-sm") }, 768 : { items: $carousel.data("owl-md") }, 992 : { items: $carousel.data("owl-lg") }, 1200 : { items: $carousel.data("owl-xl") } } } if ($carousel.hasClass("product-carousel")) { var $productCarousel = { items:1, animateOut: 'fadeOut', URLhashListener:true, startPosition: 'URLHash' } } $carousel.owlCarousel( $.extend( $defaults, $options, $responsive, $productCarousel) ); var customPrev = $("#customPrev"); var customNext = $("#customNext"); customNext.on("click", function(){ $carousel.trigger("next.owl.carousel", [350]); }); customPrev.on("click", function(){ $carousel.trigger("prev.owl.carousel", [350]); }); }); /*=============================================== 11. Blog Masonry ===============================================*/ var $blogMasonry = $(".blog-masonry").imagesLoaded( function() { $blogMasonry.masonry({ itemSelector: '.blog-post-box' }); }); /*=============================================== 12. Masonry ===============================================*/ var $masonryGrid = $(".masonry").imagesLoaded( function() { $masonryGrid.masonry({ itemSelector: '.masonry-item' }); }); /*=============================================== 13. Lightbox ===============================================*/ // // Lightbox - Image // // var $lightboxImage = $(".lightbox-image-link, .lightbox-image-box"); $lightboxImage.each(function () { var $this = $(this); $this.magnificPopup({ type: 'image', fixedContentPos: false, removalDelay: 200, closeOnContentClick: true, image: { titleSrc: 'data-image-title' } }); }); // // Lightbox - Media // // var $lightboxMedia = $(".lightbox-media-link, .lightbox-media-box"); $lightboxMedia.each(function() { var $this = $(this); $this.magnificPopup({ type: "iframe", fixedContentPos: false, removalDelay: 200, preloader: false, iframe: { patterns: { youtube: { index: 'youtube.com/', id: 'v=', src: '//www.youtube.com/embed/%id%?autoplay=1&rel=0' }, vimeo: { index: 'vimeo.com/', id: '/', src: '//player.vimeo.com/video/%id%?autoplay=1' } }, srcAction: "iframe_src" } }); }); // // Lightbox - Gallery // // var $gallery = $(".gallery-wrapper"); if ($gallery.length) { $gallery.each(function() { var $this = $(this); $this.magnificPopup({ delegate: 'a', removalDelay: '200', type: 'image', fixedContentPos: false, gallery: { enabled: true }, image: { titleSrc: 'data-gallery-title' } }); }); } /*=============================================== 14. Parallax ===============================================*/ if ($windowWidth > 992) { var parallaxBg = $(".parallax"); if (parallaxBg.length) { parallaxBg.each(function() { $(this).parallaxie({ speed: 0.2 }); }); } } /*=============================================== 15. Countdown ===============================================*/ // // Countdown - Legacy style // // $(".countdown").each(function() { var finalDate = $(this).attr('data-countdown'); $(this).countdown(finalDate, function(event) { $(this).html(event.strftime('' + '

%D

Days
' + '

%H

Hours
' + '

%M

Minutes
' + '

%S

Seconds
')); }); }); // // Countdown - Basic style // // $(".countdown-basic").each(function() { var finalDate = $(this).attr('data-countdown'); $(this).countdown(finalDate, function(event) { $(this).html(event.strftime('%D days %H:%M:%S')); }); }); /*=============================================== 16. Counter ===============================================*/ $(".counter").appear(function() { $(this).each(function () { $(this).prop("Counter",0).animate({ Counter: $(this).text() }, { duration: 3000, easing: "swing", step: function (now) { $(this).text(Math.ceil(now)); } }); }); },{accX: 0, accY: -10}); /*=============================================== 17. Accordion ===============================================*/ $(".accordion-title").each(function() { var $this = $(this); $this.on("click", function() { var accordionList = $this.parent("li"); var accordionContent = this.nextElementSibling; if (accordionList.hasClass("active")) { accordionList.removeClass("active"); accordionContent.style.maxHeight = null; } else { accordionList.addClass("active"); if ($this.closest(".accordion").hasClass("single-open")) { $this.closest(".accordion").children("li").removeClass("active"); accordionList.addClass("active"); $this.parents(".single-open").find(".accordion-content").css("max-height", "0"); } accordionContent.style.maxHeight = accordionContent.scrollHeight + "px"; } }); // // Give max-height to Accordion's active content // // if ($this.parents(".accordion").find("li").hasClass("active")) { var accordionActiveContent = $this.parents(".accordion").find("li.active").children(".accordion-content"); var accordionHeight = accordionActiveContent.prop("scrollHeight"); accordionActiveContent.css({'max-height': accordionHeight + "px"}); } }); /*=============================================== 18. Popover ===============================================*/ $('[data-toggle="popover"]').popover(); /*=============================================== 19. Tooltip ===============================================*/ $('[data-toggle="tooltip"]').tooltip(); /*=============================================== 20. Easy Pie Chart ===============================================*/ $(".pie-chart").appear(function() { $(this).each(function() { $(this).easyPieChart({ lineCap: 'square', onStep: function(from, to, percent) { $(this.el).find('.percent').text(Math.round(percent)); } }); }); },{accX: 0, accY: -10}); /*=============================================== 21. Google Maps ===============================================*/ var mapCanvas = $(".gmap"); if (mapCanvas.length) { var m,divId,initLatitude, initLongitude, map; for (var i = 0; i < mapCanvas.length; i++) { m = mapCanvas[i]; initLatitude = m.dataset["latitude"]; initLongitude = m.dataset["longitude"]; divId = "#"+ m["id"]; map = new GMaps({ el: divId, lat: initLatitude, lng: initLongitude, zoom: 16, scrollwheel: false, styles: [ /* style your map at https://snazzymaps.com/editor and paste JSON here */ ] }); map.addMarker({ lat : initLatitude, lng : initLongitude }); } } /*=============================================== 22. Contact Form ===============================================*/ $("#contactform").on("submit", function(e) { var name = $("#name").val(); var email = $("#email").val(); var subject = $("#subject").val(); var message = $("#message").val(); if (name === "") { $("#name").addClass("error-color"); } if (email === "") { $("#email").addClass("error-color"); } if (subject === "") { $("#subject").addClass("error-color"); } if (message === "") { $("#message").addClass("error-color"); } else { $.ajax({ url:"assets/php/contact-form.php", data:$(this).serialize(), type:"POST", success:function(data){ $("#success").addClass("show-result"); //=== Show Success Message== $("#contactform").each(function(){ this.reset(); }); }, error:function(data){ $("#error").addClass("show-result"); //===Show Error Message==== } }); var forms = $("#contactform input, #contactform textarea"); forms.removeClass("error-color"); } e.preventDefault(); }); /*=============================================== 23. Shop ===============================================*/ $(".product-quantity .qnt").append('-+'); $(".qnt-button").on("click", function() { var $button = $(this); var oldValue = $button.parent().find("input").val(); if ($button.text() == "+") { var newVal = parseFloat(oldValue) + 1; } else { // Don't allow decrementing below zero if (oldValue > 1) { var newVal = parseFloat(oldValue) - 1; } else { newVal = 1; } } $button.parent().find("input").val(newVal); return false; });