https://www.giardino-marling.com/media/mod_altea_headervideo/js/toggle-play.js?061763

1/**
2 * mod_altea_headervideo — floating play / pause button.
3 *
4 * Vanilla JS, no jQuery. Each button is bound to the video whose id it carries
5 * in data-ahv-video, so any number of module instances can coexist on a page.
6 *
7 * @copyright  (C) Altea. All rights reserved.
8 * @license    GNU General Public License version 2 or later
9 */
10(function () {
11	'use strict';
12
13	function bind(button) {
14		if (button.dataset.ahvPlayBound === '1') {
15			return;
16		}
17
18		var video = document.getElementById(button.dataset.ahvVideo || '');
19
20		if (!video) {
21			return;
22		}
23
24		button.dataset.ahvPlayBound = '1';
25
26		var labelPlay = button.dataset.ahvLabelPlay || 'Play video';
27		var labelPause = button.dataset.ahvLabelPause || 'Pause video';
28
29		function sync() {
30			var playing = !video.paused && !video.ended;
31
32			button.setAttribute('aria-pressed', playing ? 'true' : 'false');
33			button.setAttribute('aria-label', playing ? labelPause : labelPlay);
34			button.setAttribute('title', playing ? labelPause : labelPlay);
35		}
36
37		button.addEventListener('click', function () {
38			if (video.paused || video.ended) {
39				var playing = video.play();
40
41				if (playing && typeof playing.catch === 'function') {
42					playing.catch(function () {
43						// Playback refused by the browser: the button stays on "play".
44						sync();
45					});
46				}
47			} else {
48				video.pause();
49			}
50		});
51
52		// Keep the button in sync whatever starts or stops the video
53		// (autoplay, native controls, the responsive source switcher, ...).
54		video.addEventListener('play', sync);
55		video.addEventListener('pause', sync);
56		video.addEventListener('ended', sync);
57
58		sync();
59	}
60
61	function init() {
62		var buttons = document.querySelectorAll('.altea-headervideo__toggle-play');
63		var i;
64
65		for (i = 0; i < buttons.length; i++) {
66			bind(buttons[i]);
67		}
68	}
69
70	if (document.readyState === 'loading') {
71		document.addEventListener('DOMContentLoaded', init);
72	} else {
73		init();
74	}
75})();