Move embedapi.html code which is not part of the API into embedapi-dom.js; demo export PDF in embedded editor; add new exportPDF method to canvas (and exposed to embedded editor) which can support JSON-able data URI string response, removing PDF exporting from rasterExport; JSLint; move dependency checking code for canvg and jsPDF to utilities; simplify Utils calls; allow for custom PDF export handler (but not yet implemented in server-based extensions); import PDF todo
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@2860 eee81c28-f429-11dd-99c0-75d572ba1dddmaster
Brett Zamir
parent
36dfb2bd17
commit
abc9cd6ffb
|
|
@ -0,0 +1,76 @@
|
|||
/*globals $, EmbeddedSVGEdit*/
|
||||
/*jslint vars: true */
|
||||
var initEmbed;
|
||||
|
||||
$(function () {'use strict';
|
||||
|
||||
var svgCanvas = null;
|
||||
var frame;
|
||||
|
||||
initEmbed = function () {
|
||||
var doc, mainButton;
|
||||
svgCanvas = new EmbeddedSVGEdit(frame);
|
||||
// Hide main button, as we will be controlling new, load, save, etc. from the host document
|
||||
doc = frame.contentDocument || frame.contentWindow.document;
|
||||
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);
|
||||
}
|
||||
|
||||
function exportPNG() {
|
||||
var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
|
||||
var exportWindow = window.open(
|
||||
'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
|
||||
'svg-edit-exportWindow'
|
||||
);
|
||||
svgCanvas.rasterExport('PNG', null, exportWindow.name);
|
||||
}
|
||||
|
||||
function exportPDF() {
|
||||
var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
|
||||
|
||||
/**
|
||||
// If you want to handle the PDF blob yourself, do as follows
|
||||
svgCanvas.bind('exportedPDF', function (win, data) {
|
||||
alert(data.dataurlstring);
|
||||
});
|
||||
svgCanvas.exportPDF(); // Accepts two args: optionalWindowName supplied back to bound exportPDF handler and optionalOutputType (defaults to dataurlstring)
|
||||
return;
|
||||
*/
|
||||
|
||||
var exportWindow = window.open(
|
||||
'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
|
||||
'svg-edit-exportWindow'
|
||||
);
|
||||
svgCanvas.exportPDF(exportWindow.name);
|
||||
}
|
||||
|
||||
// Add event handlers
|
||||
$('#load').click(loadSvg);
|
||||
$('#save').click(saveSvg);
|
||||
$('#exportPNG').click(exportPNG);
|
||||
$('#exportPDF').click(exportPDF);
|
||||
$('body').append(
|
||||
$('<iframe src="svg-editor.html?extensions=ext-xdomain-messaging.js' +
|
||||
window.location.href.replace(/\?(.*)$/, '&$1') + // Append arguments to this file onto the iframe
|
||||
'" width="900px" height="600px" id="svgedit" onload="initEmbed();"></iframe>'
|
||||
)
|
||||
);
|
||||
frame = document.getElementById('svgedit');
|
||||
});
|
||||
|
|
@ -5,66 +5,13 @@
|
|||
<title>Embed API</title>
|
||||
<script src="jquery.js"></script>
|
||||
<script src="embedapi.js"></script>
|
||||
<script>
|
||||
/*globals $, EmbeddedSVGEdit*/
|
||||
var initEmbed;
|
||||
$(function () {'use strict';
|
||||
|
||||
var svgCanvas = null;
|
||||
|
||||
initEmbed = function () {
|
||||
var doc, mainButton,
|
||||
frame = document.getElementById('svgedit');
|
||||
svgCanvas = new EmbeddedSVGEdit(frame);
|
||||
// Hide main button, as we will be controlling new, load, save, etc. from the host document
|
||||
doc = frame.contentDocument || frame.contentWindow.document;
|
||||
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);
|
||||
}
|
||||
|
||||
function exportSvg() {
|
||||
var str = document.getElementById('svgedit').contentWindow.svgEditor.uiStrings.notification.loadingImage;
|
||||
var exportWindow = window.open(
|
||||
'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
|
||||
'svg-edit-exportWindow'
|
||||
);
|
||||
svgCanvas.rasterExport('PNG', null, exportWindow.name);
|
||||
}
|
||||
|
||||
// Add event handlers
|
||||
$('#load').click(loadSvg);
|
||||
$('#save').click(saveSvg);
|
||||
$('#export').click(exportSvg);
|
||||
$('body').append(
|
||||
$('<iframe src="svg-editor.html?extensions=ext-xdomain-messaging.js' +
|
||||
window.location.href.replace(/\?(.*)$/, '&$1') + // Append arguments to this file onto the iframe
|
||||
'" width="900px" height="600px" id="svgedit" onload="initEmbed();"></iframe>'
|
||||
)
|
||||
);
|
||||
});
|
||||
</script>
|
||||
<script src="embedapi-dom.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<button id="load">Load example</button>
|
||||
<button id="save">Save data</button>
|
||||
<button id="export">Export data</button>
|
||||
<button id="exportPNG">Export data to PNG</button>
|
||||
<button id="exportPDF">Export data to PDF</button>
|
||||
<br/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -120,7 +120,7 @@ function EmbeddedSVGEdit (frame, allowedOrigins) {
|
|||
// Run in svgedit itself
|
||||
var i,
|
||||
functions = [
|
||||
'clearSvgContentElement', 'setIdPrefix', 'getCurrentDrawing', 'addSvgElementFromJson', 'getTransformList', 'matrixMultiply', 'hasMatrixTransform', 'transformListToTransform', 'convertToNum', 'findDefs', 'getUrlFromAttr', 'getHref', 'setHref', 'getBBox', 'getRotationAngle', 'getElem', 'getRefElem', 'assignAttributes', 'cleanupElement', 'remapElement', 'recalculateDimensions', 'sanitizeSvg', 'runExtensions', 'addExtension', 'round', 'getIntersectionList', 'getStrokedBBox', 'getVisibleElements', 'getVisibleElementsAndBBoxes', 'groupSvgElem', 'getId', 'getNextId', 'call', 'bind', 'prepareSvg', 'setRotationAngle', 'recalculateAllSelectedDimensions', 'clearSelection', 'addToSelection', 'selectOnly', 'removeFromSelection', 'selectAllInCurrentLayer', 'getMouseTarget', 'removeUnusedDefElems', 'svgCanvasToString', 'svgToString', 'embedImage', 'setGoodImage', 'open', 'save', 'rasterExport', 'getSvgString', 'randomizeIds', 'uniquifyElems', 'setUseData', 'convertGradients', 'convertToGroup', 'setSvgString', 'importSvgString', 'identifyLayers', 'createLayer', 'cloneLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility', 'moveSelectedToLayer', 'mergeLayer', 'mergeAllLayers', 'leaveContext', 'setContext', 'clear', 'linkControlPoints', 'getContentElem', 'getRootElem', 'getSelectedElems', 'getResolution', 'getZoom', 'getVersion', 'setUiStrings', 'setConfig', 'getTitle', 'setGroupTitle', 'getDocumentTitle', 'setDocumentTitle', 'getEditorNS', 'setResolution', 'getOffset', 'setBBoxZoom', 'setZoom', 'getMode', 'setMode', 'getColor', 'setColor', 'setGradient', 'setPaint', 'setStrokePaint', 'setFillPaint', 'getStrokeWidth', 'setStrokeWidth', 'setStrokeAttr', 'getStyle', 'getOpacity', 'setOpacity', 'getFillOpacity', 'getStrokeOpacity', 'setPaintOpacity', 'getPaintOpacity', 'getBlur', 'setBlurNoUndo', 'setBlurOffsets', 'setBlur', 'getBold', 'setBold', 'getItalic', 'setItalic', 'getFontFamily', 'setFontFamily', 'setFontColor', 'getFontColor', 'getFontSize', 'setFontSize', 'getText', 'setTextContent', 'setImageURL', 'setLinkURL', 'setRectRadius', 'makeHyperlink', 'removeHyperlink', 'setSegType', 'convertToPath', 'changeSelectedAttribute', 'deleteSelectedElements', 'cutSelectedElements', 'copySelectedElements', 'pasteElements', 'groupSelectedElements', 'pushGroupProperties', 'ungroupSelectedElement', 'moveToTopSelectedElement', 'moveToBottomSelectedElement', 'moveUpDownSelected', 'moveSelectedElements', 'cloneSelectedElements', 'alignSelectedElements', 'updateCanvas', 'setBackground', 'cycleElement', 'getPrivateMethods', 'zoomChanged', 'ready'
|
||||
'clearSvgContentElement', 'setIdPrefix', 'getCurrentDrawing', 'addSvgElementFromJson', 'getTransformList', 'matrixMultiply', 'hasMatrixTransform', 'transformListToTransform', 'convertToNum', 'findDefs', 'getUrlFromAttr', 'getHref', 'setHref', 'getBBox', 'getRotationAngle', 'getElem', 'getRefElem', 'assignAttributes', 'cleanupElement', 'remapElement', 'recalculateDimensions', 'sanitizeSvg', 'runExtensions', 'addExtension', 'round', 'getIntersectionList', 'getStrokedBBox', 'getVisibleElements', 'getVisibleElementsAndBBoxes', 'groupSvgElem', 'getId', 'getNextId', 'call', 'bind', 'prepareSvg', 'setRotationAngle', 'recalculateAllSelectedDimensions', 'clearSelection', 'addToSelection', 'selectOnly', 'removeFromSelection', 'selectAllInCurrentLayer', 'getMouseTarget', 'removeUnusedDefElems', 'svgCanvasToString', 'svgToString', 'embedImage', 'setGoodImage', 'open', 'save', 'rasterExport', 'exportPDF', 'getSvgString', 'randomizeIds', 'uniquifyElems', 'setUseData', 'convertGradients', 'convertToGroup', 'setSvgString', 'importSvgString', 'identifyLayers', 'createLayer', 'cloneLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility', 'moveSelectedToLayer', 'mergeLayer', 'mergeAllLayers', 'leaveContext', 'setContext', 'clear', 'linkControlPoints', 'getContentElem', 'getRootElem', 'getSelectedElems', 'getResolution', 'getZoom', 'getVersion', 'setUiStrings', 'setConfig', 'getTitle', 'setGroupTitle', 'getDocumentTitle', 'setDocumentTitle', 'getEditorNS', 'setResolution', 'getOffset', 'setBBoxZoom', 'setZoom', 'getMode', 'setMode', 'getColor', 'setColor', 'setGradient', 'setPaint', 'setStrokePaint', 'setFillPaint', 'getStrokeWidth', 'setStrokeWidth', 'setStrokeAttr', 'getStyle', 'getOpacity', 'setOpacity', 'getFillOpacity', 'getStrokeOpacity', 'setPaintOpacity', 'getPaintOpacity', 'getBlur', 'setBlurNoUndo', 'setBlurOffsets', 'setBlur', 'getBold', 'setBold', 'getItalic', 'setItalic', 'getFontFamily', 'setFontFamily', 'setFontColor', 'getFontColor', 'getFontSize', 'setFontSize', 'getText', 'setTextContent', 'setImageURL', 'setLinkURL', 'setRectRadius', 'makeHyperlink', 'removeHyperlink', 'setSegType', 'convertToPath', 'changeSelectedAttribute', 'deleteSelectedElements', 'cutSelectedElements', 'copySelectedElements', 'pasteElements', 'groupSelectedElements', 'pushGroupProperties', 'ungroupSelectedElement', 'moveToTopSelectedElement', 'moveToBottomSelectedElement', 'moveUpDownSelected', 'moveSelectedElements', 'cloneSelectedElements', 'alignSelectedElements', 'updateCanvas', 'setBackground', 'cycleElement', 'getPrivateMethods', 'zoomChanged', 'ready'
|
||||
];
|
||||
|
||||
// TODO: rewrite the following, it's pretty scary.
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
svgEditor.addExtension("server_opensave", {
|
||||
callback: function() {'use strict';
|
||||
|
||||
var Utils = svgedit.utilities;
|
||||
var save_svg_action = '/+modify';
|
||||
|
||||
// Create upload target (hidden iframe)
|
||||
|
|
@ -25,18 +25,18 @@ svgEditor.addExtension("server_opensave", {
|
|||
var svg = "<?xml version=\"1.0\"?>\n" + data;
|
||||
var qstr = $.param.querystring();
|
||||
var name = qstr.substr(9).split('/+get/')[1];
|
||||
var svg_data = svgedit.utilities.encode64(svg);
|
||||
var svg_data = Utils.encode64(svg);
|
||||
if(!$('#export_canvas').length) {
|
||||
$('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
}
|
||||
var c = $('#export_canvas')[0];
|
||||
c.width = svgCanvas.contentW;
|
||||
c.height = svgCanvas.contentH;
|
||||
svgEditor.buildCanvgCallback(function () {
|
||||
Utils.buildCanvgCallback(function () {
|
||||
canvg(c, svg, {renderCallback: function() {
|
||||
var datauri = c.toDataURL('image/png');
|
||||
// var uiStrings = svgEditor.uiStrings;
|
||||
var png_data = svgedit.utilities.encode64(datauri);
|
||||
var png_data = Utils.encode64(datauri);
|
||||
var form = $('<form>').attr({
|
||||
method: 'post',
|
||||
action: save_svg_action + '/' + name,
|
||||
|
|
|
|||
|
|
@ -34,7 +34,8 @@ svgEditor.addExtension("server_opensave", {
|
|||
save_svg_action = svgEditor.curConfig.extPath + 'filesave.php',
|
||||
save_img_action = svgEditor.curConfig.extPath + 'filesave.php',
|
||||
// Create upload target (hidden iframe)
|
||||
cancelled = false;
|
||||
cancelled = false,
|
||||
Utils = svgedit.utilities;
|
||||
|
||||
$('<iframe name="output_frame" src="#"/>').hide().appendTo('body');
|
||||
svgEditor.setCustomHandlers({
|
||||
|
|
@ -42,7 +43,7 @@ svgEditor.addExtension("server_opensave", {
|
|||
var svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data, // Firefox doesn't seem to know it is UTF-8 (no matter whether we use or skip the clientDownload code) despite the Content-Disposition header containing UTF-8, but adding the encoding works
|
||||
filename = getFileNameFromTitle();
|
||||
|
||||
if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + svgedit.utilities.encode64(svg))) {
|
||||
if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + Utils.encode64(svg))) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -68,7 +69,7 @@ svgEditor.addExtension("server_opensave", {
|
|||
|
||||
c.width = svgCanvas.contentW;
|
||||
c.height = svgCanvas.contentH;
|
||||
svgEditor.buildCanvgCallback(function () {
|
||||
Utils.buildCanvgCallback(function () {
|
||||
canvg(c, data.svg, {renderCallback: function() {
|
||||
var pre, filename, suffix,
|
||||
datauri = quality ? c.toDataURL(mimeType, quality) : c.toDataURL(mimeType),
|
||||
|
|
@ -125,7 +126,7 @@ svgEditor.addExtension("server_opensave", {
|
|||
$('#dialog_box').hide();
|
||||
|
||||
if (type !== 'import_img') {
|
||||
xmlstr = svgedit.utilities.decode64(str64);
|
||||
xmlstr = Utils.decode64(str64);
|
||||
}
|
||||
|
||||
switch (type) {
|
||||
|
|
|
|||
|
|
@ -43,6 +43,7 @@ TODOS
|
|||
Utils = svgedit.utilities,
|
||||
isReady = false,
|
||||
customExportImage = false,
|
||||
customExportPDF = false,
|
||||
callbacks = [],
|
||||
/**
|
||||
* PREFS AND CONFIG
|
||||
|
|
@ -203,30 +204,6 @@ TODOS
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} globalCheck A global which can be used to determine if the script is already loaded
|
||||
* @param {array} scripts An array of scripts to preload (in order)
|
||||
* @param {function} cb The callback to execute upon load.
|
||||
*/
|
||||
function executeAfterLoads (globalCheck, scripts, cb) {
|
||||
return function () {
|
||||
var args = arguments;
|
||||
function endCallback () {
|
||||
cb.apply(null, args);
|
||||
}
|
||||
if (window[globalCheck]) {
|
||||
endCallback();
|
||||
}
|
||||
else {
|
||||
scripts.reduceRight(function (oldFunc, script) {
|
||||
return function () {
|
||||
$.getScript(script, oldFunc);
|
||||
};
|
||||
}, endCallback)();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* EXPORTS
|
||||
*/
|
||||
|
|
@ -259,14 +236,6 @@ TODOS
|
|||
* @todo Prevent execution until init executes if dependent on it?
|
||||
*/
|
||||
|
||||
var buildCanvgCallback = editor.buildCanvgCallback = function (callCanvg) {
|
||||
return executeAfterLoads('canvg', ['canvg/rgbcolor.js', 'canvg/canvg.js'], callCanvg);
|
||||
};
|
||||
|
||||
var executeJSPDFCallback = editor.executeJSPDFCallback = function (callJSPDF) {
|
||||
return executeAfterLoads('jsPDF', ['jspdf/underscore-min.js', 'jspdf/jspdf.min.js', 'jspdf/jspdf.plugin.svgToPdf.js'], callJSPDF)();
|
||||
};
|
||||
|
||||
/**
|
||||
* Where permitted, sets canvas and/or defaultPrefs based on previous
|
||||
* storage. This will override URL settings (for security reasons) but
|
||||
|
|
@ -440,7 +409,11 @@ TODOS
|
|||
}
|
||||
if (opts.exportImage) {
|
||||
customExportImage = opts.exportImage;
|
||||
svgCanvas.bind('exported', buildCanvgCallback(customExportImage));
|
||||
svgCanvas.bind('exported', Utils.buildCanvgCallback(customExportImage));
|
||||
}
|
||||
if (opts.exportPDF) {
|
||||
customExportPDF = opts.exportPDF;
|
||||
svgCanvas.bind('exportedPDF', Utils.buildJSPDFCallback(customExportPDF));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
|
@ -1100,8 +1073,7 @@ TODOS
|
|||
var exportHandler = function(win, data) {
|
||||
var issues = data.issues,
|
||||
type = data.type || 'PNG',
|
||||
exportWindowName = data.exportWindowName,
|
||||
dataURLType = (type === 'ICO' ? 'BMP' : type).toLowerCase();
|
||||
exportWindowName = data.exportWindowName;
|
||||
|
||||
if (exportWindowName) {
|
||||
exportWindow = window.open('', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
|
||||
|
|
@ -1110,41 +1082,11 @@ TODOS
|
|||
$('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
}
|
||||
var c = $('#export_canvas')[0];
|
||||
if (type === 'PDF') {
|
||||
var res = svgCanvas.getResolution();
|
||||
var orientation = res.w > res.h ? 'landscape' : 'portrait';
|
||||
var units = 'pt'; // curConfig.baseUnit; // We could use baseUnit, but that is presumably not intended for export purposes
|
||||
|
||||
executeJSPDFCallback(function () {
|
||||
var doc = jsPDF({
|
||||
orientation: orientation,
|
||||
unit: units,
|
||||
format: [res.w, res.h]
|
||||
// , compressPdf: true
|
||||
}); // Todo: Give options to use predefined jsPDF formats like "a4", etc. from pull-down (with option to keep customizable)
|
||||
var docTitle = svgCanvas.getDocumentTitle();
|
||||
doc.setProperties({
|
||||
title: docTitle/*,
|
||||
subject: '',
|
||||
author: '',
|
||||
keywords: '',
|
||||
creator: ''*/
|
||||
});
|
||||
svgElementToPdf(data.svg, doc, {});
|
||||
|
||||
// doc.output('save'); // Works to open in a new
|
||||
// window; todo: configure this and other export
|
||||
// options to optionally work in this manner as
|
||||
// opposed to opening a new tab
|
||||
// return;
|
||||
exportWindow.location.href = doc.output('dataurlstring');
|
||||
});
|
||||
return;
|
||||
}
|
||||
c.width = svgCanvas.contentW;
|
||||
c.height = svgCanvas.contentH;
|
||||
|
||||
canvg(c, data.svg, {renderCallback: function() {
|
||||
var dataURLType = (type === 'ICO' ? 'BMP' : type).toLowerCase();
|
||||
var datauri = data.quality ? c.toDataURL('image/' + dataURLType, data.quality) : c.toDataURL('image/' + dataURLType);
|
||||
exportWindow.location.href = datauri;
|
||||
var done = $.pref('export_notice_done');
|
||||
|
|
@ -2902,7 +2844,14 @@ TODOS
|
|||
svgCanvas.bind('transition', elementTransition);
|
||||
svgCanvas.bind('changed', elementChanged);
|
||||
svgCanvas.bind('saved', saveHandler);
|
||||
svgCanvas.bind('exported', buildCanvgCallback(exportHandler));
|
||||
svgCanvas.bind('exported', Utils.buildCanvgCallback(exportHandler));
|
||||
svgCanvas.bind('exportedPDF', function (win, data) {
|
||||
var exportWindowName = data.exportWindowName;
|
||||
if (exportWindowName) {
|
||||
exportWindow = window.open('', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
|
||||
}
|
||||
exportWindow.location.href = data.dataurlstring;
|
||||
});
|
||||
svgCanvas.bind('zoomed', zoomChanged);
|
||||
svgCanvas.bind('contextset', contextChanged);
|
||||
svgCanvas.bind('extension_added', extAdded);
|
||||
|
|
@ -3650,19 +3599,31 @@ TODOS
|
|||
return;
|
||||
}
|
||||
// Open placeholder window (prevents popup)
|
||||
if (!customExportImage) {
|
||||
var exportWindowName;
|
||||
function openExportWindow () {
|
||||
var str = uiStrings.notification.loadingImage;
|
||||
if (curConfig.exportWindowType === 'new') {
|
||||
editor.exportWindowCt++;
|
||||
}
|
||||
var exportWindowName = curConfig.canvasName + editor.exportWindowCt;
|
||||
exportWindowName = curConfig.canvasName + editor.exportWindowCt;
|
||||
exportWindow = window.open(
|
||||
'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
|
||||
exportWindowName
|
||||
);
|
||||
}
|
||||
var quality = parseInt($('#image-slider').val(), 10)/100;
|
||||
svgCanvas.rasterExport(imgType, quality, exportWindowName);
|
||||
if (imgType === 'PDF') {
|
||||
if (!customExportPDF) {
|
||||
openExportWindow();
|
||||
}
|
||||
svgCanvas.exportPDF(exportWindowName);
|
||||
}
|
||||
else {
|
||||
if (!customExportImage) {
|
||||
openExportWindow();
|
||||
}
|
||||
var quality = parseInt($('#image-slider').val(), 10)/100;
|
||||
svgCanvas.rasterExport(imgType, quality, exportWindowName);
|
||||
}
|
||||
}, function () {
|
||||
var sel = $(this);
|
||||
if (sel.val() === 'JPEG' || sel.val() === 'WEBP') {
|
||||
|
|
@ -4943,6 +4904,10 @@ TODOS
|
|||
if (!file) {
|
||||
return;
|
||||
}
|
||||
/* if (file.type === 'application/pdf') { // Todo: Handle PDF imports
|
||||
|
||||
}
|
||||
else */
|
||||
if (file.type.indexOf('image') != -1) {
|
||||
// Detected an image
|
||||
// svg handling
|
||||
|
|
@ -4981,7 +4946,7 @@ TODOS
|
|||
svgCanvas.alignSelectedElements('c', 'page');
|
||||
updateContextPanel();
|
||||
};
|
||||
// create dummy img so we know the default dimensions
|
||||
// create dummy img so we know the default dimensions
|
||||
var imgWidth = 100;
|
||||
var imgHeight = 100;
|
||||
var img = new Image();
|
||||
|
|
|
|||
|
|
@ -4329,12 +4329,7 @@ this.save = function(opts) {
|
|||
call('saved', str);
|
||||
};
|
||||
|
||||
// Function: rasterExport
|
||||
// Generates a Data URL based on the current image, then calls "exported"
|
||||
// with an object including the string, image information, and any issues found
|
||||
this.rasterExport = function(imgType, quality, exportWindowName) {
|
||||
var mimeType = 'image/' + imgType.toLowerCase();
|
||||
|
||||
function getIssues () {
|
||||
// remove the selected outline before serializing
|
||||
clearSelection();
|
||||
|
||||
|
|
@ -4359,11 +4354,54 @@ this.rasterExport = function(imgType, quality, exportWindowName) {
|
|||
issues.push(descr);
|
||||
}
|
||||
});
|
||||
return issues;
|
||||
}
|
||||
|
||||
// Function: rasterExport
|
||||
// Generates a Data URL based on the current image, then calls "exported"
|
||||
// with an object including the string, image information, and any issues found
|
||||
this.rasterExport = function(imgType, quality, exportWindowName) {
|
||||
var mimeType = 'image/' + imgType.toLowerCase();
|
||||
var issues = getIssues();
|
||||
var str = this.svgCanvasToString();
|
||||
call('exported', {svg: str, issues: issues, type: imgType, mimeType: mimeType, quality: quality, exportWindowName: exportWindowName});
|
||||
};
|
||||
|
||||
this.exportPDF = function (exportWindowName, outputType) {
|
||||
var that = this;
|
||||
svgedit.utilities.buildJSPDFCallback(function () {
|
||||
var res = getResolution();
|
||||
var orientation = res.w > res.h ? 'landscape' : 'portrait';
|
||||
var units = 'pt'; // curConfig.baseUnit; // We could use baseUnit, but that is presumably not intended for export purposes
|
||||
var doc = jsPDF({
|
||||
orientation: orientation,
|
||||
unit: units,
|
||||
format: [res.w, res.h]
|
||||
// , compressPdf: true
|
||||
}); // Todo: Give options to use predefined jsPDF formats like "a4", etc. from pull-down (with option to keep customizable)
|
||||
var docTitle = getDocumentTitle();
|
||||
doc.setProperties({
|
||||
title: docTitle/*,
|
||||
subject: '',
|
||||
author: '',
|
||||
keywords: '',
|
||||
creator: ''*/
|
||||
});
|
||||
var issues = getIssues();
|
||||
var str = that.svgCanvasToString();
|
||||
svgElementToPdf(str, doc, {});
|
||||
|
||||
// doc.output('save'); // Works to open in a new
|
||||
// window; todo: configure this and other export
|
||||
// options to optionally work in this manner as
|
||||
// opposed to opening a new tab
|
||||
var obj = {svg: str, issues: issues, exportWindowName: exportWindowName};
|
||||
var method = outputType || 'dataurlstring';
|
||||
obj[method] = doc.output(method);
|
||||
call('exportedPDF', obj);
|
||||
})();
|
||||
};
|
||||
|
||||
// Function: getSvgString
|
||||
// Returns the current drawing as raw SVG XML text.
|
||||
//
|
||||
|
|
@ -5531,7 +5569,7 @@ this.setGroupTitle = function(val) {
|
|||
|
||||
// Function: getDocumentTitle
|
||||
// Returns the current document title or an empty string if not found
|
||||
this.getDocumentTitle = function() {
|
||||
var getDocumentTitle = this.getDocumentTitle = function() {
|
||||
return canvas.getTitle(svgcontent);
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
// 3) svgtransformlist.js
|
||||
// 4) units.js
|
||||
|
||||
(function() {'use strict';
|
||||
(function(undef) {'use strict';
|
||||
|
||||
if (!svgedit.utilities) {
|
||||
svgedit.utilities = {};
|
||||
|
|
@ -88,8 +88,9 @@ svgedit.utilities.encode64 = function(input) {
|
|||
// input = svgedit.utilities.convertToXMLReferences(input);
|
||||
if (window.btoa) {
|
||||
return window.btoa(input); // Use native if available
|
||||
}
|
||||
var output = new Array( Math.floor( (input.length + 2) / 3 ) * 4 );
|
||||
}
|
||||
var output = [];
|
||||
output.length = Math.floor( (input.length + 2) / 3 ) * 4;
|
||||
var chr1, chr2, chr3;
|
||||
var enc1, enc2, enc3, enc4;
|
||||
var i = 0, p = 0;
|
||||
|
|
@ -163,7 +164,7 @@ svgedit.utilities.decode64 = function(input) {
|
|||
// codedread:does not seem to work with webkit-based browsers on OSX // Brettz9: please test again as function upgraded
|
||||
svgedit.utilities.encodeUTF8 = function (argString) {
|
||||
//return unescape(encodeURIComponent(input)); //may or may not work
|
||||
if (argString === null || typeof argString === 'undefined') {
|
||||
if (argString === null || argString === undef) {
|
||||
return '';
|
||||
}
|
||||
|
||||
|
|
@ -398,13 +399,13 @@ svgedit.utilities.getPathBBox = function(path) {
|
|||
for (i = 0; i < tot; i++) {
|
||||
var seg = seglist.getItem(i);
|
||||
|
||||
if(typeof seg.x === 'undefined') {continue;}
|
||||
if(seg.x === undef) {continue;}
|
||||
|
||||
// Add actual points to limits
|
||||
bounds[0].push(P0[0]);
|
||||
bounds[1].push(P0[1]);
|
||||
|
||||
if(seg.x1) {
|
||||
if (seg.x1) {
|
||||
var P1 = [seg.x1, seg.y1],
|
||||
P2 = [seg.x2, seg.y2],
|
||||
P3 = [seg.x, seg.y];
|
||||
|
|
@ -723,4 +724,42 @@ svgedit.utilities.preg_quote = function (str, delimiter) {
|
|||
return String(str).replace(new RegExp('[.\\\\+*?\\[\\^\\]$(){}=!<>|:\\' + (delimiter || '') + '-]', 'g'), '\\$&');
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {string} globalCheck A global which can be used to determine if the script is already loaded
|
||||
* @param {array} scripts An array of scripts to preload (in order)
|
||||
* @param {function} cb The callback to execute upon load.
|
||||
*/
|
||||
svgedit.utilities.executeAfterLoads = function (globalCheck, scripts, cb) {
|
||||
return function () {
|
||||
var args = arguments;
|
||||
function endCallback () {
|
||||
cb.apply(null, args);
|
||||
}
|
||||
if (window[globalCheck]) {
|
||||
endCallback();
|
||||
}
|
||||
else {
|
||||
scripts.reduceRight(function (oldFunc, script) {
|
||||
return function () {
|
||||
$.getScript(script, oldFunc);
|
||||
};
|
||||
}, endCallback)();
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
svgedit.utilities.buildCanvgCallback = function (callCanvg) {
|
||||
return svgedit.utilities.executeAfterLoads('canvg', ['canvg/rgbcolor.js', 'canvg/canvg.js'], callCanvg);
|
||||
};
|
||||
|
||||
svgedit.utilities.buildJSPDFCallback = function (callJSPDF) {
|
||||
return svgedit.utilities.executeAfterLoads('RGBColor', ['canvg/rgbcolor.js'], function () {
|
||||
var arr = [];
|
||||
if (!RGBColor || RGBColor.ok === undef) { // It's not our RGBColor, so we'll need to load it
|
||||
arr.push('canvg/rgbcolor.js');
|
||||
}
|
||||
svgedit.utilities.executeAfterLoads('jsPDF', arr.concat('jspdf/underscore-min.js', 'jspdf/jspdf.min.js', 'jspdf/jspdf.plugin.svgToPdf.js'), callJSPDF)();
|
||||
});
|
||||
};
|
||||
|
||||
}());
|
||||
|
|
|
|||
Loading…
Reference in New Issue