diff options
Diffstat (limited to 'src/elements/Dom.js')
| -rw-r--r-- | src/elements/Dom.js | 266 |
1 files changed, 85 insertions, 181 deletions
diff --git a/src/elements/Dom.js b/src/elements/Dom.js index f3ea467..566008c 100644 --- a/src/elements/Dom.js +++ b/src/elements/Dom.js @@ -15,294 +15,217 @@ import List from '../types/List.js' import attr from '../modules/core/attr.js' export default class Dom extends EventTarget { - - constructor ( node, attrs ) { - - super( node ) + constructor (node, attrs) { + super(node) this.node = node this.type = node.nodeName - if ( attrs && node !== attrs ) { - - this.attr( attrs ) - + if (attrs && node !== attrs) { + this.attr(attrs) } - } // Add given element at a position - add ( element, i ) { - - element = makeInstance( element ) - - if ( i == null ) { - - this.node.appendChild( element.node ) - - } else if ( element.node !== this.node.childNodes[i] ) { - - this.node.insertBefore( element.node, this.node.childNodes[i] ) + add (element, i) { + element = makeInstance(element) + if (i == null) { + this.node.appendChild(element.node) + } else if (element.node !== this.node.childNodes[i]) { + this.node.insertBefore(element.node, this.node.childNodes[i]) } return this - } // Add element to given container and return self - addTo ( parent ) { - - return makeInstance( parent ).put( this ) - + addTo (parent) { + return makeInstance(parent).put(this) } // Returns all child elements children () { - - return new List( map( this.node.children, function ( node ) { - - return adopt( node ) - - } ) ) - + return new List(map(this.node.children, function (node) { + return adopt(node) + })) } // Remove all elements in this container clear () { - // remove children - while ( this.node.hasChildNodes() ) { - - this.node.removeChild( this.node.lastChild ) - + while (this.node.hasChildNodes()) { + this.node.removeChild(this.node.lastChild) } // remove defs reference delete this._defs return this - } // Clone element clone () { - // write dom data to the dom so the clone can pickup the data this.writeDataToDom() // clone element and assign new id - return assignNewId( this.node.cloneNode( true ) ) - + return assignNewId(this.node.cloneNode(true)) } // Iterates over all children and invokes a given block - each ( block, deep ) { - + each (block, deep) { var children = this.children() var i, il - for ( i = 0, il = children.length; i < il; i++ ) { - - block.apply( children[i], [ i, children ] ) - - if ( deep ) { - - children[i].each( block, deep ) + for (i = 0, il = children.length; i < il; i++) { + block.apply(children[i], [ i, children ]) + if (deep) { + children[i].each(block, deep) } - } return this - } // Get first child first () { - - return adopt( this.node.firstChild ) - + return adopt(this.node.firstChild) } // Get a element at the given index - get ( i ) { - - return adopt( this.node.childNodes[i] ) - + get (i) { + return adopt(this.node.childNodes[i]) } getEventHolder () { - return this.node - } getEventTarget () { - return this.node - } // Checks if the given element is a child - has ( element ) { - - return this.index( element ) >= 0 - + has (element) { + return this.index(element) >= 0 } // 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 ) - + if (typeof id === 'undefined' && !this.node.id) { + this.node.id = eid(this.type) } // dont't set directly width this.node.id to make `null` work correctly - return this.attr( 'id', id ) - + return this.attr('id', id) } // Gets index of given element - index ( element ) { - - return [].slice.call( this.node.childNodes ).indexOf( element.node ) - + index (element) { + return [].slice.call(this.node.childNodes).indexOf(element.node) } // Get the last child last () { - - return adopt( this.node.lastChild ) - + return adopt(this.node.lastChild) } // matches the element vs a css selector - matches ( selector ) { - + matches (selector) { const el = this.node - return ( el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector ).call( el, selector ) - + return (el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector).call(el, selector) } // Returns the parent element instance - parent ( type ) { - + parent (type) { var parent = this // check for parent - if ( !parent.node.parentNode ) return null + if (!parent.node.parentNode) return null // get parent element - parent = adopt( parent.node.parentNode ) + parent = adopt(parent.node.parentNode) - if ( !type ) return parent + if (!type) return parent // loop trough ancestors if type is given - while ( parent && parent.node instanceof globals.window.SVGElement ) { // FIXME: That shouldnt be neccessary - - if ( typeof type === 'string' ? parent.matches( type ) : parent instanceof type ) return parent - parent = adopt( parent.node.parentNode ) - + while (parent && parent.node instanceof globals.window.SVGElement) { // FIXME: That shouldnt be neccessary + if (typeof type === 'string' ? parent.matches(type) : parent instanceof type) return parent + parent = adopt(parent.node.parentNode) } - } // Basically does the same as `add()` but returns the added element instead - put ( element, i ) { - - this.add( element, i ) + put (element, i) { + this.add(element, i) return element - } // Add element to given container and return container - putIn ( parent ) { - - return makeInstance( parent ).add( this ) - + putIn (parent) { + return makeInstance(parent).add(this) } // Remove element remove () { - - if ( this.parent() ) { - - this.parent().removeElement( this ) - + if (this.parent()) { + this.parent().removeElement(this) } return this - } // Remove a given child - removeElement ( element ) { - - this.node.removeChild( element.node ) + removeElement (element) { + this.node.removeChild(element.node) return this - } // Replace this with element - replace ( element ) { - - element = makeInstance( element ) - this.node.parentNode.replaceChild( element.node, this.node ) + replace (element) { + element = makeInstance(element) + this.node.parentNode.replaceChild(element.node, this.node) return element - } - round ( precision = 2, map ) { - + round (precision = 2, map) { const factor = 10 ** precision const attrs = this.attr() // If we have no map, build one from attrs - if ( !map ) { - - map = Object.keys( attrs ) - + if (!map) { + map = Object.keys(attrs) } // Holds rounded attributes const newAttrs = {} - map.forEach( ( key ) => { - - newAttrs[key] = Math.round( attrs[key] * factor ) / factor + map.forEach((key) => { + newAttrs[key] = Math.round(attrs[key] * factor) / factor + }) - } ) - - this.attr( newAttrs ) + this.attr(newAttrs) return this - } // Return id on string conversion toString () { - return this.id() - } // Import raw svg - svg ( svgOrFn, outerHTML ) { - + svg (svgOrFn, outerHTML) { var well, len, fragment - if ( svgOrFn === false ) { - + if (svgOrFn === false) { outerHTML = false svgOrFn = null - } // act as getter if no svg string is given - if ( svgOrFn == null || typeof svgOrFn === 'function' ) { - + if (svgOrFn == null || typeof svgOrFn === 'function') { // The default for exports is, that the outerNode is included outerHTML = outerHTML == null ? true : outerHTML @@ -311,49 +234,38 @@ export default class Dom extends EventTarget { let current = this // An export modifier was passed - if ( svgOrFn != null ) { - - current = adopt( current.node.cloneNode( true ) ) + if (svgOrFn != null) { + current = adopt(current.node.cloneNode(true)) // If the user wants outerHTML we need to process this node, too - if ( outerHTML ) { - - let result = svgOrFn( current ) + if (outerHTML) { + let result = svgOrFn(current) current = result || current // The user does not want this node? Well, then he gets nothing - if ( result === false ) return '' - + if (result === false) return '' } // Deep loop through all children and apply modifier - current.each( function () { - - let result = svgOrFn( this ) + current.each(function () { + let result = svgOrFn(this) let _this = result || this // If modifier returns false, discard node - if ( result === false ) { - + if (result === false) { this.remove() // If modifier returns new node, use it - - } else if ( result && this !== _this ) { - - this.replace( _this ) - + } else if (result && this !== _this) { + this.replace(_this) } - - }, true ) - + }, true) } // Return outer or inner content return outerHTML ? current.node.outerHTML : current.node.innerHTML - } // Act as setter if we got a string @@ -362,41 +274,33 @@ export default class Dom extends EventTarget { outerHTML = outerHTML == null ? false : outerHTML // Create temporary holder - well = globals.document.createElementNS( ns, 'svg' ) + well = globals.document.createElementNS(ns, 'svg') fragment = globals.document.createDocumentFragment() // Dump raw svg well.innerHTML = svgOrFn // Transplant nodes into the fragment - for ( len = well.children.length; len--; ) { - - fragment.appendChild( well.firstElementChild ) - + for (len = well.children.length; len--;) { + fragment.appendChild(well.firstElementChild) } // Add the whole fragment at once return outerHTML - ? this.replace( fragment ) - : this.add( fragment ) - + ? this.replace(fragment) + : this.add(fragment) } // write svgjs data to the dom writeDataToDom () { - // dump variables recursively - this.each( function () { - + this.each(function () { this.writeDataToDom() - - } ) + }) return this - } - } -extend( Dom, { attr, find } ) -register( Dom ) +extend(Dom, { attr, find }) +register(Dom) |