Uninstall button

This commit is contained in:
rift 2024-08-14 23:33:16 -05:00
parent 088071fa38
commit 053f2c1e66
4 changed files with 123 additions and 82 deletions

BIN
database_back.sqlite Normal file

Binary file not shown.

View file

@ -150,31 +150,31 @@ app.use("/scripts/", express.static("./database_assets/scripts"));
app.use(ssrHandler); app.use(ssrHandler);
app.use(express.static(publicPath)); app.use(express.static(publicPath));
// await catalog_assets.create({ await catalog_assets.create({
// package_name: "com.nebula.cybermonay", package_name: "com.nebula.cybermonay",
// title: "Cyber Monay", title: "Cyber Monay",
// image: "cyber_monay.jpg", image: "cyber_monay.jpg",
// author: "Nebula Services", author: "Nebula Services",
// version: "1.0.0", version: "1.0.0",
// description: 'A parody of the famous "Cyber Monay" hack!', description: 'A parody of the famous "Cyber Monay" hack!',
// tags: ["Hacking", "Animated", "Funny"], tags: ["Hacking", "Animated", "Funny"],
// payload: "com.nebula.cybermonay.css", payload: "com.nebula.cybermonay.css",
// background_video: "cyber_monay_test.mp4", background_video: "cyber_monay_test.mp4",
// type: "theme", type: "theme",
// }); });
// await catalog_assets.create({ await catalog_assets.create({
// package_name: "com.nebula.fortnite.jpg", package_name: "com.nebula.fortnite.jpg",
// title: "Fortnite.jpg", title: "Fortnite.jpg",
// image: "fortnite.jpg", image: "fortnite.jpg",
// author: "Nebula Services", author: "Nebula Services",
// version: "1.0.0", version: "1.0.0",
// description: "Like the image in Ultraviolet, now on Nebula!", description: "Like the image in Ultraviolet, now on Nebula!",
// tags: ["Image", "Funny"], tags: ["Image", "Funny"],
// payload: "com.nebula.cybermonay.css", payload: "com.nebula.cybermonay.css",
// background_image: "fortnite.jpg", background_image: "fortnite.jpg",
// type: "theme", type: "theme",
// }); });
catalog_assets.sync(); catalog_assets.sync();
const server = createServer(); const server = createServer();

View file

@ -1,5 +1,6 @@
<script> <script>
let assetPromise = get_assets(); let assetPromise = get_assets();
async function get_assets() { async function get_assets() {
const response = await fetch("/api/catalog-assets"); const response = await fetch("/api/catalog-assets");
const data = await response.json(); const data = await response.json();
@ -11,42 +12,52 @@
{#await assetPromise} {#await assetPromise}
Loading assets... Loading assets...
{:then assets} {:then assets}
<div class="flex flex-row gap-6 flex-wrap"> {#if Object.keys(assets).length > 1}
{#each Object.entries(assets) as [key, asset]} <div class="flex flex-row gap-6 flex-wrap">
<a href={"/assets/" + key}> {#each Object.entries(assets) as [key, asset]}
<div <a href={"/assets/" + key}>
class="bg-navbar-color w-64 rounded-3xl shadow-lg overflow-hidden transition-transform duration-300 hover:scale-105" <div
> class="bg-navbar-color w-64 rounded-3xl shadow-lg overflow-hidden transition-transform duration-300 hover:scale-105"
<img >
src={"/images/" + asset.image} <img
alt={asset.title} src={"/images/" + asset.image}
class="w-full h-40 object-cover" alt={asset.title}
/> class="w-full h-40 object-cover"
<div class="p-6 text-sm"> />
<div class="font-semibold text-2xl mb-2"> <div class="p-6 text-sm">
{asset.title} <div class="font-semibold text-2xl mb-2">
{asset.title}
</div>
<div class="mb-4">{asset.description}</div>
<div class="flex flex-wrap gap-2 mb-4">
{#each asset.tags as tag}
<div
class="bg-navbar-text-color text-navbar-color font-bold px-3 py-1 rounded-md text-center"
>
{tag}
</div>
{/each}
</div>
<div>
<strong>Version:</strong>
{asset.version}
</div>
<div><strong>Type:</strong> {asset.type}</div>
</div> </div>
<div class="mb-4">{asset.description}</div>
<div class="flex flex-wrap gap-2 mb-4">
{#each asset.tags as tag}
<div
class="bg-navbar-text-color text-navbar-color font-bold px-3 py-1 rounded-md text-center"
>
{tag}
</div>
{/each}
</div>
<div>
<strong>Version:</strong>
{asset.version}
</div>
<div><strong>Type:</strong> {asset.type}</div>
</div> </div>
</div> </a>
</a> {/each}
{/each} </div>
</div> {:else}
<div class="text-2xl text-center text-text-color mt-6 w-96">
No assets available at the moment. The server host's database is empty.
Please contact the maintainer of this site if you think this is an
error.
</div>
{/if}
{:catch someError} {:catch someError}
System error: {someError.message}. <div class="text-lg text-center text-red-500 mt-6">
System error: {someError.message}.
</div>
{/await} {/await}
</div> </div>

View file

@ -62,35 +62,65 @@ const assets_json = await response.json();
} }
</div> </div>
<script is:inline define:vars={{ assets_json, package_name }}> <script is:inline define:vars={{ assets_json, package_name }}>
// determine if this is installed
let items = JSON.parse(localStorage.getItem("installed_themes")) || [];
const packageExists = items.indexOf(package_name) !== -1;
if (packageExists) {
document.getElementById("install").textContent = "Uninstall";
}
document.getElementById("install").addEventListener("click", install); document.getElementById("install").addEventListener("click", install);
function install() { function install() {
let installedThemes = localStorage.getItem("installed_themes"); if (packageExists) {
const index = items.indexOf(package_name);
items.splice(index, 1);
localStorage.setItem("installed_themes", JSON.stringify(items));
if (installedThemes) { localStorage.removeItem("background_video");
// If it exists, append it
installedThemes = JSON.parse(installedThemes);
installedThemes.push(package_name);
} else {
// If it doesn't exist, create a new array
installedThemes = [package_name];
}
localStorage.setItem("installed_themes", JSON.stringify(installedThemes));
if (assets_json.background_video) {
localStorage.setItem("background_video", assets_json.background_video);
} else {
localStorage.removeItem("video");
}
if (assets_json.background_image) {
localStorage.setItem("background_image", assets_json.background_image);
} else {
localStorage.removeItem("background_image"); localStorage.removeItem("background_image");
localStorage.removeItem("stylesheet");
location.reload();
} else {
console.log("Package does not exist in the items array.");
let installedThemes = localStorage.getItem("installed_themes");
if (installedThemes) {
// If it exists, append it
installedThemes = JSON.parse(installedThemes);
installedThemes.push(package_name);
} else {
// If it doesn't exist, create a new array
installedThemes = [package_name];
}
localStorage.setItem(
"installed_themes",
JSON.stringify(installedThemes)
);
if (assets_json.background_video) {
localStorage.setItem(
"background_video",
assets_json.background_video
);
} else {
localStorage.removeItem("video");
}
if (assets_json.background_image) {
localStorage.setItem(
"background_image",
assets_json.background_image
);
} else {
localStorage.removeItem("background_image");
}
if (assets_json.type == "theme") {
localStorage.setItem("stylesheet", "/styles/" + assets_json.payload);
}
location.reload();
} }
if (assets_json.type == "theme") {
localStorage.setItem("stylesheet", "/styles/" + assets_json.payload);
}
location.reload();
} }
</script> </script>
</Layout> </Layout>