"+d.join("")+"
"}function e(){for(var a=0;a","
"].join(""),s=function(){var a="";if(p)for(var b=1;6>=b;b++)a+="";return["","
▼
","","
"].join("")}(),t="spectrum.id";b.fn.spectrum=function(a){if("string"==typeof a){var c=this,d=Array.prototype.slice.call(arguments,1);return this.each(function(){var e=o[b(this).data(t)];if(e){var f=e[a];if(!f)throw new Error("Spectrum: no such method: '"+a+"'");"get"==a?c=e.get():"container"==a?c=e.container:"option"==a?c=e.option.apply(e,d):"destroy"==a?(e.destroy(),b(this).removeData(t)):f.apply(e,d)}}),c}return this.spectrum("destroy").each(function(){var c=g(this,a);b(this).data(t,c.id)})},b.fn.spectrum.load=!0,b.fn.spectrum.loadOpts={},b.fn.spectrum.draggable=l,b.fn.spectrum.defaults=n,b.spectrum={},b.spectrum.localization={},b.spectrum.palettes={},b.fn.spectrum.processNativeColorInputs=function(){var a=b("")[0],c="color"===a.type&&"!"!=a.value;c||b("input[type=color]").spectrum({preferredFormat:"hex6"})},function(){function b(a,d){if(a=a?a:"",d=d||{},"object"==typeof a&&a.hasOwnProperty("_tc_id"))return a;var f=c(a),h=f.r,j=f.g,m=f.b,n=f.a,o=x(100*n)/100,p=d.format||f.format;return 1>h&&(h=x(h)),1>j&&(j=x(j)),1>m&&(m=x(m)),{ok:f.ok,format:p,_tc_id:v++,alpha:n,getAlpha:function(){return n},setAlpha:function(a){n=k(a),o=x(100*n)/100},toHsv:function(){var a=g(h,j,m);return{h:360*a.h,s:a.s,v:a.v,a:n}},toHsvString:function(){var a=g(h,j,m),b=x(360*a.h),c=x(100*a.s),d=x(100*a.v);return 1==n?"hsv("+b+", "+c+"%, "+d+"%)":"hsva("+b+", "+c+"%, "+d+"%, "+o+")"},toHsl:function(){var a=e(h,j,m);return{h:360*a.h,s:a.s,l:a.l,a:n}},toHslString:function(){var a=e(h,j,m),b=x(360*a.h),c=x(100*a.s),d=x(100*a.l);return 1==n?"hsl("+b+", "+c+"%, "+d+"%)":"hsla("+b+", "+c+"%, "+d+"%, "+o+")"},toHex:function(a){return i(h,j,m,a)},toHexString:function(a){return"#"+i(h,j,m,a)},toRgb:function(){return{r:x(h),g:x(j),b:x(m),a:n}},toRgbString:function(){return 1==n?"rgb("+x(h)+", "+x(j)+", "+x(m)+")":"rgba("+x(h)+", "+x(j)+", "+x(m)+", "+o+")"},toPercentageRgb:function(){return{r:x(100*l(h,255))+"%",g:x(100*l(j,255))+"%",b:x(100*l(m,255))+"%",a:n}},toPercentageRgbString:function(){return 1==n?"rgb("+x(100*l(h,255))+"%, "+x(100*l(j,255))+"%, "+x(100*l(m,255))+"%)":"rgba("+x(100*l(h,255))+"%, "+x(100*l(j,255))+"%, "+x(100*l(m,255))+"%, "+o+")"},toName:function(){return 0===n?"transparent":C[i(h,j,m,!0)]||!1},toFilter:function(a){var c=i(h,j,m),e=c,f=Math.round(255*parseFloat(n)).toString(16),g=f,k=d&&d.gradientType?"GradientType = 1, ":"";if(a){var l=b(a);e=l.toHex(),g=Math.round(255*parseFloat(l.alpha)).toString(16)}return"progid:DXImageTransform.Microsoft.gradient("+k+"startColorstr=#"+q(f)+c+",endColorstr=#"+q(g)+e+")"},toString:function(a){var b=!!a;a=a||this.format;var c=!1,d=!b&&1>n&&n>0,e=d&&("hex"===a||"hex6"===a||"hex3"===a||"name"===a);return"rgb"===a&&(c=this.toRgbString()),"prgb"===a&&(c=this.toPercentageRgbString()),("hex"===a||"hex6"===a)&&(c=this.toHexString()),"hex3"===a&&(c=this.toHexString(!0)),"name"===a&&(c=this.toName()),"hsl"===a&&(c=this.toHslString()),"hsv"===a&&(c=this.toHsvString()),e?this.toRgbString():c||this.toHexString()}}}function c(a){var b={r:0,g:0,b:0},c=1,e=!1,g=!1;return"string"==typeof a&&(a=s(a)),"object"==typeof a&&(a.hasOwnProperty("r")&&a.hasOwnProperty("g")&&a.hasOwnProperty("b")?(b=d(a.r,a.g,a.b),e=!0,g="%"===String(a.r).substr(-1)?"prgb":"rgb"):a.hasOwnProperty("h")&&a.hasOwnProperty("s")&&a.hasOwnProperty("v")?(a.s=r(a.s),a.v=r(a.v),b=h(a.h,a.s,a.v),e=!0,g="hsv"):a.hasOwnProperty("h")&&a.hasOwnProperty("s")&&a.hasOwnProperty("l")&&(a.s=r(a.s),a.l=r(a.l),b=f(a.h,a.s,a.l),e=!0,g="hsl"),a.hasOwnProperty("a")&&(c=a.a)),c=k(c),{ok:e,format:a.format||g,r:y(255,z(b.r,0)),g:y(255,z(b.g,0)),b:y(255,z(b.b,0)),a:c}}function d(a,b,c){return{r:255*l(a,255),g:255*l(b,255),b:255*l(c,255)}}function e(a,b,c){a=l(a,255),b=l(b,255),c=l(c,255);var d,e,f=z(a,b,c),g=y(a,b,c),h=(f+g)/2;if(f==g)d=e=0;else{var i=f-g;switch(e=h>.5?i/(2-f-g):i/(f+g),f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,l:h}}function f(a,b,c){function d(a,b,c){return 0>c&&(c+=1),c>1&&(c-=1),1/6>c?a+6*(b-a)*c:.5>c?b:2/3>c?a+6*(b-a)*(2/3-c):a}var e,f,g;if(a=l(a,360),b=l(b,100),c=l(c,100),0===b)e=f=g=c;else{var h=.5>c?c*(1+b):c+b-c*b,i=2*c-h;e=d(i,h,a+1/3),f=d(i,h,a),g=d(i,h,a-1/3)}return{r:255*e,g:255*f,b:255*g}}function g(a,b,c){a=l(a,255),b=l(b,255),c=l(c,255);var d,e,f=z(a,b,c),g=y(a,b,c),h=f,i=f-g;if(e=0===f?0:i/f,f==g)d=0;else{switch(f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,v:h}}function h(a,b,c){a=6*l(a,360),b=l(b,100),c=l(c,100);var d=w.floor(a),e=a-d,f=c*(1-b),g=c*(1-e*b),h=c*(1-(1-e)*b),i=d%6,j=[c,g,f,f,h,c][i],k=[h,c,c,g,f,f][i],m=[f,f,h,c,c,g][i];return{r:255*j,g:255*k,b:255*m}}function i(a,b,c,d){var e=[q(x(a).toString(16)),q(x(b).toString(16)),q(x(c).toString(16))];return d&&e[0].charAt(0)==e[0].charAt(1)&&e[1].charAt(0)==e[1].charAt(1)&&e[2].charAt(0)==e[2].charAt(1)?e[0].charAt(0)+e[1].charAt(0)+e[2].charAt(0):e.join("")}function j(a){var b={};for(var c in a)a.hasOwnProperty(c)&&(b[a[c]]=c);return b}function k(a){return a=parseFloat(a),(isNaN(a)||0>a||a>1)&&(a=1),a}function l(a,b){o(a)&&(a="100%");var c=p(a);return a=y(b,z(0,parseFloat(a))),c&&(a=parseInt(a*b,10)/100),w.abs(a-b)<1e-6?1:a%b/parseFloat(b)}function m(a){return y(1,z(0,a))}function n(a){return parseInt(a,16)}function o(a){return"string"==typeof a&&-1!=a.indexOf(".")&&1===parseFloat(a)}function p(a){return"string"==typeof a&&-1!=a.indexOf("%")}function q(a){return 1==a.length?"0"+a:""+a}function r(a){return 1>=a&&(a=100*a+"%"),a}function s(a){a=a.replace(t,"").replace(u,"").toLowerCase();var b=!1;if(B[a])a=B[a],b=!0;else if("transparent"==a)return{r:0,g:0,b:0,a:0,format:"name"};var c;return(c=D.rgb.exec(a))?{r:c[1],g:c[2],b:c[3]}:(c=D.rgba.exec(a))?{r:c[1],g:c[2],b:c[3],a:c[4]}:(c=D.hsl.exec(a))?{h:c[1],s:c[2],l:c[3]}:(c=D.hsla.exec(a))?{h:c[1],s:c[2],l:c[3],a:c[4]}:(c=D.hsv.exec(a))?{h:c[1],s:c[2],v:c[3]}:(c=D.hex6.exec(a))?{r:n(c[1]),g:n(c[2]),b:n(c[3]),format:b?"name":"hex"}:(c=D.hex3.exec(a))?{r:n(c[1]+""+c[1]),g:n(c[2]+""+c[2]),b:n(c[3]+""+c[3]),format:b?"name":"hex"}:!1}var t=/^[\s,#]+/,u=/\s+$/,v=0,w=Math,x=w.round,y=w.min,z=w.max,A=w.random;b.fromRatio=function(a,c){if("object"==typeof a){var d={};for(var e in a)a.hasOwnProperty(e)&&(d[e]="a"===e?a[e]:r(a[e]));a=d}return b(a,c)},b.equals=function(a,c){return a&&c?b(a).toRgbString()==b(c).toRgbString():!1},b.random=function(){return b.fromRatio({r:A(),g:A(),b:A()})},b.desaturate=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s-=c/100,d.s=m(d.s),b(d)},b.saturate=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s+=c/100,d.s=m(d.s),b(d)},b.greyscale=function(a){return b.desaturate(a,100)},b.lighten=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l+=c/100,d.l=m(d.l),b(d)},b.darken=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l-=c/100,d.l=m(d.l),b(d)},b.complement=function(a){var c=b(a).toHsl();return c.h=(c.h+180)%360,b(c)},b.triad=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+120)%360,s:c.s,l:c.l}),b({h:(d+240)%360,s:c.s,l:c.l})]},b.tetrad=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+90)%360,s:c.s,l:c.l}),b({h:(d+180)%360,s:c.s,l:c.l}),b({h:(d+270)%360,s:c.s,l:c.l})]},b.splitcomplement=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+72)%360,s:c.s,l:c.l}),b({h:(d+216)%360,s:c.s,l:c.l})]},b.analogous=function(a,c,d){c=c||6,d=d||30;var e=b(a).toHsl(),f=360/d,g=[b(a)];for(e.h=(e.h-(f*c>>1)+720)%360;--c;)e.h=(e.h+f)%360,g.push(b(e));return g},b.monochromatic=function(a,c){c=c||6;for(var d=b(a).toHsv(),e=d.h,f=d.s,g=d.v,h=[],i=1/c;c--;)h.push(b({h:e,s:f,v:g})),g=(g+i)%1;return h},b.readability=function(a,c){var d=b(a).toRgb(),e=b(c).toRgb(),f=(299*d.r+587*d.g+114*d.b)/1e3,g=(299*e.r+587*e.g+114*e.b)/1e3,h=Math.max(d.r,e.r)-Math.min(d.r,e.r)+Math.max(d.g,e.g)-Math.min(d.g,e.g)+Math.max(d.b,e.b)-Math.min(d.b,e.b);return{brightness:Math.abs(f-g),color:h}},b.readable=function(a,c){var d=b.readability(a,c);return d.brightness>125&&d.color>500},b.mostReadable=function(a,c){for(var d=null,e=0,f=!1,g=0;g","","
","","
","","","","
","","
","","
","","
","","","
","","",a,"
","","","
","","","Add new frame
",this.container.append(e);var f=a>1;f&&this.initDragndropBehavior_(),this.updateScrollerOverflows()},a.PreviewFilmController.prototype.initDragndropBehavior_=function(){$("#preview-list").sortable({placeholder:"preview-tile-drop-proxy",update:$.proxy(this.onUpdate_,this),items:".preview-tile"}),$("#preview-list").disableSelection()},a.PreviewFilmController.prototype.onUpdate_=function(a,b){var c=parseInt(b.item.data("tile-number"),10),d=$(".preview-tile").index(b.item);this.piskelController.moveFrame(c,d),this.piskelController.setCurrentFrameIndex(d)},a.PreviewFilmController.prototype.createPreviewTile_=function(a){var c=this.piskelController.getCurrentLayer().getFrameAt(a),d=document.createElement("li");d.setAttribute("data-tile-number",a),d.setAttribute("data-tile-action",b.SELECT),d.classList.add("preview-tile"),this.piskelController.getCurrentFrame()==c&&d.classList.add("selected");var e=document.createElement("div");e.classList.add("canvas-container",pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));var f=document.createElement("div");f.className="canvas-background",e.appendChild(f);var g=document.createElement("button");g.setAttribute("rel","tooltip"),g.setAttribute("data-placement","right"),g.setAttribute("data-tile-number",a),g.setAttribute("data-tile-action",b.CLONE),g.setAttribute("title","Duplicate this frame"),g.className="tile-overlay duplicate-frame-action",d.appendChild(g);var h=new pskl.rendering.CanvasRenderer(c,this.zoom);h.drawTransparentAs(Constants.TRANSPARENT_COLOR);var i=h.render();if(i.classList.add("tile-view","canvas"),e.appendChild(i),d.appendChild(e),a>0||this.piskelController.getFrameCount()>1){var j=document.createElement("button");j.setAttribute("rel","tooltip"),j.setAttribute("data-placement","right"),j.setAttribute("title","Delete this frame"),j.setAttribute("data-tile-number",a),j.setAttribute("data-tile-action",b.DELETE),j.className="tile-overlay delete-frame-action",d.appendChild(j);var k=document.createElement("div");k.className="tile-overlay dnd-action",d.appendChild(k)}var l=document.createElement("div");return l.className="tile-overlay tile-count",l.innerHTML=a+1,d.appendChild(l),d},a.PreviewFilmController.prototype.calculateZoom_=function(){var a=this.piskelController.getCurrentFrame(),b=a.getHeight(),c=a.getWidth();return Math.min(Constants.PREVIEW_FILM_SIZE/b,Constants.PREVIEW_FILM_SIZE/c)}}(),function(){var a=$.namespace("pskl.controller");a.LayersListController=function(a){this.piskelController=a},a.LayersListController.prototype.init=function(){this.layerItemTemplate_=pskl.utils.Template.get("layer-item-template"),this.rootEl=document.querySelectorAll(".layers-list-container")[0],this.layersListEl=document.querySelectorAll(".layers-list")[0],this.rootEl.addEventListener("click",this.onClick_.bind(this)),$.subscribe(Events.PISKEL_RESET,this.renderLayerList_.bind(this)),this.renderLayerList_()},a.LayersListController.prototype.renderLayerList_=function(){this.layersListEl.innerHTML="";var a=this.piskelController.getLayers();a.forEach(this.addLayerItem.bind(this))},a.LayersListController.prototype.addLayerItem=function(a,b){var c=this.piskelController.getCurrentLayer()===a,d=pskl.utils.Template.replace(this.layerItemTemplate_,{layername:a.getName(),layerindex:b,"isselected:current-layer-item":c}),e=pskl.utils.Template.createFromHTML(d);this.layersListEl.insertBefore(e,this.layersListEl.firstChild)},a.LayersListController.prototype.onClick_=function(a){var b,c=a.target||a.srcElement;c.classList.contains("button")?this.onButtonClick_(c):c.classList.contains("layer-item")?(b=c.dataset.layerIndex,this.piskelController.setCurrentLayerIndex(parseInt(b,10))):c.classList.contains("edit-icon")&&(b=c.parentNode.dataset.layerIndex,this.renameLayerAt_(b))},a.LayersListController.prototype.renameLayerAt_=function(a){var b=this.piskelController.getLayerAt(a),c=window.prompt("Please enter the layer name",b.getName());c&&(this.piskelController.renameLayerAt(a,c),this.renderLayerList_())},a.LayersListController.prototype.onButtonClick_=function(a){var b=a.getAttribute("data-action");"up"==b?this.piskelController.moveLayerUp():"down"==b?this.piskelController.moveLayerDown():"add"==b?this.piskelController.createLayer():"delete"==b&&this.piskelController.removeCurrentLayer()}}(),function(){var a=$.namespace("pskl.controller"),b=200;a.AnimatedPreviewController=function(a,b){this.piskelController=a,this.container=b,this.elapsedTime=0,this.currentIndex=0,this.setFPS(Constants.DEFAULT.FPS),this.piskelController.getCurrentFrame(),this.renderer=new pskl.rendering.frame.TiledFrameRenderer(this.container),this.updateZoom_(),$.subscribe(Events.FRAME_SIZE_CHANGED,this.onFrameSizeChange_.bind(this)),$.subscribe(Events.USER_SETTINGS_CHANGED,$.proxy(this.onUserSettingsChange_,this))},a.AnimatedPreviewController.prototype.onUserSettingsChange_=function(){this.updateZoom_(),this.updateContainerDimensions_()},a.AnimatedPreviewController.prototype.updateZoom_=function(){var a=pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW),b=a?1:this.calculateZoom_();this.renderer.setZoom(b)},a.AnimatedPreviewController.prototype.getZoom=function(){return this.calculateZoom_()},a.AnimatedPreviewController.prototype.getCoordinates=function(a,b){var c=this.container.offset();a-=c.left,b-=c.top;var d=this.getZoom();return{x:Math.floor(a/d),y:Math.floor(b/d)}},a.AnimatedPreviewController.prototype.init=function(){$("#preview-fps")[0].addEventListener("change",this.onFPSSliderChange.bind(this)),document.querySelector(".right-column").style.width=Constants.ANIMATED_PREVIEW_WIDTH+"px"},a.AnimatedPreviewController.prototype.onFPSSliderChange=function(){this.setFPS(parseInt($("#preview-fps")[0].value,10))},a.AnimatedPreviewController.prototype.setFPS=function(a){this.fps=a,$("#preview-fps").val(this.fps),$("#display-fps").html(this.fps+" FPS")},a.AnimatedPreviewController.prototype.getFPS=function(){return this.fps},a.AnimatedPreviewController.prototype.render=function(a){this.elapsedTime+=a;var b=Math.floor(this.elapsedTime/(1e3/this.fps));if(b!=this.currentIndex){this.currentIndex=b,this.piskelController.hasFrameAt(this.currentIndex)||(this.currentIndex=0,this.elapsedTime=0);var c=this.piskelController.getFrameAt(this.currentIndex);this.renderer.render(c)}},a.AnimatedPreviewController.prototype.calculateZoom_=function(){var a=this.piskelController.getCurrentFrame(),b=200,c=b/a.getHeight(),d=b/a.getWidth();return Math.min(c,d)},a.AnimatedPreviewController.prototype.onFrameSizeChange_=function(){this.updateZoom_(),this.updateContainerDimensions_()},a.AnimatedPreviewController.prototype.updateContainerDimensions_=function(){var a,c,d=this.container.get(0),e=pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW);if(e)a=b,c=b;else{var f=this.getZoom(),g=this.piskelController.getCurrentFrame();a=g.getHeight()*f,c=g.getWidth()*f}d.style.height=a+"px",d.style.width=c+"px",d.style.marginTop=(b-a)/2+"px",d.style.marginBottom=(b-a)/2+"px",d.style.marginLeft=(b-c)/2+"px",d.style.marginRight=(b-c)/2+"px"}}(),function(){var a=$.namespace("pskl.controller"); -a.MinimapController=function(a,b,c,d){this.piskelController=a,this.animationController=b,this.drawingController=c,this.container=d,this.isClicked=!1},a.MinimapController.prototype.init=function(){this.cropFrame=document.createElement("DIV"),this.cropFrame.className="minimap-crop-frame",this.cropFrame.style.display="none",$(this.container).append(this.cropFrame),$(this.container).mousedown(this.onMinimapMousedown_.bind(this)),$("body").mousemove(this.onMinimapMousemove_.bind(this)),$("body").mouseup(this.onMinimapMouseup_.bind(this)),$.subscribe(Events.ZOOM_CHANGED,$.proxy(this.renderMinimap_,this))},a.MinimapController.prototype.renderMinimap_=function(){var a=this.getDrawingAreaZoomRatio_();a>1?this.displayCropFrame_(a,this.drawingController.getRenderer().getOffset()):this.hideCropFrame_()},a.MinimapController.prototype.displayCropFrame_=function(a,b){this.cropFrame.style.display="block",this.cropFrame.style.top=b.y*this.animationController.getZoom()+"px",this.cropFrame.style.left=b.x*this.animationController.getZoom()+"px";var c=this.getDrawingAreaZoomRatio_();this.cropFrame.style.width=this.container.width()/c+"px",this.cropFrame.style.height=this.container.height()/c+"px"},a.MinimapController.prototype.hideCropFrame_=function(){this.cropFrame.style.display="none"},a.MinimapController.prototype.onMinimapMousemove_=function(a){if(this.isClicked&&this.getDrawingAreaZoomRatio_()>1){var b=this.getCoordinatesCenteredAround_(a.clientX,a.clientY);this.drawingController.setOffset(b.x,b.y)}},a.MinimapController.prototype.onMinimapMousedown_=function(){this.isClicked=!0},a.MinimapController.prototype.onMinimapMouseup_=function(){this.isClicked=!1},a.MinimapController.prototype.getCoordinatesCenteredAround_=function(a,b){var c=this.animationController.getCoordinates(a,b),d=this.getDrawingAreaZoomRatio_(),e=this.piskelController.getCurrentFrame().getWidth(),f=this.piskelController.getCurrentFrame().getHeight(),g=e/d,h=f/d;return{x:c.x-g/2,y:c.y-h/2}},a.MinimapController.prototype.getDrawingAreaZoomRatio_=function(){var a=this.drawingController.getRenderer().getZoom(),b=this.piskelController.getCurrentFrame().getHeight()*a,c=b/this.drawingController.getRenderer().getDisplaySize().height;return c}}(),function(){var a=$.namespace("pskl.controller");a.ToolController=function(){var a=function(a,b,c){return{id:a,shortcut:b,instance:c}};this.tools=[a("simplePen","P",new pskl.drawingtools.SimplePen),a("verticalMirrorPen","V",new pskl.drawingtools.VerticalMirrorPen),a("eraser","E",new pskl.drawingtools.Eraser),a("paintBucket","B",new pskl.drawingtools.PaintBucket),a("stroke","L",new pskl.drawingtools.Stroke),a("rectangle","R",new pskl.drawingtools.Rectangle),a("circle","C",new pskl.drawingtools.Circle),a("move","M",new pskl.drawingtools.Move),a("rectangleSelect","S",new pskl.drawingtools.RectangleSelect),a("shapeSelect","Z",new pskl.drawingtools.ShapeSelect),a("lighten","U",new pskl.drawingtools.Lighten),a("colorPicker","O",new pskl.drawingtools.ColorPicker)],this.currentSelectedTool=this.tools[0],this.previousSelectedTool=this.tools[0]},a.ToolController.prototype.init=function(){this.createToolsDom_(),this.addKeyboardShortcuts_(),this.selectTool_(this.tools[0]),$("#tool-section").mousedown($.proxy(this.onToolIconClicked_,this))},a.ToolController.prototype.activateToolOnStage_=function(a){var b=$("body"),c=b.data("selected-tool-class");c&&(b.removeClass(c),b.removeClass(pskl.drawingtools.Move.TOOL_ID)),b.addClass(a.instance.toolId),b.data("selected-tool-class",a.instance.toolId)},a.ToolController.prototype.selectTool_=function(a){this.currentSelectedTool=a,this.activateToolOnStage_(this.currentSelectedTool);var b=$("#tool-section .tool-icon.selected"),c=$("[data-tool-id="+a.instance.toolId+"]");b.removeClass("selected"),c.addClass("selected"),$.publish(Events.TOOL_SELECTED,[a.instance])},a.ToolController.prototype.onToolIconClicked_=function(a){var b=$(a.target),c=b.closest(".tool-icon");if(c.length){var d=c.data().toolId,e=this.getToolById_(d);e&&this.selectTool_(e)}},a.ToolController.prototype.onKeyboardShortcut_=function(a){for(var b=0;bx
",document.body.appendChild(c),$(c).find(".close").click($.proxy(this.removeMessage_,this)),b.behavior&&b.behavior(c)},a.NotificationController.prototype.removeMessage_=function(){var a=$("#user-message");a.length&&a.remove()}}(),function(){var a=$.namespace("pskl.controller");a.CanvasBackgroundController=function(){this.body=document.body},a.CanvasBackgroundController.prototype.init=function(){$.subscribe(Events.USER_SETTINGS_CHANGED,this.onUserSettingsChange_.bind(this)),this.updateBackgroundClass_(pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND))},a.CanvasBackgroundController.prototype.onUserSettingsChange_=function(a,b,c){b==pskl.UserSettings.CANVAS_BACKGROUND&&this.updateBackgroundClass_(c)},a.CanvasBackgroundController.prototype.updateBackgroundClass_=function(a){var b=this.body.dataset.currentBackgroundClass;b&&this.body.classList.remove(b),this.body.classList.add(a),this.body.dataset.currentBackgroundClass=a}}(),function(){var a=$.namespace("pskl.controller.settings");a.ApplicationSettingsController=function(){},a.ApplicationSettingsController.prototype.init=function(){var a=pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND);$("#background-picker-wrapper").find(".background-picker[data-background-class="+a+"]").addClass("selected");var b=pskl.UserSettings.get(pskl.UserSettings.GRID_WIDTH);$("#grid-width").val(b),$("#grid-width").change(this.onGridWidthChange.bind(this));var c=pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW);$("#tiled-preview").prop("checked",c),$("#tiled-preview").change(this.onTiledPreviewChange.bind(this)),$("#background-picker-wrapper").click(this.onBackgroundClick.bind(this))},a.ApplicationSettingsController.prototype.onGridWidthChange=function(){var a=$("#grid-width").val();pskl.UserSettings.set(pskl.UserSettings.GRID_WIDTH,parseInt(a,10))},a.ApplicationSettingsController.prototype.onTiledPreviewChange=function(){var a=$("#tiled-preview").prop("checked");pskl.UserSettings.set(pskl.UserSettings.TILED_PREVIEW,a)},a.ApplicationSettingsController.prototype.onBackgroundClick=function(a){var b=$(a.target).closest(".background-picker");if(b.length){var c=b.data("background-class");pskl.UserSettings.set(pskl.UserSettings.CANVAS_BACKGROUND,c),$(".background-picker").removeClass("selected"),b.addClass("selected")}}}(),function(){var a=$.namespace("pskl.controller.settings");a.ResizeController=function(a){this.piskelController=a},a.ResizeController.prototype.init=function(){this.resizeWidth=$("[name=resize-width]"),this.resizeHeight=$("[name=resize-height]"),this.resizeWidth.val(this.piskelController.getWidth()),this.resizeHeight.val(this.piskelController.getHeight()),this.cancelButton=$(".resize-cancel-button"),this.cancelButton.click(this.onCancelButtonClicked_.bind(this)),this.resizeForm=$("[name=resize-form]"),this.resizeForm.submit(this.onResizeFormSubmit_.bind(this)),this.resizeContentCheckbox=$(".resize-content-checkbox")},a.ResizeController.prototype.onResizeFormSubmit_=function(a){a.originalEvent.preventDefault(),parseInt(this.resizeWidth.val(),10),parseInt(this.resizeHeight.val(),10),this.isResizeContentEnabled_();var b=this.piskelController.getLayers().map(this.resizeLayer_.bind(this)),c=pskl.model.Piskel.fromLayers(b,this.piskelController.getPiskel().getDescriptor());pskl.app.piskelController.setPiskel(c),$.publish(Events.CLOSE_SETTINGS_DRAWER)},a.ResizeController.prototype.resizeLayer_=function(a){var b=a.getFrames().map(this.resizeFrame_.bind(this));return pskl.model.Layer.fromFrames(a.getName(),b)},a.ResizeController.prototype.resizeFrame_=function(a){var b,c=parseInt(this.resizeWidth.val(),10),d=parseInt(this.resizeHeight.val(),10);return this.isResizeContentEnabled_()?b=pskl.utils.FrameUtils.resize(a,c,d,!1):(b=new pskl.model.Frame(c,d),a.forEachPixel(function(a,c,d){c"+d.join("")+"
"}function e(){for(var a=0;a","
"].join(""),s=function(){var a="";if(p)for(var b=1;6>=b;b++)a+="";return["","
▼
","","
"].join("")}(),t="spectrum.id";b.fn.spectrum=function(a){if("string"==typeof a){var c=this,d=Array.prototype.slice.call(arguments,1);return this.each(function(){var e=o[b(this).data(t)];if(e){var f=e[a];if(!f)throw new Error("Spectrum: no such method: '"+a+"'");"get"==a?c=e.get():"container"==a?c=e.container:"option"==a?c=e.option.apply(e,d):"destroy"==a?(e.destroy(),b(this).removeData(t)):f.apply(e,d)}}),c}return this.spectrum("destroy").each(function(){var c=g(this,a);b(this).data(t,c.id)})},b.fn.spectrum.load=!0,b.fn.spectrum.loadOpts={},b.fn.spectrum.draggable=l,b.fn.spectrum.defaults=n,b.spectrum={},b.spectrum.localization={},b.spectrum.palettes={},b.fn.spectrum.processNativeColorInputs=function(){var a=b("")[0],c="color"===a.type&&"!"!=a.value;c||b("input[type=color]").spectrum({preferredFormat:"hex6"})},function(){function b(a,d){if(a=a?a:"",d=d||{},"object"==typeof a&&a.hasOwnProperty("_tc_id"))return a;var f=c(a),h=f.r,j=f.g,m=f.b,n=f.a,o=x(100*n)/100,p=d.format||f.format;return 1>h&&(h=x(h)),1>j&&(j=x(j)),1>m&&(m=x(m)),{ok:f.ok,format:p,_tc_id:v++,alpha:n,getAlpha:function(){return n},setAlpha:function(a){n=k(a),o=x(100*n)/100},toHsv:function(){var a=g(h,j,m);return{h:360*a.h,s:a.s,v:a.v,a:n}},toHsvString:function(){var a=g(h,j,m),b=x(360*a.h),c=x(100*a.s),d=x(100*a.v);return 1==n?"hsv("+b+", "+c+"%, "+d+"%)":"hsva("+b+", "+c+"%, "+d+"%, "+o+")"},toHsl:function(){var a=e(h,j,m);return{h:360*a.h,s:a.s,l:a.l,a:n}},toHslString:function(){var a=e(h,j,m),b=x(360*a.h),c=x(100*a.s),d=x(100*a.l);return 1==n?"hsl("+b+", "+c+"%, "+d+"%)":"hsla("+b+", "+c+"%, "+d+"%, "+o+")"},toHex:function(a){return i(h,j,m,a)},toHexString:function(a){return"#"+i(h,j,m,a)},toRgb:function(){return{r:x(h),g:x(j),b:x(m),a:n}},toRgbString:function(){return 1==n?"rgb("+x(h)+", "+x(j)+", "+x(m)+")":"rgba("+x(h)+", "+x(j)+", "+x(m)+", "+o+")"},toPercentageRgb:function(){return{r:x(100*l(h,255))+"%",g:x(100*l(j,255))+"%",b:x(100*l(m,255))+"%",a:n}},toPercentageRgbString:function(){return 1==n?"rgb("+x(100*l(h,255))+"%, "+x(100*l(j,255))+"%, "+x(100*l(m,255))+"%)":"rgba("+x(100*l(h,255))+"%, "+x(100*l(j,255))+"%, "+x(100*l(m,255))+"%, "+o+")"},toName:function(){return 0===n?"transparent":C[i(h,j,m,!0)]||!1},toFilter:function(a){var c=i(h,j,m),e=c,f=Math.round(255*parseFloat(n)).toString(16),g=f,k=d&&d.gradientType?"GradientType = 1, ":"";if(a){var l=b(a);e=l.toHex(),g=Math.round(255*parseFloat(l.alpha)).toString(16)}return"progid:DXImageTransform.Microsoft.gradient("+k+"startColorstr=#"+q(f)+c+",endColorstr=#"+q(g)+e+")"},toString:function(a){var b=!!a;a=a||this.format;var c=!1,d=!b&&1>n&&n>0,e=d&&("hex"===a||"hex6"===a||"hex3"===a||"name"===a);return"rgb"===a&&(c=this.toRgbString()),"prgb"===a&&(c=this.toPercentageRgbString()),("hex"===a||"hex6"===a)&&(c=this.toHexString()),"hex3"===a&&(c=this.toHexString(!0)),"name"===a&&(c=this.toName()),"hsl"===a&&(c=this.toHslString()),"hsv"===a&&(c=this.toHsvString()),e?this.toRgbString():c||this.toHexString()}}}function c(a){var b={r:0,g:0,b:0},c=1,e=!1,g=!1;return"string"==typeof a&&(a=s(a)),"object"==typeof a&&(a.hasOwnProperty("r")&&a.hasOwnProperty("g")&&a.hasOwnProperty("b")?(b=d(a.r,a.g,a.b),e=!0,g="%"===String(a.r).substr(-1)?"prgb":"rgb"):a.hasOwnProperty("h")&&a.hasOwnProperty("s")&&a.hasOwnProperty("v")?(a.s=r(a.s),a.v=r(a.v),b=h(a.h,a.s,a.v),e=!0,g="hsv"):a.hasOwnProperty("h")&&a.hasOwnProperty("s")&&a.hasOwnProperty("l")&&(a.s=r(a.s),a.l=r(a.l),b=f(a.h,a.s,a.l),e=!0,g="hsl"),a.hasOwnProperty("a")&&(c=a.a)),c=k(c),{ok:e,format:a.format||g,r:y(255,z(b.r,0)),g:y(255,z(b.g,0)),b:y(255,z(b.b,0)),a:c}}function d(a,b,c){return{r:255*l(a,255),g:255*l(b,255),b:255*l(c,255)}}function e(a,b,c){a=l(a,255),b=l(b,255),c=l(c,255);var d,e,f=z(a,b,c),g=y(a,b,c),h=(f+g)/2;if(f==g)d=e=0;else{var i=f-g;switch(e=h>.5?i/(2-f-g):i/(f+g),f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,l:h}}function f(a,b,c){function d(a,b,c){return 0>c&&(c+=1),c>1&&(c-=1),1/6>c?a+6*(b-a)*c:.5>c?b:2/3>c?a+6*(b-a)*(2/3-c):a}var e,f,g;if(a=l(a,360),b=l(b,100),c=l(c,100),0===b)e=f=g=c;else{var h=.5>c?c*(1+b):c+b-c*b,i=2*c-h;e=d(i,h,a+1/3),f=d(i,h,a),g=d(i,h,a-1/3)}return{r:255*e,g:255*f,b:255*g}}function g(a,b,c){a=l(a,255),b=l(b,255),c=l(c,255);var d,e,f=z(a,b,c),g=y(a,b,c),h=f,i=f-g;if(e=0===f?0:i/f,f==g)d=0;else{switch(f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,v:h}}function h(a,b,c){a=6*l(a,360),b=l(b,100),c=l(c,100);var d=w.floor(a),e=a-d,f=c*(1-b),g=c*(1-e*b),h=c*(1-(1-e)*b),i=d%6,j=[c,g,f,f,h,c][i],k=[h,c,c,g,f,f][i],m=[f,f,h,c,c,g][i];return{r:255*j,g:255*k,b:255*m}}function i(a,b,c,d){var e=[q(x(a).toString(16)),q(x(b).toString(16)),q(x(c).toString(16))];return d&&e[0].charAt(0)==e[0].charAt(1)&&e[1].charAt(0)==e[1].charAt(1)&&e[2].charAt(0)==e[2].charAt(1)?e[0].charAt(0)+e[1].charAt(0)+e[2].charAt(0):e.join("")}function j(a){var b={};for(var c in a)a.hasOwnProperty(c)&&(b[a[c]]=c);return b}function k(a){return a=parseFloat(a),(isNaN(a)||0>a||a>1)&&(a=1),a}function l(a,b){o(a)&&(a="100%");var c=p(a);return a=y(b,z(0,parseFloat(a))),c&&(a=parseInt(a*b,10)/100),w.abs(a-b)<1e-6?1:a%b/parseFloat(b)}function m(a){return y(1,z(0,a))}function n(a){return parseInt(a,16)}function o(a){return"string"==typeof a&&-1!=a.indexOf(".")&&1===parseFloat(a)}function p(a){return"string"==typeof a&&-1!=a.indexOf("%")}function q(a){return 1==a.length?"0"+a:""+a}function r(a){return 1>=a&&(a=100*a+"%"),a}function s(a){a=a.replace(t,"").replace(u,"").toLowerCase();var b=!1;if(B[a])a=B[a],b=!0;else if("transparent"==a)return{r:0,g:0,b:0,a:0,format:"name"};var c;return(c=D.rgb.exec(a))?{r:c[1],g:c[2],b:c[3]}:(c=D.rgba.exec(a))?{r:c[1],g:c[2],b:c[3],a:c[4]}:(c=D.hsl.exec(a))?{h:c[1],s:c[2],l:c[3]}:(c=D.hsla.exec(a))?{h:c[1],s:c[2],l:c[3],a:c[4]}:(c=D.hsv.exec(a))?{h:c[1],s:c[2],v:c[3]}:(c=D.hex6.exec(a))?{r:n(c[1]),g:n(c[2]),b:n(c[3]),format:b?"name":"hex"}:(c=D.hex3.exec(a))?{r:n(c[1]+""+c[1]),g:n(c[2]+""+c[2]),b:n(c[3]+""+c[3]),format:b?"name":"hex"}:!1}var t=/^[\s,#]+/,u=/\s+$/,v=0,w=Math,x=w.round,y=w.min,z=w.max,A=w.random;b.fromRatio=function(a,c){if("object"==typeof a){var d={};for(var e in a)a.hasOwnProperty(e)&&(d[e]="a"===e?a[e]:r(a[e]));a=d}return b(a,c)},b.equals=function(a,c){return a&&c?b(a).toRgbString()==b(c).toRgbString():!1},b.random=function(){return b.fromRatio({r:A(),g:A(),b:A()})},b.desaturate=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s-=c/100,d.s=m(d.s),b(d)},b.saturate=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s+=c/100,d.s=m(d.s),b(d)},b.greyscale=function(a){return b.desaturate(a,100)},b.lighten=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l+=c/100,d.l=m(d.l),b(d)},b.darken=function(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l-=c/100,d.l=m(d.l),b(d)},b.complement=function(a){var c=b(a).toHsl();return c.h=(c.h+180)%360,b(c)},b.triad=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+120)%360,s:c.s,l:c.l}),b({h:(d+240)%360,s:c.s,l:c.l})]},b.tetrad=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+90)%360,s:c.s,l:c.l}),b({h:(d+180)%360,s:c.s,l:c.l}),b({h:(d+270)%360,s:c.s,l:c.l})]},b.splitcomplement=function(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+72)%360,s:c.s,l:c.l}),b({h:(d+216)%360,s:c.s,l:c.l})]},b.analogous=function(a,c,d){c=c||6,d=d||30;var e=b(a).toHsl(),f=360/d,g=[b(a)];for(e.h=(e.h-(f*c>>1)+720)%360;--c;)e.h=(e.h+f)%360,g.push(b(e));return g},b.monochromatic=function(a,c){c=c||6;for(var d=b(a).toHsv(),e=d.h,f=d.s,g=d.v,h=[],i=1/c;c--;)h.push(b({h:e,s:f,v:g})),g=(g+i)%1;return h},b.readability=function(a,c){var d=b(a).toRgb(),e=b(c).toRgb(),f=(299*d.r+587*d.g+114*d.b)/1e3,g=(299*e.r+587*e.g+114*e.b)/1e3,h=Math.max(d.r,e.r)-Math.min(d.r,e.r)+Math.max(d.g,e.g)-Math.min(d.g,e.g)+Math.max(d.b,e.b)-Math.min(d.b,e.b);return{brightness:Math.abs(f-g),color:h}},b.readable=function(a,c){var d=b.readability(a,c);return d.brightness>125&&d.color>500},b.mostReadable=function(a,c){for(var d=null,e=0,f=!1,g=0;g","","
","","
","","","","
","","
","","
","","
","","","
","","",a,"
","","","
","","","Add new frame
",this.container.append(e);var f=a>1;f&&this.initDragndropBehavior_(),this.updateScrollerOverflows()},a.PreviewFilmController.prototype.initDragndropBehavior_=function(){$("#preview-list").sortable({placeholder:"preview-tile-drop-proxy",update:$.proxy(this.onUpdate_,this),items:".preview-tile"}),$("#preview-list").disableSelection()},a.PreviewFilmController.prototype.onUpdate_=function(a,b){var c=parseInt(b.item.data("tile-number"),10),d=$(".preview-tile").index(b.item);this.piskelController.moveFrame(c,d),this.piskelController.setCurrentFrameIndex(d)},a.PreviewFilmController.prototype.createPreviewTile_=function(a){var c=this.piskelController.getCurrentLayer().getFrameAt(a),d=document.createElement("li");d.setAttribute("data-tile-number",a),d.setAttribute("data-tile-action",b.SELECT),d.classList.add("preview-tile"),this.piskelController.getCurrentFrame()==c&&d.classList.add("selected");var e=document.createElement("div");e.classList.add("canvas-container",pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));var f=document.createElement("div");f.className="canvas-background",e.appendChild(f);var g=document.createElement("button"); +if(g.setAttribute("rel","tooltip"),g.setAttribute("data-placement","right"),g.setAttribute("data-tile-number",a),g.setAttribute("data-tile-action",b.CLONE),g.setAttribute("title","Duplicate this frame"),g.className="tile-overlay duplicate-frame-action",d.appendChild(g),e.appendChild(this.getCanvasForFrame(c)),d.appendChild(e),a>0||this.piskelController.getFrameCount()>1){var h=document.createElement("button");h.setAttribute("rel","tooltip"),h.setAttribute("data-placement","right"),h.setAttribute("title","Delete this frame"),h.setAttribute("data-tile-number",a),h.setAttribute("data-tile-action",b.DELETE),h.className="tile-overlay delete-frame-action",d.appendChild(h);var i=document.createElement("div");i.className="tile-overlay dnd-action",d.appendChild(i)}var j=document.createElement("div");return j.className="tile-overlay tile-count",j.innerHTML=a+1,d.appendChild(j),d},a.PreviewFilmController.prototype.getCanvasForFrame=function(a){var b=this.cachedFrameProcessor.get(a,this.zoom);return b},a.PreviewFilmController.prototype.frameToPreviewCanvas_=function(a){var b=new pskl.rendering.CanvasRenderer(a,this.zoom);b.drawTransparentAs(Constants.TRANSPARENT_COLOR);var c=b.render();return c.classList.add("tile-view","canvas"),c},a.PreviewFilmController.prototype.clonePreviewCanvas_=function(a){var b=pskl.CanvasUtils.clone(a);return b.classList.add("tile-view","canvas"),b},a.PreviewFilmController.prototype.calculateZoom_=function(){var a=this.piskelController.getCurrentFrame(),b=a.getHeight(),c=a.getWidth();return Math.min(Constants.PREVIEW_FILM_SIZE/b,Constants.PREVIEW_FILM_SIZE/c)}}(),function(){var a=$.namespace("pskl.controller");a.LayersListController=function(a){this.piskelController=a},a.LayersListController.prototype.init=function(){this.layerItemTemplate_=pskl.utils.Template.get("layer-item-template"),this.rootEl=document.querySelector(".layers-list-container"),this.layersListEl=document.querySelector(".layers-list"),this.toggleLayerPreviewEl=document.querySelector(".layers-toggle-preview"),this.rootEl.addEventListener("click",this.onClick_.bind(this)),this.toggleLayerPreviewEl.addEventListener("click",this.toggleLayerPreview_.bind(this)),$.subscribe(Events.PISKEL_RESET,this.renderLayerList_.bind(this)),pskl.app.shortcutService.addShortcut("alt+L",this.toggleLayerPreview_.bind(this)),this.renderLayerList_(),this.updateToggleLayerPreview_(),$.subscribe(Events.USER_SETTINGS_CHANGED,$.proxy(this.onUserSettingsChange_,this))},a.LayersListController.prototype.renderLayerList_=function(){this.layersListEl.innerHTML="";var a=this.piskelController.getLayers();a.forEach(this.addLayerItem.bind(this))},a.LayersListController.prototype.updateToggleLayerPreview_=function(){var a="layers-toggle-preview-enabled";pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW)?this.toggleLayerPreviewEl.classList.add(a):this.toggleLayerPreviewEl.classList.remove(a)},a.LayersListController.prototype.onUserSettingsChange_=function(a,b){b==pskl.UserSettings.LAYER_PREVIEW&&this.updateToggleLayerPreview_()},a.LayersListController.prototype.addLayerItem=function(a,b){var c=this.piskelController.getCurrentLayer()===a,d=pskl.utils.Template.replace(this.layerItemTemplate_,{layername:a.getName(),layerindex:b,"isselected:current-layer-item":c}),e=pskl.utils.Template.createFromHTML(d);this.layersListEl.insertBefore(e,this.layersListEl.firstChild)},a.LayersListController.prototype.onClick_=function(a){var b,c=a.target||a.srcElement;c.classList.contains("button")?this.onButtonClick_(c):c.classList.contains("layer-item")?(b=c.dataset.layerIndex,this.piskelController.setCurrentLayerIndex(parseInt(b,10))):c.classList.contains("edit-icon")&&(b=c.parentNode.dataset.layerIndex,this.renameLayerAt_(b))},a.LayersListController.prototype.renameLayerAt_=function(a){var b=this.piskelController.getLayerAt(a),c=window.prompt("Please enter the layer name",b.getName());c&&(this.piskelController.renameLayerAt(a,c),this.renderLayerList_())},a.LayersListController.prototype.onButtonClick_=function(a){var b=a.getAttribute("data-action");"up"==b?this.piskelController.moveLayerUp():"down"==b?this.piskelController.moveLayerDown():"add"==b?this.piskelController.createLayer():"delete"==b&&this.piskelController.removeCurrentLayer()},a.LayersListController.prototype.toggleLayerPreview_=function(){var a=pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW);pskl.UserSettings.set(pskl.UserSettings.LAYER_PREVIEW,!a)}}(),function(){var a=$.namespace("pskl.controller"),b=200;a.AnimatedPreviewController=function(a,b){this.piskelController=a,this.container=b,this.elapsedTime=0,this.currentIndex=0,this.setFPS(Constants.DEFAULT.FPS),this.piskelController.getCurrentFrame(),this.renderer=new pskl.rendering.frame.TiledFrameRenderer(this.container)},a.AnimatedPreviewController.prototype.init=function(){$("#preview-fps")[0].addEventListener("change",this.onFPSSliderChange.bind(this)),document.querySelector(".right-column").style.width=Constants.ANIMATED_PREVIEW_WIDTH+"px",this.toggleOnionSkinEl=document.querySelector(".preview-toggle-onion-skin"),this.toggleOnionSkinEl.addEventListener("click",this.toggleOnionSkin_.bind(this)),pskl.app.shortcutService.addShortcut("alt+O",this.toggleOnionSkin_.bind(this)),$.subscribe(Events.FRAME_SIZE_CHANGED,this.onFrameSizeChange_.bind(this)),$.subscribe(Events.USER_SETTINGS_CHANGED,$.proxy(this.onUserSettingsChange_,this)),this.updateZoom_(),this.updateOnionSkinPreview_()},a.AnimatedPreviewController.prototype.onUserSettingsChange_=function(a,b){b==pskl.UserSettings.ONION_SKIN?this.updateOnionSkinPreview_():(this.updateZoom_(),this.updateContainerDimensions_())},a.AnimatedPreviewController.prototype.updateOnionSkinPreview_=function(){var a="preview-toggle-onion-skin-enabled";pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN)?this.toggleOnionSkinEl.classList.add(a):this.toggleOnionSkinEl.classList.remove(a)},a.AnimatedPreviewController.prototype.updateZoom_=function(){var a=pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW),b=a?1:this.calculateZoom_();this.renderer.setZoom(b)},a.AnimatedPreviewController.prototype.getZoom=function(){return this.calculateZoom_()},a.AnimatedPreviewController.prototype.getCoordinates=function(a,b){var c=this.container.offset();a-=c.left,b-=c.top;var d=this.getZoom();return{x:Math.floor(a/d),y:Math.floor(b/d)}},a.AnimatedPreviewController.prototype.onFPSSliderChange=function(){this.setFPS(parseInt($("#preview-fps")[0].value,10))},a.AnimatedPreviewController.prototype.setFPS=function(a){this.fps=a,$("#preview-fps").val(this.fps),$("#display-fps").html(this.fps+" FPS")},a.AnimatedPreviewController.prototype.getFPS=function(){return this.fps},a.AnimatedPreviewController.prototype.render=function(a){this.elapsedTime+=a;var b=Math.floor(this.elapsedTime/(1e3/this.fps));if(b!=this.currentIndex){this.currentIndex=b,this.piskelController.hasFrameAt(this.currentIndex)||(this.currentIndex=0,this.elapsedTime=0);var c=this.piskelController.getFrameAt(this.currentIndex);this.renderer.render(c)}},a.AnimatedPreviewController.prototype.calculateZoom_=function(){var a=this.piskelController.getCurrentFrame(),b=200,c=b/a.getHeight(),d=b/a.getWidth();return Math.min(c,d)},a.AnimatedPreviewController.prototype.onFrameSizeChange_=function(){this.updateZoom_(),this.updateContainerDimensions_()},a.AnimatedPreviewController.prototype.updateContainerDimensions_=function(){var a,c,d=this.container.get(0),e=pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW);if(e)a=b,c=b;else{var f=this.getZoom(),g=this.piskelController.getCurrentFrame();a=g.getHeight()*f,c=g.getWidth()*f}d.style.height=a+"px",d.style.width=c+"px",d.style.marginTop=(b-a)/2+"px",d.style.marginBottom=(b-a)/2+"px",d.style.marginLeft=(b-c)/2+"px",d.style.marginRight=(b-c)/2+"px"},a.AnimatedPreviewController.prototype.toggleOnionSkin_=function(){var a=pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN);pskl.UserSettings.set(pskl.UserSettings.ONION_SKIN,!a)}}(),function(){var a=$.namespace("pskl.controller");a.MinimapController=function(a,b,c,d){this.piskelController=a,this.animationController=b,this.drawingController=c,this.container=d,this.isClicked=!1},a.MinimapController.prototype.init=function(){this.cropFrame=document.createElement("DIV"),this.cropFrame.className="minimap-crop-frame",this.cropFrame.style.display="none",$(this.container).append(this.cropFrame),$(this.container).mousedown(this.onMinimapMousedown_.bind(this)),$("body").mousemove(this.onMinimapMousemove_.bind(this)),$("body").mouseup(this.onMinimapMouseup_.bind(this)),$.subscribe(Events.ZOOM_CHANGED,$.proxy(this.renderMinimap_,this))},a.MinimapController.prototype.renderMinimap_=function(){var a=this.getDrawingAreaZoomRatio_();a>1?this.displayCropFrame_(a,this.drawingController.getRenderer().getOffset()):this.hideCropFrame_()},a.MinimapController.prototype.displayCropFrame_=function(a,b){this.cropFrame.style.display="block",this.cropFrame.style.top=b.y*this.animationController.getZoom()+"px",this.cropFrame.style.left=b.x*this.animationController.getZoom()+"px";var c=this.getDrawingAreaZoomRatio_();this.cropFrame.style.width=this.container.width()/c+"px",this.cropFrame.style.height=this.container.height()/c+"px"},a.MinimapController.prototype.hideCropFrame_=function(){this.cropFrame.style.display="none"},a.MinimapController.prototype.onMinimapMousemove_=function(a){if(this.isClicked&&this.getDrawingAreaZoomRatio_()>1){var b=this.getCoordinatesCenteredAround_(a.clientX,a.clientY);this.drawingController.setOffset(b.x,b.y)}},a.MinimapController.prototype.onMinimapMousedown_=function(){this.isClicked=!0},a.MinimapController.prototype.onMinimapMouseup_=function(){this.isClicked=!1},a.MinimapController.prototype.getCoordinatesCenteredAround_=function(a,b){var c=this.animationController.getCoordinates(a,b),d=this.getDrawingAreaZoomRatio_(),e=this.piskelController.getCurrentFrame().getWidth(),f=this.piskelController.getCurrentFrame().getHeight(),g=e/d,h=f/d;return{x:c.x-g/2,y:c.y-h/2}},a.MinimapController.prototype.getDrawingAreaZoomRatio_=function(){var a=this.drawingController.getRenderer().getZoom(),b=this.piskelController.getCurrentFrame().getHeight()*a,c=b/this.drawingController.getRenderer().getDisplaySize().height;return c}}(),function(){var a=$.namespace("pskl.controller");a.ToolController=function(){var a=function(a,b,c){return{id:a,shortcut:b,instance:c}};this.tools=[a("simplePen","P",new pskl.drawingtools.SimplePen),a("verticalMirrorPen","V",new pskl.drawingtools.VerticalMirrorPen),a("eraser","E",new pskl.drawingtools.Eraser),a("paintBucket","B",new pskl.drawingtools.PaintBucket),a("stroke","L",new pskl.drawingtools.Stroke),a("rectangle","R",new pskl.drawingtools.Rectangle),a("circle","C",new pskl.drawingtools.Circle),a("move","M",new pskl.drawingtools.Move),a("rectangleSelect","S",new pskl.drawingtools.RectangleSelect),a("shapeSelect","Z",new pskl.drawingtools.ShapeSelect),a("lighten","U",new pskl.drawingtools.Lighten),a("colorPicker","O",new pskl.drawingtools.ColorPicker)],this.currentSelectedTool=this.tools[0],this.previousSelectedTool=this.tools[0]},a.ToolController.prototype.init=function(){this.createToolsDom_(),this.addKeyboardShortcuts_(),this.selectTool_(this.tools[0]),$("#tool-section").mousedown($.proxy(this.onToolIconClicked_,this))},a.ToolController.prototype.activateToolOnStage_=function(a){var b=$("body"),c=b.data("selected-tool-class");c&&(b.removeClass(c),b.removeClass(pskl.drawingtools.Move.TOOL_ID)),b.addClass(a.instance.toolId),b.data("selected-tool-class",a.instance.toolId)},a.ToolController.prototype.selectTool_=function(a){this.currentSelectedTool=a,this.activateToolOnStage_(this.currentSelectedTool);var b=$("#tool-section .tool-icon.selected"),c=$("[data-tool-id="+a.instance.toolId+"]");b.removeClass("selected"),c.addClass("selected"),$.publish(Events.TOOL_SELECTED,[a.instance])},a.ToolController.prototype.onToolIconClicked_=function(a){var b=$(a.target),c=b.closest(".tool-icon");if(c.length){var d=c.data().toolId,e=this.getToolById_(d);e&&this.selectTool_(e)}},a.ToolController.prototype.onKeyboardShortcut_=function(a){for(var b=0;bx
",document.body.appendChild(c),$(c).find(".close").click($.proxy(this.removeMessage_,this)),b.behavior&&b.behavior(c)},a.NotificationController.prototype.removeMessage_=function(){var a=$("#user-message");a.length&&a.remove()}}(),function(){var a=$.namespace("pskl.controller");a.CanvasBackgroundController=function(){this.body=document.body},a.CanvasBackgroundController.prototype.init=function(){$.subscribe(Events.USER_SETTINGS_CHANGED,this.onUserSettingsChange_.bind(this)),this.updateBackgroundClass_(pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND))},a.CanvasBackgroundController.prototype.onUserSettingsChange_=function(a,b,c){b==pskl.UserSettings.CANVAS_BACKGROUND&&this.updateBackgroundClass_(c)},a.CanvasBackgroundController.prototype.updateBackgroundClass_=function(a){var b=this.body.dataset.currentBackgroundClass;b&&this.body.classList.remove(b),this.body.classList.add(a),this.body.dataset.currentBackgroundClass=a}}(),function(){var a=$.namespace("pskl.controller.settings");a.ApplicationSettingsController=function(){},a.ApplicationSettingsController.prototype.init=function(){var a=pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND);$("#background-picker-wrapper").find(".background-picker[data-background-class="+a+"]").addClass("selected");var b=pskl.UserSettings.get(pskl.UserSettings.GRID_WIDTH);$("#grid-width").val(b),$("#grid-width").change(this.onGridWidthChange.bind(this)),$("#background-picker-wrapper").click(this.onBackgroundClick.bind(this))},a.ApplicationSettingsController.prototype.onGridWidthChange=function(){var a=$("#grid-width").val();pskl.UserSettings.set(pskl.UserSettings.GRID_WIDTH,parseInt(a,10))},a.ApplicationSettingsController.prototype.onBackgroundClick=function(a){var b=$(a.target).closest(".background-picker");if(b.length){var c=b.data("background-class");pskl.UserSettings.set(pskl.UserSettings.CANVAS_BACKGROUND,c),$(".background-picker").removeClass("selected"),b.addClass("selected")}}}(),function(){var a=$.namespace("pskl.controller.settings");a.ResizeController=function(a){this.piskelController=a},a.ResizeController.prototype.init=function(){this.resizeWidth=$("[name=resize-width]"),this.resizeHeight=$("[name=resize-height]"),this.resizeWidth.val(this.piskelController.getWidth()),this.resizeHeight.val(this.piskelController.getHeight()),this.cancelButton=$(".resize-cancel-button"),this.cancelButton.click(this.onCancelButtonClicked_.bind(this)),this.resizeForm=$("[name=resize-form]"),this.resizeForm.submit(this.onResizeFormSubmit_.bind(this)),this.resizeContentCheckbox=$(".resize-content-checkbox")},a.ResizeController.prototype.onResizeFormSubmit_=function(a){a.originalEvent.preventDefault(),parseInt(this.resizeWidth.val(),10),parseInt(this.resizeHeight.val(),10),this.isResizeContentEnabled_();var b=this.piskelController.getLayers().map(this.resizeLayer_.bind(this)),c=pskl.model.Piskel.fromLayers(b,this.piskelController.getPiskel().getDescriptor());pskl.app.piskelController.setPiskel(c,!0),$.publish(Events.CLOSE_SETTINGS_DRAWER)},a.ResizeController.prototype.resizeLayer_=function(a){var b=a.getFrames().map(this.resizeFrame_.bind(this));return pskl.model.Layer.fromFrames(a.getName(),b)},a.ResizeController.prototype.resizeFrame_=function(a){var b,c=parseInt(this.resizeWidth.val(),10),d=parseInt(this.resizeHeight.val(),10);return this.isResizeContentEnabled_()?b=pskl.utils.FrameUtils.resize(a,c,d,!1):(b=new pskl.model.Frame(c,d),a.forEachPixel(function(a,c,d){c
-
- Layers
+Layers + +
+
diff --git a/templates/settings/application.html b/templates/settings/application.html
index fdde7954..22c72076 100644
--- a/templates/settings/application.html
+++ b/templates/settings/application.html
@@ -29,9 +29,10 @@
+
+
diff --git a/templates/settings/export-gif.html b/templates/settings/export-gif.html
index b95c991a..525fa1cc 100644
--- a/templates/settings/export-gif.html
+++ b/templates/settings/export-gif.html
@@ -3,17 +3,19 @@
Export to Animated GIF
-
-
+
+
diff --git a/templates/settings/export-png.html b/templates/settings/export-png.html
index d4611dac..08c9ee66 100644
--- a/templates/settings/export-png.html
+++ b/templates/settings/export-png.html
@@ -6,8 +6,8 @@
Preview :
-
-
+
+
diff --git a/templates/settings/localstorage.html b/templates/settings/localstorage.html
index 524cb15e..774c6084 100644
--- a/templates/settings/localstorage.html
+++ b/templates/settings/localstorage.html
@@ -1,4 +1,9 @@
\ No newline at end of file