jparticles
Version:
A lightweight, efficient and easy-to-use Canvas library for building some cool particle effects.
2 lines (1 loc) • 2.55 kB
JavaScript
this.JParticles=this.JParticles||{},this.JParticles.Line=function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=function(e,t){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)};return function(e){function n(t,i){var o=e.call(this,n.defaultConfig,t,i)||this;return o.specificAngles=[-180,-90,0,90,180],o.bootstrap(),o}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(n,e),n.prototype.init=function(){this.createLines(this.options.num),this.createLinesOnClick()},n.prototype.createLines=function(e,n){for(var i=this.options,o=i.maxWidth,r=i.minWidth,s=i.maxSpeed,a=i.minSpeed,c=i.maxDegree,l=i.minDegree;e--;)this.elements.push({x:null!=n?n:Math.random()*this.canvasWidth,width:t.randomInRange(o,r),color:this.getColor(),speed:t.randomSpeed(s,a),degree:t.toFixed(t.randomInRange(c,l)%180)})},n.prototype.createLinesOnClick=function(){var e=this;if(this.options.createOnClick){var n=function(n){if(!e.isPaused){var i=n.pageX-t.offset(e.canvas).left;e.createLines(e.options.numberOfCreations,i)}};this.canvas.addEventListener("click",n),this.onDestroy((function(){e.canvas.removeEventListener("click",n)}))}},n.prototype.draw=function(){var e=this,n=this,i=n.ctx,o=n.canvasWidth,r=n.canvasHeight,s=this.options,a=s.removeOnOverflow,c=s.overflowCompensation,l=s.reservedLines;this.clearCanvasAndSetGlobalAttrs();var h=10*Math.hypot(o,r),d=Math.max(0,c);this.elements.forEach((function(n,o){var r=t.degreesToRadians(-n.degree),s=0;e.specificAngles.includes(n.degree)||(s=Math.abs(e.canvasHeight/2/Math.tan(r))),i.save(),i.beginPath(),i.translate(n.x,e.canvasHeight/2),i.rotate(r),i.moveTo(-h,0),i.lineTo(h,0),i.lineWidth=n.width,i.strokeStyle=n.color,i.stroke(),i.closePath(),i.restore(),e.isPaused||(n.x+=n.speed);var c=!1,p=!1;n.x+s+n.width+d<0?(c=!0,p=!0):n.x>e.canvasWidth+s+n.width+d&&(c=!0),c&&(a&&e.elements.length>l?e.elements.splice(o,1):n.speed=Math.abs(n.speed)*(p?1:-1))})),this.requestAnimationFrame()},n.defaultConfig={num:6,maxWidth:2,minWidth:1,maxSpeed:3,minSpeed:1,maxDegree:90,minDegree:80,createOnClick:!0,numberOfCreations:3,removeOnOverflow:!0,overflowCompensation:20,reservedLines:6},n}(n(e).default)}(JParticles.classes.Base,JParticles.utils);