https://whoamitoyou.com/js/main.js

1/**
2 * @Package: Caliber - Multi Purpose HTML Template
3 * @Since: Caliber 1.0
4 * This file is part of Caliber - Multi Purpose HTML package.
5 */
6
7jQuery(function ($) {
8  "use strict";
9
10  var CALIBER_SETTINGS = window.CALIBER_SETTINGS || {};
11
12  /*--------------------------------
13        Gallery Filtering (MixItUp)
14     --------------------------------*/
15
16  CALIBER_SETTINGS.galleryFiltering = function () {
17    if ($.isFunction($.fn.mixItUp)) {
18      $("#gallery-mixitup").mixItUp({
19        animation: {
20          duration: 480,
21          effects: "fade translateX(10%) scale(0.25) stagger(58ms)",
22          easing: "ease",
23        },
24
25        selectors: {
26          target: ".filter-item",
27          filter: ".filter-mixitup .filter",
28        },
29      });
30    }
31  };
32
33  /*--------------------------------
34        Gallery Filtering (MixItUp)
35     --------------------------------*/
36
37  CALIBER_SETTINGS.fancyBox = function () {
38    if ($.isFunction($.fn.fancybox)) {
39      $(".fancybox").fancybox();
40    }
41  };
42
43  /*--------------------------------
44        Parallax Scrolling
45     --------------------------------*/
46  CALIBER_SETTINGS.parallaxScrolling = function () {
47    if ($.isFunction($.fn.localScroll)) {
48      $("#parallax-nav-primary").localScroll(800);
49      $("#parallax-nav-dark").localScroll(800);
50      $("#parallax-mobile-menu").localScroll(800);
51    }
52
53    if ($.isFunction($.fn.parallax)) {
54      $("#header").parallax("50%", 0.1);
55      $("#about").parallax("50%", 0.1);
56      $("#team").parallax("50%", 0.1);
57      $("#services").parallax("50%", 0.1);
58      $("#capabilities").parallax("50%", 0.1);
59      $("#portfolio").parallax("50%", 0.1);
60      $("#blog").parallax("50%", 0.1);
61      $("#contact").parallax("50%", 0.1);
62
63      //.parallax(xPosition, speedFactor, outerHeight) options:
64      //xPosition - Horizontal position of the element
65      //inertia - speed to move relative to vertical scroll. Example: 0.1 is one tenth the speed of scrolling, 2 is twice the speed of scrolling
66      //outerHeight (true/false) - Whether or not jQuery should use it's outerHeight option to determine when a section is in the viewport
67    }
68  };
69
70  /*--------------------------------
71        Fixed Header Menu for Parallax
72     --------------------------------*/
73
74  CALIBER_SETTINGS.fixedParallaxHeader = function () {
75    if ($.isFunction($.fn.parallax)) {
76      //  alert($(window).scrollTop() +" "+$("#slides").height());
77      if ($(window).scrollTop() >= 50) {
78        $(".header-parallax").addClass("fixed-top");
79      } else {
80        $(".header-parallax").removeClass("fixed-top");
81      }
82    }
83  };
84
85  /*--------------------------------
86        Twitter Carousel
87     --------------------------------*/
88
89  CALIBER_SETTINGS.twitterCarousel = function () {
90    if ($.isFunction($.fn.owlCarousel)) {
91      $("#twitter-carousel").owlCarousel({
92        autoPlay: 3000,
93        stopOnHover: true,
94        navigation: true,
95        pagination: false,
96        navigationText: [
97          "<i class='mdi mdi-chevron-left'>",
98          "<i class='mdi mdi-chevron-right'>",
99        ],
100        paginationSpeed: 1000,
101        goToFirstSpeed: 2000,
102        singleItem: true,
103        autoHeight: true,
104        transitionStyle: "fade",
105      });
106    }
107  };
108
109  /*--------------------------------
110        Image Carousel (Made for you Section)
111     --------------------------------*/
112
113  CALIBER_SETTINGS.imageCarousel = function () {
114    if ($.isFunction($.fn.owlCarousel)) {
115      $("#image-slider").owlCarousel({
116        autoPlay: 5000,
117        stopOnHover: true,
118        navigation: false,
119        pagination: true,
120        paginationSpeed: 1000,
121        goToFirstSpeed: 2000,
122        singleItem: true,
123        autoHeight: true,
124        lazyLoad: true,
125        transitionStyle: "fade",
126      });
127    }
128  };
129
130  /*--------------------------------
131        Slider Header Carousel
132     --------------------------------*/
133
134  CALIBER_SETTINGS.headerSliderCarousel = function () {
135    if ($.isFunction($.fn.owlCarousel)) {
136      $("#header-slider").owlCarousel({
137        autoPlay: 5000,
138        stopOnHover: true,
139        navigation: true,
140        navigationText: [
141          "<i class='mdi mdi-chevron-left'>",
142          "<i class='mdi mdi-chevron-right'>",
143        ],
144        pagination: false,
145        paginationSpeed: 1000,
146        goToFirstSpeed: 2000,
147        singleItem: true,
148        lazyLoad: true,
149        autoHeight: true,
150        transitionStyle: "fade",
151      });
152    }
153  };
154
155  /*--------------------------------
156        Slider Header Carousel
157     --------------------------------*/
158
159  CALIBER_SETTINGS.inViewPortAnimation = function () {
160    if ($.isFunction($.fn.viewportChecker)) {
161      $(".inviewport")
162        .addClass("hiddenthis")
163        .viewportChecker({
164          classToAdd: "visiblethis",
165          offset: 0,
166          callbackFunction: function (elem) {
167            var effect = $(elem).attr("data-effect");
168            $(elem).addClass(effect);
169          },
170        });
171    }
172  };
173
174  /*--------------------------------
175        Mobile Menu
176     --------------------------------*/
177
178  CALIBER_SETTINGS.mobileMenu = function () {
179    $(".menu-toggle").on("click", function () {
180      $(".menu-mobile.cssmenu").toggleClass("open");
181      $(this).toggleClass("mdi-menu mdi-close");
182    });

183
184    $(".menu-mobile.cssmenu li.has-sub a").on("click", function (e) {
185      $(this).parent().children("ul").toggleClass("open");
186      $(this).find("i").toggleClass("open");
187      e.stopPropagation();
188    });
189  };
190
191  /*--------------------------------
192        Contact AJAX Form
193     --------------------------------*/
194
195  CALIBER_SETTINGS.validateContactForm = function () {
196    $("#c_name").keyup(function () {
197      var name = $("#c_name").val();
198      if (name == null || name == "") {
199        $("#c_name").removeClass("green");
200        console.log(name + "name err");
201      } else {
202        $("#c_name").addClass("green");
203        console.log("name done");
204      }
205      enable_form();
206    });
207
208    $("#c_email").keyup(function () {
209      var email = $("#c_email").val();
210      var atpos = email.indexOf("@");
211      var dotpos = email.lastIndexOf(".");
212
213      if (
214        email == null ||
215        email == "" ||
216        atpos < 1 ||
217        dotpos < atpos + 2 ||
218        dotpos + 2 >= email.length
219      ) {
220        $("#c_email").removeClass("green");
221        console.log("email err");
222      } else {
223        $("#c_email").addClass("green");
224        console.log("email done");
225      }
226      enable_form();
227    });
228
229    $("#c_phone").keyup(function () {
230      var phone = $("#c_phone").val();
231      var phoneRE = /^[\d\.\-]+$/;
232
233      if (
234        phone == null ||
235        phone == "" ||
236        phone.length < 10 ||
237        !phoneRE.test(phone)
238      ) {
239        $("#c_phone").removeClass("green");
240        console.log("phone err");
241      } else {
242        $("#c_phone").addClass("green");
243        console.log("phone done");
244      }
245      enable_form();
246    });
247
248    $("#c_message").keyup(function () {
249      var message = $("#c_message").val();
250      if (message == null || message == "" || message.length < 9) {
251        $("#c_message").removeClass("green");
252        console.log("message err");
253      } else {
254        $("#c_message").addClass("green");
255        console.log("message done");
256      }
257
258      enable_form();
259    });
260  };
261
262  CALIBER_SETTINGS.sendMessageAJAX = function () {
263    $("#c_send").on("click", function () {
264      if ($(this).hasClass("disabled")) {
265        $("#response_email").html(
266          "Please Fill in your details correctly and try again",
267        );
268      } else {
269        var email = $("#c_email").val();
270        var name = $("#c_name").val();
271        var phone = $("#c_phone").val();
272        var msg = $("#c_message").val();
273
274        var xmlhttp;
275        if (window.XMLHttpRequest) {
276          // code for IE7+, Firefox, Chrome, Opera, Safari
277          xmlhttp = new XMLHttpRequest();
278        } else {
279          // code for IE6, IE5
280          xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
281        }
282        xmlhttp.onreadystatechange = function () {
283          if (xmlhttp.readyState == 1) {
284            $("#response_email").html("Sending...");
285          }
286          if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
287            $("#response_email").html(xmlhttp.responseText);
288          }
289        };
290        xmlhttp.open("POST", "maintainemail.php", true);
291        xmlhttp.setRequestHeader(
292          "Content-type",
293          "application/x-www-form-urlencoded",
294        );
295        xmlhttp.send(
296          "email=" +
297            encodeURIComponent(email) +
298            "&name=" +
299            encodeURIComponent(name) +
300            "&phone=" +
301            encodeURIComponent(phone) +
302            "&msg=" +
303            encodeURIComponent(msg),
304        );
305        return false;
306      }
307    });
308  };
309
310  function enable_form() {
311    if (
312      $("#c_name").hasClass("green") &&
313      $("#c_phone").hasClass("green") &&
314      $("#c_email").hasClass("green") &&
315      $("#c_message").hasClass("green")
316    ) {
317      $("#c_send").removeClass("disabled");
318      console.log("enabled");
319    } else {
320      $("#c_send").addClass("disabled");
321      console.log("disabled");
322    }
323  }
324
325  CALIBER_SETTINGS.isotopeMasonaryGallery = function () {
326    if ($.isFunction($.fn.isotope)) {
327      var $container = $("#gallery-isotope");
328      $container.isotope({
329        filter: "*",
330        layoutMode: "sloppyMasonry",
331        animationOptions: {
332          duration: 750,
333          easing: "linear",
334          queue: false,
335        },
336      });
337
338      $(".filter-isotope .filter").click(function () {
339        $(".filter-isotope .filter.active").removeClass("active");
340        $(this).addClass("active");
341
342        var selector = $(this).attr("data-filter");
343        $container.isotope({
344          filter: selector,
345          layoutMode: "sloppyMasonry",
346          animationOptions: {
347            duration: 750,
348            easing: "linear",
349            queue: false,
350          },
351        });
352        return false;
353      });
354    }
355  };
356
357  /*--------------------------------
358        Settings Panel
359     --------------------------------*/
360
361  CALIBER_SETTINGS.settingsPanel = function () {
362    $(".settings-panel .toggle").on("click", function () {
363      $(".settings-panel").toggleClass("collapsed");
364      $(this).toggleClass("mdi-settings mdi-close");
365    });

366
367    $(".settings-panel .style div").on("click", function () {
368      var sections = $(this).attr("data-sections");
369      $("#settings-response").load("settings.php", { sections: sections });
370      window.location.reload();
371    });
372
373    $(".settings-panel .colors div").on("click", function () {
374      var color = $(this).attr("data-color");
375      var colorfile = "";
376
377      if (color == "yellow") {
378        colorfile = "";
379      } else {
380        colorfile = "." + color;
381      }
382
383      $("#main-style").attr("href", "css/style" + colorfile + ".css");
384      $(".settings-panel .colors div").removeClass("active");
385      $(this).addClass("active");
386
387      $("#settings-response").load("settings.php", { color: color });
388
389      $(".style-dependent").each(function () {
390        var src = $(this).attr("src");
391        var oldsrc = src;
392        src = src.replace("yellow", color);
393        src = src.replace("red", color);
394        src = src.replace("orange", color);
395        src = src.replace("blue", color);
396        src = src.replace("green", color);
397
398        if (src != oldsrc) {
399          $(this).attr("src", src);
400        }
401      });
402    });
403  };
404
405  /******************************
406     initialize respective scripts 
407     *****************************/
408  $(document).ready(function () {
409    CALIBER_SETTINGS.galleryFiltering();
410    CALIBER_SETTINGS.twitterCarousel();
411    CALIBER_SETTINGS.imageCarousel();
412    CALIBER_SETTINGS.headerSliderCarousel();
413    CALIBER_SETTINGS.inViewPortAnimation();
414    //CALIBER_SETTINGS.mobileMenu();
415    CALIBER_SETTINGS.validateContactForm();
416    CALIBER_SETTINGS.sendMessageAJAX();
417    CALIBER_SETTINGS.fancyBox();
418    CALIBER_SETTINGS.parallaxScrolling();
419    CALIBER_SETTINGS.settingsPanel();
420  });
421
422  $(window).scroll(function () {
423    CALIBER_SETTINGS.fixedParallaxHeader();
424  });
425
426  $(window).resize(function () {});
427
428  $(window).load(function () {
429    CALIBER_SETTINGS.isotopeMasonaryGallery();
430  });
431});