Funorb - Make game.html load game and attributes based on URL param

This commit is contained in:
dginovker 2023-05-08 00:56:43 +09:00
parent 96c4506362
commit 27f85fd1d9
2 changed files with 76 additions and 28 deletions

View File

@ -0,0 +1,44 @@
{
"ageofwar": {
"name": "Age of War",
"image": "./img/ageofwar.avif",
"swf": "./swfs/ageofwar.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=383-age-of-war"
},
"bloonstd1": {
"name": "Bloons TD 1",
"image": "./img/bloonstd1.avif",
"swf": "./swfs/bloonstd1.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=384-bloons-tower-defense-1"
},
"bloonstd2": {
"name": "Bloons TD 2",
"image": "./img/bloonstd2.avif",
"swf": "./swfs/bloonstd2.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=391-bloons-tower-defense-2"
},
"bloonstd3": {
"name": "Bloons TD 3",
"image": "./img/bloonstd3.avif",
"swf": "./swfs/bloonstd3.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=436-bloons-tower-defense-3"
},
"flashsonic": {
"name": "Flash Sonic",
"image": "./img/flashsonic.avif",
"swf": "./swfs/flashsonic.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=385-flash-sonic"
},
"learntofly2": {
"name": "Learn to Fly 2",
"image": "./img/learntofly2.avif",
"swf": "./swfs/learntofly2.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=437-learn-to-fly-2"
},
"worldshardestgame": {
"name": "World's Hardest Game",
"image": "./img/worldshardestgame.avif",
"swf": "./swfs/worldshardestgame.swf",
"forum": "https://forum.2009scape.org/viewtopic.php?t=386-world-s-hardest-game"
}
}

View File

@ -99,15 +99,12 @@ en">
<div id="theGameScreen" style="height: max-content;"> <div id="theGameScreen" style="height: max-content;">
<script src="https://unpkg.com/@ruffle-rs/ruffle"></script> <script src="https://unpkg.com/@ruffle-rs/ruffle"></script>
<div style="text-align: center; padding-top: 1.5rem; padding-bottom: 1.5rem;"> <div style="text-align: center; padding-top: 1.5rem; padding-bottom: 1.5rem;">
<object> <div id="swfgamecontainer">
<param name="play" id="swfParam"> </div>
<embed id="swfEmbed">
</embed>
</object>
</div> </div>
<span class="headertitleleft"><span class="headertitleright"> <span class="headertitleleft"><span class="headertitleright">
<a href="SetInJS" id="talkInForms">Talk about it on the Forums!</a> <a href="SetInJS" id="talkInForums">Talk about it on the Forums!</a>
</span></span> </span></span>
<p>If the keyboard stops working, try clicking on the game.</p> <p>If the keyboard stops working, try clicking on the game.</p>
@ -119,7 +116,7 @@ en">
<div id="bookmark"> <div id="bookmark">
<span class="bmtg">More about this game:</span> <span class="bmtg">More about this game:</span>
<a href="SetInJS" id="talkInForms2" <a href="SetInJS" id="talkInForums2"
target="_blank" title="Talk about this game on the Forums" target="_blank" title="Talk about this game on the Forums"
><img ><img
src="../../site/img/forum/icons/off_topic_2.gif" src="../../site/img/forum/icons/off_topic_2.gif"
@ -165,29 +162,36 @@ en">
</table> </table>
<script> <script>
const data = { fetch("data.json")
"ageofwar": { .then(async response => {
"name": "Age of War", console.log(response)
"image": "./img/ageofwar.avif", const data = await response.json();
"swf": "./swfs/ageofwar.swf", console.log(data);
"forumPost": "https://forum.2009scape.org/viewtopic.php?t=383-age-of-war" // Get the current game parameter from URL
} const urlParams = new URLSearchParams(window.location.search);
} const game = urlParams.get('game');
// Get the current game parameter from URL // Get the game data from the JSON file
const urlParams = new URLSearchParams(window.location.search); const gameData = data[game];
const game = urlParams.get('game'); console.log(gameData);
// Get the game data from the JSON file
const gameData = data[game];
if (!gameData) { if (!gameData) {
document.getElementById('warning').innerHTML = `Game '${game}' Not Found!`; document.getElementById('warning').innerHTML = `Game '${game}' Not Found!`;
document.getElementById('notFound').style.display = ''; document.getElementById('notFound').style.display = '';
} }
document.getElementById('swfParam').setAttribute('value', gameData?.swf); window.RufflePlayer = window.RufflePlayer || {};
document.getElementById('swfEmbed').setAttribute('src', gameData?.swf); window.addEventListener("load", (event) => {
document.getElementById('talkInForms').setAttribute('href', gameData?.forum || "https://forum.2009scape.org/viewforum.php?f=26-website-games"); const ruffle = window.RufflePlayer.newest();
document.getElementById('talkInForms2').setAttribute('href', gameData?.forum || "https://forum.2009scape.org/viewforum.php?f=26-website-games"); const player = ruffle.createPlayer();
const container = document.getElementById("swfgamecontainer");
container.appendChild(player);
player.load(gameData.swf);
player.style.width = "680px";
player.style.height = "480px";
});
document.getElementById('talkInForums').setAttribute('href', gameData?.forum || "https://forum.2009scape.org/viewforum.php?f=26-website-games");
document.getElementById('talkInForums2').setAttribute('href', gameData?.forum || "https://forum.2009scape.org/viewforum.php?f=26-website-games");
});
</script> </script>
</body> </body>