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

Applied patch by bencurthoys to fix embed api 

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1734 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Alexis Deveria 2010-09-20 18:55:10 +00:00
parent b79afbde87
commit fb653705d6
5 changed files with 160 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
editor/embedapi.html Normal file
View File

@ -0,0 +1,56 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="embedapi.js"></script>
<script type="text/javascript">
var svgCanvas = null;
function init_embed() {
var frame = document.getElementById('svgedit');
svgCanvas = new embedded_svg_edit(frame);
// Hide main button, as we will be controlling new/load/save etc from the host document
var doc;
doc = frame.contentDocument;
if (!doc)
{
doc = frame.contentWindow.document;
}
var mainButton = doc.getElementById('main_button');
mainButton.style.display = 'none';
}
function handleSvgData(data, error) {
if (error)
{
alert('error ' + error);
}
else
{
alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
}
}
function loadSvg() {
var svgexample = '<svg width="640" height="480" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><g><title>Layer 1</title><rect stroke-width="5" stroke="#000000" fill="#FF0000" id="svg_1" height="35" width="51" y="35" x="32"/><ellipse ry="15" rx="24" stroke-width="5" stroke="#000000" fill="#0000ff" id="svg_2" cy="60" cx="66"/></g></svg>';
svgCanvas.setSvgString(svgexample);
}
function saveSvg() {
svgCanvas.getSvgString()(handleSvgData);
}
</script>
<button onclick="loadSvg();">Load example</button>
<button onclick="saveSvg();">Save data</button>
<br/>
<iframe src="svg-editor.html" width="900px" height="600px" id="svgedit" onload="init_embed()"></iframe>
</body>
</html>

26
editor/extensions/ext-imagelib.js
View File

@ -55,11 +55,7 @@ svgEditor.addExtension("imagelib", function() {
var response = evt.data; var response = evt.data;
if(!response) { if(!response) {
$.alert('No data was given', function() { // Do nothing
if(mode !== 'm') {
closeBrowser();
}
});
return; return;
} }
@ -131,13 +127,19 @@ svgEditor.addExtension("imagelib", function() {
// Assume it's raw image data // Assume it's raw image data
// importImage(str); // importImage(str);
$.alert('Unexpected data was returned: ' + response, function() { // Don't give warning as postMessage may have been used by something else
if(mode !== 'm') { if(mode !== 'm') {
closeBrowser(); closeBrowser();
} else { } else {
pending[id].entry.remove(); pending[id].entry.remove();
} }
}); // $.alert('Unexpected data was returned: ' + response, function() {
// if(mode !== 'm') {
// closeBrowser();
// } else {
// pending[id].entry.remove();
// }
// });
return; return;
} }

5
editor/svg-editor.html
View File

@ -10,7 +10,8 @@
<link rel="stylesheet" href="svg-editor.css" type="text/css"/> <link rel="stylesheet" href="svg-editor.css" type="text/css"/>
<link rel="stylesheet" href="spinbtn/JQuerySpinBtn.css" type="text/css"/> <link rel="stylesheet" href="spinbtn/JQuerySpinBtn.css" type="text/css"/>
<!-- Development version of script tags: --> <!-- Development version of script tags: -->
<script type="text/javascript" src="jquery.js"></script> <!-- <script type="text/javascript" src="jquery.js"></script> -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.js"></script>
<script type="text/javascript" src="js-hotkeys/jquery.hotkeys.min.js"></script> <script type="text/javascript" src="js-hotkeys/jquery.hotkeys.min.js"></script>
<script type="text/javascript" src="jgraduate/jquery.jgraduate.js"></script> <script type="text/javascript" src="jgraduate/jquery.jgraduate.js"></script>
<script type="text/javascript" src="svgicons/jquery.svgicons.js"></script> <script type="text/javascript" src="svgicons/jquery.svgicons.js"></script>
@ -24,7 +25,7 @@
<!-- <script type="text/javascript" src="extensions/ext-helloworld.js"></script> --> <!-- <script type="text/javascript" src="extensions/ext-helloworld.js"></script> -->
<!-- Release version of script tags: > <!-- Release version of script tags: >
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js-hotkeys/jquery.hotkeys-0.7.9.js"></script> <script type="text/javascript" src="js-hotkeys/jquery.hotkeys-0.7.9.js"></script>
<script type="text/javascript" src="jquerybbq/jquery.bbq.min.js"></script> <script type="text/javascript" src="jquerybbq/jquery.bbq.min.js"></script>
<script type="text/javascript" src="jgraduate/jquery.jgraduate.min.js"></script> <script type="text/javascript" src="jgraduate/jquery.jgraduate.min.js"></script>

83
editor/svg-editor.js
View File

@ -3992,48 +3992,47 @@
// var lang = ('lang' in curPrefs) ? curPrefs.lang : null; // var lang = ('lang' in curPrefs) ? curPrefs.lang : null;
Editor.putLocale(null, good_langs); Editor.putLocale(null, good_langs);
// Not sure what this was being used for...commented out until known. // Callback handler for embedapi.js
// The "message" event listener was interfering with image lib responder try{
// try{ json_encode = function(obj){
// json_encode = function(obj){ //simple partial JSON encoder implementation
// //simple partial JSON encoder implementation if(window.JSON && JSON.stringify) return JSON.stringify(obj);
// if(window.JSON && JSON.stringify) return JSON.stringify(obj); var enc = arguments.callee; //for purposes of recursion
// var enc = arguments.callee; //for purposes of recursion if(typeof obj == "boolean" || typeof obj == "number"){
// if(typeof obj == "boolean" || typeof obj == "number"){ return obj+'' //should work...
// return obj+'' //should work... }else if(typeof obj == "string"){
// }else if(typeof obj == "string"){ //a large portion of this is stolen from Douglas Crockford's json2.js
// //a large portion of this is stolen from Douglas Crockford's json2.js return '"'+
// return '"'+ obj.replace(
// obj.replace( /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g
// /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g , function (a) {
// , function (a) { return '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
// return '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4); })
// }) +'"'; //note that this isn't quite as purtyful as the usualness
// +'"'; //note that this isn't quite as purtyful as the usualness }else if(obj.length){ //simple hackish test for arrayish-ness
// }else if(obj.length){ //simple hackish test for arrayish-ness for(var i = 0; i < obj.length; i++){
// for(var i = 0; i < obj.length; i++){ obj[i] = enc(obj[i]); //encode every sub-thingy on top
// obj[i] = enc(obj[i]); //encode every sub-thingy on top }
// } return "["+obj.join(",")+"]";
// return "["+obj.join(",")+"]"; }else{
// }else{ var pairs = []; //pairs will be stored here
// var pairs = []; //pairs will be stored here for(var k in obj){ //loop through thingys
// for(var k in obj){ //loop through thingys pairs.push(enc(k)+":"+enc(obj[k])); //key: value
// pairs.push(enc(k)+":"+enc(obj[k])); //key: value }
// } return "{"+pairs.join(",")+"}" //wrap in the braces
// return "{"+pairs.join(",")+"}" //wrap in the braces }
// } }
// } window.addEventListener("message", function(e){
// window.addEventListener("message", function(e){ var cbid = parseInt(e.data.substr(0, e.data.indexOf(";")));
// var cbid = parseInt(e.data.substr(0, e.data.indexOf(";"))); try{
// try{ e.source.postMessage("SVGe"+cbid+";"+json_encode(eval(e.data)), "*");
// e.source.postMessage("SVGe"+cbid+";"+json_encode(eval(e.data)), e.origin); }catch(err){
// }catch(err){ e.source.postMessage("SVGe"+cbid+";error:"+err.message, "*");
// e.source.postMessage("SVGe"+cbid+";error:"+err.message, e.origin); }
// } }, false)
// }, false) }catch(err){
// }catch(err){ window.embed_error = err;
// window.embed_error = err; }
// }

113
editor/svgicons/jquery.svgicons.js
View File

@ -208,26 +208,6 @@ $(function() {
} }
data_loaded = true; data_loaded = true;
} }
// Clean source SVGs (mostly for Inkscape files)
// TODO: Find a way to do this without crashing Safari (when converting to IMG)
$(svgdoc).find('metadata').remove().end()
.find('*').each(function(i, el) {
if(el.nodeName.indexOf(':') != -1) {
$(el).remove();
}
var attrs = $.extend(false, el.attributes, {});
for(i in attrs) {
var attr = attrs[i];
var fullattr = attr.prefix?attr.prefix + ':' + attr.localName:'';
if(attr.prefix) {
el.removeAttribute(attr.localName); // for Opera
el.removeAttribute(fullattr); // for Webkit
}
if(fullattr == 'xlink:href') {
el.setAttribute('xlink:href', attr.nodeValue);
}
}
});
elems = $(svgdoc.firstChild).children(); //.getElementsByTagName('foreignContent'); elems = $(svgdoc.firstChild).children(); //.getElementsByTagName('foreignContent');
@ -253,36 +233,36 @@ $(function() {
} }
} }
var setIcon = function(target, icon, id, setID) {
if(isOpera) icon.css('visibility','hidden');
if(opts.replace) {
if(setID) icon.attr('id',id);
var cl = target.attr('class');
if(cl) icon.attr('class','svg_icon '+cl);
target.replaceWith(icon);
} else {
target.append(icon);
}
if(isOpera) {
setTimeout(function() {
icon.removeAttr('style');
},1);
}
}
var addIcon = function(icon, id) {
if(opts.id_match === undefined || opts.id_match !== false) {
setIcon(holder, icon, id, true);
}
svg_icons[id] = icon;
}
function makeIcons(toImage, fallback) { function makeIcons(toImage, fallback) {
if(icons_made) return; if(icons_made) return;
if(opts.no_img) toImage = false; if(opts.no_img) toImage = false;
var holder; var holder;
var setIcon = function(target, icon, id, setID) {
if(isOpera) icon.css('visibility','hidden');
if(opts.replace) {
if(setID) icon.attr('id',id);
var cl = target.attr('class');
if(cl) icon.attr('class','svg_icon '+cl);
target.replaceWith(icon);
} else {
target.append(icon);
}
if(isOpera) {
setTimeout(function() {
icon.removeAttr('style');
},1);
}
}
var addIcon = function(icon, id) {
if(opts.id_match === undefined || opts.id_match !== false) {
setIcon(holder, icon, id, true);
}
svg_icons[id] = icon;
}
if(toImage) { if(toImage) {
var temp_holder = $(document.createElement('div')); var temp_holder = $(document.createElement('div'));
temp_holder.hide().appendTo('body'); temp_holder.hide().appendTo('body');
@ -303,13 +283,13 @@ $(function() {
addIcon(icon, id); addIcon(icon, id);
}); });
} else { } else {
$.each(elems, function(i, elem) { var len = elems.length;
var id = elem.getAttribute('id'); for(var i = 0; i < len; i++) {
if(id == 'svg_eof') return; var elem = elems[i];
var id = elem.id;
if(id === 'svg_eof') break;
holder = $('#' + id); holder = $('#' + id);
if(elem.getElementsByTagNameNS) { var svg = elem.getElementsByTagNameNS(svgns, 'svg')[0];
var svg = elem.getElementsByTagNameNS(svgns, 'svg')[0];
}
var svgroot = document.createElementNS(svgns, "svg"); var svgroot = document.createElementNS(svgns, "svg");
svgroot.setAttributeNS(svgns, 'viewBox', [0,0,icon_w,icon_h].join(' ')); svgroot.setAttributeNS(svgns, 'viewBox', [0,0,icon_w,icon_h].join(' '));
@ -324,17 +304,16 @@ $(function() {
svg.setAttribute('viewBox', [0,0,w,h].join(' ')); svg.setAttribute('viewBox', [0,0,w,h].join(' '));
} }
$(svgroot).attr({ // Not using jQuery to be a bit faster
"xmlns": svgns, svgroot.setAttribute('xmlns', svgns);
"width": icon_w, svgroot.setAttribute('width', icon_w);
"height": icon_h, svgroot.setAttribute('height', icon_h);
"xmlns:xlink": xlinkns, svgroot.setAttribute("xmlns:xlink", xlinkns);
"class": 'svg_icon' svgroot.setAttribute("class", 'svg_icon');
});
// Without cloning, Firefox will make another GET request. // Without cloning, Firefox will make another GET request.
// With cloning, causes issue in Opera/Win/Non-EN // With cloning, causes issue in Opera/Win/Non-EN
if(!isOpera) svg = svg.cloneNode(true); // if(!isOpera) svg = svg.cloneNode(true);
svgroot.appendChild(svg); svgroot.appendChild(svg);
@ -350,7 +329,8 @@ $(function() {
var icon = fixIDs($(svgroot), i); var icon = fixIDs($(svgroot), i);
} }
addIcon(icon, id); addIcon(icon, id);
}); }
} }
if(opts.placement) { if(opts.placement) {
@ -370,9 +350,8 @@ $(function() {
} }
if(opts.resize) $.resizeSvgIcons(opts.resize); if(opts.resize) $.resizeSvgIcons(opts.resize);
icons_made = true; icons_made = true;
if(opts.callback) opts.callback(svg_icons); if(opts.callback) opts.callback(svg_icons);
} }
fixIDs = function(svg_el, svg_num, force) { fixIDs = function(svg_el, svg_num, force) {
@ -385,18 +364,18 @@ $(function() {
if(isOpera) no_dupes = false; // Opera didn't clone svg_el, so not reliable if(isOpera) no_dupes = false; // Opera didn't clone svg_el, so not reliable
// if(!force && no_dupes) return; // if(!force && no_dupes) return;
var new_id = 'x' + id + svg_num + i; var new_id = 'x' + id + svg_num + i;
$(this).attr('id', new_id); this.id = new_id;
svg_el.find('[fill="url(#' + id + ')"]').each(function() { svg_el.find('[fill="url(#' + id + ')"]').each(function() {
$(this).attr('fill', 'url(#' + new_id + ')'); this.setAttribute('fill', 'url(#' + new_id + ')');
}).end().find('[stroke="url(#' + id + ')"]').each(function() { }).end().find('[stroke="url(#' + id + ')"]').each(function() {
$(this).attr('stroke', 'url(#' + new_id + ')'); this.setAttribute('stroke', 'url(#' + new_id + ')');
}).end().find('use').each(function() { }).end().find('use').each(function() {
if(this.getAttribute('xlink:href') == '#' + id) { if(this.getAttribute('xlink:href') == '#' + id) {
this.setAttributeNS(xlinkns,'href','#' + new_id); this.setAttributeNS(xlinkns,'href','#' + new_id);
} }
}).end().find('[filter="url(#' + id + ')"]').each(function() { }).end().find('[filter="url(#' + id + ')"]').each(function() {
$(this).attr('filter', 'url(#' + new_id + ')'); this.setAttribute('filter', 'url(#' + new_id + ')');
}); });
}); });
return svg_el; return svg_el;