https://www.safesave-payments.com/wp-content/plugins/custom-progress-bar/js/jquery.circlechart.js?ver=6.9.9

1(function($){
2 	$.fn.extend({  		
3	    //pass the options variable to the function
4		percentcircle: function(options) {
5		//Set the default values, use comma to separate the settings, example:
6			var defaults = {
7			        animate : true,
8					diameter : 100,
9					guage: 2,
10					coverBg: '#fff',
11					bgColor: '#efefef',
12					fillColor: '#1D74B5',
13					percentSize: '15px',
14					percentWeight: 'normal'
15				},
16				styles = {
17				    cirContainer : {
18					    'width':defaults.diameter,
19						'height':defaults.diameter
20					},
21					cir : {
22					    'position': 'relative',
23					    'text-align': 'center',
24					    'width': defaults.diameter,
25					    'height': defaults.diameter,
26					    'border-radius': '100%',
27					    'background-color': defaults.bgColor,
28					    'background-image' : 'linear-gradient(91deg, transparent 50%, '+defaults.bgColor+' 50%), linear-gradient(90deg, '+defaults.bgColor+' 50%, transparent 50%)'
29					},
30					cirCover: {
31						'position': 'relative',
32					    'top': defaults.guage,
33					    'left': defaults.guage,
34					    'text-align': 'center',
35					    'width': defaults.diameter - (defaults.guage * 2),
36					    'height': defaults.diameter - (defaults.guage * 2),
37					    'border-radius': '100%',
38					    'background-color': defaults.coverBg
39					},
40					percent: {
41						'display':'block',
42						'width': defaults.diameter,
43					    'height': defaults.diameter,
44					    'line-height': defaults.diameter + 'px',
45					    'vertical-align': 'middle',
46					    'font-size': defaults.percentSize,
47					    'font-weight': defaults.percentWeight,
48					    'color': defaults.fillColor
49                    }
50				};
51			
52			var that = this,
53					template = '<div><div class="ab"><div class="cir"><span class="perc">{{percentage}}</span></div></div></div>',					
54					options =  $.extend(defaults, options)					
55
56			function init(){
57				that.each(function(){
58					var $this = $(this),
59					    //we need to check for a percent otherwise set to 0;
60						perc = Math.round($this.data('percent')), //get the percentage from the element
61						deg = perc * 3.6,
62						stop = options.animate ? 0 : deg,
63						$chart = $(template.replace('{{percentage}}',perc+'%'));
64						//set all of the css properties forthe chart
65						$chart.css(styles.cirContainer).find('.ab').css(styles.cir).find('.cir').css(styles.cirCover).find('.perc').css(styles.percent);
66					
67					$this.append($chart); //add the chart back to the target element
68					setTimeout(function(){
69						animateChart(deg,parseInt(stop),$chart.find('.ab')); //both values set to the same value to keep the function from looping and animating	
70					},250)
71	   	    	});
72			}
73
74			var animateChart = function (stop,curr,$elm){
75				var deg = curr;
76				if(curr <= stop){
77					if (deg>=180){
78						$elm.css('background-image','linear-gradient(' + (90+deg) + 'deg, transparent 50%, '+options.fillColor+' 50%),linear-gradient(90deg, '+options.fillColor+' 50%, transparent 50%)');
79			  	    }else{
80			  		    $elm.css('background-image','linear-gradient(' + (deg-90) + 'deg, transparent 50%, '+options.bgColor+' 50%),linear-gradient(90deg, '+options.fillColor+' 50%, transparent 50%)');
81			  	    }
82					curr ++;
83					setTimeout(function(){
84						animateChart(stop,curr,$elm);
85					},1);
86				}
87			};			
88			
89			init(); //kick off the goodness
90   	    }
91	});
92	
93})(jQuery);