aboutsummaryrefslogtreecommitdiffstats
path: root/src/elements
diff options
context:
space:
mode:
Diffstat (limited to 'src/elements')
-rw-r--r--src/elements/A.js20
-rw-r--r--src/elements/Circle.js14
-rw-r--r--src/elements/ClipPath.js19
-rw-r--r--src/elements/Container.js4
-rw-r--r--src/elements/Defs.js6
-rw-r--r--src/elements/Dom.js101
-rw-r--r--src/elements/Element.js61
-rw-r--r--src/elements/Ellipse.js10
-rw-r--r--src/elements/ForeignObject.js2
-rw-r--r--src/elements/Fragment.js5
-rw-r--r--src/elements/G.js9
-rw-r--r--src/elements/Gradient.js16
-rw-r--r--src/elements/Image.js48
-rw-r--r--src/elements/Line.js18
-rw-r--r--src/elements/Marker.js28
-rw-r--r--src/elements/Mask.js17
-rw-r--r--src/elements/Path.js36
-rw-r--r--src/elements/Pattern.js17
-rw-r--r--src/elements/Polygon.js2
-rw-r--r--src/elements/Polyline.js2
-rw-r--r--src/elements/Rect.js2
-rw-r--r--src/elements/Stop.js4
-rw-r--r--src/elements/Style.js14
-rw-r--r--src/elements/Svg.js26
-rw-r--r--src/elements/Symbol.js2
-rw-r--r--src/elements/Text.js20
-rw-r--r--src/elements/TextPath.js14
-rw-r--r--src/elements/Tspan.js17
-rw-r--r--src/elements/Use.js4
29 files changed, 288 insertions, 250 deletions
diff --git a/src/elements/A.js b/src/elements/A.js
index 173fc92..231954f 100644
--- a/src/elements/A.js
+++ b/src/elements/A.js
@@ -1,24 +1,28 @@
-import { nodeOrNew, register, wrapWithAttrCheck, extend } from '../utils/adopter.js'
+import {
+ nodeOrNew,
+ register,
+ wrapWithAttrCheck,
+ extend
+} from '../utils/adopter.js'
import { registerMethods } from '../utils/methods.js'
import { xlink } from '../modules/core/namespaces.js'
import Container from './Container.js'
import * as containerGeometry from '../modules/core/containerGeometry.js'
export default class A extends Container {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('a', node), attrs)
}
// Link target attribute
- target (target) {
+ target(target) {
return this.attr('target', target)
}
// Link url
- to (url) {
+ to(url) {
return this.attr('href', url, xlink)
}
-
}
extend(A, containerGeometry)
@@ -31,7 +35,7 @@ registerMethods({
})
},
Element: {
- unlink () {
+ unlink() {
const link = this.linker()
if (!link) return this
@@ -48,7 +52,7 @@ registerMethods({
link.remove()
return this
},
- linkTo (url) {
+ linkTo(url) {
// reuse old link if possible
let link = this.linker()
@@ -65,7 +69,7 @@ registerMethods({
return this
},
- linker () {
+ linker() {
const link = this.parent()
if (link && link.node.nodeName.toLowerCase() === 'a') {
return link
diff --git a/src/elements/Circle.js b/src/elements/Circle.js
index 6981b05..5dae51e 100644
--- a/src/elements/Circle.js
+++ b/src/elements/Circle.js
@@ -10,25 +10,25 @@ import SVGNumber from '../types/SVGNumber.js'
import Shape from './Shape.js'
export default class Circle extends Shape {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('circle', node), attrs)
}
- radius (r) {
+ radius(r) {
return this.attr('r', r)
}
// Radius x value
- rx (rx) {
+ rx(rx) {
return this.attr('r', rx)
}
// Alias radius x value
- ry (ry) {
+ ry(ry) {
return this.rx(ry)
}
- size (size) {
+ size(size) {
return this.radius(new SVGNumber(size).divide(2))
}
}
@@ -39,9 +39,7 @@ registerMethods({
Container: {
// Create circle element
circle: wrapWithAttrCheck(function (size = 0) {
- return this.put(new Circle())
- .size(size)
- .move(0, 0)
+ return this.put(new Circle()).size(size).move(0, 0)
})
}
})
diff --git a/src/elements/ClipPath.js b/src/elements/ClipPath.js
index f17428f..747059d 100644
--- a/src/elements/ClipPath.js
+++ b/src/elements/ClipPath.js
@@ -4,12 +4,12 @@ import Container from './Container.js'
import baseFind from '../modules/core/selector.js'
export default class ClipPath extends Container {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('clipPath', node), attrs)
}
// Unclip all clipped elements and remove itself
- remove () {
+ remove() {
// unclip all targets
this.targets().forEach(function (el) {
el.unclip()
@@ -19,7 +19,7 @@ export default class ClipPath extends Container {
return super.remove()
}
- targets () {
+ targets() {
return baseFind('svg [clip-path*=' + this.id() + ']')
}
}
@@ -33,22 +33,23 @@ registerMethods({
},
Element: {
// Distribute clipPath to svg element
- clipper () {
+ clipper() {
return this.reference('clip-path')
},
- clipWith (element) {
+ clipWith(element) {
// use given clip or create a new one
- const clipper = element instanceof ClipPath
- ? element
- : this.parent().clip().add(element)
+ const clipper =
+ element instanceof ClipPath
+ ? element
+ : this.parent().clip().add(element)
// apply mask
return this.attr('clip-path', 'url(#' + clipper.id() + ')')
},
// Unclip element
- unclip () {
+ unclip() {
return this.attr('clip-path', null)
}
}
diff --git a/src/elements/Container.js b/src/elements/Container.js
index 9278435..0f45b6d 100644
--- a/src/elements/Container.js
+++ b/src/elements/Container.js
@@ -2,7 +2,7 @@ import { register } from '../utils/adopter.js'
import Element from './Element.js'
export default class Container extends Element {
- flatten (parent = this, index) {
+ flatten() {
this.each(function () {
if (this instanceof Container) {
return this.flatten().ungroup()
@@ -12,7 +12,7 @@ export default class Container extends Element {
return this
}
- ungroup (parent = this.parent(), index = parent.index(this)) {
+ ungroup(parent = this.parent(), index = parent.index(this)) {
// when parent != this, we want append all elements to the end
index = index === -1 ? parent.children().length : index
diff --git a/src/elements/Defs.js b/src/elements/Defs.js
index 7491ba0..6d9f725 100644
--- a/src/elements/Defs.js
+++ b/src/elements/Defs.js
@@ -2,15 +2,15 @@ import { nodeOrNew, register } from '../utils/adopter.js'
import Container from './Container.js'
export default class Defs extends Container {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('defs', node), attrs)
}
- flatten () {
+ flatten() {
return this
}
- ungroup () {
+ ungroup() {
return this
}
}
diff --git a/src/elements/Dom.js b/src/elements/Dom.js
index 2584a43..604a1ee 100644
--- a/src/elements/Dom.js
+++ b/src/elements/Dom.js
@@ -16,7 +16,7 @@ import List from '../types/List.js'
import attr from '../modules/core/attr.js'
export default class Dom extends EventTarget {
- constructor (node, attrs) {
+ constructor(node, attrs) {
super()
this.node = node
this.type = node.nodeName
@@ -27,11 +27,14 @@ export default class Dom extends EventTarget {
}
// Add given element at a position
- add (element, i) {
+ add(element, i) {
element = makeInstance(element)
// If non-root svg nodes are added we have to remove their namespaces
- if (element.removeNamespace && this.node instanceof globals.window.SVGElement) {
+ if (
+ element.removeNamespace &&
+ this.node instanceof globals.window.SVGElement
+ ) {
element.removeNamespace()
}
@@ -45,19 +48,21 @@ export default class Dom extends EventTarget {
}
// Add element to given container and return self
- addTo (parent, i) {
+ addTo(parent, i) {
return makeInstance(parent).put(this, i)
}
// Returns all child elements
- children () {
- return new List(map(this.node.children, function (node) {
- return adopt(node)
- }))
+ children() {
+ return new List(
+ map(this.node.children, function (node) {
+ return adopt(node)
+ })
+ )
}
// Remove all elements in this container
- clear () {
+ clear() {
// remove children
while (this.node.hasChildNodes()) {
this.node.removeChild(this.node.lastChild)
@@ -67,7 +72,7 @@ export default class Dom extends EventTarget {
}
// Clone element
- clone (deep = true, assignNewIds = true) {
+ clone(deep = true, assignNewIds = true) {
// write dom data to the dom so the clone can pickup the data
this.writeDataToDom()
@@ -81,12 +86,12 @@ export default class Dom extends EventTarget {
}
// Iterates over all children and invokes a given block
- each (block, deep) {
+ each(block, deep) {
const children = this.children()
let i, il
for (i = 0, il = children.length; i < il; i++) {
- block.apply(children[i], [ i, children ])
+ block.apply(children[i], [i, children])
if (deep) {
children[i].each(block, deep)
@@ -96,39 +101,39 @@ export default class Dom extends EventTarget {
return this
}
- element (nodeName, attrs) {
+ element(nodeName, attrs) {
return this.put(new Dom(create(nodeName), attrs))
}
// Get first child
- first () {
+ first() {
return adopt(this.node.firstChild)
}
// Get a element at the given index
- get (i) {
+ get(i) {
return adopt(this.node.childNodes[i])
}
- getEventHolder () {
+ getEventHolder() {
return this.node
}
- getEventTarget () {
+ getEventTarget() {
return this.node
}
// Checks if the given element is a child
- has (element) {
+ has(element) {
return this.index(element) >= 0
}
- html (htmlOrFn, outerHTML) {
+ html(htmlOrFn, outerHTML) {
return this.xml(htmlOrFn, outerHTML, html)
}
// Get / set id
- id (id) {
+ id(id) {
// generate new id if no id set
if (typeof id === 'undefined' && !this.node.id) {
this.node.id = eid(this.type)
@@ -139,24 +144,31 @@ export default class Dom extends EventTarget {
}
// Gets index of given element
- index (element) {
+ index(element) {
return [].slice.call(this.node.childNodes).indexOf(element.node)
}
// Get the last child
- last () {
+ last() {
return adopt(this.node.lastChild)
}
// matches the element vs a css selector
- matches (selector) {
+ matches(selector) {
const el = this.node
- const matcher = el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector || null
+ const matcher =
+ el.matches ||
+ el.matchesSelector ||
+ el.msMatchesSelector ||
+ el.mozMatchesSelector ||
+ el.webkitMatchesSelector ||
+ el.oMatchesSelector ||
+ null
return matcher && matcher.call(el, selector)
}
// Returns the parent element instance
- parent (type) {
+ parent(type) {
let parent = this
// check for parent
@@ -169,26 +181,29 @@ export default class Dom extends EventTarget {
// loop through ancestors if type is given
do {
- if (typeof type === 'string' ? parent.matches(type) : parent instanceof type) return parent
+ if (
+ typeof type === 'string' ? parent.matches(type) : parent instanceof type
+ )
+ return parent
} while ((parent = adopt(parent.node.parentNode)))
return parent
}
// Basically does the same as `add()` but returns the added element instead
- put (element, i) {
+ put(element, i) {
element = makeInstance(element)
this.add(element, i)
return element
}
// Add element to given container and return container
- putIn (parent, i) {
+ putIn(parent, i) {
return makeInstance(parent).add(this, i)
}
// Remove element
- remove () {
+ remove() {
if (this.parent()) {
this.parent().removeElement(this)
}
@@ -197,14 +212,14 @@ export default class Dom extends EventTarget {
}
// Remove a given child
- removeElement (element) {
+ removeElement(element) {
this.node.removeChild(element.node)
return this
}
// Replace this with element
- replace (element) {
+ replace(element) {
element = makeInstance(element)
if (this.node.parentNode) {
@@ -214,7 +229,7 @@ export default class Dom extends EventTarget {
return element
}
- round (precision = 2, map = null) {
+ round(precision = 2, map = null) {
const factor = 10 ** precision
const attrs = this.attr(map)
@@ -229,22 +244,22 @@ export default class Dom extends EventTarget {
}
// Import / Export raw svg
- svg (svgOrFn, outerSVG) {
+ svg(svgOrFn, outerSVG) {
return this.xml(svgOrFn, outerSVG, svg)
}
// Return id on string conversion
- toString () {
+ toString() {
return this.id()
}
- words (text) {
+ words(text) {
// This is faster than removing all children and adding a new one
this.node.textContent = text
return this
}
- wrap (node) {
+ wrap(node) {
const parent = this.parent()
if (!parent) {
@@ -256,7 +271,7 @@ export default class Dom extends EventTarget {
}
// write svgjs data to the dom
- writeDataToDom () {
+ writeDataToDom() {
// dump variables recursively
this.each(function () {
this.writeDataToDom()
@@ -266,7 +281,7 @@ export default class Dom extends EventTarget {
}
// Import / Export raw svg
- xml (xmlOrFn, outerXML, ns) {
+ xml(xmlOrFn, outerXML, ns) {
if (typeof xmlOrFn === 'boolean') {
ns = outerXML
outerXML = xmlOrFn
@@ -312,9 +327,7 @@ export default class Dom extends EventTarget {
}
// Return outer or inner content
- return outerXML
- ? current.node.outerHTML
- : current.node.innerHTML
+ return outerXML ? current.node.outerHTML : current.node.innerHTML
}
// Act as setter if we got a string
@@ -330,16 +343,14 @@ export default class Dom extends EventTarget {
well.innerHTML = xmlOrFn
// Transplant nodes into the fragment
- for (let len = well.children.length; len--;) {
+ for (let len = well.children.length; len--; ) {
fragment.appendChild(well.firstElementChild)
}
const parent = this.parent()
// Add the whole fragment at once
- return outerXML
- ? this.replace(fragment) && parent
- : this.add(fragment)
+ return outerXML ? this.replace(fragment) && parent : this.add(fragment)
}
}
diff --git a/src/elements/Element.js b/src/elements/Element.js
index 2aaeab5..61db7b7 100644
--- a/src/elements/Element.js
+++ b/src/elements/Element.js
@@ -16,7 +16,7 @@ import List from '../types/List.js'
import SVGNumber from '../types/SVGNumber.js'
export default class Element extends Dom {
- constructor (node, attrs) {
+ constructor(node, attrs) {
super(node, attrs)
// initialize data object
@@ -32,61 +32,61 @@ export default class Element extends Dom {
}
// Move element by its center
- center (x, y) {
+ center(x, y) {
return this.cx(x).cy(y)
}
// Move by center over x-axis
- cx (x) {
+ cx(x) {
return x == null
? this.x() + this.width() / 2
: this.x(x - this.width() / 2)
}
// Move by center over y-axis
- cy (y) {
+ cy(y) {
return y == null
? this.y() + this.height() / 2
: this.y(y - this.height() / 2)
}
// Get defs
- defs () {
+ defs() {
const root = this.root()
return root && root.defs()
}
// Relative move over x and y axes
- dmove (x, y) {
+ dmove(x, y) {
return this.dx(x).dy(y)
}
// Relative move over x axis
- dx (x = 0) {
+ dx(x = 0) {
return this.x(new SVGNumber(x).plus(this.x()))
}
// Relative move over y axis
- dy (y = 0) {
+ dy(y = 0) {
return this.y(new SVGNumber(y).plus(this.y()))
}
- getEventHolder () {
+ getEventHolder() {
return this
}
// Set height of element
- height (height) {
+ height(height) {
return this.attr('height', height)
}
// Move element to given x and y values
- move (x, y) {
+ move(x, y) {
return this.x(x).y(y)
}
// return array of all ancestors of given type up to the root svg
- parents (until = this.root()) {
+ parents(until = this.root()) {
const isSelector = typeof until === 'string'
if (!isSelector) {
until = makeInstance(until)
@@ -95,13 +95,13 @@ export default class Element extends Dom {
let parent = this
while (
- (parent = parent.parent())
- && parent.node !== globals.document
- && parent.nodeName !== '#document-fragment') {
-
+ (parent = parent.parent()) &&
+ parent.node !== globals.document &&
+ parent.nodeName !== '#document-fragment'
+ ) {
parents.push(parent)
- if (!isSelector && (parent.node === until.node)) {
+ if (!isSelector && parent.node === until.node) {
break
}
if (isSelector && parent.matches(until)) {
@@ -117,7 +117,7 @@ export default class Element extends Dom {
}
// Get referenced element form attribute value
- reference (attr) {
+ reference(attr) {
attr = this.attr(attr)
if (!attr) return null
@@ -126,33 +126,31 @@ export default class Element extends Dom {
}
// Get parent document
- root () {
+ root() {
const p = this.parent(getClass(root))
return p && p.root()
}
// set given data to the elements data property
- setData (o) {
+ setData(o) {
this.dom = o
return this
}
// Set element size to given width and height
- size (width, height) {
+ size(width, height) {
const p = proportionalSize(this, width, height)
- return this
- .width(new SVGNumber(p.width))
- .height(new SVGNumber(p.height))
+ return this.width(new SVGNumber(p.width)).height(new SVGNumber(p.height))
}
// Set width of element
- width (width) {
+ width(width) {
return this.attr('width', width)
}
// write svgjs data to the dom
- writeDataToDom () {
+ writeDataToDom() {
// remove previously set data
this.node.removeAttribute('svgjs:data')
@@ -164,18 +162,23 @@ export default class Element extends Dom {
}
// Move over x-axis
- x (x) {
+ x(x) {
return this.attr('x', x)
}
// Move over y-axis
- y (y) {
+ y(y) {
return this.attr('y', y)
}
}
extend(Element, {
- bbox, rbox, inside, point, ctm, screenCTM
+ bbox,
+ rbox,
+ inside,
+ point,
+ ctm,
+ screenCTM
})
register(Element, 'Element')
diff --git a/src/elements/Ellipse.js b/src/elements/Ellipse.js
index 7f4e853..3f8b04b 100644
--- a/src/elements/Ellipse.js
+++ b/src/elements/Ellipse.js
@@ -11,16 +11,16 @@ import Shape from './Shape.js'
import * as circled from '../modules/core/circled.js'
export default class Ellipse extends Shape {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('ellipse', node), attrs)
}
- size (width, height) {
+ size(width, height) {
const p = proportionalSize(this, width, height)
- return this
- .rx(new SVGNumber(p.width).divide(2))
- .ry(new SVGNumber(p.height).divide(2))
+ return this.rx(new SVGNumber(p.width).divide(2)).ry(
+ new SVGNumber(p.height).divide(2)
+ )
}
}
diff --git a/src/elements/ForeignObject.js b/src/elements/ForeignObject.js
index 0a417b0..a4148d5 100644
--- a/src/elements/ForeignObject.js
+++ b/src/elements/ForeignObject.js
@@ -3,7 +3,7 @@ import { registerMethods } from '../utils/methods.js'
import Element from './Element.js'
export default class ForeignObject extends Element {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('foreignObject', node), attrs)
}
}
diff --git a/src/elements/Fragment.js b/src/elements/Fragment.js
index d2c4764..ece3046 100644
--- a/src/elements/Fragment.js
+++ b/src/elements/Fragment.js
@@ -3,12 +3,12 @@ import { globals } from '../utils/window.js'
import { register, create } from '../utils/adopter.js'
class Fragment extends Dom {
- constructor (node = globals.document.createDocumentFragment()) {
+ constructor(node = globals.document.createDocumentFragment()) {
super(node)
}
// Import / Export raw xml
- xml (xmlOrFn, outerXML, ns) {
+ xml(xmlOrFn, outerXML, ns) {
if (typeof xmlOrFn === 'boolean') {
ns = outerXML
outerXML = xmlOrFn
@@ -27,7 +27,6 @@ class Fragment extends Dom {
// Act as setter if we got a string
return super.xml(xmlOrFn, false, ns)
}
-
}
register(Fragment, 'Fragment')
diff --git a/src/elements/G.js b/src/elements/G.js
index b3a999e..4d3b03c 100644
--- a/src/elements/G.js
+++ b/src/elements/G.js
@@ -1,10 +1,15 @@
-import { nodeOrNew, register, wrapWithAttrCheck, extend } from '../utils/adopter.js'
+import {
+ nodeOrNew,
+ register,
+ wrapWithAttrCheck,
+ extend
+} from '../utils/adopter.js'
import { registerMethods } from '../utils/methods.js'
import Container from './Container.js'
import * as containerGeometry from '../modules/core/containerGeometry.js'
export default class G extends Container {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('g', node), attrs)
}
}
diff --git a/src/elements/Gradient.js b/src/elements/Gradient.js
index d3fa15b..1631c14 100644
--- a/src/elements/Gradient.js
+++ b/src/elements/Gradient.js
@@ -11,7 +11,7 @@ import baseFind from '../modules/core/selector.js'
import * as gradiented from '../modules/core/gradiented.js'
export default class Gradient extends Container {
- constructor (type, attrs) {
+ constructor(type, attrs) {
super(
nodeOrNew(type + 'Gradient', typeof type === 'string' ? null : type),
attrs
@@ -19,26 +19,26 @@ export default class Gradient extends Container {
}
// custom attr to handle transform
- attr (a, b, c) {
+ attr(a, b, c) {
if (a === 'transform') a = 'gradientTransform'
return super.attr(a, b, c)
}
- bbox () {
+ bbox() {
return new Box()
}
- targets () {
+ targets() {
return baseFind('svg [fill*=' + this.id() + ']')
}
// Alias string conversion to fill
- toString () {
+ toString() {
return this.url()
}
// Update gradient
- update (block) {
+ update(block) {
// remove all stops
this.clear()
@@ -51,7 +51,7 @@ export default class Gradient extends Container {
}
// Return the fill id
- url () {
+ url() {
return 'url(#' + this.id() + ')'
}
}
@@ -61,7 +61,7 @@ extend(Gradient, gradiented)
registerMethods({
Container: {
// Create gradient element in defs
- gradient (...args) {
+ gradient(...args) {
return this.defs().gradient(...args)
}
},
diff --git a/src/elements/Image.js b/src/elements/Image.js
index c51bc9a..080da16 100644
--- a/src/elements/Image.js
+++ b/src/elements/Image.js
@@ -9,35 +9,40 @@ import Shape from './Shape.js'
import { globals } from '../utils/window.js'
export default class Image extends Shape {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('image', node), attrs)
}
// (re)load image
- load (url, callback) {
+ load(url, callback) {
if (!url) return this
const img = new globals.window.Image()
- on(img, 'load', function (e) {
- const p = this.parent(Pattern)
+ on(
+ img,
+ 'load',
+ function (e) {
+ const p = this.parent(Pattern)
- // ensure image size
- if (this.width() === 0 && this.height() === 0) {
- this.size(img.width, img.height)
- }
+ // ensure image size
+ if (this.width() === 0 && this.height() === 0) {
+ this.size(img.width, img.height)
+ }
- if (p instanceof Pattern) {
- // ensure pattern size if not set
- if (p.width() === 0 && p.height() === 0) {
- p.size(this.width(), this.height())
+ if (p instanceof Pattern) {
+ // ensure pattern size if not set
+ if (p.width() === 0 && p.height() === 0) {
+ p.size(this.width(), this.height())
+ }
}
- }
- if (typeof callback === 'function') {
- callback.call(this, e)
- }
- }, this)
+ if (typeof callback === 'function') {
+ callback.call(this, e)
+ }
+ },
+ this
+ )
on(img, 'load error', function () {
// dont forget to unbind memory leaking events
@@ -57,9 +62,12 @@ registerAttrHook(function (attr, val, _this) {
}
if (val instanceof Image) {
- val = _this.root().defs().pattern(0, 0, (pattern) => {
- pattern.add(val)
- })
+ val = _this
+ .root()
+ .defs()
+ .pattern(0, 0, (pattern) => {
+ pattern.add(val)
+ })
}
return val
diff --git a/src/elements/Line.js b/src/elements/Line.js
index 9350a23..0dab35d 100644
--- a/src/elements/Line.js
+++ b/src/elements/Line.js
@@ -12,25 +12,25 @@ import * as pointed from '../modules/core/pointed.js'
export default class Line extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('line', node), attrs)
}
// Get array
- array () {
+ array() {
return new PointArray([
- [ this.attr('x1'), this.attr('y1') ],
- [ this.attr('x2'), this.attr('y2') ]
+ [this.attr('x1'), this.attr('y1')],
+ [this.attr('x2'), this.attr('y2')]
])
}
// Move by left top corner
- move (x, y) {
+ move(x, y) {
return this.attr(this.array().move(x, y).toLine())
}
// Overwrite native plot() method
- plot (x1, y1, x2, y2) {
+ plot(x1, y1, x2, y2) {
if (x1 == null) {
return this.array()
} else if (typeof y1 !== 'undefined') {
@@ -43,7 +43,7 @@ export default class Line extends Shape {
}
// Set element size to given width and height
- size (width, height) {
+ size(width, height) {
const p = proportionalSize(this, width, height)
return this.attr(this.array().size(p.width, p.height).toLine())
}
@@ -58,8 +58,8 @@ registerMethods({
// make sure plot is called as a setter
// x1 is not necessarily a number, it can also be an array, a string and a PointArray
return Line.prototype.plot.apply(
- this.put(new Line())
- , args[0] != null ? args : [ 0, 0, 0, 0 ]
+ this.put(new Line()),
+ args[0] != null ? args : [0, 0, 0, 0]
)
})
}
diff --git a/src/elements/Marker.js b/src/elements/Marker.js
index d6f98c8..5ddf802 100644
--- a/src/elements/Marker.js
+++ b/src/elements/Marker.js
@@ -4,31 +4,31 @@ import Container from './Container.js'
export default class Marker extends Container {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('marker', node), attrs)
}
// Set height of element
- height (height) {
+ height(height) {
return this.attr('markerHeight', height)
}
- orient (orient) {
+ orient(orient) {
return this.attr('orient', orient)
}
// Set marker refX and refY
- ref (x, y) {
+ ref(x, y) {
return this.attr('refX', x).attr('refY', y)
}
// Return the fill id
- toString () {
+ toString() {
return 'url(#' + this.id() + ')'
}
// Update marker
- update (block) {
+ update(block) {
// remove all content
this.clear()
@@ -41,15 +41,14 @@ export default class Marker extends Container {
}
// Set width of element
- width (width) {
+ width(width) {
return this.attr('markerWidth', width)
}
-
}
registerMethods({
Container: {
- marker (...args) {
+ marker(...args) {
// Create marker element in defs
return this.defs().marker(...args)
}
@@ -68,17 +67,18 @@ registerMethods({
},
marker: {
// Create and attach markers
- marker (marker, width, height, block) {
- let attr = [ 'marker' ]
+ marker(marker, width, height, block) {
+ let attr = ['marker']
// Build attribute name
if (marker !== 'all') attr.push(marker)
attr = attr.join('-')
// Set marker attribute
- marker = arguments[1] instanceof Marker
- ? arguments[1]
- : this.defs().marker(width, height, block)
+ marker =
+ arguments[1] instanceof Marker
+ ? arguments[1]
+ : this.defs().marker(width, height, block)
return this.attr(attr, marker)
}
diff --git a/src/elements/Mask.js b/src/elements/Mask.js
index 5b462f7..b8a2c99 100644
--- a/src/elements/Mask.js
+++ b/src/elements/Mask.js
@@ -5,12 +5,12 @@ import baseFind from '../modules/core/selector.js'
export default class Mask extends Container {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('mask', node), attrs)
}
// Unmask all masked elements and remove itself
- remove () {
+ remove() {
// unmask all targets
this.targets().forEach(function (el) {
el.unmask()
@@ -20,7 +20,7 @@ export default class Mask extends Container {
return super.remove()
}
- targets () {
+ targets() {
return baseFind('svg [mask*=' + this.id() + ']')
}
}
@@ -33,22 +33,21 @@ registerMethods({
},
Element: {
// Distribute mask to svg element
- masker () {
+ masker() {
return this.reference('mask')
},
- maskWith (element) {
+ maskWith(element) {
// use given mask or create a new one
- const masker = element instanceof Mask
- ? element
- : this.parent().mask().add(element)
+ const masker =
+ element instanceof Mask ? element : this.parent().mask().add(element)
// apply mask
return this.attr('mask', 'url(#' + masker.id() + ')')
},
// Unmask element
- unmask () {
+ unmask() {
return this.attr('mask', null)
}
}
diff --git a/src/elements/Path.js b/src/elements/Path.js
index 2aa0a51..ec9a19f 100644
--- a/src/elements/Path.js
+++ b/src/elements/Path.js
@@ -6,59 +6,65 @@ import Shape from './Shape.js'
export default class Path extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('path', node), attrs)
}
// Get array
- array () {
+ array() {
return this._array || (this._array = new PathArray(this.attr('d')))
}
// Clear array cache
- clear () {
+ clear() {
delete this._array
return this
}
// Set height of element
- height (height) {
- return height == null ? this.bbox().height : this.size(this.bbox().width, height)
+ height(height) {
+ return height == null
+ ? this.bbox().height
+ : this.size(this.bbox().width, height)
}
// Move by left top corner
- move (x, y) {
+ move(x, y) {
return this.attr('d', this.array().move(x, y))
}
// Plot new path
- plot (d) {
- return (d == null)
+ plot(d) {
+ return d == null
? this.array()
- : this.clear().attr('d', typeof d === 'string' ? d : (this._array = new PathArray(d)))
+ : this.clear().attr(
+ 'd',
+ typeof d === 'string' ? d : (this._array = new PathArray(d))
+ )
}
// Set element size to given width and height
- size (width, height) {
+ size(width, height) {
const p = proportionalSize(this, width, height)
return this.attr('d', this.array().size(p.width, p.height))
}
// Set width of element
- width (width) {
- return width == null ? this.bbox().width : this.size(width, this.bbox().height)
+ width(width) {
+ return width == null
+ ? this.bbox().width
+ : this.size(width, this.bbox().height)
}
// Move by left top corner over x-axis
- x (x) {
+ x(x) {
return x == null ? this.bbox().x : this.move(x, this.bbox().y)
}
// Move by left top corner over y-axis
- y (y) {
+ y(y) {
return y == null ? this.bbox().y : this.move(this.bbox().x, y)
}
-
}
// Define morphable array
diff --git a/src/elements/Pattern.js b/src/elements/Pattern.js
index 18a75e8..b42a83a 100644
--- a/src/elements/Pattern.js
+++ b/src/elements/Pattern.js
@@ -6,31 +6,31 @@ import baseFind from '../modules/core/selector.js'
export default class Pattern extends Container {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('pattern', node), attrs)
}
// custom attr to handle transform
- attr (a, b, c) {
+ attr(a, b, c) {
if (a === 'transform') a = 'patternTransform'
return super.attr(a, b, c)
}
- bbox () {
+ bbox() {
return new Box()
}
- targets () {
+ targets() {
return baseFind('svg [fill*=' + this.id() + ']')
}
// Alias string conversion to fill
- toString () {
+ toString() {
return this.url()
}
// Update pattern by rebuilding
- update (block) {
+ update(block) {
// remove content
this.clear()
@@ -43,16 +43,15 @@ export default class Pattern extends Container {
}
// Return the fill id
- url () {
+ url() {
return 'url(#' + this.id() + ')'
}
-
}
registerMethods({
Container: {
// Create pattern element in defs
- pattern (...args) {
+ pattern(...args) {
return this.defs().pattern(...args)
}
},
diff --git a/src/elements/Polygon.js b/src/elements/Polygon.js
index 0c99aa7..d64dcb3 100644
--- a/src/elements/Polygon.js
+++ b/src/elements/Polygon.js
@@ -12,7 +12,7 @@ import * as poly from '../modules/core/poly.js'
export default class Polygon extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('polygon', node), attrs)
}
}
diff --git a/src/elements/Polyline.js b/src/elements/Polyline.js
index e390da3..2f063f2 100644
--- a/src/elements/Polyline.js
+++ b/src/elements/Polyline.js
@@ -12,7 +12,7 @@ import * as poly from '../modules/core/poly.js'
export default class Polyline extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('polyline', node), attrs)
}
}
diff --git a/src/elements/Rect.js b/src/elements/Rect.js
index 0ed85fc..749cf6d 100644
--- a/src/elements/Rect.js
+++ b/src/elements/Rect.js
@@ -10,7 +10,7 @@ import Shape from './Shape.js'
export default class Rect extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('rect', node), attrs)
}
}
diff --git a/src/elements/Stop.js b/src/elements/Stop.js
index d29090c..193256e 100644
--- a/src/elements/Stop.js
+++ b/src/elements/Stop.js
@@ -4,12 +4,12 @@ import SVGNumber from '../types/SVGNumber.js'
import { registerMethods } from '../utils/methods.js'
export default class Stop extends Element {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('stop', node), attrs)
}
// add color stops
- update (o) {
+ update(o) {
if (typeof o === 'number' || o instanceof SVGNumber) {
o = {
offset: arguments[0],
diff --git a/src/elements/Style.js b/src/elements/Style.js
index f7c3c57..fc1a27e 100644
--- a/src/elements/Style.js
+++ b/src/elements/Style.js
@@ -3,7 +3,7 @@ import { registerMethods } from '../utils/methods.js'
import { unCamelCase } from '../utils/utils.js'
import Element from './Element.js'
-function cssRule (selector, rule) {
+function cssRule(selector, rule) {
if (!selector) return ''
if (!rule) return selector
@@ -19,16 +19,16 @@ function cssRule (selector, rule) {
}
export default class Style extends Element {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('style', node), attrs)
}
- addText (w = '') {
+ addText(w = '') {
this.node.textContent += w
return this
}
- font (name, src, params = {}) {
+ font(name, src, params = {}) {
return this.rule('@font-face', {
fontFamily: name,
src: src,
@@ -36,16 +36,16 @@ export default class Style extends Element {
})
}
- rule (selector, obj) {
+ rule(selector, obj) {
return this.addText(cssRule(selector, obj))
}
}
registerMethods('Dom', {
- style (selector, obj) {
+ style(selector, obj) {
return this.put(new Style()).rule(selector, obj)
},
- fontface (name, src, params) {
+ fontface(name, src, params) {
return this.put(new Style()).font(name, src, params)
}
})
diff --git a/src/elements/Svg.js b/src/elements/Svg.js
index acddf34..7b36daa 100644
--- a/src/elements/Svg.js
+++ b/src/elements/Svg.js
@@ -11,34 +11,35 @@ import Defs from './Defs.js'
import { globals } from '../utils/window.js'
export default class Svg extends Container {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('svg', node), attrs)
this.namespace()
}
// Creates and returns defs element
- defs () {
+ defs() {
if (!this.isRoot()) return this.root().defs()
- return adopt(this.node.querySelector('defs'))
- || this.put(new Defs())
+ return adopt(this.node.querySelector('defs')) || this.put(new Defs())
}
- isRoot () {
- return !this.node.parentNode
- || (!(this.node.parentNode instanceof globals.window.SVGElement) && this.node.parentNode.nodeName !== '#document-fragment')
+ isRoot() {
+ return (
+ !this.node.parentNode ||
+ (!(this.node.parentNode instanceof globals.window.SVGElement) &&
+ this.node.parentNode.nodeName !== '#document-fragment')
+ )
}
// Add namespaces
- namespace () {
+ namespace() {
if (!this.isRoot()) return this.root().namespace()
- return this
- .attr({ xmlns: svg, version: '1.1' })
+ return this.attr({ xmlns: svg, version: '1.1' })
.attr('xmlns:xlink', xlink, xmlns)
.attr('xmlns:svgjs', svgjs, xmlns)
}
- removeNamespace () {
+ removeNamespace() {
return this.attr({ xmlns: null, version: null })
.attr('xmlns:xlink', null, xmlns)
.attr('xmlns:svgjs', null, xmlns)
@@ -46,11 +47,10 @@ export default class Svg extends Container {
// Check if this is a root svg
// If not, call root() from this element
- root () {
+ root() {
if (this.isRoot()) return this
return super.root()
}
-
}
registerMethods({
diff --git a/src/elements/Symbol.js b/src/elements/Symbol.js
index d2a98ac..28ad206 100644
--- a/src/elements/Symbol.js
+++ b/src/elements/Symbol.js
@@ -4,7 +4,7 @@ import Container from './Container.js'
export default class Symbol extends Container {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('symbol', node), attrs)
}
}
diff --git a/src/elements/Text.js b/src/elements/Text.js
index f716f83..39371f6 100644
--- a/src/elements/Text.js
+++ b/src/elements/Text.js
@@ -13,7 +13,7 @@ import * as textable from '../modules/core/textable.js'
export default class Text extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('text', node), attrs)
this.dom.leading = new SVGNumber(1.3) // store leading value for rebuilding
@@ -22,7 +22,7 @@ export default class Text extends Shape {
}
// Set / get leading
- leading (value) {
+ leading(value) {
// act as getter
if (value == null) {
return this.dom.leading
@@ -35,7 +35,7 @@ export default class Text extends Shape {
}
// Rebuild appearance type
- rebuild (rebuild) {
+ rebuild(rebuild) {
// store new rebuild flag if given
if (typeof rebuild === 'boolean') {
this._rebuild = rebuild
@@ -48,7 +48,8 @@ export default class Text extends Shape {
const leading = this.dom.leading
this.each(function (i) {
- const fontSize = globals.window.getComputedStyle(this.node)
+ const fontSize = globals.window
+ .getComputedStyle(this.node)
.getPropertyValue('font-size')
const dy = leading * new SVGNumber(fontSize)
@@ -72,14 +73,14 @@ export default class Text extends Shape {
}
// overwrite method from parent to set data properly
- setData (o) {
+ setData(o) {
this.dom = o
this.dom.leading = new SVGNumber(o.leading || 1.3)
return this
}
// Set the text content
- text (text) {
+ text(text) {
// act as getter
if (text === undefined) {
const children = this.node.childNodes
@@ -94,7 +95,11 @@ export default class Text extends Shape {
}
// add newline if its not the first child and newLined is set to true
- if (i !== firstLine && children[i].nodeType !== 3 && adopt(children[i]).dom.newLined === true) {
+ if (
+ i !== firstLine &&
+ children[i].nodeType !== 3 &&
+ adopt(children[i]).dom.newLined === true
+ ) {
text += '\n'
}
@@ -124,7 +129,6 @@ export default class Text extends Shape {
// disable build mode and rebuild lines
return this.build(false).rebuild()
}
-
}
extend(Text, textable)
diff --git a/src/elements/TextPath.js b/src/elements/TextPath.js
index 2af73e7..89c6c42 100644
--- a/src/elements/TextPath.js
+++ b/src/elements/TextPath.js
@@ -8,19 +8,19 @@ import baseFind from '../modules/core/selector.js'
export default class TextPath extends Text {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('textPath', node), attrs)
}
// return the array of the path track element
- array () {
+ array() {
const track = this.track()
return track ? track.array() : null
}
// Plot path if any
- plot (d) {
+ plot(d) {
const track = this.track()
let pathArray = null
@@ -28,11 +28,11 @@ export default class TextPath extends Text {
pathArray = track.plot(d)
}
- return (d == null) ? pathArray : this
+ return d == null ? pathArray : this
}
// Get the path element
- track () {
+ track() {
return this.reference('href')
}
}
@@ -75,7 +75,7 @@ registerMethods({
}),
// Get the textPath children
- textPath () {
+ textPath() {
return this.findOne('textPath')
}
},
@@ -91,7 +91,7 @@ registerMethods({
return text.path(this)
}),
- targets () {
+ targets() {
return baseFind('svg textPath').filter((node) => {
return (node.attr('href') || '').includes(this.id())
})
diff --git a/src/elements/Tspan.js b/src/elements/Tspan.js
index 73cd52d..12b49f8 100644
--- a/src/elements/Tspan.js
+++ b/src/elements/Tspan.js
@@ -13,23 +13,23 @@ import * as textable from '../modules/core/textable.js'
export default class Tspan extends Shape {
// Initialize node
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('tspan', node), attrs)
this._build = false // disable build mode for adding multiple lines
}
// Shortcut dx
- dx (dx) {
+ dx(dx) {
return this.attr('dx', dx)
}
// Shortcut dy
- dy (dy) {
+ dy(dy) {
return this.attr('dy', dy)
}
// Create new line
- newLine () {
+ newLine() {
// mark new line
this.dom.newLined = true
@@ -43,7 +43,8 @@ export default class Tspan extends Shape {
const i = text.index(this)
- const fontSize = globals.window.getComputedStyle(this.node)
+ const fontSize = globals.window
+ .getComputedStyle(this.node)
.getPropertyValue('font-size')
const dy = text.dom.leading * new SVGNumber(fontSize)
@@ -52,8 +53,9 @@ export default class Tspan extends Shape {
}
// Set text content
- text (text) {
- if (text == null) return this.node.textContent + (this.dom.newLined ? '\n' : '')
+ text(text) {
+ if (text == null)
+ return this.node.textContent + (this.dom.newLined ? '\n' : '')
if (typeof text === 'function') {
this.clear().build(true)
@@ -65,7 +67,6 @@ export default class Tspan extends Shape {
return this
}
-
}
extend(Tspan, textable)
diff --git a/src/elements/Use.js b/src/elements/Use.js
index 30d9436..e92dd48 100644
--- a/src/elements/Use.js
+++ b/src/elements/Use.js
@@ -4,12 +4,12 @@ import { xlink } from '../modules/core/namespaces.js'
import Shape from './Shape.js'
export default class Use extends Shape {
- constructor (node, attrs = node) {
+ constructor(node, attrs = node) {
super(nodeOrNew('use', node), attrs)
}
// Use element as a reference
- use (element, file) {
+ use(element, file) {
// Set lined element
return this.attr('href', (file || '') + '#' + element, xlink)
}