Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */
var coll = document.getElementsByClassName("collapsible");
var i;
for (i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function() {
this.classList.toggle("active");
var content = this.nextElementSibling;
$(content).toggle('fast');
});
}
var imageRotationTimeout; // Declare this variable globally
var loading = true;
function setMainImage(imageHtml) {
var mainImageDiv = document.querySelector('.mainImage');
// Apply the blink effect
mainImageDiv.classList.add('blink');
// Delay the image update to allow the blink effect to be visible
setTimeout(function() {
// Set new image HTML and loading bar
mainImageDiv.innerHTML = imageHtml + '<div class="loadingBar"></div>';
resetAndStartLoadingBar();
// Remove the blink class after the animation ends
setTimeout(function() {
mainImageDiv.classList.remove('blink');
}, 500); // Duration of the blink animation in milliseconds
}, 250); // Short delay before updating the image
}
function toggleLoadingBarVisibility() {
loading = false;
var loadingBar = document.querySelector('.loadingBar');
if (loadingBar) {
var isHidden = loadingBar.style.display === 'none';
loadingBar.style.display = isHidden ? 'block' : 'none';
}
}
function addClickEventToImages() {
var images = document.querySelectorAll('.carousel .dpImage');
images.forEach(function(image, index) {
image.addEventListener('click', function() {
// Cancel auto rotation
clearTimeout(imageRotationTimeout);
// Hide the loading bar by setting its display to 'none'
toggleLoadingBarVisibility();
// Set clicked image as main image
setMainImage(this.innerHTML);
});
});
}
var lastSelectedIndex = -1;
var currentIndex = 0;
var rotationInterval = 10000; // 10 seconds
var imageRotationTimeout;
function getNextIndex(imagesLength) {
var nextIndex;
do {
nextIndex = Math.floor(Math.random() * imagesLength);
} while (nextIndex === lastSelectedIndex);
return nextIndex;
}
function startImageRotation() {
var images = document.querySelectorAll('.carousel .dpImage');
currentIndex = getNextIndex(images.length);
setMainImage(images[currentIndex].innerHTML);
lastSelectedIndex = currentIndex;
resetAndStartLoadingBar();
// Schedule the next rotation
imageRotationTimeout = setTimeout(startImageRotation, rotationInterval);
}
function resetAndStartLoadingBar() {
if(loading) {
var loadingBar = document.querySelector('.loadingBar');
loadingBar.style.transition = 'none'; // Disable transition
loadingBar.style.width = '0%'; // Reset the width immediately
setTimeout(function() {
loadingBar.style.transition = 'width ' + rotationInterval + 'ms linear';
loadingBar.style.width = '100%'; // Start the transition
}, 10); // Small delay to allow for width reset
}
}
// Initialize
window.onload = function() {
addClickEventToImages();
startImageRotation(); // Start the initial rotation
};
$(function() {
$(this).impulse();
$('#container').impulse({effect: 'easeOutBack', fluid: false});
});
// ataredo.com/morphology/lucidscroll - documentation
(function($, nib) {
$.fn.impulse = function(options) {
var set = $.extend({}, $.fn.impulse.default, options), gate = $(nib),
vessel = this, object = $(set.target), area = {}, edge = [],
fad = {}, entity, brink = [], outset = [], quit = [], morph,
way, speed, destined = [], pour = 'requestAnimationFrame',
use = $.extend({novel: pour in nib, turned: 0}, set);
elementAnalysis();
vessel.each(function(hit) {
use = $.extend({}, use);
$(this).data('impulse', use).on('wheel.excite', function(act, info) {
if (!use.keen && !act.mien) return;
if (act.mien) {
fad = $.extend({}, use, info);
use.annul = fad.delay == true;
var loom = act.mien;
fad.fluid = false;
}
else {
if (use.annul) return;
fad = use;
loom = act.originalEvent.deltaY;
}
loom = loom/Math.abs(loom);
if (use.crux) {
entity = $(this);
brink[0] = edge[hit];
}
else {
entity = object;
brink = edge;
}
$.each({range: 'orbit', tempo: 'pace'}, function(slot, mate) {
if (typeof fad[slot] === 'function') fad[mate] = fad[slot]();
else fad[mate] = fad[slot];
});
if (loom != use.zeal || act.mien) use.turned = 1;
else use.turned = Math.min(use.curb, use.turned+1);
if (!fad.delay && fad.fluid && use.turned == 1) morph = 'curve';
else morph = fad.effect;
way = loom*fad.orbit*Math.pow(use.leap, use.turned-1);
speed = fad.pace*Math.pow(use.sloth, use.turned-1) || 1;
use.zeal = loom;
entity.each(function(part) {
outset[part] = $(this).scrollTop();
destined[part] = outset[part]+way;
quit[part] = onFringe(this, part, outset[part]);
});
use.waive = ceaseOperation();
if (!way) speed = 1;
if (use.novel) {
if (use.motion) {
cancelAnimationFrame(use.motion);
use.initial = use.present;
}
else use.initial = Date.now();
use.motion = nib[pour](streamCore);
}
else inciteSource();
});
this.addEventListener('wheel', function(tick) {
if (!use.keen) return;
if (use.annul) return denyRise(tick);
else if (fad.delay == true && !use.waive) use.annul = true;
if (!(use.waive && use.occur)) denyRise(tick);
}, hasQuiet() ? {passive: false} : false);
});
$.easing['curve'] = $.easing['easeInOutSine'];
gate.resize(function() {
clearTimeout(use.bound);
use.bound = setTimeout(detectOverflow, 100);
});
return this;
function streamCore() {
use.present = Date.now();
var advance = Math.min(use.present-use.initial, speed)/speed,
increase = $.easing[morph](advance);
entity.each(function(key) {
if (!quit[key]) {
$(this).scrollTop(outset[key]+increase*way);
checkLimits(this, key, advance);
}
});
if (advance < 1 && !use.waive) use.motion = nib[pour](streamCore);
else hindStage();
}
function inciteSource() {
entity.each(function(beat) {
if (!quit[beat]) {
$(this).stop().animate({scrollTop: destined[beat]}, {
duration: speed,
easing: morph,
progress: function(current, sequence) {
checkLimits(this, beat, sequence);
},
complete: hindStage
});
}
});
}
function checkLimits(essence, rank, factor) {
if (100*factor >= fad.reset) use.turned = 0;
if (onFringe(essence, rank)) {
quit[rank] = true;
if (!use.novel) $(essence).stop(true, true);
use.waive = ceaseOperation();
}
}
function onFringe(matter, cue, genesis) {
var put = Math.round(genesis || $(matter).scrollTop()),
above = destined[cue] < 0 && !put,
below = destined[cue] > brink[cue] && put == brink[cue] && fad.orbit > 0;
return above || below;
}
function ceaseOperation() {
return quit.every(function(flag) {return flag});
}
function hindStage() {
use.turned = use.annul = use.motion = 0;
}
function denyRise(jab) {
jab.preventDefault();
jab.stopPropagation();
}
function elementAnalysis() {
var item = $();
if (!object.length) {
use.crux = true;
object = vessel;
}
object.each(function() {
if ($.zenith(this)) {
if (!use.main) {
if (use.novel) use.main = nib;
else use.main = baseTag();
item = item.add(use.main);
}
}
else item = item.add(this);
});
use.target = object = item;
object.each(function(zest) {
if ($.zenith(this)) area[zest] = 'hub';
else area[zest] = 'sub';
});
if (use.crux && use.main) vessel = object;
detectOverflow();
}
function baseTag() {
var origin = gate.scrollTop();
gate.scrollTop(1);
if ($('html').scrollTop()) var root = 'html';
else if ($('body').scrollTop()) root = 'body';
else root = 'html, body';
gate.scrollTop(origin);
return root;
}
function detectOverflow() {
object.each(function(peg) {
if (area[peg] == 'hub') var teem = $(document).height()-gate.height();
else teem = this.scrollHeight-$(this).height();
edge[peg] = Math.round(teem);
});
}
function hasQuiet() {
var cold = false,
hike = function() {};
try {
var aid = Object.defineProperty({}, 'passive', {
get: function() {cold = true}
});
nib.addEventListener('test', hike, aid);
nib.removeEventListener('test', hike, aid);
} catch(e) {}
return cold;
}
};
$.zenith = function(sample) {
var peak = [nib,document,'HTML','BODY'], facet;
if (sample) return peak.indexOf(sample) > -1 || peak.indexOf(sample.tagName) > -1;
$.each(peak, function(spot, detail) {
facet = $(detail).data('impulse');
if (facet) return false;
});
return facet;
};
$.fn.impulse.default = {
target: '',
range: 135,
leap: 1.35,
tempo: 500,
sloth: 1.1,
curb: 5,
reset: 85,
effect: 'easeOutSine',
keen: true,
delay: false,
occur: true,
fluid: true
};
$.fn.demit = function() {
return this.each(function() {
if ($.zenith(this)) var habit = $.zenith();
else habit = $(this).data('impulse');
if (habit) {
if (habit.novel) cancelAnimationFrame(habit.motion);
else habit.target.stop();
habit.turned = habit.annul = habit.motion = 0;
}
});
};
$.fn.amend = function(gist) {
return this.each(function() {
if ($.zenith(this)) var quirk = $.zenith();
else quirk = $(this).data('impulse');
if (quirk) {
$.each(gist, function(sign, rate) {
if (sign in quirk) quirk[sign] = rate;
});
}
});
};
$.fn.evoke = function(unit) {
var lot = $.Event('wheel.excite', {mien: true}), bulk;
return this.each(function() {
if ($.zenith(this)) {
if (!bulk) {
bulk = $.zenith();
if (bulk) $(bulk.main).trigger(lot, unit);
}
}
else $(this).trigger(lot, unit);
});
};
}(jQuery, window));
(function($){var b={};$.each(['Quad','Cubic','Quart','Quint','Expo'],function(i,n){b[n]=function(p){return Math.pow(p,i+2)}});$.extend(b,{Sine:function(p){return 1-Math.cos(p*Math.PI/2)},Circ:function(p){return 1-Math.sqrt(1-p*p)},Elastic:function(p){return p===0||p===1?p:-Math.pow(2,8*(p-1))*Math.sin(((p-1)*80-7.5)*Math.PI/15)},Back:function(p){return p*p*(3*p-2)},Bounce:function(p){var f,h=4;while(p<((f=Math.pow(2,--h))-1)/11){}return (1/Math.pow(4,3-h)-7.5625*Math.pow((f*3-2)/22-p,2))}});$.each(b,function(n,e){$.easing['easeIn'+n]=e;$.easing['easeOut'+n]=function(p){return 1-e(1-p)};$.easing['easeInOut'+n]=function(p){return p<0.5?e(p*2)/2:1-e(p*-2+2)/2}})})(jQuery);