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

send open/save to a default extension

Browse Source
This commit is contained in:
JFH
2021-01-03 17:34:12 +01:00
parent e39c5f40ee
commit 5c4e2eb46c
4 changed files with 89 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/editor/ConfigObj.js
View File

@@ -173,7 +173,8 @@ export default class ConfigObj {
'ext-polygon',
'ext-shapes',
'ext-star',
'ext-storage'
'ext-storage',
'ext-opensave'
];
this.curConfig = {
// We do not put on defaultConfig to simplify object copying

27
src/editor/EditorStartup.js
View File

@@ -139,7 +139,6 @@ class EditorStartup {
this.svgCanvas.bind('selected', this.selectedChanged.bind(this));
this.svgCanvas.bind('transition', this.elementTransition.bind(this));
this.svgCanvas.bind('changed', this.elementChanged.bind(this));
this.svgCanvas.bind('saved', this.saveHandler.bind(this));
this.svgCanvas.bind('exported', this.exportHandler.bind(this));
this.svgCanvas.bind('exportedPDF', function (win, data) {
if (!data.output) { // Ignore Chrome
@@ -454,10 +453,11 @@ class EditorStartup {
this.layersPanel.init();
$id('tool_clear').addEventListener('click', this.clickClear.bind(this));
$id('tool_open').addEventListener('click', function (e) {
$id('tool_open').addEventListener('click', (e) => {
e.preventDefault();
this.clickOpen();
window.dispatchEvent(new CustomEvent('openImage'));
}.bind(this));
});
$id('tool_import').addEventListener('click', (e) => {
this.clickImport();
window.dispatchEvent(new CustomEvent('importImage'));
@@ -702,27 +702,6 @@ class EditorStartup {
this.workarea[0].addEventListener('dragover', this.onDragOver);
this.workarea[0].addEventListener('dragleave', this.onDragLeave);
this.workarea[0].addEventListener('drop', importImage);
const open = $('<input type="file">').change(async function (e) {
const ok = await this.openPrep();
if (!ok) { return; }
this.svgCanvas.clear();
if (this.files.length === 1) {
$.process_cancel(this.uiStrings.notification.loadingImage);
const reader = new FileReader();
reader.onloadend = async function ({target}) {
await this.loadSvgString(target.result);
this.updateCanvas();
};
reader.readAsText(this.files[0]);
}
});
$('#tool_open').show();
$(window).on('openImage', () => open.click());
const imgImport = $('<input type="file">').change(importImage);
$('#tool_import').show();
$(window).on('importImage', () => imgImport.click());
}
this.updateCanvas(true);

78
src/editor/extensions/ext-opensave/ext-opensave.js Normal file
View File

@@ -0,0 +1,78 @@
/* globals seAlert */
/**
* @file ext-opensave.js
*
* @license MIT
*
* @copyright 2020 OptimistikSAS
*
*/
/**
* @type {module:svgcanvas.EventHandler}
* @param {external:Window} wind
* @param {module:svgcanvas.SvgCanvas#event:saved} svg The SVG source
* @listens module:svgcanvas.SvgCanvas#event:saved
* @returns {void}
*/
export default {
name: 'opensave',
init ({$, decode64, encode64}) {
const svgEditor = this;
svgEditor.setCustomHandlers({
save (win, svg) {
this.showSaveWarning = false;
// by default, we add the XML prolog back, systems integrating SVG-edit (wikis, CMSs)
// can just provide their own custom save handler and might not want the XML prolog
svg = '<?xml version="1.0"?>\n' + svg;
// Since saving SVGs by opening a new window was removed in Chrome use artificial link-click
// https://stackoverflow.com/questions/45603201/window-is-not-allowed-to-navigate-top-frame-navigations-to-data-urls
const a = document.createElement('a');
a.href = 'data:image/svg+xml;base64,' + encode64(svg);
a.download = 'icon.svg';
a.style.display = 'none';
document.body.append(a); // Need to append for Firefox
a.click();
// Alert will only appear the first time saved OR the
// first time the bug is encountered
const done = this.configObj.pref('save_notice_done');
if (done !== 'all') {
const note = this.uiStrings.notification.saveFromBrowser.replace('%s', 'SVG');
this.configObj.pref('save_notice_done', 'all');
if (done !== 'part') {
seAlert(note);
}
}
},
async open () {
const ok = await this.openPrep();
if (!ok) { return; }
this.svgCanvas.clear();
const input = document.createElement('input');
input.type = 'file';
input.addEventListener('change', (e) => {
// getting a hold of the file reference
const file = e.target.files[0];
// setting up the reader
const reader = new FileReader();
reader.readAsText(file, 'UTF-8');
// here we tell the reader what to do when it's done reading...
reader.addEventListener('load', async (readerEvent) => {
const content = readerEvent.target.result;
await this.loadSvgString(content);
this.updateCanvas();
});
});
input.click();
}
});
}
};

63
src/editor/svgedit.js
View File

@@ -17,7 +17,7 @@
*/
import './touch.js';
import {isChrome, isGecko, isMac} from '../common/browser.js';
import {isChrome, isMac} from '../common/browser.js';
import {convertUnit, isValidUnit} from '../common/units.js';
import SvgCanvas from '../svgcanvas/svgcanvas.js';
@@ -205,20 +205,18 @@ class Editor extends EditorStartup {
setCustomHandlers (opts) {
return this.ready(() => {
if (opts.open) {
$('#tool_open > input[type="file"]').remove();
$('#tool_open').show();
this.svgCanvas.open = opts.open;
this.svgCanvas.open = opts.open.bind(this);
}
if (opts.save) {
this.showSaveWarning = false;
this.svgCanvas.bind('saved', opts.save);
this.svgCanvas.bind('saved', opts.save.bind(this));
}
if (opts.exportImage) {
this.customExportImage = opts.exportImage;
this.customExportImage = opts.exportImage.bind(this);
this.svgCanvas.bind('exported', this.customExportImage); // canvg and our RGBColor will be available to the method
}
if (opts.exportPDF) {
this.customExportPDF = opts.exportPDF;
this.customExportPDF = opts.exportPDF.bind(this);
this.svgCanvas.bind('exportedPDF', this.customExportPDF); // jsPDF and our RGBColor will be available to the method
}
});
@@ -368,55 +366,6 @@ class Editor extends EditorStartup {
}
}
/**
* @type {module:svgcanvas.EventHandler}
* @param {external:Window} wind
* @param {module:svgcanvas.SvgCanvas#event:saved} svg The SVG source
* @listens module:svgcanvas.SvgCanvas#event:saved
* @returns {void}
*/
saveHandler (wind, svg) {
this.showSaveWarning = false;
// by default, we add the XML prolog back, systems integrating SVG-edit (wikis, CMSs)
// can just provide their own custom save handler and might not want the XML prolog
svg = '<?xml version="1.0"?>\n' + svg;
// Since saving SVGs by opening a new window was removed in Chrome use artificial link-click
// https://stackoverflow.com/questions/45603201/window-is-not-allowed-to-navigate-top-frame-navigations-to-data-urls
const a = document.createElement('a');
a.href = 'data:image/svg+xml;base64,' + encode64(svg);
a.download = 'icon.svg';
a.style.display = 'none';
document.body.append(a); // Need to append for Firefox
a.click();
// Alert will only appear the first time saved OR the
// first time the bug is encountered
let done = this.configObj.pref('save_notice_done');
if (done !== 'all') {
let note = this.uiStrings.notification.saveFromBrowser.replace('%s', 'SVG');
// Check if FF and has <defs/>
if (isGecko()) {
if (svg.includes('<defs')) {
// warning about Mozilla bug #308590 when applicable (seems to be fixed now in Feb 2013)
note += '\n\n' + this.uiStrings.notification.defsFailOnSave;
this.configObj.pref('save_notice_done', 'all');
done = 'all';
} else {
this.configObj.pref('save_notice_done', 'part');
}
} else {
this.configObj.pref('save_notice_done', 'all');
}
if (done !== 'part') {
seAlert(note);
}
}
}
/**
* @param {external:Window} win
* @param {module:svgcanvas.SvgCanvas#event:exported} data
@@ -1454,7 +1403,7 @@ class Editor extends EditorStartup {
*/
openPrep () {
$('#main_menu').hide();
if (this.undoMgr.getUndoStackSize() === 0) {
if (this.svgCanvas.undoMgr.getUndoStackSize() === 0) {
return true;
}
return seConfirm(this.uiStrings.notification.QwantToOpen);