%PDF-
%PDF-
Mini Shell
Mini Shell
import '../css/default-page.less';
/**
* appendStylesheets
* loadJQuery
* registerJQueryAddOnFunctions
* sidebarTextNav
* registerExpandSidebarText
* scrollTopButton
* initRadialIndicators
* animateRadialIndicators
* scrollTo
* registerExpandMobileMenu
* registerSiteHeaderMobileDropdown
*/
let $ = null;
let hasLoadedJQuery = false;
window.onload = function() {
// appendStylesheets();
loadJQuery([
registerJQueryAddOnFunctions,
sidebarTextNav,
registerExpandSidebarText,
scrollTopButton,
registerExpandMobileMenu,
registerSiteHeaderMobileDropdown,
]);
}
function appendStylesheets() {
let stylesheetUrls = [
'/fonts/montserrat/stylesheet.css',
'/lib/fontawesome/css/fontawesome.min.css',
'/lib/fontawesome/css/solid-separated.css',
'/lib/fontawesome/css/regular-separated.css',
];
stylesheetUrls.forEach(function(url) {
let el = document.createElement('link');
el.rel = 'stylesheet';
el.type = 'text/css';
el.href = url;
document.querySelector('head').append(el);
});
}
function loadJQuery(onFinishFuncs) {
let loadFunc = () => {
if (hasLoadedJQuery) return;
hasLoadedJQuery = true;
import('jquery').then(({ default: _$ }) => {
$ = _$;
onFinishFuncs.forEach(function(func) {
func();
});
});
import('../../node_modules/@sudhanshu/radial-indicator/dist/radialIndicator.min.js').then(({ default: RadialIndicator }) => {
initRadialIndicators();
});
};
window.addEventListener('scroll', function() {
loadFunc();
});
if (window.innerWidth <= 768) {
setTimeout(loadFunc, 1500);
} else {
loadFunc();
}
}
function registerJQueryAddOnFunctions() {
$.fn.isInViewport = function() {
var elementTop = $(this).offset().top;
var elementBottom = elementTop + $(this).outerHeight();
var viewportTop = $(window).scrollTop();
var viewportBottom = viewportTop + $(window).height();
return elementBottom > viewportTop && elementTop < viewportBottom;
};
}
function sidebarTextNav() {
let sidebarNavPaddingTop = 69;
$(document).scroll(function() {
// Set currently selected sidebar-nav button
let targetIdOffsetTop = 70;
let latestTargetId = '';
$('.sidebar-text .text > div').each(function() {
if ($('html').scrollTop() > $(this).offset().top - targetIdOffsetTop) {
latestTargetId = $(this).attr('id');
}
});
$('.sidebar-text .sidebar-nav .nav-buttons button').removeClass('selected');
if (latestTargetId != '') {
$(`.sidebar-text .sidebar-nav .nav-buttons button[data-target-id="${latestTargetId}"]`).addClass('selected');
}
});
// Smooth scroll document on sidebar nav button click
$('.sidebar-text .sidebar-nav .nav-buttons button').click(function() {
let id_str = "#" + $(this).data("target-id");
let offsetTop = $(id_str).offset().top;
$('html, body').animate({
scrollTop: offsetTop - sidebarNavPaddingTop
}, 400);
});
}
function registerExpandSidebarText() {
$('.sidebar-text .expand').click(function() {
let $expandButton = $(this);
$('.sidebar-text .nav-buttons').slideToggle(250, function () {
$expandButton.attr('aria-expanded', $expandButton.attr('aria-expanded') == "true" ? "false" : "true");
});
});
}
function scrollTopButton() {
$('#scroll-top').click(function(e) {
e.preventDefault();
scrollTo(0, 500);
});
$(document).on('scroll', function() {
if ($(document).scrollTop() > 0 && ! $("#scroll-top").hasClass("active")) {
$("#scroll-top").addClass("active");
} else if ($(document).scrollTop() == 0 && $("#scroll-top").hasClass("active")) {
$("#scroll-top").removeClass("active");
}
});
}
function initRadialIndicators() {
let barWidth = 5;
let radius = 35;
if ($('.credit-card-show--info .rating').length != 0) {
barWidth = 7;
radius = 50;
}
$('.rating').radialIndicator({
minValue: 0,
maxValue: 10,
initValue: 0,
frameTime: 4,
barWidth: barWidth,
radius: radius,
barColor: {
0: '#ff6666',
4: '#ffc354',
6: '#b4d13f',
10: '#5dd145'
}
});
$(window).scroll(animateRadialIndicators);
animateRadialIndicators();
}
function animateRadialIndicators() {
$('.rating').each(function() {
if ($(this).isInViewport() && $(this).data('radial-indicator-initialized') != 'true') {
$(this).data("radialIndicator").animate($(this).data('rating'));
$(this).data('radial-indicator-initialized', 'true');
$(this).css('opacity', '1');
}
});
}
function scrollTo(element, duration, finishFunc) {
let startingY = window.pageYOffset
let elementY = element
// If element is close to page's bottom then window will scroll only to some position above the element.
let targetY = document.body.scrollHeight - elementY < window.innerHeight ? document.body.scrollHeight - window.innerHeight : elementY
let diff = targetY - startingY
// Easing function: easeInOutCubic
// From: https://gist.github.com/gre/1650294
let easing = function (t) { return t<.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1 }
let start
if (!diff) return
// Bootstrap our animation - it will get called right before next frame shall be rendered.
window.requestAnimationFrame(function step(timestamp) {
if (!start) start = timestamp
// Elapsed miliseconds since start of scrolling.
var time = timestamp - start
// Get percent of completion in range [0, 1].
var percent = Math.min(time / duration, 1)
// Apply the easing.
// It can cause bad-looking slow frames in browser performance tool, so be careful.
percent = easing(percent)
window.scrollTo(0, startingY + diff * percent)
// Proceed with animation as long as we wanted it to.
if (time < duration) {
window.requestAnimationFrame(step)
} else {
if (finishFunc != null) {
finishFunc();
}
}
});
}
function registerExpandMobileMenu() {
$('#expand-mobile-menu').css('opacity', '1');
$('#expand-mobile-menu').on('click', function() {
$('#mobile-border-container span').toggleClass('anim');
$('#site-header').toggleClass('expand');
$('#background-fade').toggleClass('anim');
});
$('#background-fade').on('click', function() {
$('#mobile-border-container span').toggleClass('anim');
$('#site-header').toggleClass('expand');
$('#background-fade').toggleClass('anim');
});
}
function registerSiteHeaderMobileDropdown() {
$('#site-header .tab-container .expand-dropdown').click(function() {
$(this).toggleClass('expanded');
$(this).parent().children('.dropdown').toggleClass('visible');
});
}
Zerion Mini Shell 1.0