{"version":3,"names":[],"mappings":"","sources":["block-media-text-autoplay.js"],"sourcesContent":["const video_play_svg = `<svg fill=\"currentColor\" viewBox=\"0 0 512 512\" xmlns=\"http://www.w3.org/2000/svg\">\n\t<path class=\"icon icon-play\"\n\t\td=\"M0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zM188.3 147.1c-7.6 4.2-12.3 12.3-12.3 20.9V344c0 8.7 4.7 16.7 12.3 20.9s16.8 4.1 24.3-.5l144-88c7.1-4.4 11.5-12.1 11.5-20.5s-4.4-16.1-11.5-20.5l-144-88c-7.4-4.5-16.7-4.7-24.3-.5z\" />\n\t<path class=\"icon icon-pause\" \n\t\td=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM224 192V320c0 17.7-14.3 32-32 32s-32-14.3-32-32V192c0-17.7 14.3-32 32-32s32 14.3 32 32zm128 0V320c0 17.7-14.3 32-32 32s-32-14.3-32-32V192c0-17.7 14.3-32 32-32s32 14.3 32 32z\" />\n</svg>\n\t<span class=\"label | visually-hidden\">Play</span>`;\n\nfunction setVideoPlaybackPause(video, button) {\n\tvideo.classList.remove(\"is-playing\");\n\tbutton.classList.remove(\"is-playing\");\n\n\tbutton.title = button.querySelector(\".label\").innerText = \"Play Video\";\n}\n\nfunction setVideoPlaybackPlay(video, button) {\n\tvideo.classList.add(\"is-playing\");\n\tbutton.classList.add(\"is-playing\");\n\n\tbutton.title = button.querySelector(\".label\").innerText = \"Pause Video\";\n}\n\nfunction autoplayMediaTextVideo() {\n\t// Do nothing if IntersectionObserver isn't supported\n\tif (!(\"IntersectionObserver\" in window)) {\n\t\tconsole.log(\"IntersectionObserver is not supported\");\n\t\treturn false;\n\t}\n\n\t// Do nothing if browser is set to reduced motion\n\tif (!window.matchMedia(\"(prefers-reduced-motion: no-preference)\")) {\n\t\tconsole.log(\"browser either doesn't support prefers-reduced-motion or is set to prefers-reduced-motion: reduced\");\n\t\treturn false;\n\t}\n\n\tconst observerThreshold = 0;\n\n\t// Set up observer\n\tvar videoObserver = new IntersectionObserver(\n\t\tfunction (entries, observer) {\n\t\t\tentries.forEach(function (entry) {\n\t\t\t\tif (entry.isIntersecting) {\n\t\t\t\t\tlet video = entry.target;\n\t\t\t\t\tvideo.play();\n\n\t\t\t\t\t// observer.unobserve(entry.target);\n\t\t\t\t}\n\t\t\t});\n\t\t},\n\t\t{ threshold: observerThreshold }\n\t);\n\n\t// Find all video elements\n\tdocument.querySelectorAll(\".wp-block-media-text__media video\").forEach(function (video) {\n\t\tvideo.setAttribute(\"loop\", \"\");\n\t\tvideo.setAttribute(\"muted\", \"\");\n\t\tvideo.setAttribute(\"playsinline\", \"\");\n\n\t\t// Activate observer\n\t\tvideoObserver.observe(video);\n\t});\n}\nautoplayMediaTextVideo();\n\ndocument.querySelectorAll(\".wp-block-media-text video\").forEach(function (video) {\n\tconst play_button = document.createElement(\"button\");\n\n\tvideo.removeAttribute(\"controls\");\n\n\tplay_button.classList.add(\"video-play-button\");\n\tplay_button.innerHTML = video_play_svg;\n\tplay_button.title = play_button.innerText.trim();\n\n\tplay_button.addEventListener(\"click\", function () {\n\t\tif (video.paused) {\n\t\t\tvideo.play();\n\t\t} else {\n\t\t\tvideo.pause();\n\t\t}\n\t});\n\tplay_button.removeAttribute(\"hidden\");\n\n\tvideo.addEventListener(\"play\", function (event) {\n\t\tsetVideoPlaybackPlay(video, play_button);\n\t});\n\tvideo.addEventListener(\"pause\", function (event) {\n\t\tsetVideoPlaybackPause(video, play_button);\n\t});\n\n\tvideo.parentNode.appendChild(play_button);\n\tvideo.parentNode.classList.add(\"has-custom-video-controls\");\n});\n"],"file":"block-media-text-autoplay.js"}