/** * 1. Main Menu 2. Mobile Menu 3. Accordion 4. Toggle 5. Owl Carousel 6. Validate Form 7. Google Map 8. FitVid 9. Masonry 10. Scroll 11. Pie chart 12. Portfolio Wookmark 13. Magnific Popup 14. Match height 15. Search Box 16. Video Wrapper *----------------------------------------------------------------- **/ "use strict"; $(document).ready(function(){ var kopa_variable = { "contact": { "address": "Lorem ipsum dolor sit amet, consectetur adipiscing elit", "marker": "/url image" }, "i18n": { "VIEW": "View", "VIEWS": "Views", "validate": { "form": { "SUBMIT": "Submit", "SENDING": "Sending..." }, "name": { "REQUIRED": "Please enter your name", "MINLENGTH": "At least {0} characters required" }, "email": { "REQUIRED": "Please enter your email", "EMAIL": "Please enter a valid email" }, "url": { "REQUIRED": "Please enter your url", "URL": "Please enter a valid url" }, "message": { "REQUIRED": "Please enter a message", "MINLENGTH": "At least {0} characters required" } }, "tweets": { "failed": "Sorry, twitter is currently unavailable for this user.", "loading": "Loading tweets..." } }, "url": { "template_directory_uri":"" } }; var map; /* ========================================================= 1. Main Menu ============================================================ */ Modernizr.load([ { load: kopa_variable.url.template_directory_uri + '/web/js/superfish.min.js', complete: function () { var r_ul = $('.kopa-main-nav .sf-menu'); r_ul.superfish({ speed: "fast", delay: "100" }); } } ]); /* ============================================ 2. Mobile-menu =============================================== */ Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.navgoco.js'], complete: function () { jQuery(".main-menu-mobile").navgoco({ accordion: true }); jQuery(".main-nav-mobile > .pull").click(function () { jQuery(".main-menu-mobile").slideToggle("slow"); }); jQuery(".caret").removeClass("caret"); } }]); /* ========================================================= 3. Accordion ============================================================ */ var panel_titles = $('.kopa-accordion .panel-title a'); panel_titles.addClass("collapsed"); $('.panel-heading.active').find(panel_titles).removeClass("collapsed"); panel_titles.click(function(){ $(this).closest('.kopa-accordion').find('.panel-heading').removeClass('active'); var pn_heading = $(this).parents('.panel-heading'); if ($(this).hasClass('collapsed')) { pn_heading.addClass('active'); } else { pn_heading.removeClass('active'); } }); /* ========================================================= 4. Toggle ============================================================ */ $('.kopa-toggle .panel-group .collapse').collapse({ toggle: false }); var panel_titles_2 = $('.kopa-toggle .panel-title a'); panel_titles_2.click(function(){ var parent = $(this).closest('.panel-heading'); if (parent.hasClass('active')) { parent.removeClass('active'); } else { parent.addClass('active'); } }); /* ========================================================= 5. Owl Carousel ============================================================ */ Modernizr.load([{ load: [ kopa_variable.url.template_directory_uri + '/web/js/owl.carousel.min.js'], complete: function () { var owl1 = $(".owl-carousel-1"); owl1.owlCarousel({ singleItem: true, pagination: true, slideSpeed: 600, navigationText: false, navigation: false, autoPlay: true, afterAction: function(){ var h_11 = owl1.find(".entry-item").height(); owl1.find(".entry-item").find('.wrapper').height(h_11); var h_1 = owl1.find(".entry-content").height(); var m_1 = -(h_1/2 + 30); owl1.find(".entry-content").css({ "margin-top": m_1 }); }, afterInit: function(){ $(".home-slider-1 .loading").hide(); } }); var owl2 = $(".owl-carousel-2"); owl2.owlCarousel({ items: 5, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); owl2.find(".owl-controls").addClass("style1"); var owl3 = $(".owl-carousel-3"); owl3.owlCarousel({ singleItem: true, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); owl3.find(".owl-controls").addClass("style2"); var owl4 = $(".owl-carousel-4"); owl4.owlCarousel({ singleItem: true, pagination: true, slideSpeed: 600, navigationText: false, navigation: false, autoPlay: true, afterInit: function(){ $(".home-slider-2 .loading").hide(); } }); owl4.find(".owl-controls").addClass("style3"); var owl5 = $(".owl-carousel-5"); owl5.owlCarousel({ singleItem: true, pagination: true, slideSpeed: 600, navigationText: false, navigation: true, autoPlay: true }); owl5.find(".owl-controls").addClass("style4"); var owl6 = $(".owl-carousel-6"); owl6.owlCarousel({ singleItem: true, pagination: true, slideSpeed: 600, navigationText: false, navigation: false, autoPlay: true, afterInit: function(){ $(".home-slider-3 .loading").hide(); } }); var owl7 = $(".kopa-service-carousel"); owl7.owlCarousel({ singleItem: true, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); var owl8 = $(".kopa-single-carousel"); owl8.owlCarousel({ singleItem: true, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); var owl9 = $(".kopa-car-carousel"); owl9.owlCarousel({ singleItem: true, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); var owl10 = $(".kopa-portfolio-carousel"); owl10.owlCarousel({ singleItem: true, pagination: false, slideSpeed: 600, navigationText: false, navigation: true }); } }]); /* ========================================================= 6. Validate Form ============================================================ */ /*-- contact form --*/ if ($('.contact-form').length > 0) { Modernizr.load([ { load:[ kopa_variable.url.template_directory_uri + '/web/js/jquery.form.min.js', kopa_variable.url.template_directory_uri + '/web/js/jquery.validate.min.js'], complete: function () { $('.contact-form').validate({ // Add requirements to each of the fields rules: { name: { required: true, minlength: 10 }, email: { required: true, email: true }, web: { required: true, minlength: 10 }, message: { required: true, minlength: 15 } }, // Specify what error messages to display // when the user does something horrid messages: { name: { required: "Please enter your name.", minlength: $.format("At least {0} characters required.") }, email: { required: "Please enter your email.", email: "Please enter a valid email." }, web: { required: "Please enter your website.", minlength: "Please enter a valid website url." }, message: { required: "Please enter a message.", minlength: $.format("At least {0} characters required.") } }, // Use Ajax to send everything to processForm.php /* submitHandler: function(form) { $("#input-submit").attr("value", "Sending..."); $(form).ajaxSubmit({ success: function(responseText, statusText, xhr, $form) { $("#response1").html(responseText).hide().slideDown("fast"); $("#input-submit").attr("value", "Submit"); } }); return false; } */ }); } } ]); }; /*-- contact form --*/ if ($('.contact-form-1').length > 0) { Modernizr.load([ { load:[ kopa_variable.url.template_directory_uri + '/web/js/jquery.form.min.js', kopa_variable.url.template_directory_uri + '/web/js/jquery.validate.min.js'], complete: function () { $('.contact-form-1').validate({ // Add requirements to each of the fields rules: { name: { required: true, minlength: 8 }, email: { required: true, email: true }, web: { required: true, minlength: 10 }, message: { required: true, minlength: 10 } }, // Specify what error messages to display // when the user does something horrid messages: { name: { required: "Please enter your name.", minlength: $.format("At least {0} characters required.") }, email: { required: "Please enter your email.", email: "Please enter a valid email." }, web: { required: "Please enter your website.", minlength: "Please enter a valid website url." }, message: { required: "Please enter a message.", minlength: $.format("At least {0} characters required.") } }, // Use Ajax to send everything to processForm.php submitHandler: function(form) { $("#.input-submit-1").attr("value", "Sending..."); $(form).ajaxSubmit({ success: function(responseText, statusText, xhr, $form) { $("#response").html(responseText).hide().slideDown("fast"); $("#.input-submit-1").attr("value", "Submit"); } }); return false; } }); } } ]); }; /*-- comment form --*/ if ($('#comments-form').length > 0) { Modernizr.load([ { load:[ kopa_variable.url.template_directory_uri + '/web/js/jquery.form.min.js', kopa_variable.url.template_directory_uri + '/web/js/jquery.validate.min.js'], complete: function () { $('#comments-form').validate({ // Add requirements to each of the fields rules: { name: { required: true, minlength: 10 }, email: { required: true, email: true }, phone: { required: true, phone: true }, message: { required: true, minlength: 15 } }, // Specify what error messages to display // when the user does something horrid messages: { name: { required: "Please enter your name.", minlength: $.format("At least {0} characters required.") }, email: { required: "Please enter your email.", email: "Please enter a valid email." }, phone: { required: "Please enter your phone.", url: "Please enter a valid phone." }, message: { required: "Please enter a message.", minlength: $.format("At least {0} characters required.") } }, // Use Ajax to send everything to processForm.php submitHandler: function(form) { $("#input-submit").attr("value", "Sending..."); $(form).ajaxSubmit({ success: function(responseText, statusText, xhr, $form) { $("#response2").html(responseText).hide().slideDown("fast"); $("#input-submit").attr("value", "Submit"); } }); return false; } }); } } ]); }; /* ========================================================= 7. Google Map ============================================================ */ var map; if ($('.kopa-map').length > 0) { Modernizr.load([{ load: [ kopa_variable.url.template_directory_uri + '/web/js/gmaps.js'], complete: function () { var id_map = $('.kopa-map').attr('id'); var lat = parseFloat($('.kopa-map').attr('data-latitude')); var lng = parseFloat($('.kopa-map').attr('data-longitude')); var place = $('.kopa-map').attr('data-place'); map = new GMaps({ el: '#'+id_map, lat: lat, lng: lng, zoomControl : true, zoomControlOpt: { style : 'SMALL', position: 'TOP_LEFT' }, panControl : false, streetViewControl : false, mapTypeControl: false, overviewMapControl: false }); map.addMarker({ lat: lat, lng: lng, title: place }); } }]); }; /* ========================================================= 8. Fitvid ============================================================ */ Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.fitvids.js'], complete: function () { $("body").fitVids(); } }]); /* ========================================================= 9. Masonry ============================================================ */ if ($('.kopa-product-list-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/masonry.pkgd.min.js', kopa_variable.url.template_directory_uri + '/web/js/imagesloaded.js'], complete: function () { var jQuerymasonry1 = $('.kopa-product-list-widget').find('.kopa-masonry-wrap'); imagesLoaded(jQuerymasonry1, function () { jQuerymasonry1.masonry({ columnWidth: 0, itemSelector: '.ms-item1' }); jQuerymasonry1.masonry('bindResize') }); } }]); } if ($('.kopa-masonry-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/masonry.pkgd.min.js', kopa_variable.url.template_directory_uri + '/web/js/imagesloaded.js'], complete: function () { var jQuerymasonry2 = $('.kopa-masonry-widget').find('.kopa-masonry-wrap'); imagesLoaded(jQuerymasonry2, function () { jQuerymasonry2.masonry({ columnWidth: 1, itemSelector: '.ms-item2' }); jQuerymasonry2.masonry('bindResize') }); } }]); } if ($('.article-list-2').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/masonry.pkgd.min.js', kopa_variable.url.template_directory_uri + '/web/js/imagesloaded.js'], complete: function () { var jQuerymasonry2 = $('.article-list-2').find('.kopa-masonry-wrap'); imagesLoaded(jQuerymasonry2, function () { jQuerymasonry2.masonry({ columnWidth: 1, itemSelector: '.ms-item3' }); jQuerymasonry2.masonry('bindResize') }); } }]); } Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/masonry.pkgd.min.js', kopa_variable.url.template_directory_uri + '/web/js/imagesloaded.js'], complete: function () { var $masonry1 = jQuery('.kopa-blog-list-3 .masonry-list-wrapper > ul'); imagesLoaded($masonry1, function () { $masonry1.masonry({ columnWidth: 0, itemSelector: '.masonry-item' }); $masonry1.masonry('bindResize') }); } }]); /* ========================================================= 10. Scroll ============================================================ */ $('.scrollup').click(function(){ $("html, body").animate({ scrollTop: 0 }, 600); return false; }); $(window).scroll(function(){ if ($(this).scrollTop() > 1) { $('.social-panel-1').fadeIn(); } else { $('.social-panel-1').fadeOut(); } }); var s_ul1 = $(".social-panel-1").children(".social-panel-list"); $(".panel-control").click(function() { s_ul1.slideToggle("slow"); }); /* ========================================================= 11. Pie chart ============================================================ */ Modernizr.load([ { load: [kopa_variable.url.template_directory_uri + '/web/js/excanvas.compiled.js', kopa_variable.url.template_directory_uri + '/web/js/excanvas.js', kopa_variable.url.template_directory_uri + '/web/js/jquery.easypiechart.js'], complete: function () { var chart_1 = $('.kopa-skill-widget').find('.chart'); chart_1.easyPieChart({ barColor: '#fe670e', trackColor: "#282F42", lineWidth: '7', lineCap: "square", size: '180', scaleColor: false, animate: 1000, onStep: function(from, to, percent) { $(this.el).find('.percent').text(Math.round(percent)); } }); var chart = window.chart = chart_1.data('easyPieChart'); var chart_1 = $('.kopa-skill-1-widget').find('.chart'); chart_1.easyPieChart({ barColor: '#148BE1', trackColor: "#fff", lineWidth: '7', lineCap: "square", size: '180', scaleColor: false, animate: 1000, onStep: function(from, to, percent) { $(this.el).find('.percent').text(Math.round(percent)); } }); var chart = window.chart = chart_1.data('easyPieChart'); } } ]); /* ========================================================= 12. Portfolio Wookmark ============================================================ */ if ($('.kopa-portfolio-widget').length > 0) { Modernizr.load([{ load: [ kopa_variable.url.template_directory_uri + '/web/js/imagesloaded.js', kopa_variable.url.template_directory_uri + '/web/js/jquery.wookmark.js'], complete: function () { $('.kopa-portfolio-widget .portfolio-list-item').imagesLoaded(function() { // Prepare layout options. var options = { autoResize: true, // This will auto-update the layout when the browser window is resized. container: $('.kopa-portfolio-widget .portfolio-container'), // Optional, used for some extra CSS styling offset: 0, // Optional, the distance between grid items fillEmptySpace: true // Optional, fill the bottom of each column with widths of flexible height }; // Get a reference to your grid items. var handler = $('.kopa-portfolio-widget .portfolio-list-item li'), filters = $('.kopa-portfolio-widget .filters-options li'); // Call the layout function. handler.wookmark(options); /** * When a filter is clicked, toggle it's active state and refresh. */ var onClickFilter = function(event) { var item = $(event.currentTarget), activeFilters = []; if (!item.hasClass('active')) { filters.removeClass('active'); } item.toggleClass('active'); // Filter by the currently selected filter if (item.hasClass('active')) { activeFilters.push(item.data('filter')); } handler.wookmarkInstance.filter(activeFilters); } // Capture filter click events. filters.click(onClickFilter); }); } }]); }; /* ========================================================= 13. Magnific Popup ============================================================ */ if ($('.kopa-portfolio-widget').length > 0) { Modernizr.load([{ load: [ kopa_variable.url.template_directory_uri + '/web/js/jquery.magnific-popup.min.js'], complete: function () { $('.kopa-portfolio-widget .portfolio-list-item').magnificPopup({ delegate: '.popup-icon', type: 'image', tLoading: 'Loading image #%curr%...', mainClass: 'mfp-img-mobile', gallery: { enabled: true, navigateByImgClick: true, preload: [0,1] }, image: { tError: 'The image #%curr% could not be loaded.' } }); } }]); }; /* ============================================ 14. Match height =============================================== */ if ($('.article-list-1').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_1 = $('.article-list-1').find('.widget-content').children("ul"); post_1.each(function() { $(this).children('li').matchHeight(); }); } }]); }; if ($('.kopa-service-2-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_2 = $('.kopa-service-2-widget').find('.widget-content').children("ul"); post_2.each(function() { $(this).children('li').matchHeight(); }); } }]); }; if ($('.kopa-skill-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_3 = $('.kopa-skill-widget').find('.bot-content').children("ul"); post_3.each(function() { $(this).children('li').matchHeight(); }); } }]); }; if ($('.kopa-team-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_4 = $('.kopa-team-widget').find('.widget-content').children("ul"); post_4.each(function() { $(this).children('li').matchHeight(); }); } }]); }; if ($('.article-list-3').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_5 = $('.article-list-3').find('.widget-content').children("ul"); post_5.each(function() { $(this).children('li').matchHeight(); }); } }]); }; if ($('.kopa-skill-1-widget').length > 0) { Modernizr.load([{ load: [kopa_variable.url.template_directory_uri + '/web/js/jquery.matchHeight-min.js'], complete: function () { var post_6 = $('.kopa-skill-1-widget').find('.widget-content').children("ul"); post_6.each(function() { $(this).children('li').matchHeight(); }); } }]); }; /* ========================================================= 15. Search Box ============================================================ */ Modernizr.load([{ load: [ kopa_variable.url.template_directory_uri + '/web/js/classie.js', kopa_variable.url.template_directory_uri + '/web/js/uisearch.js'], complete: function () { new UISearch( document.getElementById( 'sb-search' ) ); } }]); }); /* ========================================================= 16. Video wrapper ============================================================ */ if (jQuery(".video-wrapper").length > 0) { Modernizr.load([{ load: '/web/js/jquery.fitvids.js', complete: function () { jQuery(".video-wrapper").fitVids(); } }]); };