client/src/app/shared/angular/timestamp-route-transformer.directive.ts

   1 import { Directive, ElementRef, HostListener, Output, EventEmitter } from '@angular/core'
   2 import { Router } from '@angular/router'
   3 import { ElementEvent } from '@app/shared/misc/utils'
   4
   5 @Directive({
   6   selector: '[timestampRouteTransformer]'
   7 })
   8 export class TimestampRouteTransformerDirective {
   9   @Output() timestampClicked = new EventEmitter<number>()
  10
  11   constructor (private el: ElementRef, private router: Router) { }
  12
  13   @HostListener('click', ['$event'])
  14   public onClick ($event: ElementEvent) {
  15     if ($event.target.hasAttribute('href')) {
  16       const ngxLink = document.createElement('a')
  17       ngxLink.href = $event.target.getAttribute('href')
  18
  19       // we only care about reflective links
  20       if (ngxLink.host !== window.location.host) return
  21
  22       const ngxLinkParams = new URLSearchParams(ngxLink.search)
  23       if (ngxLinkParams.has('start')) {
  24         const separators = ['h', 'm', 's']
  25         const start = ngxLinkParams
  26           .get('start')
  27           .match(new RegExp('(\\d{1,9}[' + separators.join('') + '])','g')) // match digits before any given separator
  28           .map(t => {
  29             if (t.includes('h')) return parseInt(t, 10) * 3600
  30             if (t.includes('m')) return parseInt(t, 10) * 60
  31             return parseInt(t, 10)
  32           })
  33           .reduce((acc, t) => acc + t)
  34         this.timestampClicked.emit(start)
  35       }
  36
  37       $event.preventDefault()
  38     }
  39
  40     return
  41   }
  42 }