@edm-webplayer/webplayer-angular 0.1.46 → 0.1.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -148,9 +148,12 @@ class PlyrPlayerComponent {
148
148
  });
149
149
  }
150
150
  getControlsSafeZone() {
151
- const controls = (this.plyr?.elements?.controls ?? null);
151
+ const controls = (this.plyr?.elements?.controls ??
152
+ null);
152
153
  const menuHeight = this.getOpenMenuHeight();
153
- const baseSafeZone = this.isTouchDevice() ? this.controlsSafeZonePxTouch : this.controlsSafeZonePxDesktop;
154
+ const baseSafeZone = this.isTouchDevice()
155
+ ? this.controlsSafeZonePxTouch
156
+ : this.controlsSafeZonePxDesktop;
154
157
  if (!controls) {
155
158
  return Math.max(baseSafeZone, menuHeight + 5);
156
159
  }
@@ -169,8 +172,7 @@ class PlyrPlayerComponent {
169
172
  }
170
173
  getOverlaySafeZone() {
171
174
  const host = this.config?.video_host;
172
- if (this.overlayBlockAll &&
173
- (host === 'youtube' || host === 'vimeo')) {
175
+ if (this.overlayBlockAll && (host === "youtube" || host === "vimeo")) {
174
176
  if (this.playbackEnded) {
175
177
  return 0;
176
178
  }
@@ -196,7 +198,7 @@ class PlyrPlayerComponent {
196
198
  }
197
199
  ngAfterViewInit() {
198
200
  this.setupPlayer();
199
- window.addEventListener('message', this.onCastMessage);
201
+ window.addEventListener("message", this.onCastMessage);
200
202
  }
201
203
  ngOnChanges(changes) {
202
204
  if (changes["config"] && this.plyr) {
@@ -204,10 +206,10 @@ class PlyrPlayerComponent {
204
206
  }
205
207
  }
206
208
  applyTheme(colors) {
207
- const STYLE_ID = 'webplayer-theme-vars';
209
+ const STYLE_ID = "webplayer-theme-vars";
208
210
  let styleEl = this.document.getElementById(STYLE_ID);
209
211
  if (!styleEl) {
210
- styleEl = this.document.createElement('style');
212
+ styleEl = this.document.createElement("style");
211
213
  styleEl.id = STYLE_ID;
212
214
  this.document.head.appendChild(styleEl);
213
215
  }
@@ -215,7 +217,7 @@ class PlyrPlayerComponent {
215
217
  const allPairs = [];
216
218
  for (const key in colors) {
217
219
  if (Object.prototype.hasOwnProperty.call(colors, key)) {
218
- const cssVarName = `--theme-${key.replace('progresss-', 'progress-')}`;
220
+ const cssVarName = `--theme-${key.replace("progresss-", "progress-")}`;
219
221
  const cssVarValue = String(colors[key]);
220
222
  allPairs.push([cssVarName, cssVarValue]);
221
223
  try {
@@ -225,7 +227,7 @@ class PlyrPlayerComponent {
225
227
  }
226
228
  }
227
229
  const cssRule = `:root{
228
- ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
230
+ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join("\n")}
229
231
  }`;
230
232
  styleEl.textContent = cssRule;
231
233
  }
@@ -237,7 +239,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
237
239
  if (!candidate) {
238
240
  return null;
239
241
  }
240
- return candidate.replace(/_/g, '-');
242
+ return candidate.replace(/_/g, "-");
241
243
  }
242
244
  resolveLocale() {
243
245
  const candidates = [
@@ -254,7 +256,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
254
256
  return normalized;
255
257
  }
256
258
  }
257
- return 'pt-BR';
259
+ return "pt-BR";
258
260
  }
259
261
  resolveCaptionsLanguage(locale) {
260
262
  const explicit = this.normalizeLocaleCandidate(this.config?.captions_locale ??
@@ -265,7 +267,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
265
267
  const baseLocale = explicit || locale;
266
268
  if (!baseLocale)
267
269
  return null;
268
- const code = baseLocale.split('-')[0]?.trim();
270
+ const code = baseLocale.split("-")[0]?.trim();
269
271
  return code ? code.toLowerCase() : null;
270
272
  }
271
273
  shouldHideVimeoRecommendations() {
@@ -304,7 +306,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
304
306
  if (!container)
305
307
  return null;
306
308
  const wrapper = this.plyr?.elements?.wrapper ||
307
- container.querySelector('.plyr__video-wrapper');
309
+ container.querySelector(".plyr__video-wrapper");
308
310
  return wrapper || null;
309
311
  }
310
312
  ensureRecommendationBlocker() {
@@ -314,30 +316,30 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
314
316
  const wrapper = this.getVideoWrapper();
315
317
  if (!wrapper)
316
318
  return null;
317
- const blocker = this.document.createElement('div');
318
- blocker.className = 'plyr-recommendation-blocker';
319
- blocker.style.position = 'absolute';
320
- blocker.style.top = '0';
321
- blocker.style.left = '0';
322
- blocker.style.width = '100%';
323
- blocker.style.height = '100%';
324
- blocker.style.zIndex = '11';
325
- blocker.style.pointerEvents = 'none';
326
- blocker.style.display = 'none';
327
- blocker.style.background = 'rgba(0,0,0,0)';
328
- blocker.style.cursor = 'pointer';
329
- const activeZone = this.document.createElement('div');
330
- activeZone.className = 'plyr-recommendation-blocker__zone';
331
- activeZone.style.position = 'absolute';
332
- activeZone.style.top = '0';
333
- activeZone.style.left = '0';
334
- activeZone.style.width = '100%';
319
+ const blocker = this.document.createElement("div");
320
+ blocker.className = "plyr-recommendation-blocker";
321
+ blocker.style.position = "absolute";
322
+ blocker.style.top = "0";
323
+ blocker.style.left = "0";
324
+ blocker.style.width = "100%";
325
+ blocker.style.height = "100%";
326
+ blocker.style.zIndex = "11";
327
+ blocker.style.pointerEvents = "none";
328
+ blocker.style.display = "none";
329
+ blocker.style.background = "rgba(0,0,0,0)";
330
+ blocker.style.cursor = "pointer";
331
+ const activeZone = this.document.createElement("div");
332
+ activeZone.className = "plyr-recommendation-blocker__zone";
333
+ activeZone.style.position = "absolute";
334
+ activeZone.style.top = "0";
335
+ activeZone.style.left = "0";
336
+ activeZone.style.width = "100%";
335
337
  activeZone.style.bottom = `20px`;
336
- activeZone.style.pointerEvents = 'auto';
337
- activeZone.style.background = 'rgba(0,0,0,0)';
338
- activeZone.style.cursor = 'pointer';
339
- activeZone.addEventListener('pointerdown', this.onTopBlockerPointerDown);
340
- activeZone.addEventListener('click', this.onRecommendationBlockerClick);
338
+ activeZone.style.pointerEvents = "auto";
339
+ activeZone.style.background = "rgba(0,0,0,0)";
340
+ activeZone.style.cursor = "pointer";
341
+ activeZone.addEventListener("pointerdown", this.onTopBlockerPointerDown);
342
+ activeZone.addEventListener("click", this.onRecommendationBlockerClick);
341
343
  blocker.appendChild(activeZone);
342
344
  wrapper.appendChild(blocker);
343
345
  this.recommendationBlocker = blocker;
@@ -346,7 +348,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
346
348
  return blocker;
347
349
  }
348
350
  toggleRecommendationBlocker(active) {
349
- if (this.config.video_host !== "youtube" && this.config.video_host !== "vimeo") {
351
+ if (this.config.video_host !== "youtube" &&
352
+ this.config.video_host !== "vimeo") {
350
353
  return;
351
354
  }
352
355
  const blocker = this.ensureRecommendationBlocker();
@@ -354,18 +357,18 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
354
357
  return;
355
358
  const activeZone = this.recommendationBlockerActiveZone;
356
359
  if (active) {
357
- blocker.style.display = 'block';
358
- blocker.style.pointerEvents = 'none';
360
+ blocker.style.display = "block";
361
+ blocker.style.pointerEvents = "none";
359
362
  if (activeZone) {
360
- activeZone.style.pointerEvents = 'auto';
363
+ activeZone.style.pointerEvents = "auto";
361
364
  }
362
365
  this.updateRecommendationBlockerSafeZone();
363
366
  }
364
367
  else {
365
- blocker.style.display = 'none';
366
- blocker.style.pointerEvents = 'none';
368
+ blocker.style.display = "none";
369
+ blocker.style.pointerEvents = "none";
367
370
  if (activeZone) {
368
- activeZone.style.pointerEvents = 'none';
371
+ activeZone.style.pointerEvents = "none";
369
372
  }
370
373
  }
371
374
  this.updateTopClickBlockerSafeZone();
@@ -380,33 +383,33 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
380
383
  updateTopClickBlockerSafeZone(precomputed) {
381
384
  if (!this.topClickBlocker)
382
385
  return;
383
- const safeZoneRaw = typeof precomputed === 'number' ? precomputed : this.getOverlaySafeZone();
386
+ const safeZoneRaw = typeof precomputed === "number" ? precomputed : this.getOverlaySafeZone();
384
387
  const safeZone = Math.max(0, safeZoneRaw);
385
388
  this.topClickBlocker.style.bottom = `${safeZone}px`;
386
389
  }
387
390
  togglePlayback(force) {
388
391
  if (!this.plyr)
389
392
  return;
390
- const hasTogglePlay = typeof this.plyr.togglePlay === 'function';
393
+ const hasTogglePlay = typeof this.plyr.togglePlay === "function";
391
394
  const ended = this.playbackEnded;
392
- if (hasTogglePlay && typeof force === 'undefined') {
395
+ if (hasTogglePlay && typeof force === "undefined") {
393
396
  try {
394
397
  const result = this.plyr.togglePlay();
395
- if (result && typeof result.catch === 'function') {
398
+ if (result && typeof result.catch === "function") {
396
399
  result.catch(() => { });
397
400
  }
398
401
  return;
399
402
  }
400
403
  catch { }
401
404
  }
402
- const shouldPlay = typeof force === 'boolean' ? !!force : !this.plyr.playing;
405
+ const shouldPlay = typeof force === "boolean" ? !!force : !this.plyr.playing;
403
406
  if (shouldPlay) {
404
407
  if (this.deferUntilStartTimeSettles(() => this.togglePlayback(true))) {
405
408
  return;
406
409
  }
407
410
  if (ended) {
408
411
  try {
409
- if (typeof this.plyr.restart === 'function') {
412
+ if (typeof this.plyr.restart === "function") {
410
413
  this.plyr.restart();
411
414
  }
412
415
  else {
@@ -420,7 +423,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
420
423
  this.updateRecommendationBlockerSafeZone();
421
424
  try {
422
425
  const result = this.plyr.play?.();
423
- if (result && typeof result.catch === 'function') {
426
+ if (result && typeof result.catch === "function") {
424
427
  result.catch(() => { });
425
428
  }
426
429
  }
@@ -435,7 +438,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
435
438
  catch { }
436
439
  }
437
440
  ensureTopClickBlocker() {
438
- if (this.config.video_host !== "youtube" && this.config.video_host !== "vimeo") {
441
+ if (this.config.video_host !== "youtube" &&
442
+ this.config.video_host !== "vimeo") {
439
443
  return;
440
444
  }
441
445
  const wrapper = this.getVideoWrapper();
@@ -444,20 +448,20 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
444
448
  if (this.topClickBlocker && this.topClickBlocker.isConnected) {
445
449
  return;
446
450
  }
447
- const blocker = this.document.createElement('div');
448
- blocker.className = 'plyr-top-click-blocker';
449
- blocker.style.position = 'absolute';
450
- blocker.style.top = '0';
451
- blocker.style.left = '0';
452
- blocker.style.right = '0';
453
- blocker.style.width = '100%';
454
- blocker.style.zIndex = '12';
455
- blocker.style.pointerEvents = 'auto';
456
- blocker.style.background = 'rgba(0,0,0,0)';
457
- blocker.style.touchAction = 'none';
458
- blocker.style.cursor = 'pointer';
459
- blocker.addEventListener('pointerdown', this.onTopBlockerPointerDown);
460
- blocker.addEventListener('click', this.onTopBlockerClick);
451
+ const blocker = this.document.createElement("div");
452
+ blocker.className = "plyr-top-click-blocker";
453
+ blocker.style.position = "absolute";
454
+ blocker.style.top = "0";
455
+ blocker.style.left = "0";
456
+ blocker.style.right = "0";
457
+ blocker.style.width = "100%";
458
+ blocker.style.zIndex = "12";
459
+ blocker.style.pointerEvents = "auto";
460
+ blocker.style.background = "rgba(0,0,0,0)";
461
+ blocker.style.touchAction = "none";
462
+ blocker.style.cursor = "pointer";
463
+ blocker.addEventListener("pointerdown", this.onTopBlockerPointerDown);
464
+ blocker.addEventListener("click", this.onTopBlockerClick);
461
465
  wrapper.appendChild(blocker);
462
466
  this.topClickBlocker = blocker;
463
467
  this.updateTopClickBlockerSafeZone();
@@ -475,56 +479,71 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
475
479
  observer.observe(container, {
476
480
  subtree: true,
477
481
  attributes: true,
478
- attributeFilter: ['aria-hidden', 'class', 'style'],
482
+ attributeFilter: ["aria-hidden", "class", "style"],
479
483
  });
480
484
  this.menuObserver = observer;
481
485
  }
482
486
  isIOSDevice() {
483
- if (typeof navigator === 'undefined')
487
+ if (typeof navigator === "undefined")
484
488
  return false;
485
- const ua = navigator.userAgent || '';
489
+ const ua = navigator.userAgent || "";
486
490
  const iOS = /iPad|iPhone|iPod/.test(ua);
487
- const iPadOS = navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1;
491
+ const iPadOS = navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1;
488
492
  return iOS || iPadOS;
489
493
  }
490
- isAndroidDevice() {
491
- if (typeof navigator === 'undefined')
492
- return false;
493
- return /Android/i.test(navigator.userAgent || '');
494
- }
495
494
  isTouchDevice() {
496
- if (typeof window === 'undefined') {
495
+ if (typeof window === "undefined") {
497
496
  return false;
498
497
  }
499
- if (typeof navigator !== 'undefined' && navigator.maxTouchPoints > 0) {
498
+ if (typeof navigator !== "undefined" && navigator.maxTouchPoints > 0) {
500
499
  return true;
501
500
  }
502
501
  if (window.matchMedia) {
503
502
  try {
504
- if (window.matchMedia('(pointer: coarse)').matches) {
503
+ if (window.matchMedia("(pointer: coarse)").matches) {
505
504
  return true;
506
505
  }
507
506
  }
508
507
  catch { }
509
508
  }
510
- return 'ontouchstart' in window;
509
+ return "ontouchstart" in window;
511
510
  }
512
511
  isIframeProvider() {
513
- return this.config?.video_host === 'youtube' || this.config?.video_host === 'vimeo';
512
+ return (this.config?.video_host === "youtube" ||
513
+ this.config?.video_host === "vimeo");
514
514
  }
515
515
  shouldDisableAutoplayForIOS() {
516
516
  return this.isIOSDevice();
517
517
  }
518
+ tryEnterVimeoFullscreen() {
519
+ if (!this.isIOSDevice() || this.config?.video_host !== 'vimeo') {
520
+ return;
521
+ }
522
+ const embed = this.plyr?.embed;
523
+ if (!embed)
524
+ return;
525
+ const requestFullscreen = embed.requestFullscreen ||
526
+ (embed.element && embed.element.requestFullscreen);
527
+ if (typeof requestFullscreen === 'function') {
528
+ try {
529
+ const result = requestFullscreen.call(embed.element ?? embed);
530
+ if (result && typeof result.catch === 'function') {
531
+ result.catch(() => { });
532
+ }
533
+ }
534
+ catch { }
535
+ }
536
+ }
518
537
  shouldDisableAutoplayForVimeo() {
519
- return this.isIOSDevice() && this.config?.video_host === 'vimeo';
538
+ return this.isIOSDevice() && this.config?.video_host === "vimeo";
520
539
  }
521
540
  shouldResetProgressToBeginning() {
522
541
  const host = this.config?.video_host;
523
- if (host !== 'youtube' && host !== 'vimeo') {
542
+ if (host !== "youtube" && host !== "vimeo") {
524
543
  return false;
525
544
  }
526
545
  const seenFlag = this.config?.seen;
527
- if (seenFlag === true || seenFlag === 'true' || seenFlag === 1) {
546
+ if (seenFlag === true || seenFlag === "true" || seenFlag === 1) {
528
547
  return true;
529
548
  }
530
549
  const rawPercent = this.config?.last_percent;
@@ -544,7 +563,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
544
563
  return !!(this.config?.autoplay || this.config?.is_live);
545
564
  }
546
565
  shouldAutoplay() {
547
- if (this.shouldDisableAutoplayForIOS() || this.shouldDisableAutoplayForVimeo()) {
566
+ if (this.shouldDisableAutoplayForIOS() ||
567
+ this.shouldDisableAutoplayForVimeo()) {
548
568
  return false;
549
569
  }
550
570
  return this.wantsAutoplay();
@@ -556,7 +576,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
556
576
  return this.wantsAutoplay();
557
577
  }
558
578
  shouldBlockIframeAutoplay() {
559
- return this.shouldDisableAutoplayForIOS() || this.shouldDisableAutoplayForVimeo();
579
+ return (this.shouldDisableAutoplayForIOS() || this.shouldDisableAutoplayForVimeo());
560
580
  }
561
581
  stopRestrictedIframeAutoplay() {
562
582
  if (!this.shouldBlockIframeAutoplay()) {
@@ -585,7 +605,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
585
605
  }
586
606
  catch { }
587
607
  try {
588
- if (typeof this.plyr.pause === 'function') {
608
+ if (typeof this.plyr.pause === "function") {
589
609
  this.plyr.pause();
590
610
  }
591
611
  }
@@ -594,13 +614,13 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
594
614
  const embed = this.plyr?.embed;
595
615
  if (embed) {
596
616
  try {
597
- if (typeof embed.pause === 'function') {
617
+ if (typeof embed.pause === "function") {
598
618
  embed.pause();
599
619
  }
600
- if (typeof embed.setMuted === 'function') {
620
+ if (typeof embed.setMuted === "function") {
601
621
  embed.setMuted(false);
602
622
  }
603
- if (typeof embed.setVolume === 'function') {
623
+ if (typeof embed.setVolume === "function") {
604
624
  embed.setVolume(1);
605
625
  }
606
626
  }
@@ -608,7 +628,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
608
628
  }
609
629
  }
610
630
  enforceVimeoVolumeAfterPlay(video) {
611
- if (this.config?.video_host !== 'vimeo') {
631
+ if (this.config?.video_host !== "vimeo") {
612
632
  return;
613
633
  }
614
634
  const media = video ?? this.videoRef?.nativeElement ?? null;
@@ -617,13 +637,13 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
617
637
  this.setPlayerMutedState(false, volumeTarget, media);
618
638
  const currentEmbed = this.plyr?.embed;
619
639
  if (currentEmbed) {
620
- if (typeof currentEmbed.setMuted === 'function') {
640
+ if (typeof currentEmbed.setMuted === "function") {
621
641
  try {
622
642
  currentEmbed.setMuted(false);
623
643
  }
624
644
  catch { }
625
645
  }
626
- if (typeof currentEmbed.setVolume === 'function') {
646
+ if (typeof currentEmbed.setVolume === "function") {
627
647
  try {
628
648
  currentEmbed.setVolume(volumeTarget);
629
649
  }
@@ -654,7 +674,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
654
674
  media.muted = muted;
655
675
  }
656
676
  catch { }
657
- if (!muted && typeof media.volume === 'number') {
677
+ if (!muted && typeof media.volume === "number") {
658
678
  try {
659
679
  media.volume = volume;
660
680
  }
@@ -672,7 +692,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
672
692
  }
673
693
  }
674
694
  ensureAutoplayUnlockListener() {
675
- if (typeof window === 'undefined' ||
695
+ if (typeof window === "undefined" ||
676
696
  this.interactionUnmuteCleanup ||
677
697
  !this.shouldAutoplay()) {
678
698
  return;
@@ -686,13 +706,13 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
686
706
  catch { }
687
707
  this.clearAutoplayUnlockListener();
688
708
  };
689
- window.addEventListener('touchend', handler, capture);
690
- window.addEventListener('pointerup', handler, capture);
691
- window.addEventListener('click', handler, capture);
709
+ window.addEventListener("touchend", handler, capture);
710
+ window.addEventListener("pointerup", handler, capture);
711
+ window.addEventListener("click", handler, capture);
692
712
  this.interactionUnmuteCleanup = () => {
693
- window.removeEventListener('touchend', handler, capture);
694
- window.removeEventListener('pointerup', handler, capture);
695
- window.removeEventListener('click', handler, capture);
713
+ window.removeEventListener("touchend", handler, capture);
714
+ window.removeEventListener("pointerup", handler, capture);
715
+ window.removeEventListener("click", handler, capture);
696
716
  this.interactionUnmuteCleanup = undefined;
697
717
  };
698
718
  }
@@ -703,22 +723,28 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
703
723
  const container = this.plyr?.elements?.container;
704
724
  if (!container)
705
725
  return;
706
- const iframe = container.querySelector('iframe') ?? null;
726
+ const iframe = container.querySelector("iframe") ?? null;
707
727
  if (!iframe)
708
728
  return;
709
- const allowRaw = iframe.getAttribute('allow') || '';
729
+ const allowRaw = iframe.getAttribute("allow") || "";
710
730
  const tokens = new Set(allowRaw
711
- .split(';')
731
+ .split(";")
712
732
  .map((token) => token.trim())
713
733
  .filter(Boolean));
714
- ['autoplay', 'fullscreen', 'encrypted-media', 'picture-in-picture', 'gyroscope'].forEach((rule) => tokens.add(rule));
715
- iframe.setAttribute('allow', Array.from(tokens).join('; '));
716
- if (this.config.video_host === 'youtube') {
717
- iframe.setAttribute('playsinline', '1');
718
- iframe.setAttribute('webkit-playsinline', '1');
719
- }
720
- iframe.setAttribute('allowfullscreen', 'true');
721
- iframe.setAttribute('data-keepplaying', 'true');
734
+ [
735
+ "autoplay",
736
+ "fullscreen",
737
+ "encrypted-media",
738
+ "picture-in-picture",
739
+ "gyroscope",
740
+ ].forEach((rule) => tokens.add(rule));
741
+ iframe.setAttribute("allow", Array.from(tokens).join("; "));
742
+ if (this.config.video_host === "youtube") {
743
+ iframe.setAttribute("playsinline", "1");
744
+ iframe.setAttribute("webkit-playsinline", "1");
745
+ }
746
+ iframe.setAttribute("allowfullscreen", "true");
747
+ iframe.setAttribute("data-keepplaying", "true");
722
748
  }
723
749
  scheduleUserInteractionUnmute(video) {
724
750
  this.unmuteAfterDelay(video || undefined);
@@ -796,7 +822,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
796
822
  let maybePromise = null;
797
823
  try {
798
824
  const result = this.seekUsingHostAPI(start, video);
799
- if (result && typeof result.then === 'function') {
825
+ if (result && typeof result.then === "function") {
800
826
  maybePromise = result;
801
827
  }
802
828
  }
@@ -818,9 +844,9 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
818
844
  if (!Number.isFinite(target) || target < 0) {
819
845
  return null;
820
846
  }
821
- if (this.config.video_host === 'vimeo') {
847
+ if (this.config.video_host === "vimeo") {
822
848
  const embed = this.plyr?.embed;
823
- if (embed && typeof embed.setCurrentTime === 'function') {
849
+ if (embed && typeof embed.setCurrentTime === "function") {
824
850
  try {
825
851
  return embed.setCurrentTime(target);
826
852
  }
@@ -863,7 +889,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
863
889
  if (media) {
864
890
  try {
865
891
  const nativePlay = media.play();
866
- if (nativePlay && typeof nativePlay.catch === 'function') {
892
+ if (nativePlay && typeof nativePlay.catch === "function") {
867
893
  nativePlay.catch(() => { });
868
894
  }
869
895
  }
@@ -872,7 +898,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
872
898
  this.scheduleUserInteractionUnmute(media);
873
899
  return;
874
900
  }
875
- if (playResult && typeof playResult.catch === 'function') {
901
+ if (playResult &&
902
+ typeof playResult.catch === "function") {
876
903
  playResult.catch((error) => {
877
904
  if (!muted) {
878
905
  tryPlay(true);
@@ -881,7 +908,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
881
908
  if (media) {
882
909
  try {
883
910
  const nativePlay = media.play();
884
- if (nativePlay && typeof nativePlay.catch === 'function') {
911
+ if (nativePlay && typeof nativePlay.catch === "function") {
885
912
  nativePlay.catch(() => { });
886
913
  }
887
914
  }
@@ -912,16 +939,16 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
912
939
  const embed = this.plyr?.embed;
913
940
  if (!embed)
914
941
  return;
915
- if (this.config.video_host === 'youtube') {
916
- if (typeof embed.playVideo === 'function') {
942
+ if (this.config.video_host === "youtube") {
943
+ if (typeof embed.playVideo === "function") {
917
944
  try {
918
945
  embed.playVideo();
919
946
  }
920
947
  catch { }
921
948
  }
922
949
  }
923
- else if (this.config.video_host === 'vimeo') {
924
- if (typeof embed.play === 'function') {
950
+ else if (this.config.video_host === "vimeo") {
951
+ if (typeof embed.play === "function") {
925
952
  try {
926
953
  embed.play();
927
954
  }
@@ -945,11 +972,11 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
945
972
  }
946
973
  };
947
974
  const showControls = () => {
948
- container.classList.remove('plyr--auto-hide-controls');
975
+ container.classList.remove("plyr--auto-hide-controls");
949
976
  };
950
977
  const hideControls = () => {
951
978
  if (this.plyr?.playing) {
952
- container.classList.add('plyr--auto-hide-controls');
979
+ container.classList.add("plyr--auto-hide-controls");
953
980
  }
954
981
  };
955
982
  const scheduleHide = () => {
@@ -966,7 +993,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
966
993
  clearHideTimeout();
967
994
  showControls();
968
995
  if (this.isIOSDevice()) {
969
- console.log('event: ended');
996
+ console.log("event: ended");
970
997
  }
971
998
  };
972
999
  const onEnded = () => {
@@ -977,19 +1004,19 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
977
1004
  showControls();
978
1005
  scheduleHide();
979
1006
  };
980
- this.plyr?.on?.('play', onPlay);
981
- this.plyr?.on?.('pause', onPause);
982
- this.plyr?.on?.('ended', onEnded);
983
- container.addEventListener('touchstart', onUserInteraction);
984
- container.addEventListener('click', onUserInteraction);
1007
+ this.plyr?.on?.("play", onPlay);
1008
+ this.plyr?.on?.("pause", onPause);
1009
+ this.plyr?.on?.("ended", onEnded);
1010
+ container.addEventListener("touchstart", onUserInteraction);
1011
+ container.addEventListener("click", onUserInteraction);
985
1012
  this.controlsVisibilityCleanup = () => {
986
1013
  clearHideTimeout();
987
- this.plyr?.off?.('play', onPlay);
988
- this.plyr?.off?.('pause', onPause);
989
- this.plyr?.off?.('ended', onEnded);
990
- container.removeEventListener('touchstart', onUserInteraction);
991
- container.removeEventListener('click', onUserInteraction);
992
- container.classList.remove('plyr--auto-hide-controls');
1014
+ this.plyr?.off?.("play", onPlay);
1015
+ this.plyr?.off?.("pause", onPause);
1016
+ this.plyr?.off?.("ended", onEnded);
1017
+ container.removeEventListener("touchstart", onUserInteraction);
1018
+ container.removeEventListener("click", onUserInteraction);
1019
+ container.classList.remove("plyr--auto-hide-controls");
993
1020
  };
994
1021
  onPlay();
995
1022
  return;
@@ -998,10 +1025,10 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
998
1025
  const toggleClass = () => {
999
1026
  const playing = !!this.plyr?.playing;
1000
1027
  if (playing && !hovering) {
1001
- container.classList.add('plyr--auto-hide-controls');
1028
+ container.classList.add("plyr--auto-hide-controls");
1002
1029
  }
1003
1030
  else {
1004
- container.classList.remove('plyr--auto-hide-controls');
1031
+ container.classList.remove("plyr--auto-hide-controls");
1005
1032
  }
1006
1033
  };
1007
1034
  const onPlay = () => toggleClass();
@@ -1020,39 +1047,39 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1020
1047
  toggleClass();
1021
1048
  };
1022
1049
  const onFocusOut = () => {
1023
- hovering = container.matches(':hover');
1050
+ hovering = container.matches(":hover");
1024
1051
  toggleClass();
1025
1052
  };
1026
- this.plyr?.on?.('play', onPlay);
1027
- this.plyr?.on?.('pause', onPause);
1028
- this.plyr?.on?.('ended', onEnded);
1029
- container.addEventListener('mouseenter', onMouseEnter);
1030
- container.addEventListener('mouseleave', onMouseLeave);
1031
- container.addEventListener('focusin', onFocusIn);
1032
- container.addEventListener('focusout', onFocusOut);
1053
+ this.plyr?.on?.("play", onPlay);
1054
+ this.plyr?.on?.("pause", onPause);
1055
+ this.plyr?.on?.("ended", onEnded);
1056
+ container.addEventListener("mouseenter", onMouseEnter);
1057
+ container.addEventListener("mouseleave", onMouseLeave);
1058
+ container.addEventListener("focusin", onFocusIn);
1059
+ container.addEventListener("focusout", onFocusOut);
1033
1060
  toggleClass();
1034
1061
  this.controlsVisibilityCleanup = () => {
1035
- this.plyr?.off?.('play', onPlay);
1036
- this.plyr?.off?.('pause', onPause);
1037
- this.plyr?.off?.('ended', onEnded);
1038
- container.removeEventListener('mouseenter', onMouseEnter);
1039
- container.removeEventListener('mouseleave', onMouseLeave);
1040
- container.removeEventListener('focusin', onFocusIn);
1041
- container.removeEventListener('focusout', onFocusOut);
1042
- container.classList.remove('plyr--auto-hide-controls');
1062
+ this.plyr?.off?.("play", onPlay);
1063
+ this.plyr?.off?.("pause", onPause);
1064
+ this.plyr?.off?.("ended", onEnded);
1065
+ container.removeEventListener("mouseenter", onMouseEnter);
1066
+ container.removeEventListener("mouseleave", onMouseLeave);
1067
+ container.removeEventListener("focusin", onFocusIn);
1068
+ container.removeEventListener("focusout", onFocusOut);
1069
+ container.classList.remove("plyr--auto-hide-controls");
1043
1070
  };
1044
1071
  }
1045
1072
  bindFullscreenBehavior() {
1046
1073
  const onEnterFullscreen = () => {
1047
- console.log('event: enterfullscreen');
1074
+ console.log("event: enterfullscreen");
1048
1075
  parent.postMessage("event: fullscreen_enter', '*'");
1049
1076
  };
1050
1077
  const onExitFullscreen = () => {
1051
- console.log('event: exitfullscreen');
1078
+ console.log("event: exitfullscreen");
1052
1079
  parent.postMessage("event: fullscreen_exit', '*'");
1053
1080
  };
1054
- this.plyr.on('enterfullscreen', onEnterFullscreen);
1055
- this.plyr.on('exitfullscreen', onExitFullscreen);
1081
+ this.plyr.on("enterfullscreen", onEnterFullscreen);
1082
+ this.plyr.on("exitfullscreen", onExitFullscreen);
1056
1083
  }
1057
1084
  setupPlayer() {
1058
1085
  if (!this.videoRef)
@@ -1065,7 +1092,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1065
1092
  this.recommendationBlocker = null;
1066
1093
  const speedOptions = [1, 1.25, 1.5, 2];
1067
1094
  const locale = this.resolveLocale();
1068
- const captionsLanguage = this.resolveCaptionsLanguage(locale) ?? 'pt';
1095
+ const captionsLanguage = this.resolveCaptionsLanguage(locale) ?? "pt";
1069
1096
  const hideVimeoRecommendations = this.shouldHideVimeoRecommendations();
1070
1097
  const vimeoPremium = Boolean(this.config?.vimeo_premium);
1071
1098
  const shouldAutoplay = this.shouldAutoplay();
@@ -1075,7 +1102,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1075
1102
  }
1076
1103
  catch { }
1077
1104
  try {
1078
- this.videoRef.nativeElement.playsInline = this.config?.video_host === 'youtube';
1105
+ this.videoRef.nativeElement.playsInline =
1106
+ this.config?.video_host === "youtube";
1079
1107
  }
1080
1108
  catch { }
1081
1109
  try {
@@ -1089,7 +1117,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1089
1117
  };
1090
1118
  youtubePlayerVars.playerVars = {
1091
1119
  hl: locale,
1092
- cc_lang_pref: captionsLanguage || locale.split('-')[0]?.toLowerCase(),
1120
+ cc_lang_pref: captionsLanguage || locale.split("-")[0]?.toLowerCase(),
1093
1121
  autoplay: shouldAutoplay ? 1 : 0,
1094
1122
  mute: startMuted ? 1 : 0,
1095
1123
  playsinline: 1,
@@ -1119,11 +1147,11 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1119
1147
  container: null,
1120
1148
  },
1121
1149
  i18n: {
1122
- speed: 'Velocidade',
1150
+ speed: "Velocidade",
1123
1151
  },
1124
1152
  speed: {
1125
1153
  selected: 1,
1126
- options: speedOptions
1154
+ options: speedOptions,
1127
1155
  },
1128
1156
  clickToPlay: true,
1129
1157
  hideControls: false,
@@ -1135,7 +1163,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1135
1163
  if (captionsLanguage) {
1136
1164
  plyrOptions.captions = { language: captionsLanguage };
1137
1165
  }
1138
- if (this.config.video_host === 'youtube') {
1166
+ if (this.config.video_host === "youtube") {
1139
1167
  plyrOptions.youtube = youtubePlayerVars;
1140
1168
  }
1141
1169
  this.plyr = new Plyr.default(this.videoRef.nativeElement, plyrOptions);
@@ -1145,8 +1173,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1145
1173
  this.observeMenuChanges();
1146
1174
  this.playbackEnded = false;
1147
1175
  this.overlayBlockAll = false;
1148
- window.removeEventListener('resize', this.onResize);
1149
- window.addEventListener('resize', this.onResize);
1176
+ window.removeEventListener("resize", this.onResize);
1177
+ window.addEventListener("resize", this.onResize);
1150
1178
  this.bindProgressEvents();
1151
1179
  this.loadSource(this.videoRef.nativeElement).then(() => {
1152
1180
  this.setupStartTime();
@@ -1174,7 +1202,11 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1174
1202
  const t = this.plyr.currentTime || 0;
1175
1203
  const d = this.plyr.duration || 0;
1176
1204
  const p = d > 0 ? +((t / d) * 100).toFixed(2) : 0;
1177
- this.progressService.progress$.next({ currentTime: t, duration: d, percent: p });
1205
+ this.progressService.progress$.next({
1206
+ currentTime: t,
1207
+ duration: d,
1208
+ percent: p,
1209
+ });
1178
1210
  };
1179
1211
  const onTimeUpdate = () => {
1180
1212
  const now = performance.now();
@@ -1182,11 +1214,11 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1182
1214
  lastEmit = now;
1183
1215
  emitProgress();
1184
1216
  }
1185
- parent.postMessage('currentTime:' + (this.plyr.currentTime || 0), "*");
1186
- console.log('event: current_time ' + (this.plyr.currentTime || 0));
1187
- console.log('event: duration ' + this.plyr.duration);
1217
+ parent.postMessage("currentTime:" + (this.plyr.currentTime || 0), "*");
1218
+ console.log("event: current_time " + (this.plyr.currentTime || 0));
1219
+ console.log("event: duration " + this.plyr.duration);
1188
1220
  this.postCastEvent({
1189
- event: 'current_time',
1221
+ event: "current_time",
1190
1222
  currentTime: this.plyr.currentTime || 0,
1191
1223
  duration: this.plyr.duration || 0,
1192
1224
  });
@@ -1198,17 +1230,23 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1198
1230
  this.overlayBlockAll = false;
1199
1231
  this.updateRecommendationBlockerSafeZone();
1200
1232
  this.toggleRecommendationBlocker(false);
1233
+ this.tryEnterVimeoFullscreen();
1201
1234
  this.enforceVimeoVolumeAfterPlay();
1202
- parent.postMessage('playing_video', "*");
1203
- console.log('event: playing_video');
1204
- this.postCastEvent({ event: 'play', currentTime: this.plyr.currentTime || 0 });
1235
+ parent.postMessage("playing_video", "*");
1236
+ this.postCastEvent({
1237
+ event: "play",
1238
+ currentTime: this.plyr.currentTime || 0,
1239
+ });
1205
1240
  });
1206
1241
  this.plyr?.on?.("timeupdate", onTimeUpdate);
1207
1242
  this.plyr?.on?.("pause", () => {
1208
1243
  emitProgress();
1209
- console.log('event: pause');
1210
- parent.postMessage('paused_video', "*");
1211
- this.postCastEvent({ event: 'pause', currentTime: this.plyr.currentTime || 0 });
1244
+ console.log("event: pause");
1245
+ parent.postMessage("paused_video", "*");
1246
+ this.postCastEvent({
1247
+ event: "pause",
1248
+ currentTime: this.plyr.currentTime || 0,
1249
+ });
1212
1250
  this.overlayBlockAll = true;
1213
1251
  this.updateRecommendationBlockerSafeZone();
1214
1252
  this.toggleRecommendationBlocker(true);
@@ -1218,9 +1256,12 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1218
1256
  this.playbackEnded = true;
1219
1257
  this.overlayBlockAll = true;
1220
1258
  this.updateRecommendationBlockerSafeZone();
1221
- console.log('event: ended');
1222
- parent.postMessage('event: ended', "*");
1223
- this.postCastEvent({ event: 'ended', currentTime: this.plyr.currentTime || 0 });
1259
+ console.log("event: ended");
1260
+ parent.postMessage("event: ended", "*");
1261
+ this.postCastEvent({
1262
+ event: "ended",
1263
+ currentTime: this.plyr.currentTime || 0,
1264
+ });
1224
1265
  this.progressService.ended$.next();
1225
1266
  this.preventVimeoRecommendations();
1226
1267
  this.toggleRecommendationBlocker(true);
@@ -1249,7 +1290,7 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1249
1290
  }
1250
1291
  resetPlaybackRate(video) {
1251
1292
  try {
1252
- if (this.plyr && typeof this.plyr.speed !== 'undefined') {
1293
+ if (this.plyr && typeof this.plyr.speed !== "undefined") {
1253
1294
  this.plyr.speed = 1;
1254
1295
  }
1255
1296
  }
@@ -1278,7 +1319,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1278
1319
  this.hls = undefined;
1279
1320
  }
1280
1321
  this.resetPlaybackRate(video);
1281
- if (this.config.video_host === "youtube" || this.config.video_host === "vimeo") {
1322
+ if (this.config.video_host === "youtube" ||
1323
+ this.config.video_host === "vimeo") {
1282
1324
  const onReady = () => {
1283
1325
  this.plyr.off("ready", onReady);
1284
1326
  this.ensureIframeAutoplayPermissions();
@@ -1290,20 +1332,20 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1290
1332
  else if (this.shouldBlockIframeAutoplay()) {
1291
1333
  this.stopRestrictedIframeAutoplay();
1292
1334
  }
1293
- parent.postMessage('playerIsReadyToPlay', "*");
1294
- parent.postMessage('duration:' + this.plyr.duration, "*");
1295
- console.log('event: current_time ' + this.plyr.currentTime);
1296
- console.log('event: duration ' + this.plyr.duration);
1297
- console.log('event: ready');
1335
+ parent.postMessage("playerIsReadyToPlay", "*");
1336
+ parent.postMessage("duration:" + this.plyr.duration, "*");
1337
+ console.log("event: current_time " + this.plyr.currentTime);
1338
+ console.log("event: duration " + this.plyr.duration);
1339
+ console.log("event: ready");
1298
1340
  this.postCastEvent({
1299
- event: 'ready',
1341
+ event: "ready",
1300
1342
  duration: this.plyr.duration || 0,
1301
1343
  currentTime: this.plyr.currentTime || 0,
1302
1344
  });
1303
1345
  if (this.config.is_live) {
1304
- this.plyr?.on('playing', function () {
1305
- console.log('event: playing_live');
1306
- parent.postMessage('event: playing_live', '*');
1346
+ this.plyr?.on("playing", function () {
1347
+ console.log("event: playing_live");
1348
+ parent.postMessage("event: playing_live", "*");
1307
1349
  });
1308
1350
  }
1309
1351
  if (this.config.mirror) {
@@ -1337,10 +1379,10 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1337
1379
  else if (this.config.video_host === "hls") {
1338
1380
  let sourceX = "";
1339
1381
  try {
1340
- sourceX = atob(this.config.video_id || '');
1382
+ sourceX = atob(this.config.video_id || "");
1341
1383
  }
1342
1384
  catch (e) {
1343
- sourceX = this.config.video_id || '';
1385
+ sourceX = this.config.video_id || "";
1344
1386
  }
1345
1387
  const canNative = video.canPlayType("application/vnd.apple.mpegurl");
1346
1388
  if (canNative) {
@@ -1423,7 +1465,9 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1423
1465
  if (hasTime) {
1424
1466
  return clamp(last_time);
1425
1467
  }
1426
- const hasPercent = last_percent !== undefined && last_percent !== null && last_percent !== "";
1468
+ const hasPercent = last_percent !== undefined &&
1469
+ last_percent !== null &&
1470
+ last_percent !== "";
1427
1471
  if (hasPercent && hasValidDuration) {
1428
1472
  let p = Number(last_percent);
1429
1473
  if (!isFinite(p) || p < 0)
@@ -1444,30 +1488,32 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1444
1488
  return 0;
1445
1489
  }
1446
1490
  postCastEvent(payload) {
1447
- parent.postMessage(JSON.stringify(payload), '*');
1491
+ parent.postMessage(JSON.stringify(payload), "*");
1448
1492
  }
1449
1493
  onCastMessage = (evt) => {
1450
1494
  let data = evt.data;
1451
- if (typeof data === 'string') {
1495
+ if (typeof data === "string") {
1452
1496
  try {
1453
1497
  data = JSON.parse(data);
1454
1498
  }
1455
- catch { /* ignora */ }
1499
+ catch {
1500
+ /* ignora */
1501
+ }
1456
1502
  }
1457
- if (data?.action === 'request-iframe-media-metadata') {
1503
+ if (data?.action === "request-iframe-media-metadata") {
1458
1504
  this.postCastEvent({
1459
- event: 'metadata',
1505
+ event: "metadata",
1460
1506
  duration: this.plyr?.duration || 0,
1461
1507
  currentTime: this.plyr?.currentTime || 0,
1462
1508
  });
1463
1509
  }
1464
- if (data?.action === 'play') {
1510
+ if (data?.action === "play") {
1465
1511
  this.plyr?.play();
1466
1512
  }
1467
- if (data?.action === 'pause') {
1513
+ if (data?.action === "pause") {
1468
1514
  this.plyr?.pause();
1469
1515
  }
1470
- if (data?.action === 'seek' && typeof data.time === 'number') {
1516
+ if (data?.action === "seek" && typeof data.time === "number") {
1471
1517
  this.plyr && (this.plyr.currentTime = data.time);
1472
1518
  }
1473
1519
  };
@@ -1486,8 +1532,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1486
1532
  }
1487
1533
  if (this.recommendationBlockerActiveZone) {
1488
1534
  try {
1489
- this.recommendationBlockerActiveZone.removeEventListener('pointerdown', this.onTopBlockerPointerDown);
1490
- this.recommendationBlockerActiveZone.removeEventListener('click', this.onRecommendationBlockerClick);
1535
+ this.recommendationBlockerActiveZone.removeEventListener("pointerdown", this.onTopBlockerPointerDown);
1536
+ this.recommendationBlockerActiveZone.removeEventListener("click", this.onRecommendationBlockerClick);
1491
1537
  }
1492
1538
  catch { }
1493
1539
  }
@@ -1495,8 +1541,8 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1495
1541
  this.recommendationBlockerActiveZone = null;
1496
1542
  if (this.topClickBlocker?.parentElement) {
1497
1543
  try {
1498
- this.topClickBlocker.removeEventListener('pointerdown', this.onTopBlockerPointerDown);
1499
- this.topClickBlocker.removeEventListener('click', this.onTopBlockerClick);
1544
+ this.topClickBlocker.removeEventListener("pointerdown", this.onTopBlockerPointerDown);
1545
+ this.topClickBlocker.removeEventListener("click", this.onTopBlockerClick);
1500
1546
  this.topClickBlocker.parentElement.removeChild(this.topClickBlocker);
1501
1547
  }
1502
1548
  catch { }
@@ -1504,16 +1550,16 @@ ${allPairs.map(([n, v]) => ` ${n}: ${v};`).join('\n')}
1504
1550
  this.topClickBlocker = null;
1505
1551
  this.menuObserver?.disconnect();
1506
1552
  this.menuObserver = undefined;
1507
- window.removeEventListener('resize', this.onResize);
1553
+ window.removeEventListener("resize", this.onResize);
1508
1554
  this.plyr?.destroy();
1509
- window.removeEventListener('message', this.onCastMessage);
1555
+ window.removeEventListener("message", this.onCastMessage);
1510
1556
  }
1511
1557
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PlyrPlayerComponent, deps: [{ token: WebplayerProgressService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
1512
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PlyrPlayerComponent, isStandalone: true, selector: "app-plyr-player", inputs: { config: "config" }, outputs: { ready: "ready" }, viewQueries: [{ propertyName: "videoRef", first: true, predicate: ["video"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: `<video #video playsinline></video>`, isInline: true, styles: [":host{display:block;width:100%;height:100%;position:relative;--plyr-color-main: var(--theme-alert, #19a6d9);--plyr-color-hover: var(--theme-alert, #2dbbff);--plyr-progress-buffer-background: var(--theme-progress-view-off, rgba(255, 255, 255, .25));--plyr-control-background: var(--theme-bg, rgba(0, 0, 0, .8));--plyr-control-color: var(--theme-text-color, #fff);--plyr-control-button-color: var(--theme-font-bt, #fff)}:host ::ng-deep .plyr__controls{color:var(--plyr-control-color)!important;transition:opacity .2s ease,transform .2s ease}:host ::ng-deep .plyr__controls button{color:var(--plyr-control-color)!important}:host ::ng-deep .plyr__progress__buffer{background-color:var(--plyr-progress-buffer-background)!important}:host ::ng-deep .plyr,:host ::ng-deep .plyr__video-wrapper,:host ::ng-deep .plyr__video-embed,:host ::ng-deep .plyr__video-embed>iframe,:host ::ng-deep video{width:100%!important;height:100%!important;aspect-ratio:auto!important;top:0!important;left:0!important}:host ::ng-deep .mirror{transform:scaleX(-1)!important;-webkit-transform:scaleX(-1)!important}:host ::ng-deep .plyr--video .plyr__control.plyr__tab-focus,:host ::ng-deep .plyr--video .plyr__control:hover,:host ::ng-deep .plyr--video .plyr__control[aria-expanded=true]{background:var(--plyr-color-hover)!important;color:var(--plyr-control-button-color)!important}:host ::ng-deep .plyr--full-ui input[type=range]{color:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container{background:var(--plyr-control-background)!important;z-index:7!important}:host ::ng-deep .plyr--auto-hide-controls .plyr__controls{opacity:0!important;pointer-events:none!important;transform:translateY(12px)}:host ::ng-deep .ytp-more-videos-view .ytp-suggestions{pointer-events:none!important}:host ::ng-deep .plyr--vimeo .plyr__video-wrapper.plyr__video-embed{aspect-ratio:16 / 9!important;width:100%!important;height:auto!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1558
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PlyrPlayerComponent, isStandalone: true, selector: "app-plyr-player", inputs: { config: "config" }, outputs: { ready: "ready" }, viewQueries: [{ propertyName: "videoRef", first: true, predicate: ["video"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: `<video #video playsinline></video>`, isInline: true, styles: [":host{display:block;width:100%;height:100%;position:relative;--plyr-color-main: var(--theme-alert, #19a6d9);--plyr-color-hover: var(--theme-alert, #2dbbff);--plyr-progress-buffer-background: var( --theme-progress-view-off, rgba(255, 255, 255, .25) );--plyr-control-background: var(--theme-bg, rgba(0, 0, 0, .8));--plyr-control-color: var(--theme-text-color, #fff);--plyr-control-button-color: var(--theme-font-bt, #fff)}:host ::ng-deep .plyr__controls{color:var(--plyr-control-color)!important;transition:opacity .2s ease,transform .2s ease}:host ::ng-deep .plyr__controls button{color:var(--plyr-control-color)!important}:host ::ng-deep .plyr__progress__buffer{background-color:var(--plyr-progress-buffer-background)!important}:host ::ng-deep .plyr,:host ::ng-deep .plyr__video-wrapper,:host ::ng-deep .plyr__video-embed,:host ::ng-deep .plyr__video-embed>iframe,:host ::ng-deep video{width:100%!important;height:100%!important;aspect-ratio:auto!important;top:0!important;left:0!important}:host ::ng-deep .mirror{transform:scaleX(-1)!important;-webkit-transform:scaleX(-1)!important}:host ::ng-deep .plyr--video .plyr__control.plyr__tab-focus,:host ::ng-deep .plyr--video .plyr__control:hover,:host ::ng-deep .plyr--video .plyr__control[aria-expanded=true]{background:var(--plyr-color-hover)!important;color:var(--plyr-control-button-color)!important}:host ::ng-deep .plyr--full-ui input[type=range]{color:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container{background:var(--plyr-control-background)!important;z-index:7!important}:host ::ng-deep .plyr--auto-hide-controls .plyr__controls{opacity:0!important;pointer-events:none!important;transform:translateY(12px)}:host ::ng-deep .ytp-more-videos-view .ytp-suggestions{pointer-events:none!important}:host ::ng-deep .plyr--vimeo .plyr__video-wrapper.plyr__video-embed{aspect-ratio:16 / 9!important;width:100%!important;height:auto!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1513
1559
  }
1514
1560
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PlyrPlayerComponent, decorators: [{
1515
1561
  type: Component,
1516
- args: [{ selector: "app-plyr-player", template: `<video #video playsinline></video>`, standalone: true, imports: [CommonModule], styles: [":host{display:block;width:100%;height:100%;position:relative;--plyr-color-main: var(--theme-alert, #19a6d9);--plyr-color-hover: var(--theme-alert, #2dbbff);--plyr-progress-buffer-background: var(--theme-progress-view-off, rgba(255, 255, 255, .25));--plyr-control-background: var(--theme-bg, rgba(0, 0, 0, .8));--plyr-control-color: var(--theme-text-color, #fff);--plyr-control-button-color: var(--theme-font-bt, #fff)}:host ::ng-deep .plyr__controls{color:var(--plyr-control-color)!important;transition:opacity .2s ease,transform .2s ease}:host ::ng-deep .plyr__controls button{color:var(--plyr-control-color)!important}:host ::ng-deep .plyr__progress__buffer{background-color:var(--plyr-progress-buffer-background)!important}:host ::ng-deep .plyr,:host ::ng-deep .plyr__video-wrapper,:host ::ng-deep .plyr__video-embed,:host ::ng-deep .plyr__video-embed>iframe,:host ::ng-deep video{width:100%!important;height:100%!important;aspect-ratio:auto!important;top:0!important;left:0!important}:host ::ng-deep .mirror{transform:scaleX(-1)!important;-webkit-transform:scaleX(-1)!important}:host ::ng-deep .plyr--video .plyr__control.plyr__tab-focus,:host ::ng-deep .plyr--video .plyr__control:hover,:host ::ng-deep .plyr--video .plyr__control[aria-expanded=true]{background:var(--plyr-color-hover)!important;color:var(--plyr-control-button-color)!important}:host ::ng-deep .plyr--full-ui input[type=range]{color:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container{background:var(--plyr-control-background)!important;z-index:7!important}:host ::ng-deep .plyr--auto-hide-controls .plyr__controls{opacity:0!important;pointer-events:none!important;transform:translateY(12px)}:host ::ng-deep .ytp-more-videos-view .ytp-suggestions{pointer-events:none!important}:host ::ng-deep .plyr--vimeo .plyr__video-wrapper.plyr__video-embed{aspect-ratio:16 / 9!important;width:100%!important;height:auto!important}\n"] }]
1562
+ args: [{ selector: "app-plyr-player", template: `<video #video playsinline></video>`, standalone: true, imports: [CommonModule], styles: [":host{display:block;width:100%;height:100%;position:relative;--plyr-color-main: var(--theme-alert, #19a6d9);--plyr-color-hover: var(--theme-alert, #2dbbff);--plyr-progress-buffer-background: var( --theme-progress-view-off, rgba(255, 255, 255, .25) );--plyr-control-background: var(--theme-bg, rgba(0, 0, 0, .8));--plyr-control-color: var(--theme-text-color, #fff);--plyr-control-button-color: var(--theme-font-bt, #fff)}:host ::ng-deep .plyr__controls{color:var(--plyr-control-color)!important;transition:opacity .2s ease,transform .2s ease}:host ::ng-deep .plyr__controls button{color:var(--plyr-control-color)!important}:host ::ng-deep .plyr__progress__buffer{background-color:var(--plyr-progress-buffer-background)!important}:host ::ng-deep .plyr,:host ::ng-deep .plyr__video-wrapper,:host ::ng-deep .plyr__video-embed,:host ::ng-deep .plyr__video-embed>iframe,:host ::ng-deep video{width:100%!important;height:100%!important;aspect-ratio:auto!important;top:0!important;left:0!important}:host ::ng-deep .mirror{transform:scaleX(-1)!important;-webkit-transform:scaleX(-1)!important}:host ::ng-deep .plyr--video .plyr__control.plyr__tab-focus,:host ::ng-deep .plyr--video .plyr__control:hover,:host ::ng-deep .plyr--video .plyr__control[aria-expanded=true]{background:var(--plyr-color-hover)!important;color:var(--plyr-control-button-color)!important}:host ::ng-deep .plyr--full-ui input[type=range]{color:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:var(--plyr-color-main)!important}:host ::ng-deep .plyr__menu__container{background:var(--plyr-control-background)!important;z-index:7!important}:host ::ng-deep .plyr--auto-hide-controls .plyr__controls{opacity:0!important;pointer-events:none!important;transform:translateY(12px)}:host ::ng-deep .ytp-more-videos-view .ytp-suggestions{pointer-events:none!important}:host ::ng-deep .plyr--vimeo .plyr__video-wrapper.plyr__video-embed{aspect-ratio:16 / 9!important;width:100%!important;height:auto!important}\n"] }]
1517
1563
  }], ctorParameters: () => [{ type: WebplayerProgressService }, { type: Document, decorators: [{
1518
1564
  type: Inject,
1519
1565
  args: [DOCUMENT]