diff --git a/js/loading.js b/js/loading.js index 93c5b95b..e3d3aa6b 100644 --- a/js/loading.js +++ b/js/loading.js @@ -25,9 +25,63 @@ fetch("./config.jsonc").then((e) => e.text()).then((jsonc) => { let gamesList = $("#gamesList"); for (game in games) { - gamesList.append(`
  • ${game}
  • `); + gamesList.append(`
  • ${game}
  • `); } + let starredGamesList = JSON.parse(localStorage.getItem('starredGamesList')) || []; + const stars = document.querySelectorAll('.star'); + stars.forEach(star => { + star.addEventListener('click', function (event) { + + event.preventDefault(); + event.stopPropagation(); + star.classList.toggle('filled'); + + const gameItem = star.parentNode; + var gameName = gameItem.textContent; + const isStarred = starredGamesList.includes(gameName); + + if (isStarred) { + starredGamesList = starredGamesList.filter(gameName => gameName !== gameName); + + //THIS DOES NOT PUT THE GAME BACK IN ORDER ACCORDING TO THE WAY THE USER SORTED IT + //so for the weird ppl that sort by reverse alphabetical it should act pretty weird + //this is bc im layz and copy pasted this alphabetical sort thing, ill implement based off users sort later + const gameItem = star.closest('li'); + const parent = gameItem.parentNode; + + const originalPosition = Array.from(parent.children) + .sort((a, b) => a.textContent.localeCompare(b.textContent)) + .findIndex(item => item === gameItem); + + parent.removeChild(gameItem); + + parent.insertBefore(gameItem, parent.children[originalPosition]); + } else { + starredGamesList.unshift(gameName); + } + + localStorage.setItem('starredGamesList', JSON.stringify(starredGamesList)); + updateGameList(); + }); + }); + function updateGameList() { + const gamesList = document.getElementById('gamesList'); + const children = Array.from(gamesList.children); + + children.forEach(gameItem => { + const currentGameName = gameItem.textContent; + const stars = gameItem.querySelector('.star'); + + if (starredGamesList.includes(currentGameName)) { + stars.classList.add('filled'); + gamesList.insertBefore(gameItem, gamesList.firstChild); + } + }); + } + + updateGameList(); + $("#gamesList li").on("click", function() { let url = $(this).attr("url"); inGame = true;