Spaces:
Running
Running
| <html lang="id"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | |
| <title>Ark Re Code Scraper</title> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body> | |
| <!-- Background Video --> | |
| <video id="bgVideo" autoplay loop muted> | |
| <source src="https://video.twimg.com/ext_tw_video/1892164405464629249/pu/vid/avc1/1280x720/cgW9XdNOX1DPI6Rq.mp4" type="video/mp4"> | |
| </video> | |
| <div class="container"> | |
| <h1>Ark Re Code Scraper</h1> | |
| <label for="charName">Cari Karakter:</label> | |
| <input type="text" id="charName" placeholder="Masukkan nama karakter..."> | |
| <button onclick="fetchData()">Cari</button> | |
| <br> | |
| <button onclick="playVideo('Edalia')">Edalia</button> | |
| <button onclick="playVideo('Ermes')">Ermes</button> | |
| <div id="result"></div> | |
| </div> | |
| <!-- Tempat Video Ditampilkan --> | |
| <div id="videoWrapper"></div> | |
| <script> | |
| function playVideo(charName) { | |
| const fileName = `Ark Re Code - ${charName}.mp4`; | |
| const videoPath = `https://gilbertclaus.pythonanywhere.com/video/Ark ReCode/${fileName}`; | |
| const encodedURL = encodeURI(videoPath); | |
| const wrapper = document.getElementById("videoWrapper"); | |
| wrapper.innerHTML = ""; | |
| const video = document.createElement("video"); | |
| video.src = encodedURL; | |
| video.width = 360; | |
| video.controls = true; | |
| video.autoplay = true; | |
| video.volume = 0.1; | |
| video.style.marginTop = "20px"; | |
| wrapper.appendChild(video); | |
| } | |
| function fetchData() { | |
| const name = document.getElementById("charName").value; | |
| alert(`Fungsi fetchData untuk karakter "${name}" belum diimplementasikan`); | |
| } | |
| </script> | |
| </body> | |
| </html> | |