https://www.gaming.cat/wp-content/themes/h-code/assets/js/jquery.easypiechart.js?ver=1.0

1(function(root, factory) {
2	"use strict"; 
3    if(typeof exports === 'object') {
4        module.exports = factory(require('jquery'));
5    }
6    else if(typeof define === 'function' && define.amd) {
7        define(['jquery'], factory);
8    }
9    else {
10        factory(root.jQuery);
11    }
12}(this, function($) {
13
14var CanvasRenderer = function(el, options) {
15	var cachedBackground;
16	var canvas = document.createElement('canvas');
17
18	el.appendChild(canvas);
19
20	if (typeof(G_vmlCanvasManager) !== 'undefined') {
21		G_vmlCanvasManager.initElement(canvas);
22	}
23
24	var ctx = canvas.getContext('2d');
25
26	canvas.width = canvas.height = options.size;
27
28	// canvas on retina devices
29	var scaleBy = 1;
30	if (window.devicePixelRatio > 1) {
31		scaleBy = window.devicePixelRatio;
32		canvas.style.width = canvas.style.height = [options.size, 'px'].join('');
33		canvas.width = canvas.height = options.size * scaleBy;
34		ctx.scale(scaleBy, scaleBy);
35	}
36
37	// move 0,0 coordinates to the center
38	ctx.translate(options.size / 2, options.size / 2);
39
40	// rotate canvas -90deg
41	ctx.rotate((-1 / 2 + options.rotate / 180) * Math.PI);
42
43	var radius = (options.size - options.lineWidth) / 2;
44	if (options.scaleColor && options.scaleLength) {
45		radius -= options.scaleLength + 2; // 2 is the distance between scale and bar
46	}
47
48	// IE polyfill for Date
49	Date.now = Date.now || function() {
50		return +(new Date());
51	};
52
53	/**
54	 * Draw a circle around the center of the canvas
55	 * @param {strong} color     Valid CSS color string
56	 * @param {number} lineWidth Width of the line in px
57	 * @param {number} percent   Percentage to draw (float between -1 and 1)
58	 */
59	var drawCircle = function(color, lineWidth, percent) {
60		percent = Math.min(Math.max(-1, percent || 0), 1);
61		var isNegative = percent <= 0 ? true : false;
62
63		ctx.beginPath();
64		ctx.arc(0, 0, radius, 0, Math.PI * 2 * percent, isNegative);
65
66		ctx.strokeStyle = color;
67		ctx.lineWidth = lineWidth;
68
69		ctx.stroke();
70	};
71
72	/**
73	 * Draw the scale of the chart
74	 */
75	var drawScale = function() {
76		var offset;
77		var length;
78
79		ctx.lineWidth = 1;
80		ctx.fillStyle = options.scaleColor;
81
82		ctx.save();
83		for (var i = 24; i > 0; --i) {
84			if (i % 6 === 0) {
85				length = options.scaleLength;
86				offset = 0;
87			} else {
88				length = options.scaleLength * 0.6;
89				offset = options.scaleLength - length;
90			}
91			ctx.fillRect(-options.size/2 + offset, 0, length, 1);
92			ctx.rotate(Math.PI / 12);
93		}
94		ctx.restore();
95	};
96
97	/**
98	 * Request animation frame wrapper with polyfill
99	 * @return {function} Request animation frame method or timeout fallback
100	 */
101	var reqAnimationFrame = (function() {
102		return  window.requestAnimationFrame ||
103				window.webkitRequestAnimationFrame ||
104				window.mozRequestAnimationFrame ||
105				function(callback) {
106					window.setTimeout(callback, 1000 / 60);
107				};
108	}());
109
110	/**
111	 * Draw the background of the plugin including the scale and the track
112	 */
113	var drawBackground = function() {
114		if(options.scaleColor) drawScale();
115		if(options.trackColor) drawCircle(options.trackColor, options.lineWidth, 1);
116	};
117
118  /**
119    * Canvas accessor
120   */
121  this.getCanvas = function() {
122    return canvas;
123  };
124  
125  /**
126    * Canvas 2D context 'ctx' accessor
127   */
128  this.getCtx = function() {
129    return ctx;
130  };
131
132	/**
133	 * Clear the complete canvas
134	 */
135	this.clear = function() {
136		ctx.clearRect(options.size / -2, options.size / -2, options.size, options.size);
137	};
138
139	/**
140	 * Draw the complete chart
141	 * @param {number} percent Percent shown by the chart between -100 and 100
142	 */
143	this.draw = function(percent) {
144		// do we need to render a background
145		if (!!options.scaleColor || !!options.trackColor) {
146			// getImageData and putImageData are supported
147			if (ctx.getImageData && ctx.putImageData) {
148				if (!cachedBackground) {
149					drawBackground();
150					cachedBackground = ctx.getImageData(0, 0, options.size * scaleBy, options.size * scaleBy);
151				} else {
152					ctx.putImageData(cachedBackground, 0, 0);
153				}
154			} else {
155				this.clear();

156				drawBackground();
157			}
158		} else {
159			this.clear();
160		}
161
162		ctx.lineCap = options.lineCap;
163
164		// if barcolor is a function execute it and pass the percent as a value
165		var color;
166		if (typeof(options.barColor) === 'function') {
167			color = options.barColor(percent);
168		} else {
169			color = options.barColor;
170		}
171
172		// draw bar
173		drawCircle(color, options.lineWidth, percent / 100);
174	}.bind(this);
175
176	/**
177	 * Animate from some percent to some other percentage
178	 * @param {number} from Starting percentage
179	 * @param {number} to   Final percentage
180	 */
181	this.animate = function(from, to) {
182		var startTime = Date.now();
183		options.onStart(from, to);
184		var animation = function() {
185			var process = Math.min(Date.now() - startTime, options.animate.duration);
186			var currentValue = options.easing(this, process, from, to - from, options.animate.duration);
187			this.draw(currentValue);
188			options.onStep(from, to, currentValue);
189			if (process >= options.animate.duration) {
190				options.onStop(from, to);
191			} else {
192				reqAnimationFrame(animation);
193			}
194		}.bind(this);
195
196		reqAnimationFrame(animation);
197	}.bind(this);
198};
199
200var EasyPieChart = function(el, opts) {
201	var defaultOptions = {
202		barColor: '#fff',
203		trackColor: '#535353',
204		lineCap: 'round',
205		lineWidth: 2,
206		size: 120,
207		rotate: 0,
208		animate: {
209			duration: 1000,
210			enabled: true
211		},
212		easing: function (x, t, b, c, d) { 
213			t = t / (d/2);
214			if (t < 1) {
215				return c / 2 * t * t + b;
216			}
217			return -c/2 * ((--t)*(t-2) - 1) + b;
218		},
219		onStart: function(from, to) {
220			return;
221		},
222		onStep: function(from, to, currentValue) {
223			return;
224		},
225		onStop: function(from, to) {
226			return;
227		}
228	};
229
230	// detect present renderer
231	if (typeof(CanvasRenderer) !== 'undefined') {
232		defaultOptions.renderer = CanvasRenderer;
233	} else if (typeof(SVGRenderer) !== 'undefined') {
234		defaultOptions.renderer = SVGRenderer;
235	} else {
236		throw new Error('Please load either the SVG- or the CanvasRenderer');
237	}
238
239	var options = {};
240	var currentValue = 0;
241
242	/**
243	 * Initialize the plugin by creating the options object and initialize rendering
244	 */
245	var init = function() {
246		this.el = el;
247		this.options = options;
248
249		// merge user options into default options
250		for (var i in defaultOptions) {
251			if (defaultOptions.hasOwnProperty(i)) {
252				options[i] = opts && typeof(opts[i]) !== 'undefined' ? opts[i] : defaultOptions[i];
253				if (typeof(options[i]) === 'function') {
254					options[i] = options[i].bind(this);
255				}
256			}
257		}
258
259		// check for jQuery easing
260		if (typeof(options.easing) === 'string' && typeof(jQuery) !== 'undefined' && jQuery.isFunction(jQuery.easing[options.easing])) {
261			options.easing = jQuery.easing[options.easing];
262		} else {
263			options.easing = defaultOptions.easing;
264		}
265
266		// process earlier animate option to avoid bc breaks
267		if (typeof(options.animate) === 'number') {
268			options.animate = {
269				duration: options.animate,
270				enabled: true
271			};
272		}
273
274		if (typeof(options.animate) === 'boolean' && !options.animate) {
275			options.animate = {
276				duration: 1000,
277				enabled: options.animate
278			};
279		}
280
281		// create renderer
282		this.renderer = new options.renderer(el, options);
283
284		// initial draw
285		this.renderer.draw(currentValue);
286
287		// initial update
288		if (el.dataset && el.dataset.percent) {
289			this.update(parseFloat(el.dataset.percent));
290		} else if (el.getAttribute && el.getAttribute('data-percent')) {
291			this.update(parseFloat(el.getAttribute('data-percent')));
292		}
293	}.bind(this);
294
295	/**
296	 * Update the value of the chart
297	 * @param  {number} newValue Number between 0 and 100
298	 * @return {object}          Instance of the plugin for method chaining
299	 */
300	this.update = function(newValue) {
301		newValue = parseFloat(newValue);
302		if (options.animate.enabled) {
303			this.renderer.animate(currentValue, newValue);
304		} else {
305			this.renderer.draw(newValue);
306		}
307		currentValue = newValue;
308		return this;
309	}.bind(this);
310
311	/**
312	 * Disable animation
313	 * @return {object} Instance of the plugin for method chaining
314	 */
315	this.disableAnimation = function() {
316		options.animate.enabled = false;
317		return this;
318	};
319
320	/**
321	 * Enable animation
322	 * @return {object} Instance of the plugin for method chaining
323	 */
324	this.enableAnimation = function() {
325		options.animate.enabled = true;
326		return this;
327	};
328
329	init();
330};
331
332$.fn.easyPieChart = function(options) {
333	return this.each(function() {
334		var instanceOptions;
335
336		if (!$.data(this, 'easyPieChart')) {
337			instanceOptions = $.extend({}, options, $(this).data());
338			$.data(this, 'easyPieChart', new EasyPieChart(this, instanceOptions));
339		}
340	});
341};
342
343
344}));