changes
This commit is contained in:
@@ -1,214 +1,105 @@
|
||||
!(function($) {
|
||||
"use strict";
|
||||
(() => {
|
||||
'use strict';
|
||||
|
||||
// Preloader
|
||||
$(window).on('load', function() {
|
||||
if ($('#preloader').length) {
|
||||
$('#preloader').delay(100).fadeOut('slow', function() {
|
||||
$(this).remove();
|
||||
// ── Mobile Nav Toggle ──
|
||||
const navToggle = document.getElementById('nav-toggle');
|
||||
const nav = document.getElementById('nav');
|
||||
|
||||
navToggle.addEventListener('click', () => {
|
||||
const open = nav.classList.toggle('open');
|
||||
navToggle.setAttribute('aria-expanded', open);
|
||||
navToggle.querySelector('i').className = open ? 'ri-close-line' : 'ri-menu-line';
|
||||
});
|
||||
|
||||
// Close nav on link click (mobile)
|
||||
nav.querySelectorAll('a').forEach(link => {
|
||||
link.addEventListener('click', () => {
|
||||
nav.classList.remove('open');
|
||||
navToggle.setAttribute('aria-expanded', 'false');
|
||||
navToggle.querySelector('i').className = 'ri-menu-line';
|
||||
});
|
||||
});
|
||||
|
||||
// ── Header Scroll Effect ──
|
||||
const header = document.getElementById('header');
|
||||
let ticking = false;
|
||||
|
||||
window.addEventListener('scroll', () => {
|
||||
if (!ticking) {
|
||||
requestAnimationFrame(() => {
|
||||
header.classList.toggle('scrolled', window.scrollY > 50);
|
||||
ticking = false;
|
||||
});
|
||||
ticking = true;
|
||||
}
|
||||
});
|
||||
|
||||
// Smooth scroll for the navigation menu and links with .scrollto classes
|
||||
$(document).on('click', '.nav-menu a, .mobile-nav a, .scrollto', function(e) {
|
||||
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
|
||||
e.preventDefault();
|
||||
var target = $(this.hash);
|
||||
if (target.length) {
|
||||
|
||||
var scrollto = target.offset().top;
|
||||
var scrolled = 20;
|
||||
|
||||
if ($('#header').length) {
|
||||
scrollto -= $('#header').outerHeight()
|
||||
|
||||
if (!$('#header').hasClass('header-scrolled')) {
|
||||
scrollto += scrolled;
|
||||
// ── Status Monitor ──
|
||||
class StatusMonitor {
|
||||
constructor() {
|
||||
this.services = [
|
||||
{
|
||||
id: 'status-glances',
|
||||
url: '/proxy/glances/api/4/quicklook',
|
||||
parse: (data) => `CPU ${Math.round(data.cpu_percent)}% | RAM ${Math.round(data.mem_percent)}%`
|
||||
},
|
||||
{
|
||||
id: 'status-uptime',
|
||||
url: '/proxy/uptime/api/status-page/heartbeat/default',
|
||||
parse: (data) => {
|
||||
const groups = data.heartbeatList || {};
|
||||
const monitors = Object.values(groups);
|
||||
const total = monitors.length;
|
||||
const up = monitors.filter(beats => beats.length > 0 && beats[beats.length - 1].status === 1).length;
|
||||
return `${up}/${total} services up`;
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'status-cadvisor',
|
||||
url: '/proxy/cadvisor/api/v1.0/machine',
|
||||
parse: (data) => {
|
||||
const cores = data.num_cores || '?';
|
||||
const ramGB = data.memory_capacity ? (data.memory_capacity / 1073741824).toFixed(0) : '?';
|
||||
return `${cores} cores | ${ramGB} GB RAM`;
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
if ($(this).attr("href") == '#header') {
|
||||
scrollto = 0;
|
||||
}
|
||||
this.poll();
|
||||
setInterval(() => this.poll(), 60000);
|
||||
}
|
||||
|
||||
$('html, body').animate({
|
||||
scrollTop: scrollto
|
||||
}, 1500, 'easeInOutExpo');
|
||||
async poll() {
|
||||
this.services.forEach(svc => this.check(svc));
|
||||
}
|
||||
|
||||
if ($(this).parents('.nav-menu, .mobile-nav').length) {
|
||||
$('.nav-menu .active, .mobile-nav .active').removeClass('active');
|
||||
$(this).closest('li').addClass('active');
|
||||
}
|
||||
async check(svc) {
|
||||
const card = document.getElementById(svc.id);
|
||||
if (!card) return;
|
||||
|
||||
if ($('body').hasClass('mobile-nav-active')) {
|
||||
$('body').removeClass('mobile-nav-active');
|
||||
$('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
|
||||
$('.mobile-nav-overly').fadeOut();
|
||||
}
|
||||
return false;
|
||||
const dot = card.querySelector('.status-dot');
|
||||
const value = card.querySelector('.status-value');
|
||||
|
||||
dot.className = 'status-dot loading';
|
||||
|
||||
try {
|
||||
const controller = new AbortController();
|
||||
const timeout = setTimeout(() => controller.abort(), 5000);
|
||||
|
||||
const res = await fetch(svc.url, { signal: controller.signal });
|
||||
clearTimeout(timeout);
|
||||
|
||||
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||||
|
||||
const data = await res.json();
|
||||
dot.className = 'status-dot ok';
|
||||
value.textContent = svc.parse(data);
|
||||
} catch {
|
||||
dot.className = 'status-dot error';
|
||||
value.textContent = 'Unreachable';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Mobile Navigation
|
||||
if ($('.nav-menu').length) {
|
||||
var $mobile_nav = $('.nav-menu').clone().prop({
|
||||
class: 'mobile-nav d-lg-none'
|
||||
});
|
||||
$('body').append($mobile_nav);
|
||||
$('body').prepend('<button type="button" class="mobile-nav-toggle d-lg-none"><i class="icofont-navigation-menu"></i></button>');
|
||||
$('body').append('<div class="mobile-nav-overly"></div>');
|
||||
|
||||
$(document).on('click', '.mobile-nav-toggle', function(e) {
|
||||
$('body').toggleClass('mobile-nav-active');
|
||||
$('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
|
||||
$('.mobile-nav-overly').toggle();
|
||||
});
|
||||
|
||||
$(document).on('click', '.mobile-nav .drop-down > a', function(e) {
|
||||
e.preventDefault();
|
||||
$(this).next().slideToggle(300);
|
||||
$(this).parent().toggleClass('active');
|
||||
});
|
||||
|
||||
$(document).click(function(e) {
|
||||
var container = $(".mobile-nav, .mobile-nav-toggle");
|
||||
if (!container.is(e.target) && container.has(e.target).length === 0) {
|
||||
if ($('body').hasClass('mobile-nav-active')) {
|
||||
$('body').removeClass('mobile-nav-active');
|
||||
$('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
|
||||
$('.mobile-nav-overly').fadeOut();
|
||||
}
|
||||
}
|
||||
});
|
||||
} else if ($(".mobile-nav, .mobile-nav-toggle").length) {
|
||||
$(".mobile-nav, .mobile-nav-toggle").hide();
|
||||
}
|
||||
|
||||
// Navigation active state on scroll
|
||||
var nav_sections = $('section');
|
||||
var main_nav = $('.nav-menu, #mobile-nav');
|
||||
|
||||
$(window).on('scroll', function() {
|
||||
var cur_pos = $(this).scrollTop() + 90;
|
||||
|
||||
nav_sections.each(function() {
|
||||
var top = $(this).offset().top,
|
||||
bottom = top + $(this).outerHeight();
|
||||
|
||||
if (cur_pos >= top && cur_pos <= bottom) {
|
||||
if (cur_pos <= bottom) {
|
||||
main_nav.find('li').removeClass('active');
|
||||
}
|
||||
main_nav.find('a[href="#' + $(this).attr('id') + '"]').parent('li').addClass('active');
|
||||
}
|
||||
if (cur_pos < 300) {
|
||||
$(".nav-menu ul:first li:first").addClass('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Toggle .header-scrolled class to #header when page is scrolled
|
||||
$(window).scroll(function() {
|
||||
if ($(this).scrollTop() > 100) {
|
||||
$('#header').addClass('header-scrolled');
|
||||
} else {
|
||||
$('#header').removeClass('header-scrolled');
|
||||
}
|
||||
});
|
||||
|
||||
if ($(window).scrollTop() > 100) {
|
||||
$('#header').addClass('header-scrolled');
|
||||
}
|
||||
|
||||
// Back to top button
|
||||
$(window).scroll(function() {
|
||||
if ($(this).scrollTop() > 100) {
|
||||
$('.back-to-top').fadeIn('slow');
|
||||
} else {
|
||||
$('.back-to-top').fadeOut('slow');
|
||||
}
|
||||
});
|
||||
|
||||
$('.back-to-top').click(function() {
|
||||
$('html, body').animate({
|
||||
scrollTop: 0
|
||||
}, 1500, 'easeInOutExpo');
|
||||
return false;
|
||||
});
|
||||
|
||||
// Clients carousel (uses the Owl Carousel library)
|
||||
$(".clients-carousel").owlCarousel({
|
||||
autoplay: true,
|
||||
dots: true,
|
||||
loop: true,
|
||||
responsive: {
|
||||
0: {
|
||||
items: 2
|
||||
},
|
||||
768: {
|
||||
items: 4
|
||||
},
|
||||
900: {
|
||||
items: 6
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Porfolio isotope and filter
|
||||
$(window).on('load', function() {
|
||||
var portfolioIsotope = $('.portfolio-container').isotope({
|
||||
itemSelector: '.portfolio-item'
|
||||
});
|
||||
|
||||
$('#portfolio-flters li').on('click', function() {
|
||||
$("#portfolio-flters li").removeClass('filter-active');
|
||||
$(this).addClass('filter-active');
|
||||
|
||||
portfolioIsotope.isotope({
|
||||
filter: $(this).data('filter')
|
||||
});
|
||||
aos_init();
|
||||
});
|
||||
|
||||
// Initiate venobox (lightbox feature used in portofilo)
|
||||
$(document).ready(function() {
|
||||
$('.venobox').venobox({
|
||||
'share': false
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// jQuery counterUp
|
||||
$('[data-toggle="counter-up"]').counterUp({
|
||||
delay: 10,
|
||||
time: 1000
|
||||
});
|
||||
|
||||
// Testimonials carousel (uses the Owl Carousel library)
|
||||
$(".testimonials-carousel").owlCarousel({
|
||||
autoplay: true,
|
||||
dots: true,
|
||||
loop: true,
|
||||
items: 1
|
||||
});
|
||||
|
||||
// Portfolio details carousel
|
||||
$(".portfolio-details-carousel").owlCarousel({
|
||||
autoplay: true,
|
||||
dots: true,
|
||||
loop: true,
|
||||
items: 1
|
||||
});
|
||||
|
||||
// Initi AOS
|
||||
function aos_init() {
|
||||
AOS.init({
|
||||
duration: 1000,
|
||||
once: true
|
||||
});
|
||||
}
|
||||
aos_init();
|
||||
|
||||
})(jQuery);
|
||||
new StatusMonitor();
|
||||
})();
|
||||
|
||||
Reference in New Issue
Block a user