(INCOMPLETE: ES6 Module conversion and linting)
- Breaking change: Require `new` with `EmbeddedSVGEdit` (allows us to use `class` internally)
- Breaking change: If `svgcanvas.setUiStrings` must now be called if not using editor in order
to get strings (for sake of i18n) (and if using path.js alone, must also have its `setUiStrings` called)
- Breaking change (ext-overview-window): Avoid global `overviewWindowGlobals`
- Breaking change (ext-imagelib): Change to object-based encoding for namespacing of
messages (though keep stringifying/parsing ourselves until we remove IE9 support)
- Breaking change: Rename `jquery.js` to `jquery.min.js`
- Breaking change: Remove `scoped` attribute from `style`; it is now deprecated and
obsolete; also move to head (after other stylesheets)
- Enhancement: Make SpinButton plugin independent of SVGEdit via
generic state object for tool_scale
- Enhancement: Remove now unused Python l10n scripts (#238)
- Enhancement: ES6 Modules (including jQuery plugins but not jQuery)
- Enhancement: Further JSDoc (incomplete)
- Enhancement (Optimization): Compress images using imageoptim (and add
npm script) (per #215)
- Fix: i18nize path.js strings and canvas notifications
- Fix: Attempt i18n for ext-markers
- Refactoring (ext-storage): Move locale info to own file imported by the extension (toward modularity; still should be split into separate files by language and *dynamically* imported, but we'll wait for better `import` support to refactor this)
- Refactoring: For imagelib, add local jQuery copy (using old 1.4.4 as had
been using from server)
- Refactoring: For MathJax, add local copy (using old 2.3 as had been using from
server); server had not been working
- Refactoring: Remove `use strict` (implicit in modules)
- Refactoring: Remove trailing whitespace, fix some code within comments
- Refactoring: Expect `jQuery` global rather than `$` for better modularity
(also to adapt line later once available via `import`)
- Refactoring: Prefer `const` (and then `let`)
- Refactoring: Add block scope keywords closer to first block in which they appear
- Refactoring: Use ES6 `class`
- Refactoring `$.isArray` -> `Array.isArray` and avoid some other jQuery core methods
with simple VanillaJS replacements
- Refactoring: Use abbreviated object property syntax
- Refactoring: Object destructuring
- Refactoring: Remove `uiStrings` contents in svg-editor.js (obtains from locale)
- Refactoring: Add favicon to embedded API file
- Refactoring: Use arrow functions for brief functions (incomplete)
- Refactoring: Use `Array.prototype.includes`/`String.prototype.includes`;
`String.prototype.startsWith`, `String.prototype.trim`
- Refactoring: Remove now unnecessary svgutils do/while resetting of variables
- Refactoring: Use shorthand methods for object literals (avoid ": function")
- Refactoring: Avoid quoting object property keys where unnecessary
- Refactoring: Just do truthy/falsey check for lengths in place of comparison to 0
- Refactoring (Testing): Avoid jQuery usage within most test files (defer script,
also in preparation for future switch to ES6 modules for tests)
- Refactoring: Make jpicker variable declaration indent bearable
- Refactoring (Linting): Finish svgcanvas.js
- Docs: Mention in comment no longer an entry file as before
- Docs: Migrate old config, extensions, and FAQ docs
- Licensing: Indicate MIT is license type of rgbcolor; rename/add license file name for
jgraduate and screencast to reflect type (Apache 2.0); rename file to reflect it
contains license information (of type MIT) for Raphael icons
This commit is contained in:
Brett Zamir
@@ -1,5 +1,4 @@
|
||||
/* eslint-disable no-var */
|
||||
/* globals $, svgedit */
|
||||
/* globals jQuery */
|
||||
/**
|
||||
* Package: svgedit.browser
|
||||
*
|
||||
@@ -12,177 +11,168 @@
|
||||
// Dependencies:
|
||||
// 1) jQuery (for $.alert())
|
||||
|
||||
(function () {
|
||||
'use strict';
|
||||
import './pathseg.js';
|
||||
import {NS} from './svgedit.js';
|
||||
|
||||
if (!svgedit.browser) {
|
||||
svgedit.browser = {};
|
||||
}
|
||||
const $ = jQuery;
|
||||
|
||||
// alias
|
||||
var NS = svgedit.NS;
|
||||
|
||||
var supportsSvg_ = (function () {
|
||||
return !!document.createElementNS && !!document.createElementNS(NS.SVG, 'svg').createSVGRect;
|
||||
const supportsSvg_ = (function () {
|
||||
return !!document.createElementNS && !!document.createElementNS(NS.SVG, 'svg').createSVGRect;
|
||||
}());
|
||||
|
||||
svgedit.browser.supportsSvg = function () { return supportsSvg_; };
|
||||
if (!svgedit.browser.supportsSvg()) {
|
||||
window.location = 'browser-not-supported.html';
|
||||
return;
|
||||
}
|
||||
export const supportsSvg = () => supportsSvg_;
|
||||
|
||||
var userAgent = navigator.userAgent;
|
||||
var svg = document.createElementNS(NS.SVG, 'svg');
|
||||
const {userAgent} = navigator;
|
||||
const svg = document.createElementNS(NS.SVG, 'svg');
|
||||
|
||||
// Note: Browser sniffing should only be used if no other detection method is possible
|
||||
var isOpera_ = !!window.opera;
|
||||
var isWebkit_ = userAgent.indexOf('AppleWebKit') >= 0;
|
||||
var isGecko_ = userAgent.indexOf('Gecko/') >= 0;
|
||||
var isIE_ = userAgent.indexOf('MSIE') >= 0;
|
||||
var isChrome_ = userAgent.indexOf('Chrome/') >= 0;
|
||||
var isWindows_ = userAgent.indexOf('Windows') >= 0;
|
||||
var isMac_ = userAgent.indexOf('Macintosh') >= 0;
|
||||
var isTouch_ = 'ontouchstart' in window;
|
||||
const isOpera_ = !!window.opera;
|
||||
const isWebkit_ = userAgent.includes('AppleWebKit');
|
||||
const isGecko_ = userAgent.includes('Gecko/');
|
||||
const isIE_ = userAgent.includes('MSIE');
|
||||
const isChrome_ = userAgent.includes('Chrome/');
|
||||
const isWindows_ = userAgent.includes('Windows');
|
||||
const isMac_ = userAgent.includes('Macintosh');
|
||||
const isTouch_ = 'ontouchstart' in window;
|
||||
|
||||
var supportsSelectors_ = (function () {
|
||||
return !!svg.querySelector;
|
||||
const supportsSelectors_ = (function () {
|
||||
return !!svg.querySelector;
|
||||
}());
|
||||
|
||||
var supportsXpath_ = (function () {
|
||||
return !!document.evaluate;
|
||||
const supportsXpath_ = (function () {
|
||||
return !!document.evaluate;
|
||||
}());
|
||||
|
||||
// segList functions (for FF1.5 and 2.0)
|
||||
var supportsPathReplaceItem_ = (function () {
|
||||
var path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,10');
|
||||
var seglist = path.pathSegList;
|
||||
var seg = path.createSVGPathSegLinetoAbs(5, 5);
|
||||
try {
|
||||
seglist.replaceItem(seg, 1);
|
||||
return true;
|
||||
} catch (err) {}
|
||||
return false;
|
||||
const supportsPathReplaceItem_ = (function () {
|
||||
const path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,10');
|
||||
const seglist = path.pathSegList;
|
||||
const seg = path.createSVGPathSegLinetoAbs(5, 5);
|
||||
try {
|
||||
seglist.replaceItem(seg, 1);
|
||||
return true;
|
||||
} catch (err) {}
|
||||
return false;
|
||||
}());
|
||||
|
||||
var supportsPathInsertItemBefore_ = (function () {
|
||||
var path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,10');
|
||||
var seglist = path.pathSegList;
|
||||
var seg = path.createSVGPathSegLinetoAbs(5, 5);
|
||||
try {
|
||||
seglist.insertItemBefore(seg, 1);
|
||||
return true;
|
||||
} catch (err) {}
|
||||
return false;
|
||||
const supportsPathInsertItemBefore_ = (function () {
|
||||
const path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,10');
|
||||
const seglist = path.pathSegList;
|
||||
const seg = path.createSVGPathSegLinetoAbs(5, 5);
|
||||
try {
|
||||
seglist.insertItemBefore(seg, 1);
|
||||
return true;
|
||||
} catch (err) {}
|
||||
return false;
|
||||
}());
|
||||
|
||||
// text character positioning (for IE9)
|
||||
var supportsGoodTextCharPos_ = (function () {
|
||||
var svgroot = document.createElementNS(NS.SVG, 'svg');
|
||||
var svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgroot);
|
||||
svgcontent.setAttribute('x', 5);
|
||||
svgroot.appendChild(svgcontent);
|
||||
var text = document.createElementNS(NS.SVG, 'text');
|
||||
text.textContent = 'a';
|
||||
svgcontent.appendChild(text);
|
||||
var pos = text.getStartPositionOfChar(0).x;
|
||||
document.documentElement.removeChild(svgroot);
|
||||
return (pos === 0);
|
||||
const supportsGoodTextCharPos_ = (function () {
|
||||
const svgroot = document.createElementNS(NS.SVG, 'svg');
|
||||
const svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgroot);
|
||||
svgcontent.setAttribute('x', 5);
|
||||
svgroot.appendChild(svgcontent);
|
||||
const text = document.createElementNS(NS.SVG, 'text');
|
||||
text.textContent = 'a';
|
||||
svgcontent.appendChild(text);
|
||||
const pos = text.getStartPositionOfChar(0).x;
|
||||
document.documentElement.removeChild(svgroot);
|
||||
return (pos === 0);
|
||||
}());
|
||||
|
||||
var supportsPathBBox_ = (function () {
|
||||
var svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgcontent);
|
||||
var path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 C0,0 10,10 10,0');
|
||||
svgcontent.appendChild(path);
|
||||
var bbox = path.getBBox();
|
||||
document.documentElement.removeChild(svgcontent);
|
||||
return (bbox.height > 4 && bbox.height < 5);
|
||||
const supportsPathBBox_ = (function () {
|
||||
const svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgcontent);
|
||||
const path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 C0,0 10,10 10,0');
|
||||
svgcontent.appendChild(path);
|
||||
const bbox = path.getBBox();
|
||||
document.documentElement.removeChild(svgcontent);
|
||||
return (bbox.height > 4 && bbox.height < 5);
|
||||
}());
|
||||
|
||||
// Support for correct bbox sizing on groups with horizontal/vertical lines
|
||||
var supportsHVLineContainerBBox_ = (function () {
|
||||
var svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgcontent);
|
||||
var path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,0');
|
||||
var path2 = document.createElementNS(NS.SVG, 'path');
|
||||
path2.setAttribute('d', 'M5,0 15,0');
|
||||
var g = document.createElementNS(NS.SVG, 'g');
|
||||
g.appendChild(path);
|
||||
g.appendChild(path2);
|
||||
svgcontent.appendChild(g);
|
||||
var bbox = g.getBBox();
|
||||
document.documentElement.removeChild(svgcontent);
|
||||
// Webkit gives 0, FF gives 10, Opera (correctly) gives 15
|
||||
return (bbox.width === 15);
|
||||
const supportsHVLineContainerBBox_ = (function () {
|
||||
const svgcontent = document.createElementNS(NS.SVG, 'svg');
|
||||
document.documentElement.appendChild(svgcontent);
|
||||
const path = document.createElementNS(NS.SVG, 'path');
|
||||
path.setAttribute('d', 'M0,0 10,0');
|
||||
const path2 = document.createElementNS(NS.SVG, 'path');
|
||||
path2.setAttribute('d', 'M5,0 15,0');
|
||||
const g = document.createElementNS(NS.SVG, 'g');
|
||||
g.appendChild(path);
|
||||
g.appendChild(path2);
|
||||
svgcontent.appendChild(g);
|
||||
const bbox = g.getBBox();
|
||||
document.documentElement.removeChild(svgcontent);
|
||||
// Webkit gives 0, FF gives 10, Opera (correctly) gives 15
|
||||
return (bbox.width === 15);
|
||||
}());
|
||||
|
||||
var supportsEditableText_ = (function () {
|
||||
// TODO: Find better way to check support for this
|
||||
return isOpera_;
|
||||
const supportsEditableText_ = (function () {
|
||||
// TODO: Find better way to check support for this
|
||||
return isOpera_;
|
||||
}());
|
||||
|
||||
var supportsGoodDecimals_ = (function () {
|
||||
// Correct decimals on clone attributes (Opera < 10.5/win/non-en)
|
||||
var rect = document.createElementNS(NS.SVG, 'rect');
|
||||
rect.setAttribute('x', 0.1);
|
||||
var crect = rect.cloneNode(false);
|
||||
var retValue = (crect.getAttribute('x').indexOf(',') === -1);
|
||||
if (!retValue) {
|
||||
$.alert('NOTE: This version of Opera is known to contain bugs in SVG-edit.\n' +
|
||||
'Please upgrade to the <a href="https://www.opera.com/download">latest version</a> in which the problems have been fixed.');
|
||||
}
|
||||
return retValue;
|
||||
const supportsGoodDecimals_ = (function () {
|
||||
// Correct decimals on clone attributes (Opera < 10.5/win/non-en)
|
||||
const rect = document.createElementNS(NS.SVG, 'rect');
|
||||
rect.setAttribute('x', 0.1);
|
||||
const crect = rect.cloneNode(false);
|
||||
const retValue = (!crect.getAttribute('x').includes(','));
|
||||
if (!retValue) {
|
||||
$.alert('NOTE: This version of Opera is known to contain bugs in SVG-edit.\n' +
|
||||
'Please upgrade to the <a href="http://opera.com">latest version</a> in which the problems have been fixed.');
|
||||
}
|
||||
return retValue;
|
||||
}());
|
||||
|
||||
var supportsNonScalingStroke_ = (function () {
|
||||
var rect = document.createElementNS(NS.SVG, 'rect');
|
||||
rect.setAttribute('style', 'vector-effect:non-scaling-stroke');
|
||||
return rect.style.vectorEffect === 'non-scaling-stroke';
|
||||
const supportsNonScalingStroke_ = (function () {
|
||||
const rect = document.createElementNS(NS.SVG, 'rect');
|
||||
rect.setAttribute('style', 'vector-effect:non-scaling-stroke');
|
||||
return rect.style.vectorEffect === 'non-scaling-stroke';
|
||||
}());
|
||||
|
||||
var supportsNativeSVGTransformLists_ = (function () {
|
||||
var rect = document.createElementNS(NS.SVG, 'rect');
|
||||
var rxform = rect.transform.baseVal;
|
||||
var t1 = svg.createSVGTransform();
|
||||
rxform.appendItem(t1);
|
||||
var r1 = rxform.getItem(0);
|
||||
return r1 instanceof SVGTransform && t1 instanceof SVGTransform &&
|
||||
r1.type === t1.type && r1.angle === t1.angle &&
|
||||
r1.matrix.a === t1.matrix.a &&
|
||||
r1.matrix.b === t1.matrix.b &&
|
||||
r1.matrix.c === t1.matrix.c &&
|
||||
r1.matrix.d === t1.matrix.d &&
|
||||
r1.matrix.e === t1.matrix.e &&
|
||||
r1.matrix.f === t1.matrix.f;
|
||||
const supportsNativeSVGTransformLists_ = (function () {
|
||||
const rect = document.createElementNS(NS.SVG, 'rect');
|
||||
const rxform = rect.transform.baseVal;
|
||||
const t1 = svg.createSVGTransform();
|
||||
rxform.appendItem(t1);
|
||||
const r1 = rxform.getItem(0);
|
||||
// Todo: Do frame-independent instance checking
|
||||
return r1 instanceof SVGTransform && t1 instanceof SVGTransform &&
|
||||
r1.type === t1.type && r1.angle === t1.angle &&
|
||||
r1.matrix.a === t1.matrix.a &&
|
||||
r1.matrix.b === t1.matrix.b &&
|
||||
r1.matrix.c === t1.matrix.c &&
|
||||
r1.matrix.d === t1.matrix.d &&
|
||||
r1.matrix.e === t1.matrix.e &&
|
||||
r1.matrix.f === t1.matrix.f;
|
||||
}());
|
||||
|
||||
// Public API
|
||||
|
||||
svgedit.browser.isOpera = function () { return isOpera_; };
|
||||
svgedit.browser.isWebkit = function () { return isWebkit_; };
|
||||
svgedit.browser.isGecko = function () { return isGecko_; };
|
||||
svgedit.browser.isIE = function () { return isIE_; };
|
||||
svgedit.browser.isChrome = function () { return isChrome_; };
|
||||
svgedit.browser.isWindows = function () { return isWindows_; };
|
||||
svgedit.browser.isMac = function () { return isMac_; };
|
||||
svgedit.browser.isTouch = function () { return isTouch_; };
|
||||
export const isOpera = () => isOpera_;
|
||||
export const isWebkit = () => isWebkit_;
|
||||
export const isGecko = () => isGecko_;
|
||||
export const isIE = () => isIE_;
|
||||
export const isChrome = () => isChrome_;
|
||||
export const isWindows = () => isWindows_;
|
||||
export const isMac = () => isMac_;
|
||||
export const isTouch = () => isTouch_;
|
||||
|
||||
svgedit.browser.supportsSelectors = function () { return supportsSelectors_; };
|
||||
svgedit.browser.supportsXpath = function () { return supportsXpath_; };
|
||||
export const supportsSelectors = () => supportsSelectors_;
|
||||
export const supportsXpath = () => supportsXpath_;
|
||||
|
||||
svgedit.browser.supportsPathReplaceItem = function () { return supportsPathReplaceItem_; };
|
||||
svgedit.browser.supportsPathInsertItemBefore = function () { return supportsPathInsertItemBefore_; };
|
||||
svgedit.browser.supportsPathBBox = function () { return supportsPathBBox_; };
|
||||
svgedit.browser.supportsHVLineContainerBBox = function () { return supportsHVLineContainerBBox_; };
|
||||
svgedit.browser.supportsGoodTextCharPos = function () { return supportsGoodTextCharPos_; };
|
||||
svgedit.browser.supportsEditableText = function () { return supportsEditableText_; };
|
||||
svgedit.browser.supportsGoodDecimals = function () { return supportsGoodDecimals_; };
|
||||
svgedit.browser.supportsNonScalingStroke = function () { return supportsNonScalingStroke_; };
|
||||
svgedit.browser.supportsNativeTransformLists = function () { return supportsNativeSVGTransformLists_; };
|
||||
}());
|
||||
export const supportsPathReplaceItem = () => supportsPathReplaceItem_;
|
||||
export const supportsPathInsertItemBefore = () => supportsPathInsertItemBefore_;
|
||||
export const supportsPathBBox = () => supportsPathBBox_;
|
||||
export const supportsHVLineContainerBBox = () => supportsHVLineContainerBBox_;
|
||||
export const supportsGoodTextCharPos = () => supportsGoodTextCharPos_;
|
||||
export const supportsEditableText = () => supportsEditableText_;
|
||||
export const supportsGoodDecimals = () => supportsGoodDecimals_;
|
||||
export const supportsNonScalingStroke = () => supportsNonScalingStroke_;
|
||||
export const supportsNativeTransformLists = () => supportsNativeSVGTransformLists_;
|
||||
|
||||
Reference in New Issue
Block a user