zcy
/
svgedit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Apply duopixel's patch for drag 'n drop image support (see issue 999). Also removed trailing spaces 

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@2090 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Ahmad Syazwan 2012-10-22 10:47:50 +00:00
parent cf0dde3f4a
commit 4cc9c7d0ec
2 changed files with 789 additions and 710 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
editor/svg-editor.html
View File

@ -136,7 +136,7 @@
<div id="fileinputs_import">
<div></div>
</div>
Import SVG
Import Image
</li>
<li id="tool_save">

107
editor/svg-editor.js
View File

@ -4403,7 +4403,95 @@
// and provide a file input to click. When that change event fires, it will
// get the text contents of the file and send it to the canvas
if (window.FileReader) {
var inp = $('<input type="file">').change(function() {
var import_image = function(e) {
e.stopPropagation();
e.preventDefault();
$("#workarea").removeAttr("style");
$('#main_menu').hide();
var file = null;
if (e.type == "drop") file = e.dataTransfer.files[0]
else file = this.files[0];
if (file) {
if(file.type.indexOf("image") != -1) {
//detected an image
//svg handling
if(file.type.indexOf("svg") != -1) {
var reader = new FileReader();
reader.onloadend = function(e) {
svgCanvas.importSvgString(e.target.result, true);
svgCanvas.ungroupSelectedElement()
svgCanvas.ungroupSelectedElement()
svgCanvas.groupSelectedElements()
svgCanvas.alignSelectedElements("m", "page")
svgCanvas.alignSelectedElements("c", "page")
};
reader.readAsText(file);
}
//bitmap handling
else {
var reader = new FileReader();
reader.onloadend = function(e) {
// let's insert the new image until we know its dimensions
insertNewImage = function(img_width, img_height){
var newImage = svgCanvas.addSvgElementFromJson({
"element": "image",
"attr": {
"x": 0,
"y": 0,
"width": img_width,
"height": img_height,
"id": svgCanvas.getNextId(),
"style": "pointer-events:inherit"
}
});
svgCanvas.setHref(newImage, e.target.result);
svgCanvas.selectOnly([newImage])
svgCanvas.alignSelectedElements("m", "page")
svgCanvas.alignSelectedElements("c", "page")
updateContextPanel();
}
// create dummy img so we know the default dimensions
var img_width = 100;
var img_height = 100;
var img = new Image();
img.src = e.target.result;
img.style.opacity = 0;
img.onload = function() {
img_width = img.offsetWidth
img_height = img.offsetHeight
insertNewImage(img_width, img_height);
}
};
reader.readAsDataURL(file)
}
}
}
}
function onDragEnter(e) {
e.stopPropagation();
e.preventDefault();
// and indicator should be displayed here, such as "drop files here"
}
function onDragOver(e) {
e.stopPropagation();
e.preventDefault();
}
function onDragLeave(e) {
e.stopPropagation();
e.preventDefault();
// hypothetical indicator should be removed here
}
workarea[0].addEventListener('dragenter', onDragEnter, false);
workarea[0].addEventListener('dragover', onDragOver, false);
workarea[0].addEventListener('dragleave', onDragLeave, false);
workarea[0].addEventListener('drop', import_image, false);
var open = $('<input type="file">').change(function() {
var f = this;
Editor.openPrep(function(ok) {
if(!ok) return;
@ -4418,19 +4506,10 @@
}
});
});
$("#tool_open").show().prepend(inp);
var inp2 = $('<input type="file">').change(function() {
$('#main_menu').hide();
if(this.files.length==1) {
var reader = new FileReader();
reader.onloadend = function(e) {
svgCanvas.importSvgString(e.target.result, true);
updateCanvas();
};
reader.readAsText(this.files[0]);
}
});
$("#tool_import").show().prepend(inp2);
$("#tool_open").show().prepend(open);
var img_import = $('<input type="file">').change(import_image);
$("#tool_import").show().prepend(img_import);
}
var updateCanvas = Editor.updateCanvas = function(center, new_ctr) {