Új hozzászólás Aktív témák

  • nevemfel

    senior tag

    Na, gyorsan átírtam. Messze van a tökéletestől, de többre már tényleg nincs időm.

    <script>
            // video api
            // Load the IFrame Player API code asynchronously.
            var tag = document.createElement("script");
            tag.src = "https://www.youtube.com/player_api";
            var firstScriptTag = document.getElementsByTagName("script")[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
            // Replace the 'ytplayer' element with an <iframe> and
            // YouTube player after the API code downloads.
            var player, btn;
            function onYouTubePlayerAPIReady() {
                player = new YT.Player("ytplayer", {
                    height: "100%",
                    width: "100%",
                    playerVars: {
                        loop: 1,
                        controls: 0,
                        showinfo: 0,
                        autohide: 1,
                        modestbranding: 1,
                        vq: "hd1080",
                    },
                    events: {
                        // Ezzel lehet reagálni a "videó betöltött" eseményre
                        onReady: function (event) {
                            btn = document.getElementById("gomb");
                            // Reagálás kattintás eseményre
                            btn.addEventListener("click", function () {
                                if (player.getPlayerState() === 1) {
                                    event.target.pauseVideo();
                                } else {
                                    event.target.playVideo();
                                }
                            });
                        },
                        onStateChange: function () {
                            btn = document.getElementById("gomb");
                            if (player.getPlayerState() === 1) {
                                btn.innerHTML = "Szünet";
                            } else {
                                btn.innerHTML = "Indítás";
                            }
                        }
                    },
                    videoId: "",
                });
            }
            // video api vege
            // MODAL kezdete
            const openModalButtons = document.querySelectorAll("[data-modal-target]");
            const closeModalButtons = document.querySelectorAll("[data-close-button]");
            const overlay = document.getElementById("overlay");
            openModalButtons.forEach(function (button) {
                button.addEventListener("click", function () {
                    const modal = document.querySelector(button.dataset.modalTarget);
                    openModal(modal, button.id);
                })
            })
            overlay.addEventListener("click", function () {
                const modals = document.querySelectorAll(".modal.active")
                modals.forEach(function (modal) {
                    closeModal(modal);
                })
            })
            closeModalButtons.forEach(function (button) {
                button.addEventListener("click", function () {
                    const modal = button.closest(".modal");
                    closeModal(modal);
                })
            })
            function openModal(modal, videoId) {
                modal.classList.add("active");
                overlay.classList.add("active");
                player.cueVideoById(videoId);
            }
            function closeModal(modal) {
                modal.classList.remove("active");
                overlay.classList.remove("active");
                player.pauseVideo();
            }
        </script>

Új hozzászólás Aktív témák