jsim-lazy-expandable/fesm2015/jsim-lazy-expandable.mjs.map

Light weight and easy to use expansion panel with lazy loaded content.

{"version":3,"file":"jsim-lazy-expandable.mjs","sources":["../../../projects/jsim-lazy-expandable/src/lib/lazy-content.directive.ts","../../../projects/jsim-lazy-expandable/src/lib/lazy-expandable.component.ts","../../../projects/jsim-lazy-expandable/src/lib/lazy-expandable.component.html","../../../projects/jsim-lazy-expandable/src/lib/lazy-expandable.module.ts","../../../projects/jsim-lazy-expandable/src/jsim-lazy-expandable.ts"],"sourcesContent":["import { Directive, TemplateRef, ViewContainerRef } from '@angular/core';\n\n@Directive({\n  selector: 'ng-template[jsimLazyContent]'\n})\nexport class LazyContentDirective {\n  viewLoaded: boolean = false;\n\n  constructor(private templateRef: TemplateRef<any>, private viewContainer: ViewContainerRef) {\n    this.viewContainer.clear();\n    this.viewLoaded = false;\n  }\n\n  public showContent(){\n    if(!this.viewLoaded){\n      this.viewContainer.createEmbeddedView(this.templateRef);\n      this.viewLoaded = true;\n    }\n  }\n}\n","import { AfterContentInit, Component, ContentChild, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';\nimport { LazyContentDirective } from './lazy-content.directive';\n\n@Component({\n  selector: 'jsim-lazy-expandable',\n  templateUrl: './lazy-expandable.component.html',\n  styleUrls: ['./lazy-expandable.component.css']\n})\nexport class LazyExpandableComponent implements OnInit, AfterContentInit {\n\n  /** Is the panel open? */\n  @Input() isOpen: boolean = false;\n\n  /** Event emitted when isOpen changes */\n  @Output() openChanged = new EventEmitter<boolean>();\n\n  /** Hide the arrow icon */\n  @Input() hideIcon: boolean = false;\n\n  /** Height of the header when collapsed (in pixels) */\n  @Input() headerHeight: number = 48;\n\n  /** Height of the header when expanded (in pixels) */\n  @Input() headerHeightExpanded: number = 64;\n\n  /** Speed of the expand and collapse animation (in pixel by milisecond) */\n  @Input() animationSpeed: number = 0.5;\n\n  /** Event emitted when animation ends */\n  @Output() animationEnd = new EventEmitter<boolean>();\n\n  /** Is expanding and collapsing disabled? */\n  @Input() disabled: boolean = false;\n\n  @ViewChild('lazyContent') content: ElementRef | undefined;\n\n  @ContentChild(LazyContentDirective) directive: LazyContentDirective | undefined;\n\n  headerHeightStyle: string = this.headerHeight + 'px';\n  contentHeight: string =  this.headerHeight + 'px';\n\n  private currentContentHeight: number = 0;\n  private desiredContentHeight: number = 0;\n  private timeLastFrame: number = Date.now();\n  private animationDuration: number = 0;\n  private currentAnimationTime: number = 0;\n\n  private animationFrameRef: number | undefined;\n\n  constructor() {}\n\n  ngOnInit(): void {}\n\n  ngAfterContentInit(): void {\n    setTimeout(() => {\n      this.setContentHeight(false);\n      if(this.isOpen && this.directive){\n        this.directive.showContent();\n      }\n    }, 0);\n  }\n\n  toggleOpen(){\n    if(this.disabled){\n      return;\n    }\n\n    this.isOpen = !this.isOpen;\n\n    if(this.isOpen && this.directive){\n      this.directive.showContent();\n    }\n\n    this.openChanged.emit(this.isOpen);\n    this.setContentHeight();\n  }\n\n  private setContentHeight(animate: boolean = true){\n    if(animate){\n      if(this.isOpen){\n        this.headerHeightStyle = this.headerHeightExpanded + 'px';\n        this.desiredContentHeight = this.content!.nativeElement.clientHeight;\n        this.currentContentHeight = 0;\n      } else {\n        this.headerHeightStyle = this.headerHeight + 'px';\n        this.desiredContentHeight = 0;\n        this.currentContentHeight = this.content!.nativeElement.clientHeight;\n      }\n      this.animationDuration = Math.abs(this.desiredContentHeight - this.currentContentHeight) / this.animationSpeed;\n      this.startAnimation();\n    } else {\n      if(this.isOpen){\n        this.headerHeightStyle = this.headerHeightExpanded + 'px';\n        this.contentHeight = 'unset';\n      } else {\n        this.headerHeightStyle = this.headerHeight + 'px';\n        this.contentHeight = this.headerHeight + 'px';\n      }\n    }\n  }\n\n  private startAnimation(){\n    this.timeLastFrame = Date.now();\n    this.currentAnimationTime = 0;\n    if(this.animationFrameRef){\n      cancelAnimationFrame(this.animationFrameRef);\n    }\n    this.animationFrameRef = requestAnimationFrame(this.animateHeader.bind(this));\n  }\n\n  private animateHeader() {\n    const time = Date.now();\n    const deltatime = time - this.timeLastFrame;\n    this.timeLastFrame = time;\n    this.currentAnimationTime += deltatime;\n\n    const amount = this.currentAnimationTime / this.animationDuration;\n\n    this.currentContentHeight = this.lerp(this.currentContentHeight, this.desiredContentHeight, amount);\n\n    if(this.isOpen){\n      this.currentContentHeight = Math.min(this.currentContentHeight, this.desiredContentHeight);\n      this.contentHeight = this.headerHeightExpanded + this.currentContentHeight + 'px';\n    } else {\n      this.currentContentHeight = Math.max(this.currentContentHeight, this.desiredContentHeight);\n      this.contentHeight = this.headerHeight + this.currentContentHeight + 'px';\n    }\n\n    if(this.currentContentHeight == this.desiredContentHeight){\n      this.animationEnded();\n      return;\n    }\n\n    this.animationFrameRef = requestAnimationFrame(this.animateHeader.bind(this));\n  }\n\n  private lerp = (x: number, y: number, a: number) => x * (1 - a) + y * a;\n\n  private animationEnded(){\n    this.animationEnd.emit(this.isOpen);\n    if(this.isOpen){\n      this.contentHeight = 'unset';\n    }\n  }\n}\n","<div class=\"lazy-exp-container\" [class.is-open]=\"isOpen\" [style.height]=\"contentHeight\" [class.disabled]=\"disabled\">\n    <div class=\"lazy-exp-header\" (click)=\"toggleOpen()\" [style.height]=\"headerHeightStyle\">\n        <div class=\"lazy-exp-header-title\">\n            <ng-content select=\"[exp-header-title]\"></ng-content>\n        </div>\n        <div class=\"lazy-exp-header-subtitle\">\n            <ng-content select=\"[exp-header-subtitle]\"></ng-content>\n        </div>\n        <div *ngIf=\"!hideIcon\" class=\"lazy-exp-header-icon\"></div>\n    </div>\n    <div #lazyContent class=\"lazy-exp-content\">\n        <div class=\"lazy-exp-content-container\">\n            <ng-content select=\"[exp-content]\"></ng-content>\n        </div>\n    </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { LazyExpandableComponent } from './lazy-expandable.component';\nimport { LazyContentDirective } from './lazy-content.directive';\n\n@NgModule({\n  declarations: [\n    LazyExpandableComponent,\n    LazyContentDirective\n  ],\n  imports: [\n    CommonModule\n  ],\n  exports: [\n    LazyExpandableComponent,\n    LazyContentDirective\n  ]\n})\nexport class LazyExpandableModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}