Update CSS to correct mobile display of the mission image and JavaScript to ensure animations trigger correctly on page load and prevent spamming. Replit-Commit-Author: Agent Replit-Commit-Session-Id: d075e7a4-f667-4f28-b24a-2d29e4931850 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 5e85e2ff-f77c-4bb3-983c-222800a23422 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/e2c5cd18-6007-4bb1-a111-e14cc125923d/d075e7a4-f667-4f28-b24a-2d29e4931850/W9XaVKV Replit-Helium-Checkpoint-Created: true
346 lines
13 KiB
JavaScript
346 lines
13 KiB
JavaScript
(function ($) {
|
|
"use strict";
|
|
|
|
var $window = $(window);
|
|
var $body = $('body');
|
|
|
|
/* Preloader Effect */
|
|
$window.on('load', function(){
|
|
$(".preloader").fadeOut(600);
|
|
});
|
|
|
|
/* Sticky Header */
|
|
if($('.active-sticky-header').length){
|
|
$window.on('resize', function(){
|
|
setHeaderHeight();
|
|
});
|
|
|
|
function setHeaderHeight(){
|
|
$("header.main-header").css("height", $('header .header-sticky').outerHeight());
|
|
}
|
|
|
|
$(window).on("scroll", function() {
|
|
var fromTop = $(window).scrollTop();
|
|
setHeaderHeight();
|
|
var headerHeight = $('header .header-sticky').outerHeight()
|
|
$("header .header-sticky").toggleClass("hide", (fromTop > headerHeight + 100));
|
|
$("header .header-sticky").toggleClass("active", (fromTop > 600));
|
|
});
|
|
}
|
|
|
|
/* Slick Menu JS */
|
|
$('#menu').slicknav({
|
|
label : '',
|
|
prependTo : '.responsive-menu'
|
|
});
|
|
|
|
if($("a[href='#top']").length){
|
|
$("a[href='#top']").click(function() {
|
|
$("html, body").animate({ scrollTop: 0 }, "slow");
|
|
return false;
|
|
});
|
|
}
|
|
|
|
/* Hero Slider Layout JS */
|
|
const hero_slider_layout = new Swiper('.hero-slider-layout .swiper', {
|
|
slidesPerView : 1,
|
|
speed: 1000,
|
|
spaceBetween: 0,
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 4000,
|
|
},
|
|
pagination: {
|
|
el: '.hero-pagination',
|
|
clickable: true,
|
|
},
|
|
});
|
|
|
|
/* Core Value Image Carousel JS */
|
|
if ($('.core-value-slider').length) {
|
|
const core_value_slider = new Swiper('.core-value-slider .swiper', {
|
|
slidesPerView : 1,
|
|
speed: 1000,
|
|
spaceBetween: 10,
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 5000,
|
|
},
|
|
navigation: {
|
|
nextEl: '.core-value-button-next',
|
|
prevEl: '.core-value-button-prev',
|
|
},
|
|
});
|
|
}
|
|
|
|
/* Service Single Image Carousel JS */
|
|
if ($('.service-single-slider').length) {
|
|
const service_single_slider = new Swiper('.service-single-slider .swiper', {
|
|
slidesPerView : 1,
|
|
speed: 1000,
|
|
spaceBetween: 10,
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 5000,
|
|
},
|
|
navigation: {
|
|
nextEl: '.service-single-button-next',
|
|
prevEl: '.service-single-button-prev',
|
|
},
|
|
});
|
|
}
|
|
|
|
/* Ministry Single Image Carousel JS */
|
|
if ($('.ministry-single-slider').length) {
|
|
const ministry_single_slider = new Swiper('.ministry-single-slider .swiper', {
|
|
slidesPerView : 1,
|
|
speed: 1000,
|
|
spaceBetween: 10,
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 5000,
|
|
},
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
clickable: true,
|
|
},
|
|
});
|
|
}
|
|
|
|
/* Skill Bar */
|
|
if ($('.skills-progress-bar').length) {
|
|
$('.skills-progress-bar').waypoint(function() {
|
|
$('.skillbar').each(function() {
|
|
$(this).find('.count-bar').animate({
|
|
width:$(this).attr('data-percent')
|
|
},2000);
|
|
});
|
|
},{
|
|
offset: '50%'
|
|
});
|
|
}
|
|
|
|
/* Youtube Background Video JS */
|
|
if ($('#herovideo').length) {
|
|
var myPlayer = $("#herovideo").YTPlayer();
|
|
}
|
|
|
|
/* Audio JS */
|
|
const player = new Plyr('#player');
|
|
|
|
/* Init Counter */
|
|
if ($('.counter').length) {
|
|
$('.counter').counterUp({ delay: 6, time: 3000 });
|
|
}
|
|
|
|
/* Image Reveal Animation */
|
|
if ($('.reveal').length) {
|
|
gsap.registerPlugin(ScrollTrigger);
|
|
let revealContainers = document.querySelectorAll(".reveal");
|
|
revealContainers.forEach((container) => {
|
|
let image = container.querySelector("img");
|
|
let tl = gsap.timeline({
|
|
scrollTrigger: {
|
|
trigger: container,
|
|
toggleActions: "play none none none"
|
|
}
|
|
});
|
|
tl.set(container, {
|
|
autoAlpha: 1
|
|
});
|
|
tl.from(container, 1, {
|
|
xPercent: -100,
|
|
ease: Power2.out
|
|
});
|
|
tl.from(image, 1, {
|
|
xPercent: 100,
|
|
scale: 1,
|
|
delay: -1,
|
|
ease: Power2.out
|
|
});
|
|
});
|
|
}
|
|
|
|
/* Text Effect Animation */
|
|
if ($('.text-anime-style-1').length) {
|
|
let staggerAmount = 0.05,
|
|
translateXValue = 0,
|
|
delayValue = 0.5,
|
|
animatedTextElements = document.querySelectorAll('.text-anime-style-1');
|
|
|
|
animatedTextElements.forEach((element) => {
|
|
let animationSplitText = new SplitText(element, { type: "chars, words" });
|
|
gsap.from(animationSplitText.words, {
|
|
duration: 1,
|
|
delay: delayValue,
|
|
x: 20,
|
|
autoAlpha: 0,
|
|
stagger: staggerAmount,
|
|
scrollTrigger: { trigger: element, start: "top 85%" },
|
|
});
|
|
});
|
|
}
|
|
|
|
if ($('.text-anime-style-2').length) {
|
|
let staggerAmount = 0.03,
|
|
translateXValue = 20,
|
|
delayValue = 0.1,
|
|
easeType = "power2.out",
|
|
animatedTextElements = document.querySelectorAll('.text-anime-style-2');
|
|
|
|
animatedTextElements.forEach((element) => {
|
|
let animationSplitText = new SplitText(element, { type: "chars, words" });
|
|
gsap.from(animationSplitText.chars, {
|
|
duration: 1,
|
|
delay: delayValue,
|
|
x: translateXValue,
|
|
autoAlpha: 0,
|
|
stagger: staggerAmount,
|
|
ease: easeType,
|
|
scrollTrigger: { trigger: element, start: "top 85%"},
|
|
});
|
|
});
|
|
}
|
|
|
|
if ($('.text-anime-style-3').length) {
|
|
let animatedTextElements = document.querySelectorAll('.text-anime-style-3');
|
|
|
|
animatedTextElements.forEach((element) => {
|
|
//Reset if needed
|
|
if (element.animation) {
|
|
element.animation.progress(1).kill();
|
|
element.split.revert();
|
|
}
|
|
|
|
element.split = new SplitText(element, {
|
|
type: "lines,words,chars",
|
|
linesClass: "split-line",
|
|
});
|
|
gsap.set(element, { perspective: 400 });
|
|
|
|
gsap.set(element.split.chars, {
|
|
opacity: 0,
|
|
x: "50",
|
|
});
|
|
|
|
element.animation = gsap.to(element.split.chars, {
|
|
scrollTrigger: { trigger: element, start: "top 90%" },
|
|
x: "0",
|
|
y: "0",
|
|
rotateX: "0",
|
|
opacity: 1,
|
|
duration: 1,
|
|
ease: Back.easeOut,
|
|
stagger: 0.02,
|
|
});
|
|
});
|
|
}
|
|
|
|
/* Parallaxie js */
|
|
var $parallaxie = $('.parallaxie');
|
|
if($parallaxie.length && ($window.width() > 991))
|
|
{
|
|
if ($window.width() > 768) {
|
|
$parallaxie.parallaxie({
|
|
speed: 0.55,
|
|
offset: 0,
|
|
});
|
|
}
|
|
}
|
|
|
|
/* Zoom Gallery screenshot */
|
|
$('.gallery-items').magnificPopup({
|
|
delegate: 'a',
|
|
type: 'image',
|
|
closeOnContentClick: false,
|
|
closeBtnInside: false,
|
|
mainClass: 'mfp-with-zoom',
|
|
image: {
|
|
verticalFit: true,
|
|
},
|
|
gallery: {
|
|
enabled: true
|
|
},
|
|
zoom: {
|
|
enabled: true,
|
|
duration: 300, // don't foget to change the duration also in CSS
|
|
opener: function(element) {
|
|
return element.find('img');
|
|
}
|
|
}
|
|
});
|
|
|
|
/* Contact form validation */
|
|
var $contactform = $("#contactForm");
|
|
$contactform.validator({focus: false}).on("submit", function (event) {
|
|
if (!event.isDefaultPrevented()) {
|
|
event.preventDefault();
|
|
submitForm();
|
|
}
|
|
});
|
|
|
|
function submitForm(){
|
|
/* Initiate Variables With Form Content*/
|
|
var fname = $("#fname").val();
|
|
var lname = $("#lname").val();
|
|
var email = $("#email").val();
|
|
var phone = $("#phone").val();
|
|
var message = $("#msg").val();
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "form-process.php",
|
|
data: "fname=" + fname + "&lname=" + lname + "&email=" + email + "&phone=" + phone + "&message=" + message,
|
|
success : function(text){
|
|
if (text == "success"){
|
|
formSuccess();
|
|
} else {
|
|
submitMSG(false,text);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function formSuccess(){
|
|
$contactform[0].reset();
|
|
submitMSG(true, "Message Sent Successfully!")
|
|
}
|
|
|
|
function submitMSG(valid, msg){
|
|
if(valid){
|
|
var msgClasses = "h3 text-success";
|
|
} else {
|
|
var msgClasses = "h3 text-danger";
|
|
}
|
|
$("#msgSubmit").removeClass().addClass(msgClasses).text(msg);
|
|
}
|
|
/* Contact form validation end */
|
|
|
|
/* Animated Wow Js */
|
|
var wowInstance = new WOW({
|
|
mobile: true,
|
|
live: false,
|
|
offset: 0,
|
|
scrollContainer: null
|
|
});
|
|
wowInstance.init();
|
|
/* Re-trigger after page fully loads so elements already in the viewport
|
|
on scroll-restore also animate (fixes "nothing shows on reload" issue) */
|
|
$(window).on('load', function () {
|
|
setTimeout(function () {
|
|
window.dispatchEvent(new Event('scroll'));
|
|
}, 200);
|
|
});
|
|
|
|
/* Popup Video */
|
|
if ($('.popup-video').length) {
|
|
$('.popup-video').magnificPopup({
|
|
type: 'iframe',
|
|
mainClass: 'mfp-fade',
|
|
removalDelay: 160,
|
|
preloader: false,
|
|
fixedContentPos: true
|
|
});
|
|
}
|
|
|
|
})(jQuery); |