http://thkp-c.com/assets/js/functions.js

1/*global jQuery */
2/* Contents
3// ------------------------------------------------>
4	1.  Background INSERT
5	2.  NAVBAR FIXED
6	3.	NAVBAR TOGGLE
7	4.  NAVBAR SCROLL TO
8	5.  NAVBAR SCROLLING SECTION
9    6.  AJAX MAILCHIMP
10    7.  AJAX CAMPAIGN MONITOR
11	8.  PRICING SWITCHER
12    9.  COUNTER UP
13    10. OWL CAROUSEL
14    11. MAGNIFIC POPUP VIDEO
15    12. WOW
16    13. AJAX CONTACT FORM
17*/
18(function ($) {
19    "use strict";
20
21    /* ------------------  Background INSERT ------------------ */
22
23    var $bgSection = $(".bg-section");
24
25    $bgSection.each(function () {
26        var bgSrc = $(this).children("img").attr("src");
27        var bgUrl = 'url(' + bgSrc + ')';
28        $(this).parent().css("backgroundImage", bgUrl);
29        $(this).parent().addClass("bg-section");
30        $(this).remove();
31    });
32
33    /* ------------------ NAVBAR FIXED ------------------ */
34
35    $(window).scroll(function () {
36        /* affix after scrolling 100px */
37        if (
38            $(document).scrollTop() > $(window).height() ||
39            $(document).scrollTop() > 105
40        ) {
41            $(".navbar-sticky").addClass("navbar-fixed");
42        } else {
43            $(".navbar-sticky").removeClass("navbar-fixed");
44        }
45    });
46
47    /* ------------------  NAVBAR TOGGLE ------------------ */
48
49    $('.navbar-toggler').on('click', function () {
50        $('.navbar-toggler-icon').toggleClass('active');
51    });
52
53    /* ------------------  NAVBAR SCROLL TO ------------------ */
54
55    var aScroll = $('.nav-item .nav-link'),
56        $navbarCollapse = $('.navbar-collapse');
57    aScroll.on('click', function (event) {
58        var target = $($(this).attr('href'));
59        $(this).parent(".nav-item").siblings().removeClass('active');
60        $(this).parent('.nav-item').addClass('active');
61
62        if (target.length > 0) {
63            event.preventDefault();
64            $('html, body').animate({
65                scrollTop: target.offset().top - 100
66            }, 1000);
67        }
68
69        // If click link and navabr is show
70        if ($('.navbar-collapse').hasClass('show')) {
71            $('.navbar-collapse').toggleClass('show');
72            $('.navbar-toggler-icon').toggleClass('active');
73            $('.navbar-toggler').toggleClass('collapsed');
74        }
75    });
76
77    /* ------------------ NAVBAR SCROLLING SECTION ------------------ */
78
79    var $section = $('section'),
80        $bodyScroll = $('.body-scroll');
81    if ($bodyScroll.length > 0) {
82        $(window).on("scroll", function () {
83            $section.each(function () {
84                var sectionID = $(this).attr("id"),
85                    sectionTop = $(this).offset().top - 100,
86                    sectionHight = $(this).outerHeight(),
87                    wScroll = $(window).scrollTop(),
88                    $navHref = $("a[href='#" + sectionID + "']"),
89                    $nav = $('.navbar-nav').find($navHref).parent();
90                if (wScroll > sectionTop - 1 && wScroll < sectionTop + sectionHight - 1) {
91                    $nav.addClass('active');
92                    $nav.siblings().removeClass('active');
93                }
94            });
95        });
96    }
97
98    /* ------------------  AJAX MAILCHIMP ------------------ */
99
100    $('.mailchimp').ajaxChimp({
101        url: "http://wplly.us5.list-manage.com/subscribe/post?u=91b69df995c1c90e1de2f6497&id=aa0f2ab5fa", //Replace with your own mailchimp Campaigns URL.
102        callback: chimpCallback
103
104    });
105
106    function chimpCallback(resp) {
107        if (resp.result === 'success') {
108            $('.subscribe-alert').html('<h5 class="alert alert-success">' + resp.msg + '</h5>').fadeIn(1000);
109            //$('.subscribe-alert').delay(6000).fadeOut();
110
111        } else if (resp.result === 'error') {
112            $('.subscribe-alert').html('<h5 class="alert alert-danger">' + resp.msg + '</h5>').fadeIn(1000);
113        }
114    }
115
116    /* ------------------  AJAX CAMPAIGN MONITOR  ------------------ */
117
118    $('#campaignmonitor').submit(function (e) {
119        e.preventDefault();
120        $.getJSON(
121            this.action + "?callback=?",
122            $(this).serialize(),
123            function (data) {
124                if (data.Status === 400) {
125                    alert("Error: " + data.Message);
126                } else { // 200
127                    alert("Success: " + data.Message);
128                }
129            });
130    });

131
132    /* ------------------  PRICING SWITCHER  ------------------ */
133
134    var $pricingSwitcher = $('.pricing-switcher'),
135        $pricingLabel = $('.pricing-switcher label'),
136        $pricingIndicator = $('.pricing-switcher .indicator'),
137        $pricingball = $('.pricing-switcher .indicator .ball'),
138        $pricingContainer = $('.pricing-container'),
139        $pricingPanel = $('.pricing-panel');
140
141    if ($pricingSwitcher.length > 0) {
142
143        // If clicked on swaitcher label
144        $pricingLabel.on('click', function () {
145            $(this).siblings('label').removeClass('active');
146            $(this).addClass('active');
147            $pricingContainer.toggleClass('monthly yearly');
148            $pricingPanel.toggleClass('hidden visible');
149            $pricingball.toggleClass('monthly yearly');
150        });
151
152        // If cliced on indicator
153        $pricingIndicator.on('click', function () {
154            $pricingball.toggleClass('monthly yearly');
155            $pricingContainer.toggleClass('monthly yearly');
156            $pricingLabel.toggleClass('active');
157            $pricingPanel.toggleClass('hidden visible');
158        });
159    }
160
161    /* ------------------  COUNTER UP ------------------ */
162
163    $(".counting").counterUp({
164        delay: 10,
165        time: 1000
166    });
167
168    /* ------------------ OWL CAROUSEL ------------------ */
169
170    $(".owl-carousel").each(function () {
171        var $Carousel = $(this);
172        $Carousel.owlCarousel({
173            loop: $Carousel.data('loop'),
174            autoplay: $Carousel.data("autoplay"),
175            margin: $Carousel.data('space'),
176            nav: $Carousel.data('nav'),
177            dots: $Carousel.data('dots'),
178            dotsSpeed: $Carousel.data('speed'),
179            responsive: {
180                0: {
181                    items: 1
182                },
183                600: {
184                    items: $Carousel.data('slide-res')
185                },
186                1000: {
187                    items: $Carousel.data('slide'),
188                }
189            }
190        });
191    });
192
193    /* ------------------  MAGNIFIC POPUP VIDEO ------------------ */
194
195    $('.popup-video').magnificPopup({
196        disableOn: 700,
197        mainClass: 'mfp-fade',
198        removalDelay: 0,
199        preloader: false,
200        fixedContentPos: false,
201        type: 'iframe',
202        iframe: {
203            markup: '<div class="mfp-iframe-scaler">' +
204                '<div class="mfp-close"></div>' +
205                '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>' +
206                '</div>',
207            patterns: {
208                youtube: {
209                    index: 'youtube.com/',
210                    id: 'v=',
211                    src: '//www.youtube.com/embed/%id%?autoplay=1'
212                }
213            },
214            srcAction: 'iframe_src',
215        }
216    });
217
218    /* ------------------  WOW ------------------ */
219
220    var wow = new WOW({
221        boxClass: 'wow',
222        animateClass: 'animated',
223        offset: 50,
224        mobile: false,
225        live: true
226
227    });
228    wow.init();
229
230    /* ------------------  AJAX CONTACT FORM  ------------------ */
231
232    var contactForm = $(".contactForm"),
233        contactResult = $('.contact-result');
234
235    contactForm.validate({
236        debug: false,
237        submitHandler: function (contactForm) {
238            $(contactResult, contactForm).html('Please Wait...');
239            $.ajax({

240                type: "POST",
241                url: "assets/php/contact.php",
242                data: $(contactForm).serialize(),
243                timeout: 20000,
244                success: function (msg) {
245                    window.location.href = "thanks-you.html";
246                    // Active this line if you need to add message alerts instead of Thanks You page
247                    //$(contactResult, contactForm).html('<div class="alert alert-success" role="alert"><strong>Thank you. We will contact you shortly.</strong></div>').delay(3000).fadeOut(2000);
248                },
249                error: $('.thanks').show()
250            });
251            return false;
252        }
253    });
254
255    contactForm.removeAttr("novalidate");
256
257}(jQuery));