]>
Commit | Line | Data |
---|---|---|
1 | import { Directive, EventEmitter, HostListener, Output } from '@angular/core' | |
2 | ||
3 | @Directive({ | |
4 | selector: '[myTimestampRouteTransformer]' | |
5 | }) | |
6 | export class TimestampRouteTransformerDirective { | |
7 | @Output() timestampClicked = new EventEmitter<number>() | |
8 | ||
9 | @HostListener('click', [ '$event' ]) | |
10 | public onClick ($event: Event) { | |
11 | const target = $event.target as HTMLLinkElement | |
12 | ||
13 | if (target.hasAttribute('href') !== true) return | |
14 | if (!target.classList.contains('video-timestamp')) return | |
15 | ||
16 | const ngxLink = document.createElement('a') | |
17 | ngxLink.href = target.getAttribute('href') | |
18 | ||
19 | const ngxLinkParams = new URLSearchParams(ngxLink.search) | |
20 | if (ngxLinkParams.has('start') !== true) return | |
21 | ||
22 | const separators = [ 'h', 'm', 's' ] | |
23 | const start = ngxLinkParams | |
24 | .get('start') | |
25 | .match(new RegExp('(\\d{1,9}[' + separators.join('') + '])', 'g')) // match digits before any given separator | |
26 | .map(t => { | |
27 | if (t.includes('h')) return parseInt(t, 10) * 3600 | |
28 | if (t.includes('m')) return parseInt(t, 10) * 60 | |
29 | return parseInt(t, 10) | |
30 | }) | |
31 | .reduce((acc, t) => acc + t) | |
32 | ||
33 | this.timestampClicked.emit(start) | |
34 | ||
35 | $event.preventDefault() | |
36 | } | |
37 | } |