=0;n--)this.value[n]=[this.value[n][0]+t,this.value[n][1]+e];return this},size:function(t,e){var i,n=this.bbox();for(i=this.value.length-1;i>=0;i--)n.width&&(this.value[i][0]=(this.value[i][0]-n.x)*t/n.width+n.x),n.height&&(this.value[i][1]=(this.value[i][1]-n.y)*e/n.height+n.y);return this},bbox:function(){return b.parser.poly.setAttribute("points",this.toString()),b.parser.poly.getBBox()}});for(var C={M:function(t,e,i){return e.x=i.x=t[0],e.y=i.y=t[1],["M",e.x,e.y]},L:function(t,e){return e.x=t[0],e.y=t[1],["L",t[0],t[1]]},H:function(t,e){return e.x=t[0],["H",t[0]]},V:function(t,e){return e.y=t[0],["V",t[0]]},C:function(t,e){return e.x=t[4],e.y=t[5],["C",t[0],t[1],t[2],t[3],t[4],t[5]]},S:function(t,e){return e.x=t[2],e.y=t[3],["S",t[0],t[1],t[2],t[3]]},Q:function(t,e){return e.x=t[2],e.y=t[3],["Q",t[0],t[1],t[2],t[3]]},T:function(t,e){return e.x=t[0],e.y=t[1],["T",t[0],t[1]]},Z:function(t,e,i){return e.x=i.x,e.y=i.y,["Z"]},A:function(t,e){return e.x=t[5],e.y=t[6],["A",t[0],t[1],t[2],t[3],t[4],t[5],t[6]]}},N="mlhvqtcsaz".split(""),A=0,P=N.length;A=0;r--)n=this.value[r][0],"M"==n||"L"==n||"T"==n?(this.value[r][1]+=t,this.value[r][2]+=e):"H"==n?this.value[r][1]+=t:"V"==n?this.value[r][1]+=e:"C"==n||"S"==n||"Q"==n?(this.value[r][1]+=t,this.value[r][2]+=e,this.value[r][3]+=t,this.value[r][4]+=e,"C"==n&&(this.value[r][5]+=t,this.value[r][6]+=e)):"A"==n&&(this.value[r][6]+=t,this.value[r][7]+=e);return this},size:function(t,e){var i,n,r=this.bbox();for(i=this.value.length-1;i>=0;i--)n=this.value[i][0],"M"==n||"L"==n||"T"==n?(this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x,this.value[i][2]=(this.value[i][2]-r.y)*e/r.height+r.y):"H"==n?this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x:"V"==n?this.value[i][1]=(this.value[i][1]-r.y)*e/r.height+r.y:"C"==n||"S"==n||"Q"==n?(this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x,this.value[i][2]=(this.value[i][2]-r.y)*e/r.height+r.y,this.value[i][3]=(this.value[i][3]-r.x)*t/r.width+r.x,this.value[i][4]=(this.value[i][4]-r.y)*e/r.height+r.y,"C"==n&&(this.value[i][5]=(this.value[i][5]-r.x)*t/r.width+r.x,this.value[i][6]=(this.value[i][6]-r.y)*e/r.height+r.y)):"A"==n&&(this.value[i][1]=this.value[i][1]*t/r.width,this.value[i][2]=this.value[i][2]*e/r.height,this.value[i][6]=(this.value[i][6]-r.x)*t/r.width+r.x,this.value[i][7]=(this.value[i][7]-r.y)*e/r.height+r.y);return this},equalCommands:function(t){var e,i,n;for(t=new b.PathArray(t),n=this.value.length===t.value.length,e=0,i=this.value.length;n&&ea);return n},bbox:function(){return b.parser.path.setAttribute("d",this.toString()),b.parser.path.getBBox()}}),b.Number=b.invent({create:function(t,e){this.value=0,this.unit=e||"","number"==typeof t?this.value=isNaN(t)?0:isFinite(t)?t:t<0?-3.4e38:3.4e38:"string"==typeof t?(e=t.match(b.regex.numberAndUnit))&&(this.value=parseFloat(e[1]),"%"==e[5]?this.value/=100:"s"==e[5]&&(this.value*=1e3),this.unit=e[5]):t instanceof b.Number&&(this.value=t.valueOf(),this.unit=t.unit)},extend:{toString:function(){return("%"==this.unit?~~(1e8*this.value)/1e6:"s"==this.unit?this.value/1e3:this.value)+this.unit},toJSON:function(){return this.toString()},valueOf:function(){return this.value},plus:function(t){return t=new b.Number(t),new b.Number(this+t,this.unit||t.unit)},minus:function(t){return t=new b.Number(t),new b.Number(this-t,this.unit||t.unit)},times:function(t){return t=new b.Number(t),new b.Number(this*t,this.unit||t.unit)},divide:function(t){return t=new b.Number(t),new b.Number(this/t,this.unit||t.unit)},to:function(t){var e=new b.Number(this);return"string"==typeof t&&(e.unit=t),e},morph:function(t){return this.destination=new b.Number(t),t.relative&&(this.destination.value+=this.value),this},at:function(t){return this.destination?new b.Number(this.destination).minus(this).times(t).plus(this):this}}}),b.Element=b.invent({create:function(t){this._stroke=b.defaults.attrs.stroke,this._event=null,this._events={},this.dom={},(this.node=t)&&(this.type=t.nodeName,this.node.instance=this,this._events=t._events||{},this._stroke=t.getAttribute("stroke")||this._stroke)},extend:{x:function(t){return this.attr("x",t)},y:function(t){return this.attr("y",t)},cx:function(t){return null==t?this.x()+this.width()/2:this.x(t-this.width()/2)},cy:function(t){return null==t?this.y()+this.height()/2:this.y(t-this.height()/2)},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},width:function(t){return this.attr("width",t)},height:function(t){return this.attr("height",t)},size:function(t,e){var i=l(this,t,e);return this.width(new b.Number(i.width)).height(new b.Number(i.height))},clone:function(t){this.writeDataToDom();var e=x(this.node.cloneNode(!0));return t?t.add(e):this.after(e),e},remove:function(){return this.parent()&&this.parent().removeElement(this),this},replace:function(t){return this.after(t).remove(),t},addTo:function(t){return t.put(this)},putIn:function(t){return t.add(this)},id:function(t){return this.attr("id",t)},inside:function(t,e){var i=this.bbox();return t>i.x&&e>i.y&&t/,"").replace(/<\/svg>$/,"");i.innerHTML="";for(var n=0,r=i.firstChild.childNodes.length;n":function(t){return-Math.cos(t*Math.PI)/2+.5},">":function(t){return Math.sin(t*Math.PI/2)},"<":function(t){return 1-Math.cos(t*Math.PI/2)}},b.morph=function(t){return function(e,i){return new b.MorphObj(e,i).at(t)}},b.Situation=b.invent({create:function(t){this.init=!1,this.reversed=!1,this.reversing=!1,this.duration=new b.Number(t.duration).valueOf(),this.delay=new b.Number(t.delay).valueOf(),this.start=+new Date+this.delay,this.finish=this.start+this.duration,this.ease=t.ease,this.loop=0,this.loops=!1,this.animations={},this.attrs={},this.styles={},this.transforms=[],this.once={}}}),b.FX=b.invent({create:function(t){this._target=t,this.situations=[],this.active=!1,this.situation=null,this.paused=!1,this.lastPos=0,this.pos=0,this.absPos=0,this._speed=1},extend:{animate:function(t,e,i){"object"==typeof t&&(e=t.ease,i=t.delay,t=t.duration);var n=new b.Situation({duration:t||1e3,delay:i||0,ease:b.easing[e||"-"]||e});return this.queue(n),this},delay:function(t){var e=new b.Situation({duration:t,delay:0,ease:b.easing["-"]});return this.queue(e)},target:function(t){return t&&t instanceof b.Element?(this._target=t,this):this._target},timeToAbsPos:function(t){return(t-this.situation.start)/(this.situation.duration/this._speed)},absPosToTime:function(t){return this.situation.duration/this._speed*t+this.situation.start},startAnimFrame:function(){this.stopAnimFrame(),this.animationFrame=t.requestAnimationFrame(function(){this.step()}.bind(this))},stopAnimFrame:function(){t.cancelAnimationFrame(this.animationFrame)},start:function(){return!this.active&&this.situation&&(this.active=!0,this.startCurrent()),this},startCurrent:function(){return this.situation.start=+new Date+this.situation.delay/this._speed,this.situation.finish=this.situation.start+this.situation.duration/this._speed,this.initAnimations().step()},queue:function(t){return("function"==typeof t||t instanceof b.Situation)&&this.situations.push(t),this.situation||(this.situation=this.situations.shift()),this},dequeue:function(){return this.stop(),this.situation=this.situations.shift(),this.situation&&(this.situation instanceof b.Situation?this.start():this.situation.call(this)),this},initAnimations:function(){var t,e,i,n=this.situation;if(n.init)return this;for(t in n.animations)for(i=this.target()[t](),Array.isArray(i)||(i=[i]),Array.isArray(n.animations[t])||(n.animations[t]=[n.animations[t]]),e=i.length;e--;)n.animations[t][e]instanceof b.Number&&(i[e]=new b.Number(i[e])),n.animations[t][e]=i[e].morph(n.animations[t][e]);for(t in n.attrs)n.attrs[t]=new b.MorphObj(this.target().attr(t),n.attrs[t]);for(t in n.styles)n.styles[t]=new b.MorphObj(this.target().style(t),n.styles[t]);return n.initialTransformation=this.target().matrixify(),n.init=!0,this},clearQueue:function(){return this.situations=[],this},clearCurrent:function(){return this.situation=null,this},stop:function(t,e){var i=this.active;return this.active=!1,e&&this.clearQueue(),t&&this.situation&&(!i&&this.startCurrent(),this.atEnd()),this.stopAnimFrame(),this.clearCurrent()},reset:function(){if(this.situation){var t=this.situation;this.stop(),this.situation=t,this.atStart()}return this},finish:function(){for(this.stop(!0,!1);this.dequeue().situation&&this.stop(!0,!1););return this.clearQueue().clearCurrent(),this},atStart:function(){return this.at(0,!0)},atEnd:function(){return!0===this.situation.loops&&(this.situation.loops=this.situation.loop+1),"number"==typeof this.situation.loops?this.at(this.situation.loops,!0):this.at(1,!0)},at:function(t,e){var i=this.situation.duration/this._speed;return this.absPos=t,e||(this.situation.reversed&&(this.absPos=1-this.absPos),this.absPos+=this.situation.loop),this.situation.start=+new Date-this.absPos*i,this.situation.finish=this.situation.start+i,this.step(!0)},speed:function(t){return 0===t?this.pause():t?(this._speed=t,this.at(this.absPos,!0)):this._speed},loop:function(t,e){var i=this.last();return i.loops=null==t||t,i.loop=0,e&&(i.reversing=!0),this},pause:function(){return this.paused=!0,this.stopAnimFrame(),this},play:function(){return this.paused?(this.paused=!1,this.at(this.absPos,!0)):this},reverse:function(t){var e=this.last();return e.reversed=void 0===t?!e.reversed:t,this},progress:function(t){return t?this.situation.ease(this.pos):this.pos},after:function(t){var e=this.last(),i=function i(n){n.detail.situation==e&&(t.call(this,e),this.off("finished.fx",i))};return this.target().on("finished.fx",i),this._callStart()},during:function(t){var e=this.last(),i=function(i){i.detail.situation==e&&t.call(this,i.detail.pos,b.morph(i.detail.pos),i.detail.eased,e)};return this.target().off("during.fx",i).on("during.fx",i),this.after(function(){this.off("during.fx",i)}),this._callStart()},afterAll:function(t){var e=function e(i){t.call(this),this.off("allfinished.fx",e)};return this.target().off("allfinished.fx",e).on("allfinished.fx",e),this._callStart()},duringAll:function(t){var e=function(e){t.call(this,e.detail.pos,b.morph(e.detail.pos),e.detail.eased,e.detail.situation)};return this.target().off("during.fx",e).on("during.fx",e),this.afterAll(function(){this.off("during.fx",e)}),this._callStart()},last:function(){return this.situations.length?this.situations[this.situations.length-1]:this.situation},add:function(t,e,i){return this.last()[i||"animations"][t]=e,this._callStart()},step:function(t){if(t||(this.absPos=this.timeToAbsPos(+new Date)),!1!==this.situation.loops){var e,i,n;e=Math.max(this.absPos,0),i=Math.floor(e),!0===this.situation.loops||ithis.lastPos&&s<=r&&(this.situation.once[s].call(this.target(),this.pos,r),delete this.situation.once[s]);return this.active&&this.target().fire("during",{pos:this.pos,eased:r,fx:this,situation:this.situation}),this.situation?(this.eachAt(),1==this.pos&&!this.situation.reversed||this.situation.reversed&&0==this.pos?(this.stopAnimFrame(),this.target().fire("finished",{fx:this,situation:this.situation}),this.situations.length||(this.target().fire("allfinished"),this.situations.length||(this.target().off(".fx"),this.active=!1)),this.active?this.dequeue():this.clearCurrent()):!this.paused&&this.active&&this.startAnimFrame(),this.lastPos=r,this):this},eachAt:function(){var t,e,i,n=this,r=this.target(),s=this.situation;for(t in s.animations)i=[].concat(s.animations[t]).map(function(t){return"string"!=typeof t&&t.at?t.at(s.ease(n.pos),n.pos):t}),r[t].apply(r,i);for(t in s.attrs)i=[t].concat(s.attrs[t]).map(function(t){return"string"!=typeof t&&t.at?t.at(s.ease(n.pos),n.pos):t}),r.attr.apply(r,i);for(t in s.styles)i=[t].concat(s.styles[t]).map(function(t){return"string"!=typeof t&&t.at?t.at(s.ease(n.pos),n.pos):t}),r.style.apply(r,i);if(s.transforms.length){for(i=s.initialTransformation,t=0,e=s.transforms.length;t=0;--e)this[k[e]]=null!=t[k[e]]?t[k[e]]:i[k[e]]},extend:{extract:function(){var t=c(this,0,1),e=c(this,1,0),i=180/Math.PI*Math.atan2(t.y,t.x)-90;return{x:this.e,y:this.f,transformedX:(this.e*Math.cos(i*Math.PI/180)+this.f*Math.sin(i*Math.PI/180))/Math.sqrt(this.a*this.a+this.b*this.b),transformedY:(this.f*Math.cos(i*Math.PI/180)+this.e*Math.sin(-i*Math.PI/180))/Math.sqrt(this.c*this.c+this.d*this.d),skewX:-i,skewY:180/Math.PI*Math.atan2(e.y,e.x),scaleX:Math.sqrt(this.a*this.a+this.b*this.b),scaleY:Math.sqrt(this.c*this.c+this.d*this.d),rotation:i,a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f,matrix:new b.Matrix(this)}},clone:function(){return new b.Matrix(this)},morph:function(t){return this.destination=new b.Matrix(t),this},at:function(t){return this.destination?new b.Matrix({a:this.a+(this.destination.a-this.a)*t,b:this.b+(this.destination.b-this.b)*t,c:this.c+(this.destination.c-this.c)*t,d:this.d+(this.destination.d-this.d)*t,e:this.e+(this.destination.e-this.e)*t,f:this.f+(this.destination.f-this.f)*t}):this},multiply:function(t){return new b.Matrix(this.native().multiply(d(t).native()))},inverse:function(){return new b.Matrix(this.native().inverse())},translate:function(t,e){return new b.Matrix(this.native().translate(t||0,e||0))},scale:function(t,e,i,n){return 1==arguments.length?e=t:3==arguments.length&&(n=i,i=e,e=t),this.around(i,n,new b.Matrix(t,0,0,e,0,0))},rotate:function(t,e,i){return t=b.utils.radians(t),this.around(e,i,new b.Matrix(Math.cos(t),Math.sin(t),-Math.sin(t),Math.cos(t),0,0))},flip:function(t,e){return"x"==t?this.scale(-1,1,e,0):"y"==t?this.scale(1,-1,0,e):this.scale(-1,-1,t,null!=e?e:t)},skew:function(t,e,i,n){
+return 1==arguments.length?e=t:3==arguments.length&&(n=i,i=e,e=t),t=b.utils.radians(t),e=b.utils.radians(e),this.around(i,n,new b.Matrix(1,Math.tan(e),Math.tan(t),1,0,0))},skewX:function(t,e,i){return this.skew(t,0,e,i)},skewY:function(t,e,i){return this.skew(0,t,e,i)},around:function(t,e,i){return this.multiply(new b.Matrix(1,0,0,1,t||0,e||0)).multiply(i).multiply(new b.Matrix(1,0,0,1,-t||0,-e||0))},native:function(){for(var t=b.parser.native.createSVGMatrix(),e=k.length-1;e>=0;e--)t[k[e]]=this[k[e]];return t},toString:function(){return"matrix("+g(this.a)+","+g(this.b)+","+g(this.c)+","+g(this.d)+","+g(this.e)+","+g(this.f)+")"}},parent:b.Element,construct:{ctm:function(){return new b.Matrix(this.node.getCTM())},screenCTM:function(){if(this instanceof b.Nested){var t=this.rect(1,1),e=t.node.getScreenCTM();return t.remove(),new b.Matrix(e)}return new b.Matrix(this.node.getScreenCTM())}}}),b.Point=b.invent({create:function(t,e){var i,n={x:0,y:0};i=Array.isArray(t)?{x:t[0],y:t[1]}:"object"==typeof t?{x:t.x,y:t.y}:null!=t?{x:t,y:null!=e?e:t}:n,this.x=i.x,this.y=i.y},extend:{clone:function(){return new b.Point(this)},morph:function(t,e){return this.destination=new b.Point(t,e),this},at:function(t){return this.destination?new b.Point({x:this.x+(this.destination.x-this.x)*t,y:this.y+(this.destination.y-this.y)*t}):this},native:function(){var t=b.parser.native.createSVGPoint();return t.x=this.x,t.y=this.y,t},transform:function(t){return new b.Point(this.native().matrixTransform(t.native()))}}}),b.extend(b.Element,{point:function(t,e){return new b.Point(t,e).transform(this.screenCTM().inverse())}}),b.extend(b.Element,{attr:function(t,e,i){if(null==t){for(t={},e=this.node.attributes,i=e.length-1;i>=0;i--)t[e[i].nodeName]=b.regex.isNumber.test(e[i].nodeValue)?parseFloat(e[i].nodeValue):e[i].nodeValue;return t}if("object"==typeof t)for(e in t)this.attr(e,t[e]);else if(null===e)this.node.removeAttribute(t);else{if(null==e)return e=this.node.getAttribute(t),null==e?b.defaults.attrs[t]:b.regex.isNumber.test(e)?parseFloat(e):e;"stroke-width"==t?this.attr("stroke",parseFloat(e)>0?this._stroke:null):"stroke"==t&&(this._stroke=e),"fill"!=t&&"stroke"!=t||(b.regex.isImage.test(e)&&(e=this.doc().defs().image(e,0,0)),e instanceof b.Image&&(e=this.doc().defs().pattern(0,0,function(){this.add(e)}))),"number"==typeof e?e=new b.Number(e):b.Color.isColor(e)?e=new b.Color(e):Array.isArray(e)&&(e=new b.Array(e)),"leading"==t?this.leading&&this.leading(e):"string"==typeof i?this.node.setAttributeNS(i,t,e.toString()):this.node.setAttribute(t,e.toString()),!this.rebuild||"font-size"!=t&&"x"!=t||this.rebuild(t,e)}return this}}),b.extend(b.Element,{transform:function(t,e){var i,n,r=this;if("object"!=typeof t)return i=new b.Matrix(r).extract(),"string"==typeof t?i[t]:i;if(i=new b.Matrix(r),e=!!e||!!t.relative,null!=t.a)i=e?i.multiply(new b.Matrix(t)):new b.Matrix(t);else if(null!=t.rotation)p(t,r),i=e?i.rotate(t.rotation,t.cx,t.cy):i.rotate(t.rotation-i.extract().rotation,t.cx,t.cy);else if(null!=t.scale||null!=t.scaleX||null!=t.scaleY){if(p(t,r),t.scaleX=null!=t.scale?t.scale:null!=t.scaleX?t.scaleX:1,t.scaleY=null!=t.scale?t.scale:null!=t.scaleY?t.scaleY:1,!e){var s=i.extract();t.scaleX=1*t.scaleX/s.scaleX,t.scaleY=1*t.scaleY/s.scaleY}i=i.scale(t.scaleX,t.scaleY,t.cx,t.cy)}else if(null!=t.skew||null!=t.skewX||null!=t.skewY){if(p(t,r),t.skewX=null!=t.skew?t.skew:null!=t.skewX?t.skewX:0,t.skewY=null!=t.skew?t.skew:null!=t.skewY?t.skewY:0,!e){var s=i.extract();i=i.multiply((new b.Matrix).skew(s.skewX,s.skewY,t.cx,t.cy).inverse())}i=i.skew(t.skewX,t.skewY,t.cx,t.cy)}else t.flip?("x"==t.flip||"y"==t.flip?t.offset=null==t.offset?r.bbox()["c"+t.flip]:t.offset:null==t.offset?(n=r.bbox(),t.flip=n.cx,t.offset=n.cy):t.flip=t.offset,i=(new b.Matrix).flip(t.flip,t.offset)):null==t.x&&null==t.y||(e?i=i.translate(t.x,t.y):(null!=t.x&&(i.e=t.x),null!=t.y&&(i.f=t.y)));return this.attr("transform",i)}}),b.extend(b.FX,{transform:function(t,e){var i,n,r=this.target();return"object"!=typeof t?(i=new b.Matrix(r).extract(),"string"==typeof t?i[t]:i):(e=!!e||!!t.relative,null!=t.a?i=new b.Matrix(t):null!=t.rotation?(p(t,r),i=new b.Rotate(t.rotation,t.cx,t.cy)):null!=t.scale||null!=t.scaleX||null!=t.scaleY?(p(t,r),t.scaleX=null!=t.scale?t.scale:null!=t.scaleX?t.scaleX:1,t.scaleY=null!=t.scale?t.scale:null!=t.scaleY?t.scaleY:1,i=new b.Scale(t.scaleX,t.scaleY,t.cx,t.cy)):null!=t.skewX||null!=t.skewY?(p(t,r),t.skewX=null!=t.skewX?t.skewX:0,t.skewY=null!=t.skewY?t.skewY:0,i=new b.Skew(t.skewX,t.skewY,t.cx,t.cy)):t.flip?("x"==t.flip||"y"==t.flip?t.offset=null==t.offset?r.bbox()["c"+t.flip]:t.offset:null==t.offset?(n=r.bbox(),t.flip=n.cx,t.offset=n.cy):t.flip=t.offset,i=(new b.Matrix).flip(t.flip,t.offset)):null==t.x&&null==t.y||(i=new b.Translate(t.x,t.y)),i?(i.relative=e,this.last().transforms.push(i),this._callStart()):this)}}),b.extend(b.Element,{untransform:function(){return this.attr("transform",null)},matrixify:function(){return(this.attr("transform")||"").split(b.regex.transforms).slice(0,-1).map(function(t){var e=t.trim().split("(");return[e[0],e[1].split(b.regex.delimiter).map(function(t){return parseFloat(t)})]}).reduce(function(t,e){return"matrix"==e[0]?t.multiply(f(e[1])):t[e[0]].apply(t,e[1])},new b.Matrix)},toParent:function(t){if(this==t)return this;var e=this.screenCTM(),i=t.screenCTM().inverse();return this.addTo(t).untransform().transform(i.multiply(e)),this},toDoc:function(){return this.toParent(this.doc())}}),b.Transformation=b.invent({create:function(t,e){if(arguments.length>1&&"boolean"!=typeof e)return this.constructor.call(this,[].slice.call(arguments));if(Array.isArray(t))for(var i=0,n=this.arguments.length;i=0},index:function(t){return[].slice.call(this.node.childNodes).indexOf(t.node)},get:function(t){return b.adopt(this.node.childNodes[t])},first:function(){return this.get(0)},last:function(){return this.get(this.node.childNodes.length-1)},each:function(t,e){var i,n,r=this.children();for(i=0,n=r.length;in/r?this.height/r:this.width/n,this.x=e,this.y=i,this.width=n,this.height=r)}else t="string"==typeof t?t.match(c).map(function(t){return parseFloat(t)}):Array.isArray(t)?t:"object"==typeof t?[t.x,t.y,t.width,t.height]:4==arguments.length?[].slice.call(arguments):h,this.x=t[0],this.y=t[1],this.width=t[2],this.height=t[3]},extend:{toString:function(){return this.x+" "+this.y+" "+this.width+" "+this.height},morph:function(t,e,i,n){return this.destination=new b.ViewBox(t,e,i,n),this},at:function(t){return this.destination?new b.ViewBox([this.x+(this.destination.x-this.x)*t,this.y+(this.destination.y-this.y)*t,this.width+(this.destination.width-this.width)*t,this.height+(this.destination.height-this.height)*t]):this}},parent:b.Container,construct:{viewbox:function(t,e,i,n){return 0==arguments.length?new b.ViewBox(this):this.attr("viewBox",new b.ViewBox(t,e,i,n))}}}),["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","mouseenter","mouseleave","touchstart","touchmove","touchleave","touchend","touchcancel"].forEach(function(t){b.Element.prototype[t]=function(e){return null==e?b.off(this,t):b.on(this,t,e),this}}),b.listenerId=0,b.on=function(t,e,i,n,r){var s=i.bind(n||t),o=t instanceof b.Element?t.node:t;o.instance=o.instance||{_events:{}};var a=o.instance._events;i._svgjsListenerId||(i._svgjsListenerId=++b.listenerId),e.split(b.regex.delimiter).forEach(function(t){var e=t.split(".")[0],n=t.split(".")[1]||"*";a[e]=a[e]||{},a[e][n]=a[e][n]||{},a[e][n][i._svgjsListenerId]=s,o.addEventListener(e,s,r||!1)})},b.off=function(t,e,i,n){var r=t instanceof b.Element?t.node:t;if(r.instance&&("function"!=typeof i||(i=i._svgjsListenerId))){var s=r.instance._events;(e||"").split(b.regex.delimiter).forEach(function(t){var e,o,a=t&&t.split(".")[0],h=t&&t.split(".")[1];if(i)s[a]&&s[a][h||"*"]&&(r.removeEventListener(a,s[a][h||"*"][i],n||!1),delete s[a][h||"*"][i]);else if(a&&h){if(s[a]&&s[a][h]){for(o in s[a][h])b.off(r,[a,h].join("."),o);delete s[a][h]}}else if(h)for(t in s)for(e in s[t])h===e&&b.off(r,[t,h].join("."));else if(a){if(s[a]){for(e in s[a])b.off(r,[a,e].join("."));delete s[a]}}else{for(t in s)b.off(r,t);r.instance._events={}}})}},b.extend(b.Element,{on:function(t,e,i,n){return b.on(this,t,e,i,n),this},off:function(t,e){return b.off(this.node,t,e),this},fire:function(e,i){return e instanceof t.Event?this.node.dispatchEvent(e):this.node.dispatchEvent(e=new b.CustomEvent(e,{detail:i,cancelable:!0})),this._event=e,this},event:function(){return this._event}}),b.Defs=b.invent({create:"defs",inherit:b.Container}),b.G=b.invent({create:"g",inherit:b.Container,extend:{x:function(t){return null==t?this.transform("x"):this.transform({x:t-this.x()},!0)},y:function(t){return null==t?this.transform("y"):this.transform({y:t-this.y()},!0)},cx:function(t){return null==t?this.gbox().cx:this.x(t-this.gbox().width/2)},cy:function(t){return null==t?this.gbox().cy:this.y(t-this.gbox().height/2)},gbox:function(){var t=this.bbox(),e=this.transform();return t.x+=e.x,t.x2+=e.x,t.cx+=e.x,t.y+=e.y,t.y2+=e.y,t.cy+=e.y,t}},construct:{group:function(){return this.put(new b.G)}}}),b.Doc=b.invent({create:function(t){t&&(t="string"==typeof t?e.getElementById(t):t,"svg"==t.nodeName?this.constructor.call(this,t):(this.constructor.call(this,b.create("svg")),t.appendChild(this.node),this.size("100%","100%")),this.namespace().defs())},inherit:b.Container,extend:{namespace:function(){return this.attr({xmlns:b.ns,version:"1.1"}).attr("xmlns:xlink",b.xlink,b.xmlns).attr("xmlns:svgjs",b.svgjs,b.xmlns)},defs:function(){if(!this._defs){var t;(t=this.node.getElementsByTagName("defs")[0])?this._defs=b.adopt(t):this._defs=new b.Defs,this.node.appendChild(this._defs.node)}return this._defs},parent:function(){return this.node.parentNode&&"#document"!=this.node.parentNode.nodeName&&"#document-fragment"!=this.node.parentNode.nodeName?this.node.parentNode:null},spof:function(){var t=this.node.getScreenCTM();return t&&this.style("left",-t.e%1+"px").style("top",-t.f%1+"px"),this},remove:function(){return this.parent()&&this.parent().removeChild(this.node),this},clear:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return delete this._defs,b.parser.draw.parentNode||this.node.appendChild(b.parser.draw),this},clone:function(t){this.writeDataToDom();var e=this.node,i=x(e.cloneNode(!0));return t?(t.node||t).appendChild(i.node):e.parentNode.insertBefore(i.node,e.nextSibling),i}}}),b.extend(b.Element,{siblings:function(){return this.parent().children()},position:function(){return this.parent().index(this)},next:function(){return this.siblings()[this.position()+1]},previous:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position()+1,e=this.parent();return e.removeElement(this).add(this,t),e instanceof b.Doc&&e.node.appendChild(e.defs().node),this},backward:function(){var t=this.position();return t>0&&this.parent().removeElement(this).add(this,t-1),this},front:function(){var t=this.parent();return t.node.appendChild(this.node),t instanceof b.Doc&&t.node.appendChild(t.defs().node),this},back:function(){return this.position()>0&&this.parent().removeElement(this).add(this,0),this},before:function(t){t.remove();var e=this.position();return this.parent().add(t,e),this},after:function(t){t.remove();var e=this.position();return this.parent().add(t,e+1),this}}),b.Mask=b.invent({create:function(){this.constructor.call(this,b.create("mask")),this.targets=[]},inherit:b.Container,extend:{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unmask();return this.targets=[],b.Element.prototype.remove.call(this),this}},construct:{mask:function(){return this.defs().put(new b.Mask)}}}),b.extend(b.Element,{maskWith:function(t){return this.masker=t instanceof b.Mask?t:this.parent().mask().add(t),this.masker.targets.push(this),this.attr("mask",'url("#'+this.masker.attr("id")+'")')},unmask:function(){return delete this.masker,this.attr("mask",null)}}),b.ClipPath=b.invent({create:function(){this.constructor.call(this,b.create("clipPath")),this.targets=[]},inherit:b.Container,extend:{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unclip();return this.targets=[],this.parent().removeElement(this),this}},construct:{clip:function(){return this.defs().put(new b.ClipPath)}}}),b.extend(b.Element,{clipWith:function(t){return this.clipper=t instanceof b.ClipPath?t:this.parent().clip().add(t),this.clipper.targets.push(this),this.attr("clip-path",'url("#'+this.clipper.attr("id")+'")')},unclip:function(){return delete this.clipper,this.attr("clip-path",null)}}),b.Gradient=b.invent({create:function(t){this.constructor.call(this,b.create(t+"Gradient")),this.type=t},inherit:b.Container,extend:{at:function(t,e,i){return this.put(new b.Stop).update(t,e,i)},update:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this},fill:function(){return"url(#"+this.id()+")"},toString:function(){return this.fill()},attr:function(t,e,i){return"transform"==t&&(t="gradientTransform"),b.Container.prototype.attr.call(this,t,e,i)}},construct:{gradient:function(t,e){return this.defs().gradient(t,e)}}}),b.extend(b.Gradient,b.FX,{from:function(t,e){return"radial"==(this._target||this).type?this.attr({fx:new b.Number(t),fy:new b.Number(e)}):this.attr({x1:new b.Number(t),y1:new b.Number(e)})},to:function(t,e){return"radial"==(this._target||this).type?this.attr({cx:new b.Number(t),cy:new b.Number(e)}):this.attr({x2:new b.Number(t),y2:new b.Number(e)})}}),b.extend(b.Defs,{gradient:function(t,e){return this.put(new b.Gradient(t)).update(e)}}),b.Stop=b.invent({create:"stop",inherit:b.Element,extend:{update:function(t){return("number"==typeof t||t instanceof b.Number)&&(t={offset:arguments[0],color:arguments[1],opacity:arguments[2]}),null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new b.Number(t.offset)),this}}}),b.Pattern=b.invent({create:"pattern",inherit:b.Container,extend:{fill:function(){return"url(#"+this.id()+")"},update:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this},toString:function(){return this.fill()},attr:function(t,e,i){return"transform"==t&&(t="patternTransform"),b.Container.prototype.attr.call(this,t,e,i)}},construct:{pattern:function(t,e,i){return this.defs().pattern(t,e,i)}}}),b.extend(b.Defs,{pattern:function(t,e,i){return this.put(new b.Pattern).update(i).attr({x:0,y:0,width:t,height:e,patternUnits:"userSpaceOnUse"})}}),b.Shape=b.invent({create:function(t){this.constructor.call(this,t)},inherit:b.Element}),b.Bare=b.invent({create:function(t,e){if(this.constructor.call(this,b.create(t)),e)for(var i in e.prototype)"function"==typeof e.prototype[i]&&(this[i]=e.prototype[i])},inherit:b.Element,extend:{words:function(t){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this.node.appendChild(e.createTextNode(t)),this}}}),b.extend(b.Parent,{element:function(t,e){return this.put(new b.Bare(t,e))}}),b.Symbol=b.invent({create:"symbol",inherit:b.Container,construct:{symbol:function(){return this.put(new b.Symbol)}}}),b.Use=b.invent({create:"use",inherit:b.Shape,extend:{element:function(t,e){return this.attr("href",(e||"")+"#"+t,b.xlink)}},construct:{use:function(t,e){return this.put(new b.Use).element(t,e)}}}),b.Rect=b.invent({create:"rect",inherit:b.Shape,construct:{rect:function(t,e){return this.put(new b.Rect).size(t,e)}}}),b.Circle=b.invent({create:"circle",inherit:b.Shape,construct:{circle:function(t){return this.put(new b.Circle).rx(new b.Number(t).divide(2)).move(0,0)}}}),b.extend(b.Circle,b.FX,{rx:function(t){return this.attr("r",t)},ry:function(t){return this.rx(t)}}),b.Ellipse=b.invent({create:"ellipse",inherit:b.Shape,construct:{ellipse:function(t,e){return this.put(new b.Ellipse).size(t,e).move(0,0)}}}),b.extend(b.Ellipse,b.Rect,b.FX,{rx:function(t){return this.attr("rx",t)},ry:function(t){return this.attr("ry",t)}}),b.extend(b.Circle,b.Ellipse,{x:function(t){return null==t?this.cx()-this.rx():this.cx(t+this.rx())},y:function(t){return null==t?this.cy()-this.ry():this.cy(t+this.ry())},cx:function(t){return null==t?this.attr("cx"):this.attr("cx",t)},cy:function(t){return null==t?this.attr("cy"):this.attr("cy",t)},width:function(t){return null==t?2*this.rx():this.rx(new b.Number(t).divide(2))},height:function(t){return null==t?2*this.ry():this.ry(new b.Number(t).divide(2))},size:function(t,e){var i=l(this,t,e);return this.rx(new b.Number(i.width).divide(2)).ry(new b.Number(i.height).divide(2))}}),b.Line=b.invent({create:"line",inherit:b.Shape,extend:{array:function(){return new b.PointArray([[this.attr("x1"),this.attr("y1")],[this.attr("x2"),this.attr("y2")]])},plot:function(t,e,i,n){return null==t?this.array():(t=void 0!==e?{x1:t,y1:e,x2:i,y2:n}:new b.PointArray(t).toLine(),this.attr(t))},move:function(t,e){return this.attr(this.array().move(t,e).toLine())},size:function(t,e){var i=l(this,t,e);return this.attr(this.array().size(i.width,i.height).toLine())}},construct:{line:function(t,e,i,n){return b.Line.prototype.plot.apply(this.put(new b.Line),null!=t?[t,e,i,n]:[0,0,0,0])}}}),b.Polyline=b.invent({create:"polyline",inherit:b.Shape,construct:{polyline:function(t){return this.put(new b.Polyline).plot(t||new b.PointArray)}}}),b.Polygon=b.invent({create:"polygon",inherit:b.Shape,construct:{polygon:function(t){return this.put(new b.Polygon).plot(t||new b.PointArray)}}}),b.extend(b.Polyline,b.Polygon,{array:function(){return this._array||(this._array=new b.PointArray(this.attr("points")))},plot:function(t){return null==t?this.array():this.clear().attr("points","string"==typeof t?t:this._array=new b.PointArray(t))},clear:function(){return delete this._array,this},move:function(t,e){return this.attr("points",this.array().move(t,e))},size:function(t,e){var i=l(this,t,e);return this.attr("points",this.array().size(i.width,i.height))}}),b.extend(b.Line,b.Polyline,b.Polygon,{morphArray:b.PointArray,x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},width:function(t){var e=this.bbox();return null==t?e.width:this.size(t,e.height)},height:function(t){var e=this.bbox();return null==t?e.height:this.size(e.width,t)}}),b.Path=b.invent({create:"path",inherit:b.Shape,extend:{morphArray:b.PathArray,array:function(){return this._array||(this._array=new b.PathArray(this.attr("d")))},plot:function(t){return null==t?this.array():this.clear().attr("d","string"==typeof t?t:this._array=new b.PathArray(t))},clear:function(){return delete this._array,this},move:function(t,e){return this.attr("d",this.array().move(t,e))},x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},size:function(t,e){var i=l(this,t,e);return this.attr("d",this.array().size(i.width,i.height))},width:function(t){return null==t?this.bbox().width:this.size(t,this.bbox().height)},height:function(t){return null==t?this.bbox().height:this.size(this.bbox().width,t)}},construct:{path:function(t){return this.put(new b.Path).plot(t||new b.PathArray)}}}),b.Image=b.invent({create:"image",inherit:b.Shape,extend:{load:function(e){if(!e)return this;var i=this,n=new t.Image;return b.on(n,"load",function(){b.off(n);var t=i.parent(b.Pattern);null!==t&&(0==i.width()&&0==i.height()&&i.size(n.width,n.height),t&&0==t.width()&&0==t.height()&&t.size(i.width(),i.height()),"function"==typeof i._loaded&&i._loaded.call(i,{width:n.width,height:n.height,ratio:n.width/n.height,url:e}))}),b.on(n,"error",function(t){b.off(n),"function"==typeof i._error&&i._error.call(i,t)}),this.attr("href",n.src=this.src=e,b.xlink)},loaded:function(t){return this._loaded=t,this},error:function(t){return this._error=t,this}},construct:{image:function(t,e,i){return this.put(new b.Image).load(t).size(e||0,i||e||0)}}}),b.Text=b.invent({create:function(){this.constructor.call(this,b.create("text")),this.dom.leading=new b.Number(1.3),this._rebuild=!0,this._build=!1,this.attr("font-family",b.defaults.attrs["font-family"])},inherit:b.Shape,extend:{x:function(t){return null==t?this.attr("x"):this.attr("x",t)},y:function(t){var e=this.attr("y"),i="number"==typeof e?e-this.bbox().y:0;return null==t?"number"==typeof e?e-i:e:this.attr("y","number"==typeof t.valueOf()?t+i:t)},cx:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)},cy:function(t){return null==t?this.bbox().cy:this.y(t-this.bbox().height/2)},text:function(t){if(void 0===t){for(var t="",e=this.node.childNodes,i=0,n=e.length;i=0;e--)null!=i[M[t][e]]&&this.attr(M.prefix(t,M[t][e]),i[M[t][e]]);return this},b.extend(b.Element,b.FX,i)}),b.extend(b.Element,b.FX,{rotate:function(t,e,i){return this.transform({rotation:t,cx:e,cy:i})},skew:function(t,e,i,n){return 1==arguments.length||3==arguments.length?this.transform({skew:t,cx:e,cy:i}):this.transform({skewX:t,skewY:e,cx:i,cy:n})},scale:function(t,e,i,n){return 1==arguments.length||3==arguments.length?this.transform({scale:t,cx:e,cy:i}):this.transform({scaleX:t,scaleY:e,cx:i,cy:n})},translate:function(t,e){return this.transform({x:t,y:e})},flip:function(t,e){return e="number"==typeof t?t:e,this.transform({flip:t||"both",offset:e})},matrix:function(t){return this.attr("transform",new b.Matrix(6==arguments.length?[].slice.call(arguments):t))},opacity:function(t){return this.attr("opacity",t)},dx:function(t){return this.x(new b.Number(t).plus(this instanceof b.FX?0:this.x()),!0)},dy:function(t){return this.y(new b.Number(t).plus(this instanceof b.FX?0:this.y()),!0)},dmove:function(t,e){return this.dx(t).dy(e)}}),b.extend(b.Rect,b.Ellipse,b.Circle,b.Gradient,b.FX,{radius:function(t,e){var i=(this._target||this).type;return"radial"==i||"circle"==i?this.attr("r",new b.Number(t)):this.rx(t).ry(null==e?t:e)}}),b.extend(b.Path,{length:function(){return this.node.getTotalLength()},pointAt:function(t){return this.node.getPointAtLength(t)}}),b.extend(b.Parent,b.Text,b.Tspan,b.FX,{font:function(t,e){if("object"==typeof t)for(e in t)this.font(e,t[e]);return"leading"==t?this.leading(e):"anchor"==t?this.attr("text-anchor",e):"size"==t||"family"==t||"weight"==t||"stretch"==t||"variant"==t||"style"==t?this.attr("font-"+t,e):this.attr(t,e)}}),b.Set=b.invent({create:function(t){t instanceof b.Set?this.members=t.members.slice():Array.isArray(t)?this.members=t:this.clear()},extend:{add:function(){var t,e,i=[].slice.call(arguments);for(t=0,e=i.length;t-1&&this.members.splice(e,1),this},each:function(t){for(var e=0,i=this.members.length;e=0},index:function(t){return this.members.indexOf(t)},get:function(t){return this.members[t]},first:function(){return this.get(0)},last:function(){return this.get(this.members.length-1)},valueOf:function(){return this.members},bbox:function(){if(0==this.members.length)return new b.RBox;var t=this.members[0].rbox(this.members[0].doc());return this.each(function(){t=t.merge(this.rbox(this.doc()))}),t}},construct:{set:function(t){
+return new b.Set(t)}}}),b.FX.Set=b.invent({create:function(t){this.set=t}}),b.Set.inherit=function(){var t,e=[];for(var t in b.Shape.prototype)"function"==typeof b.Shape.prototype[t]&&"function"!=typeof b.Set.prototype[t]&&e.push(t);e.forEach(function(t){b.Set.prototype[t]=function(){for(var e=0,i=this.members.length;e=0;t--)delete this.memory()[arguments[t]];return this},memory:function(){return this._memory||(this._memory={})}}),b.get=function(t){var i=e.getElementById(v(t)||t);return b.adopt(i)},b.select=function(t,i){return new b.Set(b.utils.map((i||e).querySelectorAll(t),function(t){return b.adopt(t)}))},b.extend(b.Parent,{select:function(t){return b.select(t,this.node)}});var k="abcdef".split("");if("function"!=typeof t.CustomEvent){var S=function(t,i){i=i||{bubbles:!1,cancelable:!1,detail:void 0};var n=e.createEvent("CustomEvent");return n.initCustomEvent(t,i.bubbles,i.cancelable,i.detail),n};S.prototype=t.Event.prototype,b.CustomEvent=S}else b.CustomEvent=t.CustomEvent;return function(e){for(var i=0,n=["moz","webkit"],r=0;r= this.resizeLimits.width) {
+ if (checkAspectRatio) {
+ snap = this.checkAspectRatio(snap, checkAspectRatioReverse);
+ }
+
+ if (this.parameters.type === "text") {
+ if (resizeFont) {
+ this.el.move(this.parameters.box.x + snap[0], this.parameters.box.y);
+ this.el.attr("font-size", this.parameters.fontSize - snap[0]);
+ }
+ return;
+ }
+
+ this.el.width(this.parameters.box.width - snap[0]);
+
+ if (updateOnlyChanges) {
+ this.el.x(this.parameters.box.x + snap[0]);
+ } else {
+ this.el.move(this.parameters.box.x + snap[0], this.parameters.box.y);
+ }
+ }
+ };
+
+ this._resizeRight = function (snap, resizeFont, checkAspectRatio, checkAspectRatioReverse) {
+ if (this.parameters.box.width + snap[0] >= this.resizeLimits.width) {
+ if (checkAspectRatio) {
+ snap = this.checkAspectRatio(snap, checkAspectRatioReverse);
+ }
+
+ if (this.parameters.type === "text") {
+ if (resizeFont) {
+ this.el.move(this.parameters.box.x - snap[0], this.parameters.box.y);
+ this.el.attr("font-size", this.parameters.fontSize + snap[0]);
+ }
+ return;
+ }
+
+ this.el.x(this.parameters.box.x).width(this.parameters.box.width + snap[0]);
+ }
+ };
+
+ this._resizeTop = function (snap, checkAspectRatio, checkAspectRatioReverse, updateOnlyChanges) {
+ if (this.parameters.box.height - snap[1] >= this.resizeLimits.height) {
+ if (checkAspectRatio) {
+ snap = this.checkAspectRatio(snap, checkAspectRatioReverse);
+ }
+
+ // Disable the font-resizing if it is not from the corner of bounding-box
+ if (this.parameters.type === "text") {
+ return;
+ }
+
+ this.el.height(this.parameters.box.height - snap[1]);
+
+ if (updateOnlyChanges) {
+ this.el.y(this.parameters.box.y + snap[1])
+ } else {
+ this.el.move(this.parameters.box.x, this.parameters.box.y + snap[1]);
+ }
+ }
+ };
+
+ this._resizeBottom = function (snap, checkAspectRatio, checkAspectRatioReverse) {
+ if (this.parameters.box.height + snap[1] >= this.resizeLimits.height) {
+ if (checkAspectRatio) {
+ snap = this.checkAspectRatio(snap, checkAspectRatioReverse);
+ }
+
+ if (this.parameters.type === "text") {
+ return;
+ }
+
+ this.el.y(this.parameters.box.y).height(this.parameters.box.height + snap[1]);
+ }
+ };
+
+ // Lets check which edge of the bounding-box was clicked and resize the this.el according to this
+ switch (event.type) {
+
+ // Left-Top-Edge
+ case 'lt':
+ // We build a calculating function for every case which gives us the new position of the this.el
+ this.calc = function (diffX, diffY) {
+ // The procedure is always the same
+ // First we snap the edge to the given grid (snapping to 1px grid is normal resizing)
+ var snap = this.snapToGrid(diffX, diffY);
+
+ this._resizeTop(snap, true, false, true);
+ this._resizeLeft(snap, true, true, false, true);
+ };
+ break;
+
+ // Right-Top
+ case 'rt':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 1 << 1);
+
+ this._resizeTop(snap, true, true, true);
+ this._resizeRight(snap, true, true, true);
+ };
+ break;
+
+ // Right-Bottom
+ case 'rb':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 0);
+
+ this._resizeBottom(snap, true);
+ this._resizeRight(snap, true, true);
+ };
+ break;
+
+ // Left-Bottom
+ case 'lb':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 1);
+
+ this._resizeBottom(snap, true, true);
+ this._resizeLeft(snap, true, true, true, true);
+ };
+ break;
+
+ // Top
+ case 't':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 1 << 1);
+
+ this._resizeTop(snap);
+ };
+ break;
+
+ // Right
+ case 'r':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 0);
+
+ this._resizeRight(snap);
+ };
+ break;
+
+ // Bottom
+ case 'b':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 0);
+
+ this._resizeBottom(snap);
+ };
+ break;
+
+ // Left
+ case 'l':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+ var snap = this.snapToGrid(diffX, diffY, 1);
+
+ this._resizeLeft(snap);
+ };
+ break;
+
+ // Rotation
+ case 'rot':
+ // s.a.
+ this.calc = function (diffX, diffY) {
+
+ // yes this is kinda stupid but we need the mouse coords back...
+ var current = {x: diffX + this.parameters.p.x, y: diffY + this.parameters.p.y};
+
+ // start minus middle
+ var sAngle = Math.atan2((this.parameters.p.y - this.parameters.box.y - this.parameters.box.height / 2), (this.parameters.p.x - this.parameters.box.x - this.parameters.box.width / 2));
+
+ // end minus middle
+ var pAngle = Math.atan2((current.y - this.parameters.box.y - this.parameters.box.height / 2), (current.x - this.parameters.box.x - this.parameters.box.width / 2));
+
+ var angle = this.parameters.rotation + (pAngle - sAngle) * 180 / Math.PI + this.options.snapToAngle / 2;
+
+ // We have to move the element to the center of the box first and change the rotation afterwards
+ // because rotation always works around a rotation-center, which is changed when moving the element
+ // We also set the new rotation center to the center of the box.
+ this.el.center(this.parameters.box.cx, this.parameters.box.cy).rotate(angle - (angle % this.options.snapToAngle), this.parameters.box.cx, this.parameters.box.cy);
+ };
+ break;
+
+ // Moving one single Point (needed when an element is deepSelected which means you can move every single point of the object)
+ case 'point':
+ this.calc = function (diffX, diffY) {
+
+ // Snapping the point to the grid
+ var snap = this.snapToGrid(diffX, diffY, this.parameters.pointCoords[0], this.parameters.pointCoords[1]);
+
+ // Get the point array
+ var array = this.el.array().valueOf();
+
+ // Changing the moved point in the array
+ array[this.parameters.i][0] = this.parameters.pointCoords[0] + snap[0];
+ array[this.parameters.i][1] = this.parameters.pointCoords[1] + snap[1];
+
+ // And plot the new this.el
+ this.el.plot(array);
+ };
+ }
+
+ this.el.fire('resizestart', {dx: this.parameters.x, dy: this.parameters.y, event: event});
+ // When resizing started, we have to register events for...
+ // Touches.
+ SVG.on(window, 'touchmove.resize', function(e) {
+ _this.update(e || window.event);
+ });
+ SVG.on(window, 'touchend.resize', function() {
+ _this.done();
+ });
+ // Mouse.
+ SVG.on(window, 'mousemove.resize', function (e) {
+ _this.update(e || window.event);
+ });
+ SVG.on(window, 'mouseup.resize', function () {
+ _this.done();
+ });
+
+ };
+
+ // The update-function redraws the element every time the mouse is moving
+ ResizeHandler.prototype.update = function (event) {
+
+ if (!event) {
+ if (this.lastUpdateCall) {
+ this.calc(this.lastUpdateCall[0], this.lastUpdateCall[1]);
+ }
+ return;
+ }
+
+ // Calculate the difference between the mouseposition at start and now
+ var txPt = this._extractPosition(event);
+ var p = this.transformPoint(txPt.x, txPt.y);
+
+ var diffX = p.x - this.parameters.p.x,
+ diffY = p.y - this.parameters.p.y;
+
+ this.lastUpdateCall = [diffX, diffY];
+
+ // Calculate the new position and height / width of the element
+ this.calc(diffX, diffY);
+
+ // Emit an event to say we have changed.
+ this.el.fire('resizing', {dx: diffX, dy: diffY, event: event});
+ };
+
+ // Is called on mouseup.
+ // Removes the update-function from the mousemove event
+ ResizeHandler.prototype.done = function () {
+ this.lastUpdateCall = null;
+ SVG.off(window, 'mousemove.resize');
+ SVG.off(window, 'mouseup.resize');
+ SVG.off(window, 'touchmove.resize');
+ SVG.off(window, 'touchend.resize');
+ this.el.fire('resizedone');
+ };
+
+ // The flag is used to determine whether the resizing is used with a left-Point (first bit) and top-point (second bit)
+ // In this cases the temp-values are calculated differently
+ ResizeHandler.prototype.snapToGrid = function (diffX, diffY, flag, pointCoordsY) {
+
+ var temp;
+
+ // If `pointCoordsY` is given, a single Point has to be snapped (deepSelect). That's why we need a different temp-value
+ if (typeof pointCoordsY !== 'undefined') {
+ // Note that flag = pointCoordsX in this case
+ temp = [(flag + diffX) % this.options.snapToGrid, (pointCoordsY + diffY) % this.options.snapToGrid];
+ } else {
+ // We check if the flag is set and if not we set a default-value (both bits set - which means upper-left-edge)
+ flag = flag == null ? 1 | 1 << 1 : flag;
+ temp = [(this.parameters.box.x + diffX + (flag & 1 ? 0 : this.parameters.box.width)) % this.options.snapToGrid, (this.parameters.box.y + diffY + (flag & (1 << 1) ? 0 : this.parameters.box.height)) % this.options.snapToGrid];
+ }
+
+ if(diffX < 0) {
+ temp[0] -= this.options.snapToGrid;
+ }
+ if(diffY < 0) {
+ temp[1] -= this.options.snapToGrid;
+ }
+
+ diffX -= (Math.abs(temp[0]) < this.options.snapToGrid / 2 ?
+ temp[0] :
+ temp[0] - (diffX < 0 ? -this.options.snapToGrid : this.options.snapToGrid));
+ diffY -= (Math.abs(temp[1]) < this.options.snapToGrid / 2 ?
+ temp[1] :
+ temp[1] - (diffY < 0 ? -this.options.snapToGrid : this.options.snapToGrid));
+
+ return this.constraintToBox(diffX, diffY, flag, pointCoordsY);
+
+ };
+
+ // keep element within constrained box
+ ResizeHandler.prototype.constraintToBox = function (diffX, diffY, flag, pointCoordsY) {
+ //return [diffX, diffY]
+ var c = this.options.constraint || {};
+ var orgX, orgY;
+
+ if (typeof pointCoordsY !== 'undefined') {
+ orgX = flag;
+ orgY = pointCoordsY;
+ } else {
+ orgX = this.parameters.box.x + (flag & 1 ? 0 : this.parameters.box.width);
+ orgY = this.parameters.box.y + (flag & (1<<1) ? 0 : this.parameters.box.height);
+ }
+
+ if (typeof c.minX !== 'undefined' && orgX + diffX < c.minX) {
+ diffX = c.minX - orgX;
+ }
+
+ if (typeof c.maxX !== 'undefined' && orgX + diffX > c.maxX) {
+ diffX = c.maxX - orgX;
+ }
+
+ if (typeof c.minY !== 'undefined' && orgY + diffY < c.minY) {
+ diffY = c.minY - orgY;
+ }
+
+ if (typeof c.maxY !== 'undefined' && orgY + diffY > c.maxY) {
+ diffY = c.maxY - orgY;
+ }
+
+ return [diffX, diffY];
+ };
+
+ ResizeHandler.prototype.checkAspectRatio = function (snap, isReverse) {
+ if (!this.options.saveAspectRatio) {
+ return snap;
+ }
+
+ var updatedSnap = snap.slice();
+ var aspectRatio = this.parameters.box.width / this.parameters.box.height;
+ var newW = this.parameters.box.width + snap[0];
+ var newH = this.parameters.box.height - snap[1];
+ var newAspectRatio = newW / newH;
+
+ if (newAspectRatio < aspectRatio) {
+ // Height is too big. Adapt it
+ updatedSnap[1] = newW / aspectRatio - this.parameters.box.height;
+ isReverse && (updatedSnap[1] = -updatedSnap[1]);
+ } else if (newAspectRatio > aspectRatio) {
+ // Width is too big. Adapt it
+ updatedSnap[0] = this.parameters.box.width - newH * aspectRatio;
+ isReverse && (updatedSnap[0] = -updatedSnap[0]);
+ }
+
+ return updatedSnap;
+ };
+
+ SVG.extend(SVG.Element, {
+ // Resize element with mouse
+ resize: function (options) {
+
+ (this.remember('_resizeHandler') || new ResizeHandler(this)).init(options || {});
+
+ return this;
+
+ }
+
+ });
+
+ SVG.Element.prototype.resize.defaults = {
+ snapToAngle: 0.1, // Specifies the speed the rotation is happening when moving the mouse
+ snapToGrid: 1, // Snaps to a grid of `snapToGrid` Pixels
+ constraint: {}, // keep element within constrained box
+ resizeLimits: { width: 0, height: 0 }, // rect limit size on resize
+ saveAspectRatio: false // Save aspect ratio when resizing using lt, rt, rb or lb points
+ };
+
+}).call(this);
+}());
diff --git a/hal-core/resources/web/js/lib/svg.resize.min.js b/hal-core/resources/web/js/lib/svg.resize.min.js
new file mode 100644
index 00000000..aef5e88a
--- /dev/null
+++ b/hal-core/resources/web/js/lib/svg.resize.min.js
@@ -0,0 +1 @@
+/*! svg.resize.js v1.4.3 MIT*/;!function(){"use strict";(function(){function t(t){t.remember("_resizeHandler",this),this.el=t,this.parameters={},this.lastUpdateCall=null,this.p=t.doc().node.createSVGPoint()}t.prototype.transformPoint=function(t,e,i){return this.p.x=t-(this.offset.x-window.pageXOffset),this.p.y=e-(this.offset.y-window.pageYOffset),this.p.matrixTransform(i||this.m)},t.prototype._extractPosition=function(t){return{x:null!=t.clientX?t.clientX:t.touches[0].clientX,y:null!=t.clientY?t.clientY:t.touches[0].clientY}},t.prototype.init=function(t){var e=this;if(this.stop(),"stop"!==t){this.options={};for(var i in this.el.resize.defaults)this.options[i]=this.el.resize.defaults[i],void 0!==t[i]&&(this.options[i]=t[i]);this.el.on("lt.resize",function(t){e.resize(t||window.event)}),this.el.on("rt.resize",function(t){e.resize(t||window.event)}),this.el.on("rb.resize",function(t){e.resize(t||window.event)}),this.el.on("lb.resize",function(t){e.resize(t||window.event)}),this.el.on("t.resize",function(t){e.resize(t||window.event)}),this.el.on("r.resize",function(t){e.resize(t||window.event)}),this.el.on("b.resize",function(t){e.resize(t||window.event)}),this.el.on("l.resize",function(t){e.resize(t||window.event)}),this.el.on("rot.resize",function(t){e.resize(t||window.event)}),this.el.on("point.resize",function(t){e.resize(t||window.event)}),this.update()}},t.prototype.stop=function(){return this.el.off("lt.resize"),this.el.off("rt.resize"),this.el.off("rb.resize"),this.el.off("lb.resize"),this.el.off("t.resize"),this.el.off("r.resize"),this.el.off("b.resize"),this.el.off("l.resize"),this.el.off("rot.resize"),this.el.off("point.resize"),this},t.prototype.resize=function(t){var e=this;this.m=this.el.node.getScreenCTM().inverse(),this.offset={x:window.pageXOffset,y:window.pageYOffset};var i=this._extractPosition(t.detail.event);if(this.parameters={type:this.el.type,p:this.transformPoint(i.x,i.y),x:t.detail.x,y:t.detail.y,box:this.el.bbox(),rotation:this.el.transform().rotation},this.resizeLimits=this.options.resizeLimits||this.resize.defaults.resizeLimits,"text"===this.el.type&&(this.parameters.fontSize=this.el.attr()["font-size"]),void 0!==t.detail.i){var s=this.el.array().valueOf();this.parameters.i=t.detail.i,this.parameters.pointCoords=[s[t.detail.i][0],s[t.detail.i][1]]}switch(this._resizeLeft=function(t,e,i,s,r){if(this.parameters.box.width-t[0]>=this.resizeLimits.width){if(i&&(t=this.checkAspectRatio(t,s)),"text"===this.parameters.type)return void(e&&(this.el.move(this.parameters.box.x+t[0],this.parameters.box.y),this.el.attr("font-size",this.parameters.fontSize-t[0])));this.el.width(this.parameters.box.width-t[0]),r?this.el.x(this.parameters.box.x+t[0]):this.el.move(this.parameters.box.x+t[0],this.parameters.box.y)}},this._resizeRight=function(t,e,i,s){if(this.parameters.box.width+t[0]>=this.resizeLimits.width){if(i&&(t=this.checkAspectRatio(t,s)),"text"===this.parameters.type)return void(e&&(this.el.move(this.parameters.box.x-t[0],this.parameters.box.y),this.el.attr("font-size",this.parameters.fontSize+t[0])));this.el.x(this.parameters.box.x).width(this.parameters.box.width+t[0])}},this._resizeTop=function(t,e,i,s){if(this.parameters.box.height-t[1]>=this.resizeLimits.height){if(e&&(t=this.checkAspectRatio(t,i)),"text"===this.parameters.type)return;this.el.height(this.parameters.box.height-t[1]),s?this.el.y(this.parameters.box.y+t[1]):this.el.move(this.parameters.box.x,this.parameters.box.y+t[1])}},this._resizeBottom=function(t,e,i){if(this.parameters.box.height+t[1]>=this.resizeLimits.height){if(e&&(t=this.checkAspectRatio(t,i)),"text"===this.parameters.type)return;this.el.y(this.parameters.box.y).height(this.parameters.box.height+t[1])}},t.type){case"lt":this.calc=function(t,e){var i=this.snapToGrid(t,e);this._resizeTop(i,!0,!1,!0),this._resizeLeft(i,!0,!0,!1,!0)};break;case"rt":this.calc=function(t,e){var i=this.snapToGrid(t,e,2);this._resizeTop(i,!0,!0,!0),this._resizeRight(i,!0,!0,!0)};break;case"rb":this.calc=function(t,e){var i=this.snapToGrid(t,e,0);this._resizeBottom(i,!0),this._resizeRight(i,!0,!0)};break;case"lb":this.calc=function(t,e){var i=this.snapToGrid(t,e,1);this._resizeBottom(i,!0,!0),this._resizeLeft(i,!0,!0,!0,!0)};break;case"t":this.calc=function(t,e){var i=this.snapToGrid(t,e,2);this._resizeTop(i)};break;case"r":this.calc=function(t,e){var i=this.snapToGrid(t,e,0);this._resizeRight(i)};break;case"b":this.calc=function(t,e){var i=this.snapToGrid(t,e,0);this._resizeBottom(i)};break;case"l":this.calc=function(t,e){var i=this.snapToGrid(t,e,1);this._resizeLeft(i)};break;case"rot":this.calc=function(t,e){var i={x:t+this.parameters.p.x,y:e+this.parameters.p.y},s=Math.atan2(this.parameters.p.y-this.parameters.box.y-this.parameters.box.height/2,this.parameters.p.x-this.parameters.box.x-this.parameters.box.width/2),r=Math.atan2(i.y-this.parameters.box.y-this.parameters.box.height/2,i.x-this.parameters.box.x-this.parameters.box.width/2),o=this.parameters.rotation+180*(r-s)/Math.PI+this.options.snapToAngle/2;this.el.center(this.parameters.box.cx,this.parameters.box.cy).rotate(o-o%this.options.snapToAngle,this.parameters.box.cx,this.parameters.box.cy)};break;case"point":this.calc=function(t,e){var i=this.snapToGrid(t,e,this.parameters.pointCoords[0],this.parameters.pointCoords[1]),s=this.el.array().valueOf();s[this.parameters.i][0]=this.parameters.pointCoords[0]+i[0],s[this.parameters.i][1]=this.parameters.pointCoords[1]+i[1],this.el.plot(s)}}this.el.fire("resizestart",{dx:this.parameters.x,dy:this.parameters.y,event:t}),SVG.on(window,"touchmove.resize",function(t){e.update(t||window.event)}),SVG.on(window,"touchend.resize",function(){e.done()}),SVG.on(window,"mousemove.resize",function(t){e.update(t||window.event)}),SVG.on(window,"mouseup.resize",function(){e.done()})},t.prototype.update=function(t){if(!t)return void(this.lastUpdateCall&&this.calc(this.lastUpdateCall[0],this.lastUpdateCall[1]));var e=this._extractPosition(t),i=this.transformPoint(e.x,e.y),s=i.x-this.parameters.p.x,r=i.y-this.parameters.p.y;this.lastUpdateCall=[s,r],this.calc(s,r),this.el.fire("resizing",{dx:s,dy:r,event:t})},t.prototype.done=function(){this.lastUpdateCall=null,SVG.off(window,"mousemove.resize"),SVG.off(window,"mouseup.resize"),SVG.off(window,"touchmove.resize"),SVG.off(window,"touchend.resize"),this.el.fire("resizedone")},t.prototype.snapToGrid=function(t,e,i,s){var r;return void 0!==s?r=[(i+t)%this.options.snapToGrid,(s+e)%this.options.snapToGrid]:(i=null==i?3:i,r=[(this.parameters.box.x+t+(1&i?0:this.parameters.box.width))%this.options.snapToGrid,(this.parameters.box.y+e+(2&i?0:this.parameters.box.height))%this.options.snapToGrid]),t<0&&(r[0]-=this.options.snapToGrid),e<0&&(r[1]-=this.options.snapToGrid),t-=Math.abs(r[0])a.maxX&&(t=a.maxX-r),void 0!==a.minY&&o+ea.maxY&&(e=a.maxY-o),[t,e]},t.prototype.checkAspectRatio=function(t,e){if(!this.options.saveAspectRatio)return t;var i=t.slice(),s=this.parameters.box.width/this.parameters.box.height,r=this.parameters.box.width+t[0],o=this.parameters.box.height-t[1],a=r/o;return as&&(i[0]=this.parameters.box.width-o*s,e&&(i[0]=-i[0])),i},SVG.extend(SVG.Element,{resize:function(e){return(this.remember("_resizeHandler")||new t(this)).init(e||{}),this}}),SVG.Element.prototype.resize.defaults={snapToAngle:.1,snapToGrid:1,constraint:{},resizeLimits:{width:0,height:0},saveAspectRatio:!1}}).call(this)}();
\ No newline at end of file
diff --git a/hal-core/resources/web/js/lib/svg.select.LICENSE.txt b/hal-core/resources/web/js/lib/svg.select.LICENSE.txt
new file mode 100644
index 00000000..ca43f864
--- /dev/null
+++ b/hal-core/resources/web/js/lib/svg.select.LICENSE.txt
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 Fuzzy
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
\ No newline at end of file
diff --git a/hal-core/resources/web/js/lib/svg.select.js b/hal-core/resources/web/js/lib/svg.select.js
new file mode 100644
index 00000000..cfd8acb5
--- /dev/null
+++ b/hal-core/resources/web/js/lib/svg.select.js
@@ -0,0 +1,425 @@
+/*!
+* svg.select.js - An extension of svg.js which allows to select elements with mouse
+* @version 3.0.1
+* https://github.com/svgdotjs/svg.select.js
+*
+* @copyright Ulrich-Matthias Schäfer
+* @license MIT
+*/;
+;(function() {
+"use strict";
+
+function SelectHandler(el) {
+
+ this.el = el;
+ el.remember('_selectHandler', this);
+ this.pointSelection = {isSelected: false};
+ this.rectSelection = {isSelected: false};
+
+ // helper list with position settings of each type of point
+ this.pointsList = {
+ lt: [ 0, 0 ],
+ rt: [ 'width', 0 ],
+ rb: [ 'width', 'height' ],
+ lb: [ 0, 'height' ],
+ t: [ 'width', 0 ],
+ r: [ 'width', 'height' ],
+ b: [ 'width', 'height' ],
+ l: [ 0, 'height' ]
+ };
+
+ // helper function to get point coordinates based on settings above and an object (bbox in our case)
+ this.pointCoord = function (setting, object, isPointCentered) {
+ var coord = typeof setting !== 'string' ? setting : object[setting];
+ // Top, bottom, right and left points are placed in the center of element width/height
+ return isPointCentered ? coord / 2 : coord
+ }
+
+ this.pointCoords = function (point, object) {
+ var settings = this.pointsList[point];
+
+ return {
+ x: this.pointCoord(settings[0], object, (point === 't' || point === 'b')),
+ y: this.pointCoord(settings[1], object, (point === 'r' || point === 'l'))
+ }
+ }
+}
+
+SelectHandler.prototype.init = function (value, options) {
+
+ var bbox = this.el.bbox();
+ this.options = {};
+
+ // store defaults list of points in order to verify users config
+ var points = this.el.selectize.defaults.points;
+
+ // Merging the defaults and the options-object together
+ for (var i in this.el.selectize.defaults) {
+ this.options[i] = this.el.selectize.defaults[i];
+ if (options[i] !== undefined) {
+ this.options[i] = options[i];
+ }
+ }
+
+ // prepare & validate list of points to be added (or excluded)
+ var pointsLists = ['points', 'pointsExclude'];
+
+ for (var i in pointsLists) {
+ var option = this.options[pointsLists[i]];
+
+ if (typeof option === 'string') {
+ if (option.length > 0) {
+ // if set as comma separated string list => convert it into an array
+ option = option.split(/\s*,\s*/i);
+ } else {
+ option = [];
+ }
+ } else if (typeof option === 'boolean' && pointsLists[i] === 'points') {
+ // this is not needed, but let's have it for legacy support
+ option = option ? points : [];
+ }
+
+ this.options[pointsLists[i]] = option;
+ }
+
+ // intersect correct all points options with users config (exclude unwanted points)
+ // ES5 -> NO arrow functions nor Array.includes()
+ this.options.points = [ points, this.options.points ].reduce(
+ function (a, b) {
+ return a.filter(
+ function (c) {
+ return b.indexOf(c) > -1;
+ }
+ )
+ }
+ );
+
+ // exclude pointsExclude, if wanted
+ this.options.points = [ this.options.points, this.options.pointsExclude ].reduce(
+ function (a, b) {
+ return a.filter(
+ function (c) {
+ return b.indexOf(c) < 0;
+ }
+ )
+ }
+ );
+
+ this.parent = this.el.parent();
+ this.nested = (this.nested || this.parent.group());
+ this.nested.matrix(new SVG.Matrix(this.el).translate(bbox.x, bbox.y));
+
+ // When deepSelect is enabled and the element is a line/polyline/polygon, draw only points for moving
+ if (this.options.deepSelect && ['line', 'polyline', 'polygon'].indexOf(this.el.type) !== -1) {
+ this.selectPoints(value);
+ } else {
+ this.selectRect(value);
+ }
+
+ this.observe();
+ this.cleanup();
+
+};
+
+SelectHandler.prototype.selectPoints = function (value) {
+
+ this.pointSelection.isSelected = value;
+
+ // When set is already there we dont have to create one
+ if (this.pointSelection.set) {
+ return this;
+ }
+
+ // Create our set of elements
+ this.pointSelection.set = this.parent.set();
+ // draw the points and mark the element as selected
+ this.drawPoints();
+
+ return this;
+
+};
+
+// create the point-array which contains the 2 points of a line or simply the points-array of polyline/polygon
+SelectHandler.prototype.getPointArray = function () {
+ var bbox = this.el.bbox();
+
+ return this.el.array().valueOf().map(function (el) {
+ return [el[0] - bbox.x, el[1] - bbox.y];
+ });
+};
+
+// Draws a points
+SelectHandler.prototype.drawPoints = function () {
+
+ var _this = this, array = this.getPointArray();
+
+ // go through the array of points
+ for (var i = 0, len = array.length; i < len; ++i) {
+
+ var curriedEvent = (function (k) {
+ return function (ev) {
+ ev = ev || window.event;
+ ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
+ ev.stopPropagation();
+
+ var x = ev.pageX || ev.touches[0].pageX;
+ var y = ev.pageY || ev.touches[0].pageY;
+ _this.el.fire('point', {x: x, y: y, i: k, event: ev});
+ };
+ })(i);
+
+ // add every point to the set
+ // add css-classes and a touchstart-event which fires our event for moving points
+ var point = this.drawPoint(array[i][0], array[i][1])
+ .addClass(this.options.classPoints)
+ .addClass(this.options.classPoints + '_point')
+ .on('touchstart', curriedEvent)
+ .on('mousedown', curriedEvent)
+ this.pointSelection.set.add(point);
+ }
+};
+
+// The function to draw single point
+SelectHandler.prototype.drawPoint = function (cx, cy) {
+ var pointType = this.options.pointType;
+
+ switch (pointType) {
+ case 'circle':
+ return this.drawCircle(cx, cy);
+ case 'rect':
+ return this.drawRect(cx, cy);
+ default:
+ if (typeof pointType === 'function') {
+ return pointType.call(this, cx, cy);
+ }
+
+ throw new Error('Unknown ' + pointType + ' point type!');
+ }
+};
+
+// The function to draw the circle point
+SelectHandler.prototype.drawCircle = function (cx, cy) {
+ return this.nested.circle(this.options.pointSize)
+ .stroke(this.options.pointStroke)
+ .fill(this.options.pointFill)
+ .center(cx, cy);
+};
+
+// The function to draw the rect point
+SelectHandler.prototype.drawRect = function (cx, cy) {
+ return this.nested.rect(this.options.pointSize, this.options.pointSize)
+ .stroke(this.options.pointStroke)
+ .fill(this.options.pointFill)
+ .center(cx, cy);
+};
+
+// every time a point is moved, we have to update the positions of our point
+SelectHandler.prototype.updatePointSelection = function () {
+ var array = this.getPointArray();
+
+ this.pointSelection.set.each(function (i) {
+ if (this.cx() === array[i][0] && this.cy() === array[i][1]) {
+ return;
+ }
+ this.center(array[i][0], array[i][1]);
+ });
+};
+
+SelectHandler.prototype.updateRectSelection = function () {
+ var _this = this, bbox = this.el.bbox();
+
+ this.rectSelection.set.get(0).attr({
+ width: bbox.width,
+ height: bbox.height
+ });
+
+ // set.get(1) is always in the upper left corner. no need to move it
+ if (this.options.points.length) {
+ this.options.points.map(function (point, index) {
+ var coords = _this.pointCoords(point, bbox);
+
+ _this.rectSelection.set.get(index + 1).center(coords.x, coords.y);
+ });
+ }
+
+ if (this.options.rotationPoint) {
+ var length = this.rectSelection.set.length();
+
+ this.rectSelection.set.get(length - 1).center(bbox.width / 2, 20);
+ }
+};
+
+SelectHandler.prototype.selectRect = function (value) {
+
+ var _this = this, bbox = this.el.bbox();
+
+ this.rectSelection.isSelected = value;
+
+ // when set is already p
+ this.rectSelection.set = this.rectSelection.set || this.parent.set();
+
+ // helperFunction to create a mouse-down function which triggers the event specified in `eventName`
+ function getMoseDownFunc(eventName) {
+ return function (ev) {
+ ev = ev || window.event;
+ ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
+ ev.stopPropagation();
+
+ var x = ev.pageX || ev.touches[0].pageX;
+ var y = ev.pageY || ev.touches[0].pageY;
+ _this.el.fire(eventName, {x: x, y: y, event: ev});
+ };
+ }
+
+ // create the selection-rectangle and add the css-class
+ if (!this.rectSelection.set.get(0)) {
+ this.rectSelection.set.add(this.nested.rect(bbox.width, bbox.height).addClass(this.options.classRect));
+ }
+
+ // Draw Points at the edges, if enabled
+ if (this.options.points.length && this.rectSelection.set.length() < 2) {
+ var ename ="touchstart", mname = "mousedown";
+
+ this.options.points.map(function (point, index) {
+ var coords = _this.pointCoords(point, bbox);
+
+ var pointElement = _this.drawPoint(coords.x, coords.y)
+ .attr('class', _this.options.classPoints + '_' + point)
+ .on(mname, getMoseDownFunc(point))
+ .on(ename, getMoseDownFunc(point));
+ _this.rectSelection.set.add(pointElement);
+ });
+
+ this.rectSelection.set.each(function () {
+ this.addClass(_this.options.classPoints);
+ });
+ }
+
+ // draw rotationPint, if enabled
+ if (this.options.rotationPoint && ((this.options.points && !this.rectSelection.set.get(9)) || (!this.options.points && !this.rectSelection.set.get(1)))) {
+
+ var curriedEvent = function (ev) {
+ ev = ev || window.event;
+ ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
+ ev.stopPropagation();
+
+ var x = ev.pageX || ev.touches[0].pageX;
+ var y = ev.pageY || ev.touches[0].pageY;
+ _this.el.fire('rot', {x: x, y: y, event: ev});
+ };
+
+ var pointElement = this.drawPoint(bbox.width / 2, 20)
+ .attr('class', this.options.classPoints + '_rot')
+ .on("touchstart", curriedEvent)
+ .on("mousedown", curriedEvent);
+ this.rectSelection.set.add(pointElement);
+ }
+
+};
+
+SelectHandler.prototype.handler = function () {
+
+ var bbox = this.el.bbox();
+ this.nested.matrix(new SVG.Matrix(this.el).translate(bbox.x, bbox.y));
+
+ if (this.rectSelection.isSelected) {
+ this.updateRectSelection();
+ }
+
+ if (this.pointSelection.isSelected) {
+ this.updatePointSelection();
+ }
+
+};
+
+SelectHandler.prototype.observe = function () {
+ var _this = this;
+
+ if (MutationObserver) {
+ if (this.rectSelection.isSelected || this.pointSelection.isSelected) {
+ this.observerInst = this.observerInst || new MutationObserver(function () {
+ _this.handler();
+ });
+ this.observerInst.observe(this.el.node, {attributes: true});
+ } else {
+ try {
+ this.observerInst.disconnect();
+ delete this.observerInst;
+ } catch (e) {
+ }
+ }
+ } else {
+ this.el.off('DOMAttrModified.select');
+
+ if (this.rectSelection.isSelected || this.pointSelection.isSelected) {
+ this.el.on('DOMAttrModified.select', function () {
+ _this.handler();
+ });
+ }
+ }
+};
+
+SelectHandler.prototype.cleanup = function () {
+
+ //var _this = this;
+
+ if (!this.rectSelection.isSelected && this.rectSelection.set) {
+ // stop watching the element, remove the selection
+ this.rectSelection.set.each(function () {
+ this.remove();
+ });
+
+ this.rectSelection.set.clear();
+ delete this.rectSelection.set;
+ }
+
+ if (!this.pointSelection.isSelected && this.pointSelection.set) {
+ // Remove all points, clear the set, stop watching the element
+ this.pointSelection.set.each(function () {
+ this.remove();
+ });
+
+ this.pointSelection.set.clear();
+ delete this.pointSelection.set;
+ }
+
+ if (!this.pointSelection.isSelected && !this.rectSelection.isSelected) {
+ this.nested.remove();
+ delete this.nested;
+
+ }
+};
+
+
+SVG.extend(SVG.Element, {
+ // Select element with mouse
+ selectize: function (value, options) {
+
+ // Check the parameters and reassign if needed
+ if (typeof value === 'object') {
+ options = value;
+ value = true;
+ }
+
+ var selectHandler = this.remember('_selectHandler') || new SelectHandler(this);
+
+ selectHandler.init(value === undefined ? true : value, options || {});
+
+ return this;
+
+ }
+});
+
+SVG.Element.prototype.selectize.defaults = {
+ points: ['lt', 'rt', 'rb', 'lb', 't', 'r', 'b', 'l'], // which points to draw, default all
+ pointsExclude: [], // easier option if to exclude few than rewrite all
+ classRect: 'svg_select_boundingRect', // Css-class added to the rect
+ classPoints: 'svg_select_points', // Css-class added to the points
+ pointSize: 7, // size of point
+ rotationPoint: true, // If true, rotation point is drawn. Needed for rotation!
+ deepSelect: false, // If true, moving of single points is possible (only line, polyline, polyon)
+ pointType: 'circle', // Point type: circle or rect, default circle
+ pointFill: "#000", // Point fill color
+ pointStroke: { width: 1, color: "#000" } // Point stroke properties
+};
+}());
\ No newline at end of file
diff --git a/hal-core/resources/web/js/lib/svg.select.min.js b/hal-core/resources/web/js/lib/svg.select.min.js
new file mode 100644
index 00000000..56e232fb
--- /dev/null
+++ b/hal-core/resources/web/js/lib/svg.select.min.js
@@ -0,0 +1 @@
+/*! svg.select.js v3.0.1 MIT*/;!function(){"use strict";function i(t){(this.el=t).remember("_selectHandler",this),this.pointSelection={isSelected:!1},this.rectSelection={isSelected:!1},this.pointsList={lt:[0,0],rt:["width",0],rb:["width","height"],lb:[0,"height"],t:["width",0],r:["width","height"],b:["width","height"],l:[0,"height"]},this.pointCoord=function(t,e,i){var o="string"!=typeof t?t:e[t];return i?o/2:o},this.pointCoords=function(t,e){var i=this.pointsList[t];return{x:this.pointCoord(i[0],e,"t"===t||"b"===t),y:this.pointCoord(i[1],e,"r"===t||"l"===t)}}}i.prototype.init=function(t,e){var i=this.el.bbox();this.options={};var o=this.el.selectize.defaults.points;for(var s in this.el.selectize.defaults)this.options[s]=this.el.selectize.defaults[s],void 0!==e[s]&&(this.options[s]=e[s]);var n=["points","pointsExclude"];for(var s in n){var r=this.options[n[s]];"string"==typeof r?r=0
+
+
+
+