File

projects/dvk/src/lib/dynamic-animations/default-dynamic-animations-handler/default-dynamic-animations-handler.service.ts

Description

The default implementation of DynamicAnimationsHandler that provides the DynamicAnimationsDirective with animations capabllities.

Implements

DynamicAnimationsHandler

Index

Methods

Constructor

constructor(element: any, state: string, transitions: AnimationTransitionsMap, styles: AnimationStylesMap, cssMap: StateCSSMap, cssMapperService: StateCssMapperService, animationStatesBuilder: AnimationStatesService)
Parameters :
Name Type Optional
element any no
state string no
transitions AnimationTransitionsMap no
styles AnimationStylesMap no
cssMap StateCSSMap no
cssMapperService StateCssMapperService no
animationStatesBuilder AnimationStatesService no

Methods

destroy
destroy()
Returns : void
nextState
nextState(toState: string)
Parameters :
Name Type Optional
toState string no
Returns : void
setAnimations
setAnimations(transitions: AnimationTransitionsMap, styles: AnimationStylesMap)
Parameters :
Name Type Optional
transitions AnimationTransitionsMap no
styles AnimationStylesMap no
Returns : void
setCSSMap
setCSSMap(map: StateCSSMap)
Parameters :
Name Type Optional
map StateCSSMap no
Returns : void
import { DynamicAnimationsHandler } from '../dynamic-animations-handler/dynamic-animations-handler.model';
import { AnimationTransitionsMap, AnimationStylesMap } from '../animation-transitions/animation-transitions.model';
import { StateCSSMap } from '../state-css-map/state-css-map.model';
import { StateCSSMapper } from '../state-css-mapper/state-css-mapper.model';
import { AnimationStateMachine } from '../animation-state-machine/animation-state-machine.model';
import { AnimationStatesService } from '../animation-states/animation-states.service';
import { StateCssMapperService } from '../state-css-mapper/state-css-mapper.service';

/**
 * The default implementation of {@link DynamicAnimationsHandler}
 * that provides the {@link DynamicAnimationsDirective} with 
 * animations capabllities.  
 */
export class DefaultDynamicAnimationsHandlerService implements DynamicAnimationsHandler {

  /**
   * @ignore
   */
  private animationsStateMachine: AnimationStateMachine;

  /**
   * @ignore
   */
  private cssMapper: StateCSSMapper;

  constructor(
    private element: any,
    private state: string,
    private transitions: AnimationTransitionsMap,
    private styles: AnimationStylesMap, 
    private cssMap: StateCSSMap,
    private cssMapperService: StateCssMapperService,
    private animationStatesBuilder: AnimationStatesService
  ) {
    this.createCSSMapper(cssMap);
    this.createStateMachine(this.transitions, this.styles);
  }
  
  setCSSMap(map: StateCSSMap) {
    this.createCSSMapper(map);
  }

  nextState(toState:string) {
    if(this.state !== toState) {
      this.state = toState;

      if(this.animationsStateMachine) {
        this.animationsStateMachine.next(
          this.state, 
          this.cssMapper);
      }
    }
  }

  setAnimations(transitions: AnimationTransitionsMap, styles: AnimationStylesMap) {
    this.createStateMachine(transitions, styles);
  }

  destroy() {
    this.animationsStateMachine.destroy();
    this.cssMapper.destroy();
    this.state = null;
    this.cssMap = null;
    this.transitions = null;
  }

  /**
   * @ignore
   */
  private createStateMachine(
    transitions: AnimationTransitionsMap, 
    styles: AnimationStylesMap) {
    if(this.animationsStateMachine) {
      this.animationsStateMachine.destroy();
    }

    if(this.transitions !== transitions || !this.animationsStateMachine) {
      this.transitions = transitions;

      this.animationsStateMachine = 
        this.animationStatesBuilder
          .createAnimationStateMachine(
            this.element,
            this.transitions,
            styles);

      this.animationsStateMachine.init(
        this.state,
        this.cssMapper);
    }
  }

  /**
   * @ignore
   */
  private createCSSMapper(map: StateCSSMap = {}) {
    if(this.cssMap !== map || !this.cssMapper) {
      this.cssMap = map;

      if(this.cssMapper) {
        this.cssMapper.removeAll();
        this.cssMapper.destroy();
      }

      this.cssMapper = this.cssMapperService
        .createStateCSSMapper(this.element,this.cssMap);

      this.cssMapper.add(this.state);
    }
  }
}

results matching ""

    No results matching ""