diff options
Diffstat (limited to 'src/elements/ClipPath.js')
-rw-r--r-- | src/elements/ClipPath.js | 50 |
1 files changed, 34 insertions, 16 deletions
diff --git a/src/elements/ClipPath.js b/src/elements/ClipPath.js index e545baa..199ee5b 100644 --- a/src/elements/ClipPath.js +++ b/src/elements/ClipPath.js @@ -4,54 +4,72 @@ import Container from './Container.js' import baseFind from '../modules/core/selector.js' export default class ClipPath extends Container { - constructor (node) { - super(nodeOrNew('clipPath', node), node) + + constructor ( node ) { + + super( nodeOrNew( 'clipPath', node ), node ) + } // Unclip all clipped elements and remove itself remove () { + // unclip all targets - this.targets().forEach(function (el) { + this.targets().forEach( function ( el ) { + el.unclip() - }) + + } ) // remove clipPath from parent return super.remove() + } targets () { - return baseFind('svg [clip-path*="' + this.id() + '"]') + + return baseFind( 'svg [clip-path*="' + this.id() + '"]' ) + } + } -registerMethods({ +registerMethods( { Container: { // Create clipping element - clip: wrapWithAttrCheck(function () { - return this.defs().put(new ClipPath()) - }) + clip: wrapWithAttrCheck( function () { + + return this.defs().put( new ClipPath() ) + + } ) }, Element: { // Distribute clipPath to svg element - clipWith (element) { + clipWith ( element ) { + // use given clip or create a new one let clipper = element instanceof ClipPath ? element - : this.parent().clip().add(element) + : this.parent().clip().add( element ) // apply mask - return this.attr('clip-path', 'url("#' + clipper.id() + '")') + return this.attr( 'clip-path', 'url("#' + clipper.id() + '")' ) + }, // Unclip element unclip () { - return this.attr('clip-path', null) + + return this.attr( 'clip-path', null ) + }, clipper () { - return this.reference('clip-path') + + return this.reference( 'clip-path' ) + } } -}) +} ) -register(ClipPath) +register( ClipPath ) |