width: this.canvas_width
}
]
+ },
+ {
+ tag: 'input',
+ type: 'file',
+ style: 'display: none'
}
]
};
Roo.EventManager.onWindowResize(this.resize, this, true);
+ // file input event
+ this.fileEl().on('change', this.uploadImage, this);
+
this.clear();
this.resize();
this.is_empty = true;
},
+ fileEl: function()
+ {
+ return this.el.select('input',true).first();
+ },
+
canvasEl: function()
{
return this.el.select('canvas',true).first();
}
// encryption ?
- return this.canvasEl().dom.toDataURL('image/'+type, false);
+ return this.canvasEl().dom.toDataURL('image/'+type, 1);
},
drawFromImage: function(img_src)
{
var img = new Image();
+ img.onload = function(){
+ this.canvasElCtx().drawImage(img, 0, 0);
+ }.bind(this);
+
img.src = img_src;
- this.canvasElCtx().drawImage(img, 0, 0);
+ this.is_empty = false;
+ },
+
+ selectImage: function()
+ {
+ this.fileEl().dom.click();
+ },
+
+ uploadImage: function(e)
+ {
+ var reader = new FileReader();
+
+ reader.onload = function(e){
+ var img = new Image();
+ img.onload = function(){
+ this.reset();
+ this.canvasElCtx().drawImage(img, 0, 0);
+ }.bind(this);
+ img.src = e.target.result;
+ }.bind(this);
+
+ reader.readAsDataURL(e.target.files[0]);
},
// Bezier Point Constructor