Socket
Socket
Sign inDemoInstall

circular-progress-bar

Package Overview
Dependencies
Maintainers
1
Versions
7
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

circular-progress-bar - npm Package Compare versions

Comparing version 1.2.1 to 1.2.2

32

circular-progress-bar.js

@@ -41,2 +41,6 @@ const classesPrefix = "circular-progress-bar";

const nodesKey = Symbol("_nodes");
const valueKey = Symbol("_value");
const barsKey = Symbol("bars");
/**

@@ -53,3 +57,3 @@ * Class for CircularProgressBar's Bar

this._nodes = (new Array(2)).fill().map(() => {
this[nodesKey] = (new Array(2)).fill().map(() => {
const clip = wrap("clip", this.node);

@@ -65,3 +69,3 @@ return {

*/
this._value = undefined;
this[valueKey] = undefined;
}

@@ -74,3 +78,3 @@

get value () {
return this._value;
return this[valueKey];
}

@@ -86,6 +90,6 @@

update (value, time, color, offset = 0) {
if (!equals(value, this._value)) {
if (!equals(value, this[valueKey])) {
const half = value / 2;
const rotate = `rotate3d(0,0,1,${toDegree(half) - 180}deg)`;
this._nodes.forEach((node) => {
this[nodesKey].forEach((node) => {
node.clip.style.transitionDuration = `${time}ms`;

@@ -97,5 +101,5 @@ node.part.style.transitionDuration = `${time}ms`;

this._nodes[0].clip.style.transform = `rotate3d(0,0,1,${toDegree(offset) + 0.3}deg)`;
this._nodes[1].clip.style.transform = `rotate3d(0,0,1,${toDegree(half + offset)}deg)`;
this._value = value;
this[nodesKey][0].clip.style.transform = `rotate3d(0,0,1,${toDegree(offset) + 0.3}deg)`;
this[nodesKey][1].clip.style.transform = `rotate3d(0,0,1,${toDegree(half + offset)}deg)`;
this[valueKey] = value;
}

@@ -150,3 +154,3 @@ }

*/
this._bars = [];
this[barsKey] = [];

@@ -188,6 +192,6 @@ this.values = Array.isArray(value) ? value : [value];

values.forEach((value, index) => {
let bar = this._bars[index];
let bar = this[barsKey][index];
if (!bar) {
bar = new Bar(opts.colors[index]);
this._bars.push(bar);
this[barsKey].push(bar);
this.wrapper.appendChild(bar.node);

@@ -200,3 +204,3 @@ }

});
this._bars.splice(lastIndex + 1, this._bars.length).forEach(bar => bar.remove());
this[barsKey].splice(lastIndex + 1, this[barsKey].length).forEach(bar => bar.remove());
}

@@ -209,3 +213,3 @@

get value () {
return this._bars[0].value;
return this[barsKey][0].value;
}

@@ -218,3 +222,3 @@

get values () {
return this._bars.map(bar => bar.value);
return this[barsKey].map(bar => bar.value);
}

@@ -221,0 +225,0 @@

@@ -1,1 +0,1 @@

this.CircularProgressBar=function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=5)}([function(e,t,r){var n=r(1);"string"==typeof n&&(n=[[e.i,n,""]]);var o={hmr:!0,transform:void 0,insertInto:void 0};r(3)(n,o);n.locals&&(e.exports=n.locals)},function(e,t,r){(e.exports=r(2)(!1)).push([e.i,".circular-progress-bar {\n position: relative;\n display: inline-block;\n border-radius: 50%;\n cursor: default;\n}\n.circular-progress-bar .circular-progress-bar-wrapper {\n position: absolute;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-clip,\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-part {\n position: absolute;\n width: 100%;\n height: 100%;\n clip-path: inset(0 0 0 50%);\n transition: transform ease-out;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-clip .circular-progress-bar-part {\n border-radius: 50%;\n transition-property: transform, background-color;\n}\n.circular-progress-bar .circular-progress-bar-value {\n position: absolute;\n border-radius: 50%;\n text-align: center;\n}\n.circular-progress-bar .circular-progress-bar-value .circular-progress-bar-text {\n font-family: monospace;\n color: #FFF;\n mix-blend-mode: difference;\n}\n",""])},function(e,t){e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var r=function(e,t){var r=e[1]||"",n=e[3];if(!n)return r;if(t&&"function"==typeof btoa){var o=function(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}(n),i=n.sources.map(function(e){return"/*# sourceURL="+n.sourceRoot+e+" */"});return[r].concat(i).concat([o]).join("\n")}return[r].join("\n")}(t,e);return t[2]?"@media "+t[2]+"{"+r+"}":r}).join("")},t.i=function(e,r){"string"==typeof e&&(e=[[null,e,""]]);for(var n={},o=0;o<this.length;o++){var i=this[o][0];"number"==typeof i&&(n[i]=!0)}for(o=0;o<e.length;o++){var s=e[o];"number"==typeof s[0]&&n[s[0]]||(r&&!s[2]?s[2]=r:r&&(s[2]="("+s[2]+") and ("+r+")"),t.push(s))}},t}},function(e,t,r){var n={},o=function(e){var t;return function(){return void 0===t&&(t=e.apply(this,arguments)),t}}(function(){return window&&document&&document.all&&!window.atob}),i=function(e){var t={};return function(e){if("function"==typeof e)return e();if(void 0===t[e]){var r=function(e){return document.querySelector(e)}.call(this,e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}t[e]=r}return t[e]}}(),s=null,a=0,u=[],l=r(4);function c(e,t){for(var r=0;r<e.length;r++){var o=e[r],i=n[o.id];if(i){i.refs++;for(var s=0;s<i.parts.length;s++)i.parts[s](o.parts[s]);for(;s<o.parts.length;s++)i.parts.push(b(o.parts[s],t))}else{var a=[];for(s=0;s<o.parts.length;s++)a.push(b(o.parts[s],t));n[o.id]={id:o.id,refs:1,parts:a}}}}function p(e,t){for(var r=[],n={},o=0;o<e.length;o++){var i=e[o],s=t.base?i[0]+t.base:i[0],a={css:i[1],media:i[2],sourceMap:i[3]};n[s]?n[s].parts.push(a):r.push(n[s]={id:s,parts:[a]})}return r}function f(e,t){var r=i(e.insertInto);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var n=u[u.length-1];if("top"===e.insertAt)n?n.nextSibling?r.insertBefore(t,n.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),u.push(t);else if("bottom"===e.insertAt)r.appendChild(t);else{if("object"!=typeof e.insertAt||!e.insertAt.before)throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");var o=i(e.insertInto+" "+e.insertAt.before);r.insertBefore(t,o)}}function d(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e);var t=u.indexOf(e);t>=0&&u.splice(t,1)}function h(e){var t=document.createElement("style");return void 0===e.attrs.type&&(e.attrs.type="text/css"),v(t,e.attrs),f(e,t),t}function v(e,t){Object.keys(t).forEach(function(r){e.setAttribute(r,t[r])})}function b(e,t){var r,n,o,i;if(t.transform&&e.css){if(!(i=t.transform(e.css)))return function(){};e.css=i}if(t.singleton){var u=a++;r=s||(s=h(t)),n=m.bind(null,r,u,!1),o=m.bind(null,r,u,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=function(e){var t=document.createElement("link");return void 0===e.attrs.type&&(e.attrs.type="text/css"),e.attrs.rel="stylesheet",v(t,e.attrs),f(e,t),t}(t),n=function(e,t,r){var n=r.css,o=r.sourceMap,i=void 0===t.convertToAbsoluteUrls&&o;(t.convertToAbsoluteUrls||i)&&(n=l(n));o&&(n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var s=new Blob([n],{type:"text/css"}),a=e.href;e.href=URL.createObjectURL(s),a&&URL.revokeObjectURL(a)}.bind(null,r,t),o=function(){d(r),r.href&&URL.revokeObjectURL(r.href)}):(r=h(t),n=function(e,t){var r=t.css,n=t.media;n&&e.setAttribute("media",n);if(e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}.bind(null,r),o=function(){d(r)});return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else o()}}e.exports=function(e,t){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");(t=t||{}).attrs="object"==typeof t.attrs?t.attrs:{},t.singleton||"boolean"==typeof t.singleton||(t.singleton=o()),t.insertInto||(t.insertInto="head"),t.insertAt||(t.insertAt="bottom");var r=p(e,t);return c(r,t),function(e){for(var o=[],i=0;i<r.length;i++){var s=r[i];(a=n[s.id]).refs--,o.push(a)}e&&c(p(e,t),t);for(i=0;i<o.length;i++){var a;if(0===(a=o[i]).refs){for(var u=0;u<a.parts.length;u++)a.parts[u]();delete n[a.id]}}}};var g=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}();function m(e,t,r,n){var o=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=g(t,o);else{var i=document.createTextNode(o),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(i,s[t]):e.appendChild(i)}}},function(e,t){e.exports=function(e){var t="undefined"!=typeof window&&window.location;if(!t)throw new Error("fixUrls requires window.location");if(!e||"string"!=typeof e)return e;var r=t.protocol+"//"+t.host,n=r+t.pathname.replace(/\/[^\/]*$/,"/");return e.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(e,t){var o,i=t.trim().replace(/^"(.*)"$/,function(e,t){return t}).replace(/^'(.*)'$/,function(e,t){return t});return/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(i)?e:(o=0===i.indexOf("//")?i:0===i.indexOf("/")?r+i:n+i.replace(/^\.\//,""),"url("+JSON.stringify(o)+")")})}},function(e,t,r){"use strict";r.r(t);r(0);const n=(e,t)=>{const r=document.createElement("div");return r.className="circular-progress-bar"+(e?`-${e}`:""),t&&t.appendChild(r),r},o=(e,t)=>e[t%e.length],i=(e,t)=>Math.abs(e-t)<Number.EPSILON,s=e=>3.6*e;class a{constructor(){this.node=n("bar"),this._nodes=new Array(2).fill().map(()=>{const e=n("clip",this.node);return{clip:e,part:n("part",e)}}),this._value=void 0}get value(){return this._value}update(e,t,r,n=0){if(!i(e,this._value)){const o=e/2,i=`rotate3d(0,0,1,${s(o)-180}deg)`;this._nodes.forEach(e=>{e.clip.style.transitionDuration=`${t}ms`,e.part.style.transitionDuration=`${t}ms`,e.part.style.transform=i,e.part.style.backgroundColor=r}),this._nodes[0].clip.style.transform=`rotate3d(0,0,1,${s(n)+.3}deg)`,this._nodes[1].clip.style.transform=`rotate3d(0,0,1,${s(o+n)}deg)`,this._value=e}}remove(){this.node.remove()}}class u{constructor(e=0,t){this.options=Object.assign(u.defaultOptions,t),this.node=n();const r=`${this.options.size}px`;this.node.style.width=r,this.node.style.height=r,this.node.style.backgroundColor=this.options.background,this.wrapper=n("wrapper",this.node),this.valueNode=n("value",this.node),this.valueNode.style.backgroundColor=this.options.valueBackground;const o=this.options.size*(this.options.barsWidth/100),i=`${this.options.size-2*o}px`;this.valueNode.style.width=i,this.valueNode.style.height=i,this.valueNode.style.lineHeight=i;const s=`${o}px`;this.valueNode.style.top=s,this.valueNode.style.left=s,this.valueTextNode=n("text",this.valueNode),this.valueTextNode.style.fontSize=`${this.options.size/5}px`,this._bars=[],this.values=Array.isArray(e)?e:[e]}set value(e){this.values=[e]}set values(e){const t=this.options;if(this.valueNode.style.visibility=t.showValue?"":"hidden",t.showValue){const r=e.reduce((e,t)=>e+t,0),n=Math.min(1===e.length?e[0]:r,t.max);if(n===t.max&&null!==t.valueWhenDone)this.valueTextNode.textContent!==t.valueWhenDone&&setTimeout(()=>this.valueTextNode.textContent=t.valueWhenDone,t.transitionTime);else{const e="%"===t.valueUnit?n/t.max*100:n;this.valueTextNode.textContent=e.toFixed(t.valueDecimals)+t.valueUnit}}let r=0,n=0;e.forEach((e,i)=>{let s=this._bars[i];s||(s=new a(t.colors[i]),this._bars.push(s),this.wrapper.appendChild(s.node));const u=Math.min(e,t.max)/t.max*100;s.update(u,t.transitionTime,o(t.colors,i),r),r+=u,n=i}),this._bars.splice(n+1,this._bars.length).forEach(e=>e.remove())}get value(){return this._bars[0].value}get values(){return this._bars.map(e=>e.value)}appendTo(e){e.appendChild(this.node)}remove(){this.node.remove()}static get defaultOptions(){return{size:150,barsWidth:7,max:100,showValue:!0,valueDecimals:0,valueUnit:"%",valueBackground:"#333",colors:["#0095ff","#ffa114","#4714ff","#ff14c8","#c8ff14","#204dff","#ff203a","#3aff20"],background:"rgba(0, 0, 0, .3)",transitionTime:500,valueWhenDone:null}}}t.default=u}]).default;
this.CircularProgressBar=function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=5)}([function(e,t,r){var n=r(1);"string"==typeof n&&(n=[[e.i,n,""]]);var o={hmr:!0,transform:void 0,insertInto:void 0};r(3)(n,o);n.locals&&(e.exports=n.locals)},function(e,t,r){(e.exports=r(2)(!1)).push([e.i,".circular-progress-bar {\n position: relative;\n display: inline-block;\n border-radius: 50%;\n cursor: default;\n}\n.circular-progress-bar .circular-progress-bar-wrapper {\n position: absolute;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-clip,\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-part {\n position: absolute;\n width: 100%;\n height: 100%;\n clip-path: inset(0 0 0 50%);\n transition: transform ease-out;\n}\n.circular-progress-bar .circular-progress-bar-wrapper .circular-progress-bar-bar .circular-progress-bar-clip .circular-progress-bar-part {\n border-radius: 50%;\n transition-property: transform, background-color;\n}\n.circular-progress-bar .circular-progress-bar-value {\n position: absolute;\n border-radius: 50%;\n text-align: center;\n}\n.circular-progress-bar .circular-progress-bar-value .circular-progress-bar-text {\n font-family: monospace;\n color: #FFF;\n mix-blend-mode: difference;\n}\n",""])},function(e,t,r){"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var r=function(e,t){var r=e[1]||"",n=e[3];if(!n)return r;if(t&&"function"==typeof btoa){var o=(s=n,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(s))))+" */"),i=n.sources.map(function(e){return"/*# sourceURL="+n.sourceRoot+e+" */"});return[r].concat(i).concat([o]).join("\n")}var s;return[r].join("\n")}(t,e);return t[2]?"@media "+t[2]+"{"+r+"}":r}).join("")},t.i=function(e,r){"string"==typeof e&&(e=[[null,e,""]]);for(var n={},o=0;o<this.length;o++){var i=this[o][0];null!=i&&(n[i]=!0)}for(o=0;o<e.length;o++){var s=e[o];null!=s[0]&&n[s[0]]||(r&&!s[2]?s[2]=r:r&&(s[2]="("+s[2]+") and ("+r+")"),t.push(s))}},t}},function(e,t,r){var n,o,i={},s=(n=function(){return window&&document&&document.all&&!window.atob},function(){return void 0===o&&(o=n.apply(this,arguments)),o}),a=function(e){var t={};return function(e){if("function"==typeof e)return e();if(void 0===t[e]){var r=function(e){return document.querySelector(e)}.call(this,e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}t[e]=r}return t[e]}}(),l=null,u=0,c=[],p=r(4);function f(e,t){for(var r=0;r<e.length;r++){var n=e[r],o=i[n.id];if(o){o.refs++;for(var s=0;s<o.parts.length;s++)o.parts[s](n.parts[s]);for(;s<n.parts.length;s++)o.parts.push(m(n.parts[s],t))}else{var a=[];for(s=0;s<n.parts.length;s++)a.push(m(n.parts[s],t));i[n.id]={id:n.id,refs:1,parts:a}}}}function d(e,t){for(var r=[],n={},o=0;o<e.length;o++){var i=e[o],s=t.base?i[0]+t.base:i[0],a={css:i[1],media:i[2],sourceMap:i[3]};n[s]?n[s].parts.push(a):r.push(n[s]={id:s,parts:[a]})}return r}function h(e,t){var r=a(e.insertInto);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var n=c[c.length-1];if("top"===e.insertAt)n?n.nextSibling?r.insertBefore(t,n.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),c.push(t);else if("bottom"===e.insertAt)r.appendChild(t);else{if("object"!=typeof e.insertAt||!e.insertAt.before)throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");var o=a(e.insertInto+" "+e.insertAt.before);r.insertBefore(t,o)}}function v(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e);var t=c.indexOf(e);t>=0&&c.splice(t,1)}function b(e){var t=document.createElement("style");return void 0===e.attrs.type&&(e.attrs.type="text/css"),g(t,e.attrs),h(e,t),t}function g(e,t){Object.keys(t).forEach(function(r){e.setAttribute(r,t[r])})}function m(e,t){var r,n,o,i;if(t.transform&&e.css){if(!(i=t.transform(e.css)))return function(){};e.css=i}if(t.singleton){var s=u++;r=l||(l=b(t)),n=w.bind(null,r,s,!1),o=w.bind(null,r,s,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=function(e){var t=document.createElement("link");return void 0===e.attrs.type&&(e.attrs.type="text/css"),e.attrs.rel="stylesheet",g(t,e.attrs),h(e,t),t}(t),n=function(e,t,r){var n=r.css,o=r.sourceMap,i=void 0===t.convertToAbsoluteUrls&&o;(t.convertToAbsoluteUrls||i)&&(n=p(n));o&&(n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var s=new Blob([n],{type:"text/css"}),a=e.href;e.href=URL.createObjectURL(s),a&&URL.revokeObjectURL(a)}.bind(null,r,t),o=function(){v(r),r.href&&URL.revokeObjectURL(r.href)}):(r=b(t),n=function(e,t){var r=t.css,n=t.media;n&&e.setAttribute("media",n);if(e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}.bind(null,r),o=function(){v(r)});return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else o()}}e.exports=function(e,t){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");(t=t||{}).attrs="object"==typeof t.attrs?t.attrs:{},t.singleton||"boolean"==typeof t.singleton||(t.singleton=s()),t.insertInto||(t.insertInto="head"),t.insertAt||(t.insertAt="bottom");var r=d(e,t);return f(r,t),function(e){for(var n=[],o=0;o<r.length;o++){var s=r[o];(a=i[s.id]).refs--,n.push(a)}e&&f(d(e,t),t);for(o=0;o<n.length;o++){var a;if(0===(a=n[o]).refs){for(var l=0;l<a.parts.length;l++)a.parts[l]();delete i[a.id]}}}};var y,x=(y=[],function(e,t){return y[e]=t,y.filter(Boolean).join("\n")});function w(e,t,r,n){var o=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=x(t,o);else{var i=document.createTextNode(o),s=e.childNodes;s[t]&&e.removeChild(s[t]),s.length?e.insertBefore(i,s[t]):e.appendChild(i)}}},function(e,t){e.exports=function(e){var t="undefined"!=typeof window&&window.location;if(!t)throw new Error("fixUrls requires window.location");if(!e||"string"!=typeof e)return e;var r=t.protocol+"//"+t.host,n=r+t.pathname.replace(/\/[^\/]*$/,"/");return e.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(e,t){var o,i=t.trim().replace(/^"(.*)"$/,function(e,t){return t}).replace(/^'(.*)'$/,function(e,t){return t});return/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(i)?e:(o=0===i.indexOf("//")?i:0===i.indexOf("/")?r+i:n+i.replace(/^\.\//,""),"url("+JSON.stringify(o)+")")})}},function(e,t,r){"use strict";r.r(t);r(0);const n=(e,t)=>{const r=document.createElement("div");return r.className="circular-progress-bar"+(e?`-${e}`:""),t&&t.appendChild(r),r},o=(e,t)=>e[t%e.length],i=(e,t)=>Math.abs(e-t)<Number.EPSILON,s=e=>3.6*e,a=Symbol("_nodes"),l=Symbol("_value"),u=Symbol("bars");class c{constructor(){this.node=n("bar"),this[a]=new Array(2).fill().map(()=>{const e=n("clip",this.node);return{clip:e,part:n("part",e)}}),this[l]=void 0}get value(){return this[l]}update(e,t,r,n=0){if(!i(e,this[l])){const o=e/2,i=`rotate3d(0,0,1,${s(o)-180}deg)`;this[a].forEach(e=>{e.clip.style.transitionDuration=`${t}ms`,e.part.style.transitionDuration=`${t}ms`,e.part.style.transform=i,e.part.style.backgroundColor=r}),this[a][0].clip.style.transform=`rotate3d(0,0,1,${s(n)+.3}deg)`,this[a][1].clip.style.transform=`rotate3d(0,0,1,${s(o+n)}deg)`,this[l]=e}}remove(){this.node.remove()}}class p{constructor(e=0,t){this.options=Object.assign(p.defaultOptions,t),this.node=n();const r=`${this.options.size}px`;this.node.style.width=r,this.node.style.height=r,this.node.style.backgroundColor=this.options.background,this.wrapper=n("wrapper",this.node),this.valueNode=n("value",this.node),this.valueNode.style.backgroundColor=this.options.valueBackground;const o=this.options.size*(this.options.barsWidth/100),i=`${this.options.size-2*o}px`;this.valueNode.style.width=i,this.valueNode.style.height=i,this.valueNode.style.lineHeight=i;const s=`${o}px`;this.valueNode.style.top=s,this.valueNode.style.left=s,this.valueTextNode=n("text",this.valueNode),this.valueTextNode.style.fontSize=`${this.options.size/5}px`,this[u]=[],this.values=Array.isArray(e)?e:[e]}set value(e){this.values=[e]}set values(e){const t=this.options;if(this.valueNode.style.visibility=t.showValue?"":"hidden",t.showValue){const r=e.reduce((e,t)=>e+t,0),n=Math.min(1===e.length?e[0]:r,t.max);if(n===t.max&&null!==t.valueWhenDone)this.valueTextNode.textContent!==t.valueWhenDone&&setTimeout(()=>this.valueTextNode.textContent=t.valueWhenDone,t.transitionTime);else{const e="%"===t.valueUnit?n/t.max*100:n;this.valueTextNode.textContent=e.toFixed(t.valueDecimals)+t.valueUnit}}let r=0,n=0;e.forEach((e,i)=>{let s=this[u][i];s||(s=new c(t.colors[i]),this[u].push(s),this.wrapper.appendChild(s.node));const a=Math.min(e,t.max)/t.max*100;s.update(a,t.transitionTime,o(t.colors,i),r),r+=a,n=i}),this[u].splice(n+1,this[u].length).forEach(e=>e.remove())}get value(){return this[u][0].value}get values(){return this[u].map(e=>e.value)}appendTo(e){e.appendChild(this.node)}remove(){this.node.remove()}static get defaultOptions(){return{size:150,barsWidth:7,max:100,showValue:!0,valueDecimals:0,valueUnit:"%",valueBackground:"#333",colors:["#0095ff","#ffa114","#4714ff","#ff14c8","#c8ff14","#204dff","#ff203a","#3aff20"],background:"rgba(0, 0, 0, .3)",transitionTime:500,valueWhenDone:null}}}t.default=p}]).default;
{
"name": "circular-progress-bar",
"version": "1.2.1",
"version": "1.2.2",
"description": "CSS circular progress bar.",

@@ -15,3 +15,3 @@ "main": "app.js",

"lint": "eslint circular-progress-bar.js",
"test": "ava",
"test": "ava tests",
"build": "lessc circular-progress-bar.less circular-progress-bar.css && webpack --mode=development",

@@ -42,13 +42,13 @@ "prepublishOnly": "npm run lint && npm test && webpack --mode=production"

"devDependencies": {
"@gmartigny/eslint-config": "^1.2.1",
"ava": "^0.25.0",
"css-loader": "^1.0.0",
"eslint": "^5.2.0",
"eslint-plugin-import": "^2.13.0",
"esm": "^3.0.72",
"less": "^3.8.0",
"@gmartigny/eslint-config": "^1.2.3",
"ava": "^1.2.1",
"css-loader": "^2.1.0",
"eslint": "^5.13.0",
"eslint-plugin-import": "^2.16.0",
"esm": "^3.2.4",
"less": "^3.9.0",
"style-loader": "^0.21.0",
"webpack": "^4.16.2",
"webpack-command": "^0.4.1"
"webpack": "^4.29.3",
"webpack-cli": "^3.2.3"
}
}

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc