diff --git a/editor/svg-editor.html b/editor/svg-editor.html index a9e3c49f..2ae66a9a 100644 --- a/editor/svg-editor.html +++ b/editor/svg-editor.html @@ -182,6 +182,8 @@ script type="text/javascript" src="locale/locale.min.js"> + +
@@ -393,8 +395,8 @@ script type="text/javascript" src="locale/locale.min.js">
Included Images - - + +
diff --git a/editor/svg-editor.js b/editor/svg-editor.js index 7ea70bf5..a466a193 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -73,7 +73,7 @@ function svg_edit_setup() { iconsize:'m', bg_color:'#FFF', bg_url:'', - img_save:'ref' + img_save:'embed' }; var setSelectMode = function() { @@ -358,8 +358,9 @@ function svg_edit_setup() { } } // text else if(el_name == 'image') { - var xlinkNS="http://www.w3.org/1999/xlink"; - $('#image_url').val(elem.getAttributeNS(xlinkNS, "href")); + var xlinkNS="http://www.w3.org/1999/xlink"; + var href = elem.getAttributeNS(xlinkNS, "href"); + setImageURL(href); } // image } } // if (elem != null) @@ -510,7 +511,7 @@ function svg_edit_setup() { // TODO: consider only setting the URL once Enter has been pressed? $('#image_url').keyup(function(){ - svgCanvas.setImageURL(this.value); + setImageURL(this.value); }); $('.attr_changer').change(function() { @@ -1275,6 +1276,34 @@ function svg_edit_setup() { $('#tools_ellipse_show').click(clickCircle); $('#tool_bold').mousedown(clickBold); $('#tool_italic').mousedown(clickItalic); + $('#change_image_url').click(function() { + var url = prompt("Select the new image URL","http://"); + if(url) setImageURL(url); + }); + + function setImageURL(url) { + svgCanvas.setImageURL(url); + $('#image_url').val(url); + + if(url.indexOf('data:') === 0) { + // data URI found + $('#image_url').hide(); + $('#change_image_url').show(); + } else { + // regular URL + + var img = svgCanvas.embedImage(url); + if(img == url && curPrefs.img_save == 'embed') { + // Couldn't embed, so show warning + $('#url_notice').show(); + } else { + $('#url_notice').hide(); + } + + $('#image_url').show(); + $('#change_image_url').hide(); + } + } // added these event handlers for all the push buttons so they // behave more like buttons being pressed-in and not images diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js index 1516a386..2e0a8726 100644 --- a/editor/svgcanvas.js +++ b/editor/svgcanvas.js @@ -1201,7 +1201,8 @@ function BatchCommand(text) { canvas.getContext("2d").drawImage(img,0,0); // retrieve the data: URL try { - result = canvas.toDataURL(); + var urldata = ';svgedit_url=' + encodeURIComponent(val); + result = canvas.toDataURL().replace(';base64',urldata+';base64'); } catch(e) { result = val; } @@ -3948,6 +3949,22 @@ function BatchCommand(text) { // set new svg document svgcontent = svgroot.appendChild(svgdoc.importNode(newDoc.documentElement, true)); + // change image href vals if possible + $(svgcontent).find('image').each(function() { + var image = this; + var val = this.getAttributeNS(xlinkns, "href"); + if(val.indexOf('data:') === 0) { + // Check if an SVG-edit data URI + var m = val.match(/svgedit_url=(.*?);/); + if(m) { + var url = decodeURIComponent(m[1]); + $(new Image()).load(function() { + image.setAttributeNS(xlinkns,'href',url); + }).attr('src',url); + } + } + }); + // Fix XML for Opera/Win/Non-EN if(window.opera) { canvas.fixOperaXML(svgcontent, newDoc.documentElement);