define(["ember","../drop/droppable","./models/page","./models/shape","./models/style"],function(a,b,c){return BaubleCanvasComponent=a.Component.extend(b,{tagName:"div",layoutName:"bauble-canvas",classNames:["mb","canvas"],classNameBindings:["cursorClass"],attributeBindings:["tabindex","style"],width:840,height:560,tabindex:-1,mode:"preview",page:void 0,shape:void 0,cursorClass:function(){return this.get("selected.resizeable")?"resize-"+this.get("selected.resizeArgs.cursor"):""}.property("selected.resizeable"),initialize:function(){this.get("page")||this.set("page",c.create({items:[]}))}.on("init"),didPageChanged:function(){this.set("page.mode",this.get("mode")),this.select(null)}.observes("page"),style:function(){return"width:%@px; height:%@px;".fmt(this.get("width"),this.get("height"))}.property("width","height"),selected:void 0,select:function(a){a?(this.set("selected",a),this.set("shape",a.get("model"))):(this.set("selected",null),this.set("shape",null))},validateDragEvent:function(a){return this.get("page.id")&&(a.dataTransfer.types.contains("text/model")||0!=a.dataTransfer.files.length&&-1!=a.dataTransfer.files[0].type.indexOf("image"))},acceptDrop:function(a){var b=a.dataTransfer.getData("text/model");if(b){var b=JSON.parse(b),c=this.$().offset(),d={id:b.id,type:b.type,style:{x:a.originalEvent.pageX-c.left,y:a.originalEvent.pageY-c.top}};this.sendAction("createShape",d)}a.preventDefault()},initElement:function(){"edit"==this.get("page.mode")&&this._registerEvents()}.on("didInsertElement"),_registerEvents:function(){this.on("click",this.cancelSelect).on("mouseUp",this.resizeStop).on("mouseLeave",this.resizeStop).on("keyUp",this.removeItem)},resizeShape:function(a){this.get("selected")&&this.get("selected").send("resize",a)},resizeStop:function(){this.get("selected.resizeable")&&(this.set("selected.resizeable",!1),this.set("selected.draggable",!0),this.off("mouseMove",this.resizeShape))},removeItem:function(a){46==a.keyCode&&(this.get("page").deleteShape(this.get("selected.model")),this.sendAction("removeShape",this.get("selected.model")),this.select(null))},cancelSelect:function(a){0==this.$(a.originalEvent.target).parents(".shape").not(".background").length&&this.select(null)},actions:{registerResize:function(){this.on("mouseMove",this.resizeShape)}}})});