ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / fcxpro.com / wp-content / plugins / webon-core / inc / shortcodes / progress-bar / assets / js / parts

(function ($) {
    'use strict';

qodefCore.shortcodes.webon_core_progress_bar = {};

$(document).ready(function () {
        qodefProgressBar.init();
    });

/**
     * Init progress bar shortcode functionality
     */
    var qodefProgressBar = {
        init: function () {
            this.holder = $('.qodef-progress-bar');

if (this.holder.length) {
                this.holder.each(function () {
                    var $thisHolder = $(this),
                        layout = $thisHolder.data('layout'),
					    numberColor = $thisHolder.data('number-color'),
					    $VSSHolder = $('.qodef-vertical-split-slider');

$thisHolder.css("color", numberColor);

if ($VSSHolder.length) {
						$thisHolder.addClass('qodef--init');
						qodefProgressBar.drawProgress($thisHolder, layout);
                    } else {
						$thisHolder.appear(function () {
							$thisHolder.addClass('qodef--init');
							qodefProgressBar.drawProgress($thisHolder, layout);
						});
                    }
                });
            }
        },
        drawProgress : function ($thisHolder, layout){
			var $container = $thisHolder.find('.qodef-m-canvas'),
				data = qodefProgressBar.generateBarData($thisHolder, layout),
				number = $thisHolder.data('number') / 100;

switch (layout) {
				case 'circle':
					qodefProgressBar.initCircleBar($container, data, number);
					break;
				case 'semi-circle':
					qodefProgressBar.initSemiCircleBar($container, data, number);
					break;
				case 'line':
					data = qodefProgressBar.generateLineData($thisHolder, number);
					qodefProgressBar.initLineBar($container, data);
					break;
				case 'custom':
					qodefProgressBar.initCustomBar($container, data, number);
					break;
			}
        },
        generateBarData: function (thisBar, layout) {
            var activeWidth = thisBar.data('active-line-width');
            var activeColor = thisBar.data('active-line-color');
            var inactiveWidth = thisBar.data('inactive-line-width');
            var inactiveColor = thisBar.data('inactive-line-color');
            var easing = 'linear';
            var duration = typeof thisBar.data('duration') !== 'undefined' && thisBar.data('duration') !== '' ? parseInt(thisBar.data('duration'), 10) : 1600;
            var textColor = thisBar.data('text-color');

return {
                strokeWidth: activeWidth,
                color: activeColor,
                trailWidth: inactiveWidth,
                trailColor: inactiveColor,
                easing: easing,
                duration: duration,
                svgStyle: {
                    width: '100%',
                    height: '100%'
                },
                text: {
                    style: {
                        color: textColor
                    },
                    autoStyleContainer: false
                },
                from: {
                    color: inactiveColor
                },
                to: {
                    color: activeColor
                },
                step: function (state, bar) {
                    if (layout !== 'custom') {
                        bar.setText('<span class="progressbar-text-inner">' + Math.round(bar.value() * 100) + '<span class="progressbar-percentage">%</span></span>');
                    }
                }
            };
        },
        generateLineData: function (thisBar, number) {
            var height = thisBar.data('active-line-width');
            var activeColor = thisBar.data('active-line-color');
            var inactiveHeight = thisBar.data('inactive-line-width');
            var inactiveColor = thisBar.data('inactive-line-color');
            var duration = typeof thisBar.data('duration') !== 'undefined' && thisBar.data('duration') !== '' ? parseInt(thisBar.data('duration'), 10) : 1600;
            var textColor = thisBar.data('text-color');

return {
                percentage: number * 100,
                duration: duration,
                fillBackgroundColor: activeColor,
                backgroundColor: inactiveColor,
                height: height,
                inactiveHeight: inactiveHeight,
                followText: thisBar.hasClass('qodef-percentage--floating'),
                textColor: textColor
            };
        },
        initCircleBar: function ($container, data, number) {
            if (qodefProgressBar.checkBar($container)) {
                var $bar = new ProgressBar.Circle($container[0], data);

$bar.animate(number);
            }
        },
        initSemiCircleBar: function ($container, data, number) {
            if (qodefProgressBar.checkBar($container)) {
                var $bar = new ProgressBar.SemiCircle($container[0], data);

$bar.animate(number);
            }
        },
        initCustomBar: function ($container, data, number) {
            if (qodefProgressBar.checkBar($container)) {
                var $bar = new ProgressBar.Path($container[0], data);

$bar.set(0);
                $bar.animate(number);
            }
        },
        initLineBar: function ($container, data) {
            $container.LineProgressbar(data);
        },
        checkBar: function ($container) {
            // check if svg is already in container, elementor fix
            if ($container.find('svg').length) {
                return false;
            }

return true;
        }
    };

qodefCore.shortcodes.webon_core_progress_bar.qodefProgressBar = qodefProgressBar;

})(jQuery);

[-] progress-bar.js [edit]
[+] ..