-
Notifications
You must be signed in to change notification settings - Fork 0
/
jsvg.min.js
10 lines (10 loc) · 13.1 KB
/
jsvg.min.js
1
2
3
4
5
6
7
8
9
10
/*! ****************************************************************************
* JSVG v0.0.4
*
* A tiny Javascript library intended to create and manage SVG elements in the DOM.
* (you can download it from npm or github repositories)
* Copyright (c) 2019 Jclo <jclo@mobilabs.fr> (https://www.mobilabs.fr).
* Released under the MIT license. You may obtain a copy of the License
* at: http://www.opensource.org/licenses/mit-license.php).
* ************************************************************************** */
!function(t,e){"use strict";"function"==typeof define&&define.amd?define([""],e):"object"==typeof exports?(module.exports=e(t),null===t.JSVG&&(t.JSVG=e(t))):t.JSVG=e(t)}(this,function(t){"use strict";var c,e,r,n,a,i,s,o,u,l,h,f,m,d="http://www.w3.org/2000/svg",p="http://www.w3.org/1999/xlink";return(e={JSVGU:{Public:{}},Anim:{Public:{}},Event:{Public:{}},Methods:{Static:{Public:{},Draw:{Public:{}}},Attr:{Public:{}},Text:{Public:{}}}}).Anim.Public={easingLinear:function(t,e,n,r){return n*t/r+e},dAnimationRun:function(t,e){var n,r,a,i,s,o;r=e,s=(n=t)[0],o=s.easing,s.event=n.createEvent(),a={value:0,start:"number"==typeof r.start?r.start:0,stop:"number"==typeof r.start?r.stop:180,t:0,duration:"number"==typeof r.d?r.d:2e3,fn:function(t){return c.draw.arc(0,t,100,80)}},"function"==typeof r.fn&&(a.fn=r.fn),s.isAnimationOn=!0,n.setMessage("isAnimationOn",!0),i=setInterval(function(){a.t+=s.frequency,(a.t>a.duration||a.stop===a.start)&&(a.t=a.duration),a.value=o(a.t,a.start,a.stop-a.start,a.duration),0===a.duration&&(a.value=a.start),s.setAttributeNS(null,"d",a.fn(a.value)),a.t===a.duration&&(clearInterval(i),s.isAnimationOn=!1,n.setMessage("isAnimationOn",!1),s.dispatchEvent(s.event))},s.frequency)},rotateAnimationRun:function(t,e){var n,r,a,i,s,o,u;r=e,o=(n=t)[0],u=o.easing,o.event=n.createEvent(),a={a:0,start:"number"==typeof r.start?r.start:0,stop:"number"==typeof r.stop?r.stop:180,t:0,duration:"number"==typeof r.d?r.d:2e3},o.isAnimationOn=!0,n.setMessage("isAnimationOn",!0),i=setInterval(function(){a.t+=o.frequency,(a.t>a.duration||a.stop===a.start)&&(a.t=a.duration),a.a=u(a.t,a.start,a.stop-a.start,a.duration),(s=c.transformAttrToObj(o.getAttribute("transform"))).rotate.a=a.a,o.setAttributeNS(null,"transform",c.transformAttrToStr(s)),a.t===a.duration&&(clearInterval(i),o.isAnimationOn=!1,n.setMessage("isAnimationOn",!1),o.dispatchEvent(o.event))},o.frequency)},scaleAnimationRun:function(t,e){var n,r,a,i,s,o;n=e,s=t[0],o=s.easing,r={x0:"number"==typeof n.x0?n.x0:0,y0:"number"==typeof n.y0?n.y0:0,x1:"number"==typeof n.x1?n.x1:1,y1:"number"==typeof n.y1?n.y1:1,x:0,y:0,t:0,duration:"number"==typeof n.d?n.d:2e3},a=setInterval(function(){r.t+=s.frequency,r.t>r.duration&&(r.t=r.duration),r.x=o(r.t,r.x0,r.x1-r.x0,r.duration),r.y=o(r.t,r.y0,r.y1-r.y0,r.duration),(i=c.transformAttrToObj(s.getAttribute("transform"))).scale.x=r.x,i.scale.y=r.y,s.setAttributeNS(null,"transform",c.transformAttrToStr(i)),r.t===r.duration&&clearInterval(a)},s.frequency)},translateAnimationRun:function(t,e){var n,r,a,i,s,o,u,l;r=e,u=(n=t)[0],l=u.easing,u.event=n.createEvent(),a=c.transformAttrToObj(n[0].getAttribute("transform")),i={x0:a.translate.x,y0:a.translate.y},s={x:0,y:0,length:Math.sqrt(Math.pow(r.x-i.x0,2)+Math.pow(r.y-i.y0,2)),arc:Math.atan((r.y-i.y0)/(r.x-i.x0)),t:0,duration:2e3},r.x-i.x0<0&&(s.arc+=-Math.PI),0===s.length&&(s.arc=0),"number"==typeof r.d&&(s.duration=r.d),u.isAnimationOn=!0,n.setMessage("isAnimationOn",!0),o=setInterval(function(){s.t+=u.frequency,s.t>s.duration&&(s.t=s.duration),s.x=l(s.t,0,s.length,s.duration)*Math.cos(s.arc)+i.x0,s.y=l(s.t,0,s.length,s.duration)*Math.sin(s.arc)+i.y0,(a=c.transformAttrToObj(u.getAttribute("transform"))).translate.x=s.x,a.translate.y=s.y,u.setAttributeNS(null,"transform",c.transformAttrToStr(a)),!1===u.isAnimationOn||!1===n.getMessage("isAnimationOn")?clearInterval(o):s.t===s.duration&&(clearInterval(o),u.isAnimationOn=!1,n.setMessage("isAnimationOn",!1),u.dispatchEvent(u.event))},u.frequency)},textAnimationRun:function(t,e){var n,r,a,i,s;n=e,a=t[0],i=a.easing,s={value:0,start:"number"==typeof n.start?n.start:0,stop:"number"==typeof n.stop?n.stop:0,t:0,duration:"number"==typeof n.d?n.d:2e3},r=setInterval(function(){s.t+=a.frequency,(s.t>s.duration||s.stop===s.start)&&(s.t=s.duration),s.value=i(s.t,s.start,s.stop-s.start,s.duration),0===s.duration&&(s.value=s.start),a.textContent=s.value.toFixed(0),s.t===s.duration&&clearInterval(r)},a.frequency)}},r=e.Anim.Public,e.Methods.Attr.Public={attr:function(t,e,n){!function(t,e,n){switch(typeof n){case"string":case"number":t[0].setAttributeNS(null,e,n);break;case"object":switch(e){case"d":r.dAnimationRun(t,n);break;case"transform":switch(n.type){case"rotate":r.rotateAnimationRun(t,n);break;case"scale":r.scaleAnimationRun(t,n);break;case"translate":r.translateAnimationRun(t,n);break;default:throw new Error("The animation is not supported for the transform "+n.type+"!")}break;default:throw new Error("The animation is not supported for the attribute "+e+"!")}}}(t,e,n)}},e.Methods.Static.Draw.Public={arc:function(t,e,n,r){return function(t,e,n,r){t=void 0!==t?t:0,e=void 0!==e?e:0,n=void 0!==n?n:0,(t%=2*Math.PI)>2*Math.PI&&(t%=2*Math.PI),e>2*Math.PI&&(e%=2*Math.PI);var a=0;Math.abs(e-t)>Math.PI&&(a=1);var i=Math.cos(t),s=Math.sin(t),o=Math.cos(e),u=Math.sin(e),l="";return void 0!==r&&(l="L"+o*r+","+u*r+"A"+r+","+r+" 0 "+a+",0 "+i*r+","+s*r+"Z"),"M"+i*n+","+s*n+"A"+n+","+n+" 0 "+a+",1 "+o*n+","+u*n+l}(t,e,n,r)},line:function(t,e){return n=e,r="",t.forEach(function(t){null!==t.x&&null!==t.y&&(""===r?r="M"+t.x+","+t.y:r+="L"+t.x+","+t.y)}),!0===n&&(r+="Z"),r;var n,r},multipolyline:function(t,e){return function(t,e){var n,r,a,i;for(n="",a=0;a<t.length;a++){for(r="",i=0;i<t[a].length;i++)null!==t[a][i].x&&null!==t[a][i].y&&(""===r?r="M"+t[a][i].x+","+t[a][i].y:r+="L"+t[a][i].x+","+t[a][i].y);!0===e&&(r+="z"),n+=r}return n}(t,e)}},e.Event.Public={create:function(t){return function(t){var e={},n="animationOver";if(t[0].event)return t[0].event;switch(t.browser){case"modern":e=new Event(n);break;case"old":(e=document.createEvent("Event")).initEvent(n,!0,!0);break;default:throw new Error("This type of browser is not supported!")}return e}(t)}},e.JSVGU.Public={getBrowser:function(){return function(){var e;try{e="modern",new Event("event")}catch(t){e="old";try{document.createEvent("Event")}catch(t){throw e="not supported",new Error("This type of browser is not supported!")}}return e}()},create:function(t,e){return function(t,e){var n,r;if("string"!=typeof e||null===document.getElementById(e))return t[0]=null,void(t.svgRoot=null);(n=document.getElementById(e).getElementsByTagNameNS(d,"svg")[0])&&0!==n.length?t[0]=n:((r=document.createElementNS(d,"svg")).setAttributeNS(null,"version","1.1"),r.setAttributeNS("http://www.w3.org/2000/xmlns/","xmlns",d),r.setAttributeNS("http://www.w3.org/2000/xmlns/","xmlns:xlink",p),t[0]=document.getElementById(e).appendChild(r)),t.svgRoot=t[0]}(t,e)}},e.Methods.Static.Public={addClass:function(t,e){var n=t.getAttributeNS(null,"class");n=n?n+" "+e:e,t.setAttributeNS(null,"class",n)},removeClass:function(t,e){var n=t.getAttributeNS(null,"class");n=n.replace(e,"").replace(/(^\s+|\s+$)/g,""),t.setAttributeNS(null,"class",n)},transformAttrToObj:function(t){return o=/[+-]?((?:[1-9]\d*|0)(?:\.\d*)?|\.\d+)([eE][+-]?\d+)?/g,u=/translate(.*?)\)/,l=/scale(.*?)\)/,c=/rotate(.*?)\)/,h=/skewX(.*?)\)/,f=/skewY(.*?)\)/,m=/matrix(.*?)\)/,n=null===(E="string"==typeof(e=t)?e:"").match(u)?null:(v=(d=E.match(u)[0].match(o))?1===d.length?p=parseFloat(d[0],10):(p=parseFloat(d[0],10),parseFloat(d[1],10)):p=null,{x:p,y:v}),r=null===E.match(l)?null:(g=(y=E.match(l)[0].match(o))?1===y.length?b=parseFloat(y[0],10):(b=parseFloat(y[0],10),parseFloat(y[1],10)):b=null,{x:b,y:g}),a=null===E.match(c)?null:(S=(A=E.match(c)[0].match(o))?1===A.length?(x=parseFloat(A[0],10),w=null):2===A.length?(x=parseFloat(A[0],10),w=parseFloat(A[1],10)):(x=parseFloat(A[0],10),w=parseFloat(A[1],10),parseFloat(A[2],10)):w=x=null,{a:x,cx:w,cy:S}),i=null===E.match(h)?null:E.match(h)[0].match(o)?parseFloat(E.match(h)[0].match(o)[0],10):null,s=null===E.match(f)?null:E.match(f)[0].match(o)?parseFloat(E.match(f)[0].match(o)[0],10):null,E.match(m),{translate:n,scale:r,rotate:a,matrix:null,skewX:i,skewY:s};var e,n,r,a,i,s,o,u,l,c,h,f,m,d,p,v,y,b,g,A,x,w,S,E},transformAttrToStr:function(t){return n="",(e=t).translate&&"number"==typeof e.translate.x&&("number"==typeof e.translate.y?n+="translate("+e.translate.x+", "+e.translate.y+") ":n+="translate("+e.translate.x+", 0) "),e.scale&&"number"==typeof e.scale.x&&("number"==typeof e.scale.y?n+="scale("+e.scale.x+", "+e.scale.y+") ":n+="scale("+e.scale.x+", "+e.scale.x+") "),e.rotate&&"number"==typeof e.rotate.a&&("number"==typeof e.rotate.cx&&"number"==typeof e.rotate.cy?n+="rotate("+e.rotate.a+", "+e.rotate.cx+", "+e.rotate.cy+") ":"number"==typeof e.rotate.cx?n+="rotate("+e.rotate.a+", "+e.rotate.cx+", "+e.rotate.cx+") ":n+="rotate("+e.rotate.a+") "),"number"==typeof e.skewX&&(n+="skewX("+e.skewX+") "),"number"==typeof e.skewY&&(n+="skewY("+e.skewY+") "),n.replace(/(^\s+|\s+$)/g,"");var e,n}},n=e.Anim.Public,e.Methods.Text.Public={text:function(t,e){!function(t,e){switch(typeof e){case"number":case"string":t[0].textContent=e;break;case"object":n.textAnimationRun(t,e)}}(t,e)}},s=e.Methods.Static.Public,o=e.Methods.Static.Draw.Public,u=e.JSVGU.Public,l=e.Methods.Attr.Public,h=e.Methods.Text.Public,f=e.Anim.Public,m=e.Event.Public,c=function(t){var e=Object.create(a);return e.browser=u.getBrowser(),e.id=null,e[0]=null,e.svgRoot=null,t&&(e.id=t.slice(1),u.create(e,e.id)),e},i=t.JSVG,c.noConflict=function(){return t.JSVG=i,this},c.VERSION="0.0.4",c.addClass=function(t,e){s.addClass(t,e)},c.removeClass=function(t,e){s.removeClass(t,e)},c.transformAttrToObj=function(t){return s.transformAttrToObj(t)},c.transformAttrToStr=function(t){return s.transformAttrToStr(t)},c.draw={arc:function(t,e,n,r){return o.arc(t,e,n,r)},line:function(t,e){return o.line(t,e)},multipolyline:function(t,e){return o.multipolyline(t,e)}},a={select:function(t){return this[0]=this[0].querySelector(t),this},parent:function(){if(this[0].parentNode)return this[0]=this[0].parentNode,this;throw new Error("This SVG element has no parent!")},firstParent:function(){return this[0]=this.svgRoot,this},append:function(t){var e=document.createElementNS(d,t);return this[0]=this[0].appendChild(e),this},appendBefore:function(t,e){var n=document.createElementNS(d,t),r=this[0].querySelector(e);return this[0].insertBefore(n,r),this[0]=n,this},appendAfter:function(t,e){var n=document.createElementNS(d,t),r=this[0].querySelector(e).nextElementSibling;return this[0].insertBefore(n,r),this[0]=n,this},appendHTML:function(t){var e;return"string"!=typeof t||((e=document.createElementNS("http://www.w3.org/1999/xhtml","body")).innerHTML=t,this[0]=this[0].appendChild(e)),this},replace:function(t){var e=document.createElementNS(d,t);return this[0].parentNode.replaceChild(e,this[0]),this[0]=e,this},remove:function(){var t;return this[0]&&((t=this[0].parentNode).removeChild(this[0]),this[0]=t),this},removeAllChilds:function(){for(;this[0].firstChild;)this[0].removeChild(this[0].firstChild);return this},animate:function(t,e){return this[0].easing="function"==typeof t?t:f.easingLinear,this[0].frequency=1e3/e||40,this},listen:function(t,e){return"string"==typeof t&&"function"==typeof e&&this[0].addEventListener(t,e),this},listenOnce:function(n,r){var a=this[0];return"string"==typeof n&&"function"==typeof r&&a.addEventListener(n,function t(e){a.removeEventListener(n,t),r(e)}),this},unlisten:function(t,e){return"string"==typeof t&&"function"==typeof e&&this[0].removeEventListener(t,e),this},alink:function(t,e){return this[0].setAttributeNS(p,"xlink:"+t,e),this},attr:function(t,e){return this[0]?l.attr(this,t,e):console.log("warning: this.svgElement is null!"),this},rmattr:function(t){return this[0].removeAttributeNS(null,t),this},text:function(t){return h.text(this,t),this},addClass:function(t){var e=this[0].getAttributeNS(null,"class");return e=e?e+" "+t:t,this[0].setAttributeNS(null,"class",e),this},removeClass:function(t){var e=this[0].getAttributeNS(null,"class");return e&&(e=e.replace(t,"").replace(/(^\s+|\s+$)/g,""),this[0].setAttributeNS(null,"class",e)),this},toggleClass:function(t){var e=this[0].getAttributeNS(null,"class");return e&&e.match(t)?this.removeClass(t):this.addClass(t),this},createEvent:function(){return m.create(this)},query:function(t){return this[0].querySelector(t)},getElement:function(){return this[0]},getAttribute:function(t){return this[0]?this[0].getAttribute(t):null},getComputedStyle:function(){return window.getComputedStyle(this[0])},getPropertyValue:function(t){return this.getPropertyValue(t)},getSize:function(){return{width:this[0].getBoundingClientRect().width,height:this[0].getBoundingClientRect().height}},getAnimationStatus:function(){return this[0].isAnimationOn},stopAnimation:function(){return!!this[0].isAnimationOn&&!(this[0].isAnimationOn=!1)},getAttachedEvent:function(){return this[0].event},trigger:function(t){this[0].dispatchEvent(t)},setMessage:function(t,e){var n,r=this[0].message;return void 0!==r&&r.isArray||(this[0].message=[],r=this[0].message),void 0===r[0]||void 0===r[0][t]?((n={})[t]=e,r.push(n)):r[0][t]=e,this},getMessage:function(t){var e=this[0].message;return void 0===e||void 0===e[0]||void 0===e[0][t]?null:this[0].message[0][t]}},c});