Progress bar component js code

СТОРІНКА ШАБЛОНУ

Це сторінка шаблону, який використовується у цій Wiki.

Будь ласка, не редагуйте цю сторінку
без дозволу адміністрації сайту


function getBar(progress) {
    var bar = BAR_TEXT + ' [';
    var stage = Math.ceil(progress * STAGE_RATIO);
    for (var i = 1; i <= BAR_WIDTH; i++) {
     if (stage >= i) {
     bar += '=';
     } else {
     bar += '&nbsp;';
     }
    }
    bar += ']&nbsp;';
    if (progress === 100) {
     bar += COMPLETE_TEXT;
    } else {
     if (progress < 10) {
     bar += '&nbsp;'
     }
     bar += progress + '%';
    }
    return bar;
}
 
document.addEventListener('DOMContentLoaded', function () {
    var barElem = document.querySelector('.bar');
    var contentElem = document.querySelector('.content');
    var initButton = document.querySelector('.init-button');
    var loadingText = document.querySelector('.loading-text');
    initButton.innerHTML = BUTTON_TEXT;
 
    function onFinish() {
     contentElem.style.display = 'block';
     if (HIDE_BAR_AFTER_FINISH) {
     barElem.style.display = 'none';
     }
    }
 
    var initialTick = true;
 
    var onClickInit = function () {
     if (HIDE_BUTTON_AFTER_INIT) {
     initButton.style.display = 'none';
     } else {
     initButton.innerHTML = BUTTON_TEXT_AFTER_INIT;
     initButton.removeEventListener('click', onClickInit);
     initButton.style.color = '#000';
     }
 
     if (LOADING_TEXT) {
     loadingText.style.display = 'block';
     loadingText.innerHTML = LOADING_TEXT;
     }
 
     var progress = 0;
 
     var tick = function () {
     barElem.innerHTML = getBar(progress);
     progress += PROGRESS_STEP;
     requestAnimationFrame(function () {
     if (progress <= 100) {
     setTimeout(tick, initialTick ? INITIAL_TICK_TIMEOUT  : TICK_INTERVAL);
     initialTick = false;
     } else {
     barElem.innerHTML = getBar(100);
     onFinish();
     }
     });
     };
     tick();
    };
 
    initButton.addEventListener('click', onClickInit);
});
Якщо не зазначено інше, вміст цієї сторінки доступний на умовах ліцензії Creative Commons Attribution-ShareAlike 3.0 License