import { Directive, ElementRef, HostListener, Input } from '@angular/core';

@Directive({
  selector: '[ydlifeScroll]'
})
export class ScrollDirective {
  @Input('display') display:string;

  constructor(private el:ElementRef) { }

  @HostListener('touchmove') onTouchmove(){
    if(this.el.nativeElement.querySelector('#menuContainer')){
      if(parseInt(this.el.nativeElement.querySelector('#menuContainer').style.left, 0) < document.body.clientWidth / 2){
        this.el.nativeElement.querySelector('#menuContainer').style.transform = 'translateX(-50px)'
      }else{
        this.el.nativeElement.querySelector('#menuContainer').style.transform = 'translateX(50px)'
      }
    }
  }
  @HostListener('touchend') onTouchcancel(){
    setTimeout(()=>{
     if(this.el.nativeElement.querySelector('#menuContainer')){
      if(sessionStorage.getItem('iconShowFlag')=='false'){
        this.el.nativeElement.querySelector('#menuContainer').style.display = 'none'
      }else{
        this.el.nativeElement.querySelector('#menuContainer').style.display = 'block'
        this.el.nativeElement.querySelector('#menuContainer').style.transform = 'translateX(0)'
      }
     }
    },1000)
  }
}
