271 lines
7.3 KiB
JavaScript
271 lines
7.3 KiB
JavaScript
|
(function (global, factory) {
|
||
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||
|
typeof define === 'function' && define.amd ? define(factory) :
|
||
|
(global.BrowserSpriteSymbol = factory());
|
||
|
}(this, (function () { 'use strict';
|
||
|
|
||
|
var SpriteSymbol = function SpriteSymbol(ref) {
|
||
|
var id = ref.id;
|
||
|
var viewBox = ref.viewBox;
|
||
|
var content = ref.content;
|
||
|
|
||
|
this.id = id;
|
||
|
this.viewBox = viewBox;
|
||
|
this.content = content;
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @return {string}
|
||
|
*/
|
||
|
SpriteSymbol.prototype.stringify = function stringify () {
|
||
|
return this.content;
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @return {string}
|
||
|
*/
|
||
|
SpriteSymbol.prototype.toString = function toString () {
|
||
|
return this.stringify();
|
||
|
};
|
||
|
|
||
|
SpriteSymbol.prototype.destroy = function destroy () {
|
||
|
var this$1 = this;
|
||
|
|
||
|
['id', 'viewBox', 'content'].forEach(function (prop) { return delete this$1[prop]; });
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @param {string} content
|
||
|
* @return {Element}
|
||
|
*/
|
||
|
var parse = function (content) {
|
||
|
var hasImportNode = !!document.importNode;
|
||
|
var doc = new DOMParser().parseFromString(content, 'image/svg+xml').documentElement;
|
||
|
|
||
|
/**
|
||
|
* Fix for browser which are throwing WrongDocumentError
|
||
|
* if you insert an element which is not part of the document
|
||
|
* @see http://stackoverflow.com/a/7986519/4624403
|
||
|
*/
|
||
|
if (hasImportNode) {
|
||
|
return document.importNode(doc, true);
|
||
|
}
|
||
|
|
||
|
return doc;
|
||
|
};
|
||
|
|
||
|
var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
function createCommonjsModule(fn, module) {
|
||
|
return module = { exports: {} }, fn(module, module.exports), module.exports;
|
||
|
}
|
||
|
|
||
|
var deepmerge = createCommonjsModule(function (module, exports) {
|
||
|
(function (root, factory) {
|
||
|
if (typeof undefined === 'function' && undefined.amd) {
|
||
|
undefined(factory);
|
||
|
} else {
|
||
|
module.exports = factory();
|
||
|
}
|
||
|
}(commonjsGlobal, function () {
|
||
|
|
||
|
function isMergeableObject(val) {
|
||
|
var nonNullObject = val && typeof val === 'object';
|
||
|
|
||
|
return nonNullObject
|
||
|
&& Object.prototype.toString.call(val) !== '[object RegExp]'
|
||
|
&& Object.prototype.toString.call(val) !== '[object Date]'
|
||
|
}
|
||
|
|
||
|
function emptyTarget(val) {
|
||
|
return Array.isArray(val) ? [] : {}
|
||
|
}
|
||
|
|
||
|
function cloneIfNecessary(value, optionsArgument) {
|
||
|
var clone = optionsArgument && optionsArgument.clone === true;
|
||
|
return (clone && isMergeableObject(value)) ? deepmerge(emptyTarget(value), value, optionsArgument) : value
|
||
|
}
|
||
|
|
||
|
function defaultArrayMerge(target, source, optionsArgument) {
|
||
|
var destination = target.slice();
|
||
|
source.forEach(function(e, i) {
|
||
|
if (typeof destination[i] === 'undefined') {
|
||
|
destination[i] = cloneIfNecessary(e, optionsArgument);
|
||
|
} else if (isMergeableObject(e)) {
|
||
|
destination[i] = deepmerge(target[i], e, optionsArgument);
|
||
|
} else if (target.indexOf(e) === -1) {
|
||
|
destination.push(cloneIfNecessary(e, optionsArgument));
|
||
|
}
|
||
|
});
|
||
|
return destination
|
||
|
}
|
||
|
|
||
|
function mergeObject(target, source, optionsArgument) {
|
||
|
var destination = {};
|
||
|
if (isMergeableObject(target)) {
|
||
|
Object.keys(target).forEach(function (key) {
|
||
|
destination[key] = cloneIfNecessary(target[key], optionsArgument);
|
||
|
});
|
||
|
}
|
||
|
Object.keys(source).forEach(function (key) {
|
||
|
if (!isMergeableObject(source[key]) || !target[key]) {
|
||
|
destination[key] = cloneIfNecessary(source[key], optionsArgument);
|
||
|
} else {
|
||
|
destination[key] = deepmerge(target[key], source[key], optionsArgument);
|
||
|
}
|
||
|
});
|
||
|
return destination
|
||
|
}
|
||
|
|
||
|
function deepmerge(target, source, optionsArgument) {
|
||
|
var array = Array.isArray(source);
|
||
|
var options = optionsArgument || { arrayMerge: defaultArrayMerge };
|
||
|
var arrayMerge = options.arrayMerge || defaultArrayMerge;
|
||
|
|
||
|
if (array) {
|
||
|
return Array.isArray(target) ? arrayMerge(target, source, optionsArgument) : cloneIfNecessary(source, optionsArgument)
|
||
|
} else {
|
||
|
return mergeObject(target, source, optionsArgument)
|
||
|
}
|
||
|
}
|
||
|
|
||
|
deepmerge.all = function deepmergeAll(array, optionsArgument) {
|
||
|
if (!Array.isArray(array) || array.length < 2) {
|
||
|
throw new Error('first argument should be an array with at least two elements')
|
||
|
}
|
||
|
|
||
|
// we are sure there are at least 2 values, so it is safe to have no initial value
|
||
|
return array.reduce(function(prev, next) {
|
||
|
return deepmerge(prev, next, optionsArgument)
|
||
|
})
|
||
|
};
|
||
|
|
||
|
return deepmerge
|
||
|
|
||
|
}));
|
||
|
});
|
||
|
|
||
|
var namespaces_1 = createCommonjsModule(function (module, exports) {
|
||
|
var namespaces = {
|
||
|
svg: {
|
||
|
name: 'xmlns',
|
||
|
uri: 'http://www.w3.org/2000/svg'
|
||
|
},
|
||
|
xlink: {
|
||
|
name: 'xmlns:xlink',
|
||
|
uri: 'http://www.w3.org/1999/xlink'
|
||
|
}
|
||
|
};
|
||
|
|
||
|
exports.default = namespaces;
|
||
|
module.exports = exports.default;
|
||
|
});
|
||
|
|
||
|
/**
|
||
|
* @param {Object} attrs
|
||
|
* @return {string}
|
||
|
*/
|
||
|
var objectToAttrsString = function (attrs) {
|
||
|
return Object.keys(attrs).map(function (attr) {
|
||
|
var value = attrs[attr].toString().replace(/"/g, '"');
|
||
|
return (attr + "=\"" + value + "\"");
|
||
|
}).join(' ');
|
||
|
};
|
||
|
|
||
|
var svg = namespaces_1.svg;
|
||
|
var xlink = namespaces_1.xlink;
|
||
|
|
||
|
var defaultAttrs = {};
|
||
|
defaultAttrs[svg.name] = svg.uri;
|
||
|
defaultAttrs[xlink.name] = xlink.uri;
|
||
|
|
||
|
/**
|
||
|
* @param {string} [content]
|
||
|
* @param {Object} [attributes]
|
||
|
* @return {string}
|
||
|
*/
|
||
|
var wrapInSvgString = function (content, attributes) {
|
||
|
if ( content === void 0 ) content = '';
|
||
|
|
||
|
var attrs = deepmerge(defaultAttrs, attributes || {});
|
||
|
var attrsRendered = objectToAttrsString(attrs);
|
||
|
return ("<svg " + attrsRendered + ">" + content + "</svg>");
|
||
|
};
|
||
|
|
||
|
var BrowserSpriteSymbol = (function (SpriteSymbol$$1) {
|
||
|
function BrowserSpriteSymbol () {
|
||
|
SpriteSymbol$$1.apply(this, arguments);
|
||
|
}
|
||
|
|
||
|
if ( SpriteSymbol$$1 ) BrowserSpriteSymbol.__proto__ = SpriteSymbol$$1;
|
||
|
BrowserSpriteSymbol.prototype = Object.create( SpriteSymbol$$1 && SpriteSymbol$$1.prototype );
|
||
|
BrowserSpriteSymbol.prototype.constructor = BrowserSpriteSymbol;
|
||
|
|
||
|
var prototypeAccessors = { isMounted: {} };
|
||
|
|
||
|
prototypeAccessors.isMounted.get = function () {
|
||
|
return !!this.node;
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @param {Element} node
|
||
|
* @return {BrowserSpriteSymbol}
|
||
|
*/
|
||
|
BrowserSpriteSymbol.createFromExistingNode = function createFromExistingNode (node) {
|
||
|
return new BrowserSpriteSymbol({
|
||
|
id: node.getAttribute('id'),
|
||
|
viewBox: node.getAttribute('viewBox'),
|
||
|
content: node.outerHTML
|
||
|
});
|
||
|
};
|
||
|
|
||
|
BrowserSpriteSymbol.prototype.destroy = function destroy () {
|
||
|
if (this.isMounted) {
|
||
|
this.unmount();
|
||
|
}
|
||
|
SpriteSymbol$$1.prototype.destroy.call(this);
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @param {Element|string} target
|
||
|
* @return {Element}
|
||
|
*/
|
||
|
BrowserSpriteSymbol.prototype.mount = function mount (target) {
|
||
|
if (this.isMounted) {
|
||
|
return this.node;
|
||
|
}
|
||
|
|
||
|
var mountTarget = typeof target === 'string' ? document.querySelector(target) : target;
|
||
|
var node = this.render();
|
||
|
this.node = node;
|
||
|
|
||
|
mountTarget.appendChild(node);
|
||
|
|
||
|
return node;
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @return {Element}
|
||
|
*/
|
||
|
BrowserSpriteSymbol.prototype.render = function render () {
|
||
|
var content = this.stringify();
|
||
|
return parse(wrapInSvgString(content)).childNodes[0];
|
||
|
};
|
||
|
|
||
|
BrowserSpriteSymbol.prototype.unmount = function unmount () {
|
||
|
this.node.parentNode.removeChild(this.node);
|
||
|
};
|
||
|
|
||
|
Object.defineProperties( BrowserSpriteSymbol.prototype, prototypeAccessors );
|
||
|
|
||
|
return BrowserSpriteSymbol;
|
||
|
}(SpriteSymbol));
|
||
|
|
||
|
return BrowserSpriteSymbol;
|
||
|
|
||
|
})));
|