File manager

File manager - Edit - /home/jardides/www/Jardi-design/j37/plugins/pagebuilderck/animnumber/assets/animnumber.js

Back
/** * @name Page Builder CK * @package com_pagebuilderck * @copyright Copyright (C) 2015. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt * @author Cedric Keiflin - http://www.template-creator.com - http://www.joomlack.fr / function pbckAnimnumberInit(numberName) { var animnumber = jQuery('#'+numberName); if (animnumber.data('running')) { clearInterval(animnumber.u); // needed to avoid problem on redraw } var opts = {}; // pour cercle opts.pieDiameter = parseFloat(animnumber.attr('data-pieDiameter')) \|\| 380; opts.pieThickness = parseFloat(animnumber.attr('data-pieThickness')) \|\| 70; opts.piePadding = parseFloat(animnumber.attr('data-piePadding')) \|\| 0; opts.pieColor = animnumber.attr('data-pieColor') \|\| '#20B2AA'; // pour cercle opts.startRadius = animnumber.attr('data-startRadius') \|\| 0; // en % opts.endRadius = animnumber.attr('data-endRadius') \|\| 100; // en % opts.offsetRadius = animnumber.attr('data-offsetRadius') \|\| 0; // en % // pour texte opts.startValue = parseFloat(animnumber.attr('data-startValue')) \|\| 0; opts.endValue = parseFloat(animnumber.attr('data-endValue')) \|\| 100; opts.step = parseFloat(animnumber.attr('data-step')) \|\| 1; opts.time = parseFloat(animnumber.attr('data-time')) \|\| 2000; pieID = numberName+'canvas'; if (opts.pieThickness > opts.pieDiameter/3) { console.log('PAGE BUILDER CK - Animated Number Error : can not find the canvas in '); return; } var ctx; animnumber.find('canvas').remove(); animnumber.find('.animnumberckpie').empty(); animnumber.find('.animnumberckpie').append('<canvas id="'+pieID+'"></canvas>'); var canvas = document.getElementById(pieID); canvas.setAttribute("width", opts.pieDiameter); canvas.setAttribute("height", opts.pieDiameter); canvas.style.position = "absolute"; canvas.style.left = "50%"; canvas.style.top = "50%"; canvas.style.marginLeft = -opts.pieDiameter/2 + 'px'; canvas.style.marginTop = -opts.pieDiameter/2 + 'px'; var rad; var radNew; if (canvas && canvas.getContext) { ctx = canvas.getContext("2d"); ctx.rotate(Math.PI(3/2)); ctx.translate(-opts.pieDiameter,0); } else { console.log('PAGE BUILDER CK - Animated Number Error : can not find the canvas in ' + numberName); return; } pbckAnimnumberResize(animnumber); rad = 0; ctx.clearRect(0,0,opts.pieDiameter,opts.pieDiameter); var radSum; radSum = 0.005; time = opts.time; animnumber.data('running', true); animnumber.u = setInterval( function(){ radNew = rad; pbckAnimnumberDraw(ctx, opts, radNew); if(rad<=1.002){ rad = (rad+radSum); } else if (rad<=1){ rad = rad; } else { rad = 1; clearInterval(animnumber.u); animnumber.data('running', false); } var number = parseInt((opts.endValue - opts.startValue) * rad / opts.step) * opts.step + opts.startValue; animnumber.find('.animnumberckvalue').text(number).css('line-height', opts.pieDiameter +'px'); },timeradSum ); } function pbckAnimnumberDraw(ctx, opts, radNew) { ctx.clearRect(0,0,opts.pieDiameter,opts.pieDiameter); ctx.globalCompositeOperation = 'source-over'; ctx.beginPath(); var startrad = Math.PI2 * parseFloat(opts.startRadius) / 100 + opts.offsetRadius * Math.PI2 / 100; var endrad = startrad + radNew Math.PI2 parseFloat(opts.endRadius - opts.startRadius) / 100; ctx.arc((opts.pieDiameter)/2, (opts.pieDiameter)/2, (opts.pieDiameter)/2-opts.pieThickness,startrad,endrad,false); ctx.lineWidth = opts.pieThickness-(opts.piePadding*2); ctx.strokeStyle = opts.pieColor; ctx.stroke(); ctx.closePath(); } // function to be called when the window is resized for reponsive behavior function pbckAnimnumberResize($this){ var canvas = $this.find('canvas'); canvas.css({'margin-left': -canvas.width()/2, 'margin-top': -canvas.height()/2}); } // check the element position to animate the number when visbile on the screen jQuery(document).ready(function($){ jQuery('.animnumberck').each(function() { var $this = jQuery(this); $window = jQuery(window); $this.removeClass('animatenumberck'); // function to be called whenever the window is scrolled or resized function animnumberckupdate($this){ var top = $this.offset().top; var pos = $window.scrollTop(); var height = $this.height(); var windowheight = $(window).height(); // check if totally above or totally below viewport if (top + height < pos \|\| top > pos + windowheight) { // if (! $this.hasClass('noreplayck')) $this.removeClass('animatenumberck'); return; } // animate the content if found if (top < pos \|\| top > pos + windowheight-30) { // is out of the screen } else { if (! $this.hasClass('animatenumberck')) { $this.addClass('animatenumberck'); pbckAnimnumberInit($this.attr('id')); pbckAnimnumberResize($this); } } } animnumberckupdate($this); $window.scroll(function() { animnumberckupdate($this); }); $window.resize(function() { pbckAnimnumberResize($this); }); }); });

| ver. 1.4 | Github | . | PHP 7.4.33 | Generation time: 0.01 | proxy | phpinfo | Settings