/**
* Popular Computer - Educational Institute Website
* Version: 1.0
*/
(function($) {
"use strict";
// Preloader
$(window).on('load', function() {
$('.preloader').fadeOut(1000);
});
// Custom Cursor
const cursor = document.querySelector('.custom-cursor');
const cursorDot = document.querySelector('.custom-cursor-dot');
document.addEventListener('mousemove', function(e) {
cursor.style.left = e.clientX + 'px';
cursor.style.top = e.clientY + 'px';
cursorDot.style.left = e.clientX + 'px';
cursorDot.style.top = e.clientY + 'px';
});
// Animated Background
function createAnimatedBackground() {
const animatedBg = document.querySelector('.animated-background');
if (!animatedBg) return;
const count = 15;
for (let i = 0; i < count; i++) {
const span = document.createElement('span');
const size = Math.random() * 50 + 10;
const posX = Math.random() * window.innerWidth;
const delay = Math.random() * 15;
const duration = Math.random() * 15 + 10;
span.style.width = size + 'px';
span.style.height = size + 'px';
span.style.left = posX + 'px';
span.style.animationDelay = delay + 's';
span.style.animationDuration = duration + 's';
span.style.opacity = Math.random() * 0.5 + 0.1;
animatedBg.appendChild(span);
}
}
createAnimatedBackground();
// Back to Top Button
$(window).on('scroll', function() {
if ($(this).scrollTop() > 300) {
$('#backToTop').addClass('active');
} else {
$('#backToTop').removeClass('active');
}
});
$('#backToTop').on('click', function(e) {
e.preventDefault();
$('html, body').animate({scrollTop: 0}, 800);
});
// Smooth Scroll for Anchor Links
$('a[href^="#"]:not([href="#"])').on('click', function(e) {
e.preventDefault();
const target = $(this.getAttribute('href'));
if (target.length) {
$('html, body').animate({
scrollTop: target.offset().top - 80
}, 800);
}
});
// Initialize Bootstrap Tooltips
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
// Initialize Bootstrap Popovers
var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
return new bootstrap.Popover(popoverTriggerEl);
});
// Testimonial Slider
if ($('.testimonial-slider').length) {
$('.testimonial-slider').slick({
dots: true,
infinite: true,
speed: 500,
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 5000,
arrows: false,
centerMode: true,
centerPadding: '0px',
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 2,
centerMode: true
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 1,
centerMode: true
}
}
]
});
}
// Counter Up
if ($('.counter').length) {
$('.counter').counterUp({
delay: 10,
time: 2000
});
}
// Course Slider
if ($('.course-slider').length) {
$('.course-slider').slick({
dots: false,
infinite: true,
speed: 500,
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 5000,
arrows: true,
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-angle-left"></i></button>',
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-angle-right"></i></button>',
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 2
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 1
}
}
]
});
}
// Animate on Scroll Initialization
function initAOS() {
// Check if elements with animate.css classes exist
const animatedElements = document.querySelectorAll('.animate__animated');
if (animatedElements.length > 0) {
// Add waypoints to trigger animations when scrolled into view
animatedElements.forEach(function(element) {
new Waypoint({
element: element,
handler: function() {
const animationClass = element.className.split('animate__animated ')[1].split(' ')[0];
element.classList.add('animate__' + animationClass);
this.destroy();
},
offset: '90%'
});
});
}
}
// Initialize animations
initAOS();
// Mobile Menu Toggle
$('.navbar-toggler').on('click', function() {
$(this).toggleClass('active');
});
// Sticky Header
$(window).on('scroll', function() {
if ($(this).scrollTop() > 100) {
$('.header').addClass('sticky');
} else {
$('.header').removeClass('sticky');
}
});
// Form Validation
const forms = document.querySelectorAll('.needs-validation');
Array.from(forms).forEach(form => {
form.addEventListener('submit', event => {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false);
});
// Password Toggle
$('.password-toggle').on('click', function() {
const passwordInput = $(this).siblings('input');
const icon = $(this).find('i');
if (passwordInput.attr('type') === 'password') {
passwordInput.attr('type', 'text');
icon.removeClass('fa-eye').addClass('fa-eye-slash');
} else {
passwordInput.attr('type', 'password');
icon.removeClass('fa-eye-slash').addClass('fa-eye');
}
});
// Course Filter
$('.course-filter-btn').on('click', function() {
const filterValue = $(this).attr('data-filter');
$('.course-filter-btn').removeClass('active');
$(this).addClass('active');
if (filterValue === 'all') {
$('.course-card').show(300);
} else {
$('.course-card').hide(300);
$('.course-card[data-category="' + filterValue + '"]').show(300);
}
});
// Gallery Lightbox
if ($('.gallery-item').length) {
$('.gallery-item').magnificPopup({
type: 'image',
gallery: {
enabled: true
}
});
}
// FAQ Accordion
$('.faq-item-header').on('click', function() {
$(this).parent().toggleClass('active');
$(this).parent().find('.faq-item-body').slideToggle();
});
// Enrollment Form Steps
let currentStep = 1;
const totalSteps = $('.enrollment-step').length;
$('.next-step').on('click', function() {
const currentStepForm = $('#step-' + currentStep);
// Validate current step
let isValid = true;
currentStepForm.find('input, select, textarea').each(function() {
if ($(this).prop('required') && !$(this).val()) {
isValid = false;
$(this).addClass('is-invalid');
} else {
$(this).removeClass('is-invalid');
}
});
if (!isValid) return;
// Move to next step
if (currentStep < totalSteps) {
$('#step-' + currentStep).hide();
currentStep++;
$('#step-' + currentStep).show();
updateProgressBar();
}
});
$('.prev-step').on('click', function() {
if (currentStep > 1) {
$('#step-' + currentStep).hide();
currentStep--;
$('#step-' + currentStep).show();
updateProgressBar();
}
});
function updateProgressBar() {
const progressPercentage = ((currentStep - 1) / (totalSteps - 1)) * 100;
$('.enrollment-progress-bar').css('width', progressPercentage + '%');
$('.step-indicator').removeClass('active');
$('.step-indicator[data-step="' + currentStep + '"]').addClass('active');
}
// Course Search
$('#courseSearch').on('keyup', function() {
const searchValue = $(this).val().toLowerCase();
$('.course-card').each(function() {
const courseTitle = $(this).find('.course-title').text().toLowerCase();
const courseCategory = $(this).find('.course-category').text().toLowerCase();
if (courseTitle.indexOf(searchValue) > -1 || courseCategory.indexOf(searchValue) > -1) {
$(this).show();
} else {
$(this).hide();
}
});
});
// Newsletter Form
$('#newsletterForm').on('submit', function(e) {
e.preventDefault();
const email = $('#newsletterEmail').val();
if (!email) {
$('#newsletterEmail').addClass('is-invalid');
return;
}
// AJAX call would go here
// Show success message
$('#newsletterSuccess').fadeIn();
// Reset form
$('#newsletterEmail').val('');
});
// Contact Form
$('#contactForm').on('submit', function(e) {
e.preventDefault();
// Validate form
let isValid = true;
$(this).find('input, textarea').each(function() {
if ($(this).prop('required') && !$(this).val()) {
isValid = false;
$(this).addClass('is-invalid');
} else {
$(this).removeClass('is-invalid');
}
});
if (!isValid) return;
// AJAX call would go here
// Show success message
$('#contactSuccess').fadeIn();
// Reset form
$('#contactForm')[0].reset();
});
})(jQuery);