Use webp images

This commit is contained in:
Daniel Bulant 2021-02-23 09:35:09 +01:00
parent 85a15fdcf4
commit c39efb36d4
35 changed files with 98 additions and 21 deletions

View file

@ -2,7 +2,7 @@
A fan-made game inspired by Helltaker. Art by u/hohodo.
![Characters](images/characters.png)
![Characters](public/sprite/characters.webp)
## Play it

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.1 KiB

BIN
public/icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

BIN
public/icon_192.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

View file

@ -3,16 +3,20 @@
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<meta name="description" content="A helltaker inspired holy game.">
<title>Svelte app</title>
<title>Heaventaker</title>
<link rel='icon' type='image/png' href='/favicon.png'>
<link rel='icon' type='image/png' href='/icon_192.png'>
<link rel="preload" href="/times.woff2">
<link rel='stylesheet' href='/global.css'>
<link rel='stylesheet' href='/build/bundle.css'>
<script defer src='/build/bundle.js'></script>
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#333">
</head>
<body>
<noscript>You seem to have javascript off. You're web developers nightmare. Please become helltaker.</noscript>
</body>
</html>

29
public/manifest.json Normal file
View file

@ -0,0 +1,29 @@
{
"short_name": "Heaventaker",
"name": "Heaventaker",
"icons": [
{
"src": "/icon_192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "/icon.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": "/?source=pwa",
"background_color": "#333",
"display": "fullscreen",
"categories": ["games", "entertainment", "heaven"],
"scope": "/",
"theme_color": "#333",
"description": "Helltaker inspired holy game",
"orientation": "landscape",
"screenshots": [{
"src": "/sprite/characters.png",
"sizes": "640x381",
"type": "image/png"
}]
}

40
public/service-worker.js Normal file
View file

@ -0,0 +1,40 @@
self.addEventListener('install', function (event) {
event.waitUntil(
caches.open("main").then(function (cache) {
return cache.addAll(
[
"/",
"/global.css",
"/times.woff2",
"/icon.png",
"/build/bundle.css",
"/build/bundle.js",
"/sound/success.wav",
"/sound/thought_patterns.m4a",
"/sprite/backg.webp",
"/sprite/button1.webp",
"/sprite/button2.webp",
"/sprite/michael_happy.webp",
"/sprite/michael_normal.webp",
"/sprite/michael_wings.webp",
"/sprite/uriel_bat.webp",
"/sprite/uriel_normal.webp",
"/sprite/uriel_side_happy.webp",
"/sprite/uriel_side_normal.webp",
]
);
})
);
});
self.addEventListener('fetch', function (event) {
event.respondWith(
caches.match(event.request).then(function (response) {
return response || fetch(event.request);
})
);
});

BIN
public/sprite/backg.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

BIN
public/sprite/button.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

BIN
public/sprite/button1.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
public/sprite/button2.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 288 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

View file

Before

Width:  |  Height:  |  Size: 316 KiB

After

Width:  |  Height:  |  Size: 316 KiB

View file

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB

View file

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

View file

Before

Width:  |  Height:  |  Size: 6.8 KiB

After

Width:  |  Height:  |  Size: 6.8 KiB

View file

Before

Width:  |  Height:  |  Size: 153 KiB

After

Width:  |  Height:  |  Size: 153 KiB

View file

Before

Width:  |  Height:  |  Size: 354 KiB

After

Width:  |  Height:  |  Size: 354 KiB

View file

Before

Width:  |  Height:  |  Size: 351 KiB

After

Width:  |  Height:  |  Size: 351 KiB

View file

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

View file

Before

Width:  |  Height:  |  Size: 437 KiB

After

Width:  |  Height:  |  Size: 437 KiB

View file

Before

Width:  |  Height:  |  Size: 377 KiB

After

Width:  |  Height:  |  Size: 377 KiB

View file

Before

Width:  |  Height:  |  Size: 404 KiB

After

Width:  |  Height:  |  Size: 404 KiB

View file

Before

Width:  |  Height:  |  Size: 380 KiB

After

Width:  |  Height:  |  Size: 380 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

View file

@ -4,4 +4,8 @@ const app = new App({
target: document.body
});
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/service-worker.js');
}
export default app;

View file

@ -12,7 +12,7 @@
max-width: 700px;
position: relative;
font-size: 25px;
background: url("/sprite/button2.png");
background: url("/sprite/button2.webp");
background-size: auto 100%;
background-repeat: repeat-x;
padding: 5px 70px;
@ -27,7 +27,7 @@
content: "";
height: 43px;
width: 64px;
background: url("/sprite/button1.png");
background: url("/sprite/button1.webp");
background-size: contain;
left: -64px;
top: 0;
@ -37,7 +37,7 @@
content: "";
height: 43px;
width: 64px;
background: url("/sprite/button1.png");
background: url("/sprite/button1.webp");
background-size: contain;
right: -64px;
top: 0;

View file

@ -1,18 +1,18 @@
export const characters = [{
name: "Michael",
art: "/sprite/michael_normal.png",
art: "/sprite/michael_normal.webp",
title: "the high marshal",
poses: {
wings: "/sprite/michael_wings.png",
happy: "/sprite/michael_happy.png"
wings: "/sprite/michael_wings.webp",
happy: "/sprite/michael_happy.webp"
}
}, {
name: "Uriel",
art: "/sprite/uriel_normal.png",
art: "/sprite/uriel_normal.webp",
title: "the gate guardian",
poses: {
side_normal: "/sprite/uriel_side_normal.png",
side_happy: "/sprite/uriel_side_happy.png",
bat: "/sprite/uriel_bat.png"
side_normal: "/sprite/uriel_side_normal.webp",
side_happy: "/sprite/uriel_side_happy.webp",
bat: "/sprite/uriel_bat.webp"
}
}];

View file

@ -1,6 +1,6 @@
export const dialog = [{
name: "uriel_entrance",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Uriel",
pose: "side_normal",
text: "Ummm... I don't want to be rude so just leave or go to the main gate.",
@ -13,27 +13,27 @@ export const dialog = [{
}]
}, {
name: "uriel_restart",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Uriel",
text: "Really dude? Well if you insist, let's start from the beggining",
next: "uriel_failure"
}, {
name: "uriel_failure",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Uriel",
text: "You picked the wrong gate fool.",
next: "uriel_entrance",
pose: "bat"
}, {
name: "uriel_success",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Uriel",
text: "Well since it already got boring around here, and how can I say no to pancakes.",
flags: ["success"],
next: "michael_heretic"
}, {
name: "michael_heretic",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Michael",
text: "How did you... You know what I don't even care. Heretic like you needs to be punished.",
buttons: [{
@ -45,7 +45,7 @@ export const dialog = [{
}]
}, {
name: "michael_success",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Michael",
pose: "happy",
text: "Really? Well, big man: if you survive this whole ordeal, prepare a room and we shall see how into this shit you really are",
@ -53,7 +53,7 @@ export const dialog = [{
next: "uriel_entrance"
}, {
name: "michael_failure",
background: "/sprite/backg.png",
background: "/sprite/backg.webp",
character: "Michael",
text: "I also have something to offer: eat shit and die.",
pose: "wings",