Your IP : 3.129.211.138
(function(){"use strict";BX.namespace("BX.UI.Graph");BX.UI.Graph.Circle=function(t,e,r,s){this.domNode=t;this.perimetr=e;this.radius=e/2;this.progressBar=Number(r)>100?100:r;this.progressBg=null;this.number=null;this.waves=null;this.leftWave=null;this.rightWave=null;this.fixCounter=s.fixCounter?s.fixCounter:null;this.color1=s.color1;this.color2=s.color2;this.x=0;this.flat=400;this.speed=3;this.rate=0;this.wave=35;this.distance=200};BX.UI.Graph.Circle.prototype={getCircumFerence:function(){return(this.radius-10)*2*3.14},getCircumProgress:function(){return this.getCircumFerence()-this.getCircumFerence()/100*this.progressBar},createCircle:function(){this.svg=document.createElementNS("http://www.w3.org/2000/svg","svg");this.svg.setAttributeNS(null,"class","ui-graph-circle-bar");this.svg.setAttributeNS(null,"viewport","0 0 "+this.radius+" "+this.radius);this.svg.setAttributeNS(null,"width",this.perimetr);this.svg.setAttributeNS(null,"height",this.perimetr);this.progressBg=document.createElementNS("http://www.w3.org/2000/svg","circle");this.progressBg.setAttributeNS(null,"r",this.radius-10);this.progressBg.setAttributeNS(null,"cx",this.radius);this.progressBg.setAttributeNS(null,"cy",this.radius);this.progressBg.setAttributeNS(null,"class","ui-graph-circle-bar-bg");this.progressMove=document.createElementNS("http://www.w3.org/2000/svg","circle");this.progressMove.setAttributeNS(null,"r",this.radius-10);this.progressMove.setAttributeNS(null,"cx",this.radius);this.progressMove.setAttributeNS(null,"cy",this.radius);this.progressMove.setAttributeNS(null,"stroke-dasharray",this.getCircumFerence());this.progressMove.setAttributeNS(null,"stroke-dashoffset",this.getCircumFerence());this.progressMove.setAttributeNS(null,"class","ui-graph-circle-bar-progress");this.svg.appendChild(this.progressBg);this.svg.appendChild(this.progressMove);return this.svg},animateFixedBar:function(){this.svg.setAttributeNS(null,"class","ui-graph-circle-bar ui-graph-circle-bar-animate ui-graph-circle-bar-without-animate");this.progressMove.setAttributeNS(null,"stroke-dashoffset",0)},animateProgressBar:function(){this.svg.setAttributeNS(null,"class","ui-graph-circle-bar ui-graph-circle-bar-animate");this.progressMove.setAttributeNS(null,"stroke-dashoffset",this.getCircumProgress())},createCanvas:function(){this.canvas=BX.create("canvas",{attrs:{className:"ui-graph-circle-canvas"}});return this.canvas},createNumberBlock:function(){this.number=BX.create("div",{attrs:{className:"ui-graph-circle-number","data-progress":this.progressBar}});return this.number},drawCircle:function(t,e,r){t.mozImageSmoothingEnabled=false;t.imageSmoothingEnabled=false;t.beginPath();t.arc(e/2,e/2,e/2-1,0,2*Math.PI);t.strokeStyle=r;t.stroke();t.beginPath();t.arc(e/2,e/2,e/2-2,0,2*Math.PI);t.clip()},drawSin:function(t,e,r,s,i,a){t.mozImageSmoothingEnabled=false;t.imageSmoothingEnabled=false;t.save();t.beginPath();t.moveTo(0,e);t.lineTo(0,a);t.quadraticCurveTo(e/4,a-e*(i/200),e/2,a);t.lineTo(e/2,a);t.quadraticCurveTo(e*3/4,a+e*(i/200),e,a);t.lineTo(e,e);t.lineTo(0,e);t.fillStyle=r;t.fill();t.restore()},init:function(t){var e=document.querySelector(".ui-graph-circle-canvas");e.style.height=t;e.width=e.height=t;var r=document.createElement("canvas"),s=r.getContext("2d");r.width=t;r.height=t;var i=document.createElement("canvas"),a=i.getContext("2d");i.width=t;i.height=t;var n=this.x;var h=this.flat;var c=this.speed;var l=this.rate;var o=this.wave;var u=this.distance;var g=e.getContext("2d");if(!this.color1&&!this.color2){this.drawSin(s,t,"rgba(183, 235, 129, .45)","rgba(183, 235, 129, .45)",o,t-t*l);this.drawSin(a,t,"rgba(178, 232, 0, .29)","rgba(178, 232, 0, .29)",o,t-t*l)}else{this.drawSin(s,t,this.color1,this.color1,o,t-t*l);this.drawSin(a,t,this.color2,this.color2,o,t-t*l)}function p(){g.clearRect(0,0,t,t);g.drawImage(r,n,0,t+h,t);g.drawImage(r,n-t-h,0,t+h,t);g.drawImage(i,n-u,0,t+h,t);g.drawImage(i,n-t-u-h,0,t+h,t);n>=t-c+h?n=0:n+=c;requestAnimationFrame(p)}p()},createWavesBlock:function(){return BX.create("div",{attrs:{className:"ui-graph-circle-waves-wrapper"},children:[this.waves=BX.create("div",{attrs:{className:"ui-graph-circle-waves"},children:[this.leftWave=BX.create("div",{attrs:{className:"ui-graph-circle-waves-left"}}),this.rightWave=BX.create("div",{attrs:{className:"ui-graph-circle-waves-right"}})]})]})},animateWavesBlock:function(t){this.progress=this.progressBar;if(t){if(this.progress<=50){this.rate=.45}if(this.progress>50){this.rate=.75}this.progressBar<=25?this.rate=.25:null}else{if(this.progress<=50){this.rate=.5}if(this.progress>50){this.rate=.85}console.log("animateWavesBlock",this.progress)}this.progressBar<=25?this.progress=25:null},animateBothWaves:function(){var t=0;var e=50;var r=15;var s;var i=Date.now();var a=1e3/r;var n;function h(){requestAnimationFrame(h);s=Date.now();n=s-i;if(n>a){i=s-n%a;var r=document.querySelector(".ui-graph-circle-waves-left");var c=document.querySelector(".ui-graph-circle-waves-right");t+=1;e-=1;r.style.transform="translateX("+t+"%)";c.style.transform="translateX("+e+"%)";if(parseInt(t,10)>=50){t=0}if(parseInt(e,10)<=0){e=50}}}h()},createWrapper:function(){this.graph=BX.create("div",{attrs:{className:"ui-graph-circle-wrapper"}});this.graph.appendChild(this.createCanvas());this.graph.appendChild(this.createNumberBlock());return this.graph},addWrapperClass:function(){this.graph.classList.add("ui-graph-circle-wrapper-animate");if(this.fixCounter){this.graph.classList.add("ui-graph-circle-counter")}},animateNumber:function(t){var e=this.progressBar;if(t){e=t}if(Number(e)<=0){if(t){this.number.innerHTML="0"}else{this.number.innerHTML="0"+" <span>%</span>"}return}if(t){this.number.innerHTML=t;this.number.innerHTML.length>=4?this.graph.classList.add("ui-graph-font-sm"):null}else{var r=0;var s=1e3/e;var i=setInterval(function(){r++;this.number.innerHTML=r+" <span>%</span>";r===Number(e)?clearInterval(i):null}.bind(this),s)}},updateCounter:function(t,e){this.progressBar=t;if(e){this.animateNumber(e);this.animateWavesBlock(e)}else{this.animateNumber();this.animateWavesBlock()}},show:function(){this.domNode.appendChild(this.createWrapper());setTimeout(function(){this.addWrapperClass();this.animateNumber(this.fixCounter);if(this.fixCounter){}else{}this.animateWavesBlock(this.fixCounter);this.init(200)}.bind(this),500)}}})();
//# sourceMappingURL=ui.circle.map.js