fix ruler

master
JFH 2020-12-31 18:41:16 +01:00
parent 5e56e2d19a
commit 031812c7ae
5 changed files with 36 additions and 62 deletions

View File

@ -150,34 +150,14 @@ export default class ConfigObj {
// EXTENSION (CLIENT VS. SERVER SAVING/OPENING) // EXTENSION (CLIENT VS. SERVER SAVING/OPENING)
avoidClientSide: false, // Deprecated in favor of `avoidClientSideDownload` avoidClientSide: false, // Deprecated in favor of `avoidClientSideDownload`
avoidClientSideDownload: false, avoidClientSideDownload: false,
avoidClientSideOpen: false avoidClientSideOpen: false,
userExtensions: []
}; };
this.curPrefs = {}; this.curPrefs = {};
// Note: The difference between Prefs and Config is that Prefs // Note: The difference between Prefs and Config is that Prefs
// can be changed in the UI and are stored in the browser, // can be changed in the UI and are stored in the browser,
// while config cannot // while config cannot
this.curConfig = {
// We do not put on defaultConfig to simplify object copying
// procedures (we obtain instead from defaultExtensions)
extensions: [],
userExtensions: [],
/**
* Can use `location.origin` to indicate the current
* origin. Can contain a '*' to allow all domains or 'null' (as
* a string) to support all `file:///` URLs. Cannot be set by
* URL for security reasons (not safe, at least for
* privacy or data integrity of SVG content).
* Might have been fairly safe to allow
* `new URL(location.href).origin` by default but
* avoiding it ensures some more security that even third
* party apps on the same domain also cannot communicate
* with this app by default.
* For use with `ext-xdomain-messaging.js`
* @todo We might instead make as a user-facing preference.
*/
allowedOrigins: []
};
this.urldata = {}; this.urldata = {};
/** /**
* @name module:SVGEditor~defaultExtensions * @name module:SVGEditor~defaultExtensions
@ -212,20 +192,22 @@ export default class ConfigObj {
* @returns {void} * @returns {void}
*/ */
setupCurConfig () { setupCurConfig () {
const curConfig = {...this.defaultConfig, ...this.curConfig}; // Now safe to merge with priority for curConfig in the event any are already set const curConfig = {...this.defaultConfig, ...this.editor.configObj.curConfig}; // Now safe to merge with priority for curConfig in the event any are already set
// Now deal with extensions and other array config // Now deal with extensions and other array config
if (!curConfig.noDefaultExtensions) { if (!curConfig.noDefaultExtensions) {
curConfig.extensions = curConfig.extensions.concat(this.defaultExtensions); curConfig.extensions = [...this.defaultExtensions];
} }
// ...and remove any dupes // ...and remove any dupes
/*
['extensions', 'allowedOrigins'].forEach(function (cfg) { ['extensions', 'allowedOrigins'].forEach(function (cfg) {
curConfig[cfg] = $.grep(curConfig[cfg], function (n, i) { // Supposedly faster than filter per http://amandeep1986.blogspot.hk/2015/02/jquery-grep-vs-js-filter.html curConfig[cfg] = $.grep(curConfig[cfg], function (n, i) { // Supposedly faster than filter per http://amandeep1986.blogspot.hk/2015/02/jquery-grep-vs-js-filter.html
return i === curConfig[cfg].indexOf(n); return i === curConfig[cfg].indexOf(n);
}); });
}); });
*/
// Export updated config // Export updated config
this.curConfig = curConfig; this.editor.configObj.curConfig = curConfig;
} }
/** /**
* @function loadFromURL Load config/data from URL if given * @function loadFromURL Load config/data from URL if given
@ -277,7 +259,7 @@ export default class ConfigObj {
this.setConfig(this.urldata, {overwrite: false}); this.setConfig(this.urldata, {overwrite: false});
this.setupCurConfig(); this.setupCurConfig();
if (!this.curConfig.preventURLContentLoading) { if (!this.editor.configObj.curConfig.preventURLContentLoading) {
let {source} = this.urldata; let {source} = this.urldata;
if (!source) { // urldata.source may have been null if it ended with '=' if (!source) { // urldata.source may have been null if it ended with '='
const src = searchParams.get('source'); const src = searchParams.get('source');
@ -298,7 +280,7 @@ export default class ConfigObj {
return; return;
} }
} }
if (!this.urldata.noStorageOnLoad || this.curConfig.forceStorage) { if (!this.urldata.noStorageOnLoad || this.editor.configObj.curConfig.forceStorage) {
this.loadContentAndPrefs(); this.loadContentAndPrefs();
} }
} else { } else {
@ -321,8 +303,8 @@ export default class ConfigObj {
* @returns {void} * @returns {void}
*/ */
loadContentAndPrefs () { loadContentAndPrefs () {
if (!this.curConfig.forceStorage && if (!this.editor.configObj.curConfig.forceStorage &&
(this.curConfig.noStorageOnLoad || (this.editor.configObj.curConfig.noStorageOnLoad ||
!document.cookie.match(/(?:^|;\s*)svgeditstore=(?:prefsAndContent|prefsOnly)/) !document.cookie.match(/(?:^|;\s*)svgeditstore=(?:prefsAndContent|prefsOnly)/)
) )
) { ) {
@ -331,12 +313,12 @@ export default class ConfigObj {
// LOAD CONTENT // LOAD CONTENT
if (this.editor.storage && // Cookies do not have enough available memory to hold large documents if (this.editor.storage && // Cookies do not have enough available memory to hold large documents
(this.curConfig.forceStorage || (this.editor.configObj.curConfig.forceStorage ||
(!this.curConfig.noStorageOnLoad && (!this.editor.configObj.curConfig.noStorageOnLoad &&
document.cookie.match(/(?:^|;\s*)svgeditstore=prefsAndContent/)) document.cookie.match(/(?:^|;\s*)svgeditstore=prefsAndContent/))
) )
) { ) {
const name = 'svgedit-' + this.curConfig.canvasName; const name = 'svgedit-' + this.editor.configObj.curConfig.canvasName;
const cached = this.editor.storage.getItem(name); const cached = this.editor.storage.getItem(name);
if (cached) { if (cached) {
this.editor.loadFromString(cached); this.editor.loadFromString(cached);
@ -404,7 +386,7 @@ export default class ConfigObj {
// Only allow prefs defined in configObj.defaultPrefs or... // Only allow prefs defined in configObj.defaultPrefs or...
if (this.defaultPrefs[key]) { if (this.defaultPrefs[key]) {
if (cfgCfg.overwrite === false && ( if (cfgCfg.overwrite === false && (
this.curConfig.preventAllURLConfig || this.editor.configObj.curConfig.preventAllURLConfig ||
this.curPrefs[key]) this.curPrefs[key])
) { ) {
return; return;
@ -417,35 +399,35 @@ export default class ConfigObj {
} else if (['extensions', 'userExtensions', 'allowedOrigins'].includes(key)) { } else if (['extensions', 'userExtensions', 'allowedOrigins'].includes(key)) {
if (cfgCfg.overwrite === false && if (cfgCfg.overwrite === false &&
( (
this.curConfig.preventAllURLConfig || this.editor.configObj.curConfig.preventAllURLConfig ||
['allowedOrigins'].includes(key) || ['allowedOrigins'].includes(key) ||
(key === 'extensions' && this.curConfig.lockExtensions) (key === 'extensions' && this.editor.configObj.curConfig.lockExtensions)
) )
) { ) {
return; return;
} }
this.curConfig[key] = this.curConfig[key].concat(val); // We will handle any dupes later this.editor.configObj.curConfig[key] = this.editor.configObj.curConfig[key].concat(val); // We will handle any dupes later
// Only allow other configObj.curConfig if defined in configObj.defaultConfig // Only allow other configObj.curConfig if defined in configObj.defaultConfig
} else if ({}.hasOwnProperty.call(this.defaultConfig, key)) { } else if ({}.hasOwnProperty.call(this.defaultConfig, key)) {
if (cfgCfg.overwrite === false && ( if (cfgCfg.overwrite === false && (
this.curConfig.preventAllURLConfig || this.editor.configObj.curConfig.preventAllURLConfig ||
{}.hasOwnProperty.call(this.curConfig, key) {}.hasOwnProperty.call(this.editor.configObj.curConfig, key)
)) { )) {
return; return;
} }
// Potentially overwriting of previously set config // Potentially overwriting of previously set config
if ({}.hasOwnProperty.call(this.curConfig, key)) { if ({}.hasOwnProperty.call(this.editor.configObj.curConfig, key)) {
if (cfgCfg.overwrite === false) { if (cfgCfg.overwrite === false) {
return; return;
} }
extendOrAdd(this.curConfig, key, val); extendOrAdd(this.editor.configObj.curConfig, key, val);
} else if (cfgCfg.allowInitialUserOverride === true) { } else if (cfgCfg.allowInitialUserOverride === true) {
extendOrAdd(this.defaultConfig, key, val); extendOrAdd(this.defaultConfig, key, val);
} else if (this.defaultConfig[key] && typeof this.defaultConfig[key] === 'object') { } else if (this.defaultConfig[key] && typeof this.defaultConfig[key] === 'object') {
this.curConfig[key] = Array.isArray(this.defaultConfig[key]) ? [] : {}; this.editor.configObj.curConfig[key] = Array.isArray(this.defaultConfig[key]) ? [] : {};
$.extend(true, this.curConfig[key], val); // Merge properties recursively, e.g., on initFill, initStroke objects $.extend(true, this.editor.configObj.curConfig[key], val); // Merge properties recursively, e.g., on initFill, initStroke objects
} else { } else {
this.curConfig[key] = val; this.editor.configObj.curConfig[key] = val;
} }
} }
}); });

View File

@ -17,7 +17,6 @@ class Rulers {
this.rulerIntervals.push(5 * i); this.rulerIntervals.push(5 * i);
} }
this.svgCanvas = editor.svgCanvas; this.svgCanvas = editor.svgCanvas;
this.curConfig = editor.configObj;
this.editor = editor; this.editor = editor;
} }
/** /**
@ -25,10 +24,9 @@ class Rulers {
*/ */
manageScroll () { manageScroll () {
const rulerX = document.getElementById('ruler_x'); const rulerX = document.getElementById('ruler_x');
const rulerY = document.getElementById('ruler_x'); const rulerY = document.getElementById('ruler_y');
if (rulerX) rulerX.scrollLeft = this.editor.workarea[0].scrollLeft;
if (rulerX) rulerX.scrollLeft = this.editor.workarea.scrollLeft; if (rulerY) rulerY.scrollTop = this.editor.workarea[0].scrollTop;
if (rulerY) rulerY.scrollTop = this.editor.workarea.scrollTop;
} }
/** /**
@ -45,7 +43,7 @@ class Rulers {
const limit = 30000; const limit = 30000;
const contentElem = this.svgCanvas.getContentElem(); const contentElem = this.svgCanvas.getContentElem();
const units = getTypeMap(); const units = getTypeMap();
const unit = units[this.curConfig.baseUnit]; // 1 = 1px const unit = units[this.editor.configObj.curConfig.baseUnit]; // 1 = 1px
// draw x ruler then y ruler // draw x ruler then y ruler
for (d = 0; d < 2; d++) { for (d = 0; d < 2; d++) {

View File

@ -181,3 +181,9 @@ export class SeStorageDialog extends HTMLElement {
// Register // Register
customElements.define('se-storage-dialog', SeStorageDialog); customElements.define('se-storage-dialog', SeStorageDialog);
/*
if ('localStorage' in window) { // && onWeb removed so Webkit works locally
this.storage = this.localStorage;
}
*/

View File

@ -480,18 +480,6 @@ class Editor {
*/ */
init () { init () {
try { try {
if ('localStorage' in window) { // && onWeb removed so Webkit works locally
/**
* The built-in interface implemented by `localStorage`
* @external Storage
*/
/**
* @name storage
* @memberof module:SVGEditor
* @type {external:Storage}
*/
this.storage = this.localStorage;
}
// Image props dialog added to DOM // Image props dialog added to DOM
const newSeImgPropDialog = document.createElement('se-img-prop-dialog'); const newSeImgPropDialog = document.createElement('se-img-prop-dialog');
newSeImgPropDialog.setAttribute('id', 'se-img-prop'); newSeImgPropDialog.setAttribute('id', 'se-img-prop');

View File

@ -168,7 +168,7 @@ if (window.opera) {
class SvgCanvas { class SvgCanvas {
/** /**
* @param {HTMLElement} container - The container HTML element that should hold the SVG root element * @param {HTMLElement} container - The container HTML element that should hold the SVG root element
* @param {module:SVGEditor.curConfig} config - An object that contains configuration data * @param {module:SVGeditor.configObj.curConfig} config - An object that contains configuration data
*/ */
constructor (container, config) { constructor (container, config) {
// Alias Namespace constants // Alias Namespace constants