/**
 * Created by Hendrik Strobelt (hendrik.strobelt.com) on 12/3/16.
 */ import * as d3 from 'd3' ; import { D3Sel , Util } from "../etc/Util" ; import { SimpleEventHandler } from "../etc/SimpleEventHandler" ; import { SVG } from "../etc/SVGplus" ; export abstract class VComponent < DataInterface > { /**
     * The static property that contains all class related events.
     * Should be overwritten and event strings have to be unique!!
     */ static events : { } = { noEvent : 'VComponent_noEvent' } ; /**
     * set of ALL options and their defaults
     * Example:
     * {
        pos: {x: 10, y: 10},
        // List of Events that are ONLY handled globally:
        globalExclusiveEvents: []
    };
     *
     */ protected id : string ; protected parent : D3Sel ; protected abstract options : { [ key ] : any ; } ; protected base : D3Sel ; protected layers : { main ? : D3Sel ; fg ? : D3Sel ; bg ? : D3Sel ; [ key ] : D3Sel ; } ; protected eventHandler : SimpleEventHandler ; protected _visibility : { hidden : boolean ; hideElement ? : D3Sel | null ; [ key ] : any ; } ; protected data : DataInterface ; protected renderData : any ; protected abstract css_name : string ; protected abstract _current : { } ; param { D3Sel } d3parent param { SimpleEventHandler } eventHandler protected constructor ( d3parent , eventHandler ? ) { this . id = Util . simpleUId ( { } ) ; this . parent = d3parent ; this . eventHandler = eventHandler || new SimpleEventHandler ( this . parent . node ( ) ) ; this . _visibility = { hidden : false } ; } protected superInitHTML ( options = { } ) { Object . keys ( options ) . forEach ( key => this . options [ key ] = options [ key ] ) ; this . base = this . parent . append ( 'div' ) . classed ( this . css_name , true ) ; } param { { } } options param defaultLayers protected superInitSVG ( options = { } , defaultLayers = [ 'bg' , 'main' , 'fg' ] ) { Object . keys ( options ) . forEach ( key => this . options [ key ] = options [ key ] ) ; this . layers = { } ; this . base = SVG . group ( this . parent , this . css_name + ' ID' + this . id , this . options . pos ) ; if ( defaultLayers ) { defaultLayers . forEach ( layer => { this . layers [ layer ] = SVG . group ( this . base , layer ) ; } ) ; } } abstract return { * } protected abstract _init ( ) ; param { Object } data return { * } update ( data ) { this . data = data ; if ( this . _visibility . hidden ) return ; this . renderData = this . _wrangle ( data ) ; this . _render ( this . renderData ) ; } param { Object } data returns { * } abstract protected abstract _wrangle ( data ) ; param { Object } renderData abstract returns { * } protected abstract _render ( renderData ) ; param { Object } options param { Boolean } reRender returns { * } updateOptions ( options , reRender = false ) { Object . keys ( options ) . forEach ( k => this . options [ k ] = options [ k ] ) ; if ( reRender ) this . _render ( this . renderData ) ; } setHideElement ( hE ) { this . _visibility . hideElement = hE ; } hideView ( ) { if ( ! this . _visibility . hidden ) { const hE = this . _visibility . hideElement || this . parent ; hE . transition ( ) . styles ( { 'opacity' : 0 , 'pointer-events' : 'none' } ) . style ( 'display' , 'none' ) ; this . _visibility . hidden = true ; } } unhideView ( ) { if ( this . _visibility . hidden ) { const hE = this . _visibility . hideElement || this . parent ; hE . transition ( ) . styles ( { 'opacity' : 1 , 'pointer-events' : null , 'display' : null } ) ; this . _visibility . hidden = false ; } } destroy ( ) { this . base . remove ( ) ; } }