2010-09-20 18:55:10 +00:00
<!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 >
2013-02-19 16:30:56 +00:00
< title > Embed API< / title >
2010-09-20 18:55:10 +00:00
< / head >
< body >
2013-02-19 16:30:56 +00:00
< script type = "text/javascript" src = "embedapi.js" > < / script >
< script type = "text/javascript" >
var svgCanvas = null;
2010-09-20 18:55:10 +00:00
2013-02-19 16:30:56 +00:00
function init_embed() {
var frame = document.getElementById('svgedit');
2010-09-20 18:55:10 +00:00
svgCanvas = new embedded_svg_edit(frame);
// Hide main button, as we will be controlling new/load/save etc from the host document
2013-02-19 16:30:56 +00:00
var doc = frame.contentDocument || frame.contentWindow.document;
2010-09-20 18:55:10 +00:00
var mainButton = doc.getElementById('main_button');
2013-02-19 16:30:56 +00:00
mainButton.style.display = 'none';
}
function handleSvgData(data, error) {
if (error) {
2010-09-20 18:55:10 +00:00
alert('error ' + error);
2013-02-19 16:30:56 +00:00
} else {
2010-09-20 18:55:10 +00:00
alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
2013-02-19 16:30:56 +00:00
}
2010-09-20 18:55:10 +00:00
}
2013-02-19 16:30:56 +00:00
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);
}
2010-09-20 18:55:10 +00:00
2013-02-19 16:30:56 +00:00
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 >
2010-09-20 18:55:10 +00:00
< / body >
< / html >
