Can now drag files on canvas

This commit is contained in:
Devine Lu Linvega 2017-05-30 20:32:11 -10:00
parent 66afa7ef99
commit 2195c62f61

View File

@ -1,7 +1,7 @@
function Ronin()
{
this.modules = {};
this.element = null;
this.element = document.getElementById('ronin');
this.default = new Default("`");
@ -40,7 +40,6 @@ function Ronin()
this.install = function()
{
ronin.element = document.getElementById('ronin');
ronin.frame.element = document.getElementById('frame');
ronin.cursor.element = document.getElementById('cursor');
ronin.terminal.element = document.getElementById('terminal');
@ -138,4 +137,38 @@ function Ronin()
ronin.widget.update();
ronin.terminal.update();
}
// Drag file on canvas
this.element.addEventListener('dragover',function(e)
{
e.stopPropagation(); e.preventDefault(); e.dataTransfer.dropEffect = 'copy';
});
this.element.addEventListener('drop', function(e)
{
e.stopPropagation();
e.preventDefault();
var files = e.dataTransfer.files;
var file = files[0];
if (!file.type.match(/image.*/)) { console.log("Not image"); return false; }
var reader = new FileReader();
reader.onload = function(event)
{
base_image = new Image();
base_image.src = event.target.result;
var width = base_image.naturalWidth;
var height = base_image.naturalHeight;
// Display as large as the canvas
var ratio = ronin.frame.size.width/width;
ronin.frame.active_layer.context().drawImage(base_image, 0,0,width * ratio,height * ratio);
}
reader.readAsDataURL(file);
});
}