262 lines
8.5 KiB
JavaScript
262 lines
8.5 KiB
JavaScript
(function ($) {
|
||
"use strict";
|
||
|
||
var $window = $(window);
|
||
var $body = $('body');
|
||
|
||
/* Preloader Effect */
|
||
$window.on('load', function(){
|
||
$(".preloader").fadeOut(600);
|
||
});
|
||
|
||
/* Sticky Header Optimizasyonu */
|
||
if($('.active-sticky-header').length){
|
||
var $headerSticky = $('header .header-sticky');
|
||
var $headerMain = $("header.main-header");
|
||
var cachedHeight = 0;
|
||
|
||
function setHeaderHeight(){
|
||
cachedHeight = $headerSticky.outerHeight();
|
||
$headerMain.css("height", cachedHeight);
|
||
}
|
||
|
||
$window.on('load resize', function(){
|
||
setHeaderHeight();
|
||
});
|
||
|
||
var ticking = false;
|
||
$window.on("scroll", { passive: true }, function() {
|
||
if (!ticking) {
|
||
window.requestAnimationFrame(function() {
|
||
var fromTop = $window.scrollTop();
|
||
if (fromTop > cachedHeight + 100) {
|
||
$headerSticky.addClass("hide");
|
||
} else {
|
||
$headerSticky.removeClass("hide");
|
||
}
|
||
if (fromTop > 600) {
|
||
$headerSticky.addClass("active");
|
||
} else {
|
||
$headerSticky.removeClass("active");
|
||
}
|
||
ticking = false;
|
||
});
|
||
ticking = true;
|
||
}
|
||
});
|
||
}
|
||
|
||
/* Slick Menu JS (Staggered) */
|
||
setTimeout(function() {
|
||
$('#menu').slicknav({
|
||
label : '',
|
||
prependTo : '.responsive-menu'
|
||
});
|
||
}, 50);
|
||
|
||
if($("a[href='#top']").length){
|
||
$(document).on("click", "a[href='#top']", function() {
|
||
$("html, body").animate({ scrollTop: 0 }, "slow");
|
||
return false;
|
||
});
|
||
}
|
||
|
||
/*
|
||
AGRESİF SIRALI BAŞLATMA (Aggressive Sequential Initialization)
|
||
Layout Thrashing'i önlemek için her bileşene kendi zaman dilimini veriyoruz.
|
||
*/
|
||
|
||
// 1. Hero Swiper (100ms)
|
||
setTimeout(function() {
|
||
if ($('.hero-swiper').length) {
|
||
new Swiper('.hero-swiper', {
|
||
speed: 1000, loop: true, autoplay: { delay: 5000 },
|
||
navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' },
|
||
pagination: { el: '.swiper-pagination', clickable: true }
|
||
});
|
||
}
|
||
}, 100);
|
||
|
||
// 2. Services Swiper (250ms)
|
||
setTimeout(function() {
|
||
if ($('.services-slider').length) {
|
||
new Swiper('.services-slider .swiper', {
|
||
slidesPerView: 1, speed: 1000, spaceBetween: 30, loop: true,
|
||
autoplay: { delay: 5000 },
|
||
pagination: { el: '.services-pagination', clickable: true },
|
||
breakpoints: { 768: { slidesPerView: 2 }, 991: { slidesPerView: 3 } }
|
||
});
|
||
}
|
||
}, 250);
|
||
|
||
// 3. Testimonial & Client Swipers (400ms)
|
||
setTimeout(function() {
|
||
if ($('.testimonial-slider').length) {
|
||
new Swiper('.testimonial-slider .swiper', {
|
||
slidesPerView: 1, speed: 1000, spaceBetween: 30, loop: true,
|
||
autoplay: { delay: 5000 },
|
||
pagination: { el: '.testimonial-pagination', clickable: true },
|
||
navigation: { nextEl: '.testimonial-button-next', prevEl: '.testimonial-button-prev' },
|
||
breakpoints: { 768: { slidesPerView: 2 }, 991: { slidesPerView: 3 } }
|
||
});
|
||
}
|
||
if ($('.hero-client-slider').length) {
|
||
new Swiper('.hero-client-slider .swiper', {
|
||
slidesPerView: 2, speed: 1000, spaceBetween: 30, loop: true,
|
||
autoplay: { delay: 5000 },
|
||
breakpoints: { 768: { slidesPerView: 4 }, 991: { slidesPerView: 5 } }
|
||
});
|
||
}
|
||
}, 400);
|
||
|
||
// 4. Diğer Sliderlar (550ms)
|
||
setTimeout(function() {
|
||
if ($('.hero-slider-layout .swiper').length) {
|
||
new Swiper('.hero-slider-layout .swiper', {
|
||
slidesPerView: 1, speed: 1000, loop: true, autoplay: { delay: 4000 },
|
||
pagination: { el: '.hero-pagination', clickable: true }
|
||
});
|
||
}
|
||
if ($('.service-single-slider').length) {
|
||
new Swiper('.service-single-slider .swiper', {
|
||
slidesPerView: 1, speed: 1000, spaceBetween: 30, loop: true,
|
||
autoplay: { delay: 5000 },
|
||
pagination: { el: '.service-pagination', clickable: true }
|
||
});
|
||
}
|
||
}, 550);
|
||
|
||
// 5. WOW.js Animasyonları (700ms)
|
||
setTimeout(function() {
|
||
if ($('.wow').length) {
|
||
new WOW().init();
|
||
}
|
||
}, 700);
|
||
|
||
// 6. GSAP & Metin Efektleri (850ms)
|
||
setTimeout(function() {
|
||
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: "restart none none reset" }
|
||
});
|
||
tl.set(container, { autoAlpha: 1 });
|
||
tl.from(container, 1.5, { xPercent: -100, ease: Power2.out });
|
||
tl.from(image, 1.5, { xPercent: 100, scale: 1.3, delay: -1.5, ease: Power2.out });
|
||
});
|
||
}
|
||
if ($('.split-text-anim').length) {
|
||
let st = $(".split-text-anim");
|
||
if (st.length) {
|
||
gsap.registerPlugin(SplitText, ScrollTrigger);
|
||
st.each(function(index, el) {
|
||
const mySplitText = new SplitText(el, { type: "lines,words,chars" });
|
||
const chars = mySplitText.chars;
|
||
gsap.from(chars, {
|
||
scrollTrigger: { trigger: el, start: "top 90%", end: "top 60%", markers: false, toggleActions: "play none none none" },
|
||
duration: 0.8, stagger: 0.02, opacity: 0, y: 20, ease: "power3.out"
|
||
});
|
||
});
|
||
}
|
||
}
|
||
}, 850);
|
||
|
||
// 7. Ağır Medya & Parallax (1000ms)
|
||
setTimeout(function() {
|
||
if ($('.parallaxie').length && $(window).width() > 991) {
|
||
$('.parallaxie').parallaxie({ speed: 0.55, offset: 0 });
|
||
}
|
||
if ($('#herovideo').length) {
|
||
$("#herovideo").YTPlayer();
|
||
}
|
||
if ($('.counter').length) {
|
||
$('.counter').counterUp({ delay: 6, time: 2000 });
|
||
}
|
||
if ($('.popup-video').length) {
|
||
$('.popup-video').magnificPopup({ type: 'iframe', mainClass: 'mfp-fade', removalDelay: 160, preloader: false, fixedContentPos: true });
|
||
}
|
||
if ($('.gallery-items').length) {
|
||
$('.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, opener: function(element) { return element.find('img'); } }
|
||
});
|
||
}
|
||
}, 1000);
|
||
|
||
/* Contact form validation */
|
||
var $contactform = $("#contactForm");
|
||
if($contactform.length) {
|
||
$contactform.validator({focus: false}).on("submit", function (event) {
|
||
if (!event.isDefaultPrevented()) {
|
||
event.preventDefault();
|
||
submitForm();
|
||
}
|
||
});
|
||
}
|
||
|
||
function submitForm(){
|
||
$.ajax({
|
||
type: "POST",
|
||
url: "form-process.php",
|
||
data: $contactform.serialize(),
|
||
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){
|
||
var msgClasses = valid ? "h4 text-success" : "h4 text-danger";
|
||
$("#msgSubmit").removeClass().addClass(msgClasses).text(msg);
|
||
}
|
||
|
||
/* Appointment form validation */
|
||
var $appointmentForm = $("#appointmentForm");
|
||
if($appointmentForm.length) {
|
||
$appointmentForm.validator({focus: false}).on("submit", function (event) {
|
||
if (!event.isDefaultPrevented()) {
|
||
event.preventDefault();
|
||
submitappointmentForm();
|
||
}
|
||
});
|
||
}
|
||
|
||
function submitappointmentForm(){
|
||
$.ajax({
|
||
type: "POST",
|
||
url: "form-appointment.php",
|
||
data: $appointmentForm.serialize(),
|
||
success : function(text){
|
||
if (text === "success"){
|
||
appointmentformSuccess();
|
||
} else {
|
||
appointmentsubmitMSG(false,text);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
function appointmentformSuccess(){
|
||
$appointmentForm[0].reset();
|
||
appointmentsubmitMSG(true, "Message Sent Successfully!")
|
||
}
|
||
|
||
function appointmentsubmitMSG(valid, msg){
|
||
var msgClasses = valid ? "h3 text-success" : "h3 text-danger";
|
||
$("#msgSubmit").removeClass().addClass(msgClasses).text(msg);
|
||
}
|
||
|
||
})(jQuery); |