feat: update vn

This commit is contained in:
ktyl 2024-03-07 00:22:04 +00:00
parent 850c9cf153
commit 3ea8ddd37d
75 changed files with 115 additions and 39 deletions

View File

@ -3,14 +3,22 @@
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<html> <html>
<body> <body onload="advance()">
<div class="column">
<div class="centre"> <div class=img-container>
<img id="portrait" src="img/stargazer.png"></img> <img id="portrait" src="img/frog.png"></img>
<div id="text-box"></div>
<a id="button" href="#" onclick="advance()">start</a>
</div> </div>
<div class="text-box">
<p id="text-box-content">SET_DIALOGUE_TEXT</p>
</div>
<div id="button" onclick="advance()">
<a id="button-text" class="centre" href="#">SET_BUTTON_TEXT</a>
</div>
</div>
</body> </body>
</html> </html>
<script src="main.js"></script> <script src="main.js"></script>

BIN
src/vn/img/kt/angry0.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 235 KiB

BIN
src/vn/img/kt/angry1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 169 KiB

BIN
src/vn/img/kt/angry2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

BIN
src/vn/img/kt/angry3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 251 KiB

BIN
src/vn/img/kt/angry4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 220 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

BIN
src/vn/img/kt/asleep.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 155 KiB

BIN
src/vn/img/kt/blast.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

BIN
src/vn/img/kt/bookworm.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 174 KiB

BIN
src/vn/img/kt/buzzcut.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 432 KiB

BIN
src/vn/img/kt/calm.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

BIN
src/vn/img/kt/chillin0.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

BIN
src/vn/img/kt/chillin1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

BIN
src/vn/img/kt/chillin2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 255 KiB

BIN
src/vn/img/kt/coffee.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

BIN
src/vn/img/kt/confident.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 133 KiB

BIN
src/vn/img/kt/dance.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 198 KiB

BIN
src/vn/img/kt/derp0.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

BIN
src/vn/img/kt/derp1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 237 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 134 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

BIN
src/vn/img/kt/dreamer0.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

BIN
src/vn/img/kt/excited.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 120 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 146 KiB

BIN
src/vn/img/kt/foood.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 374 KiB

BIN
src/vn/img/kt/gah.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 139 KiB

BIN
src/vn/img/kt/gendo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 138 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 229 KiB

BIN
src/vn/img/kt/goofy.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 163 KiB

BIN
src/vn/img/kt/grin.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 173 KiB

BIN
src/vn/img/kt/hehe.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

BIN
src/vn/img/kt/hii.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB

BIN
src/vn/img/kt/hmph.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 KiB

BIN
src/vn/img/kt/hopeful.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 170 KiB

BIN
src/vn/img/kt/huh.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 134 KiB

BIN
src/vn/img/kt/laugh0.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 273 KiB

BIN
src/vn/img/kt/laugh1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 151 KiB

BIN
src/vn/img/kt/laugh2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 473 KiB

BIN
src/vn/img/kt/laugh3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 142 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 151 KiB

BIN
src/vn/img/kt/noseup.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 196 KiB

BIN
src/vn/img/kt/ohno.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 136 KiB

BIN
src/vn/img/kt/oshit.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

BIN
src/vn/img/kt/pathetic.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 284 KiB

BIN
src/vn/img/kt/peeved.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 288 KiB

BIN
src/vn/img/kt/pizza.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 186 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 127 KiB

BIN
src/vn/img/kt/ponder.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 119 KiB

BIN
src/vn/img/kt/pose.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 482 KiB

BIN
src/vn/img/kt/queasy.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 96 KiB

BIN
src/vn/img/kt/scared.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

BIN
src/vn/img/kt/sleepy.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 348 KiB

BIN
src/vn/img/kt/smug.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 275 KiB

BIN
src/vn/img/kt/snarl.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 242 KiB

BIN
src/vn/img/kt/sneaky.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 137 KiB

BIN
src/vn/img/kt/stargazer.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 209 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 226 KiB

BIN
src/vn/img/kt/tantrum.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 220 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 110 KiB

BIN
src/vn/img/kt/uh.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

BIN
src/vn/img/kt/unsure.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

BIN
src/vn/img/kt/vr.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 236 KiB

BIN
src/vn/img/kt/waow.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 242 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 290 KiB

BIN
src/vn/img/kt/whaaaat.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 410 KiB

BIN
src/vn/img/kt/yay.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 139 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

View File

@ -1,32 +1,34 @@
let idx = 0 let idx = 0
let frames = [ let frames = [
"hello! you're just in time!", "img/yay.png", null, "press start to begin!", "img/kt/stargazer.png", "start",
"this was starting to get ridiculous.", "img/you-shouldnt-be-doing-that.png", null,
"there are books EVERYWWHERE", "img/scared.png", null,
"and more keep coming!", "img/oshit.png", null,
"we've got to do something about it before the deadline!", "img/determined.png", null,
"hey, could you sort the books for me?", "img/books-messy.png", "stack books by size", "hello! you're just in time!", "img/kt/yay.png", null,
"this was starting to get ridiculous.", "img/kt/you-shouldnt-be-doing-that.png", null,
"there are books EVERYWWHERE", "img/kt/scared.png", null,
"and more keep coming!", "img/kt/oshit.png", null,
"we've got to do something about them at some point, why not now?", "img/kt/determined.png", null,
"hey, could you sort the books for me?", "img/books-messy.png", "stack by size",
"yes, i can you've finished STACKING them,", "img/books-size.png", null, "yes, i can you've finished STACKING them,", "img/books-size.png", null,
"but that's hardly FINISHED, is it?", "img/books-size.png", null, "but that's hardly FINISHED, is it?", "img/books-size.png", null,
"i mean sure, if you want to be a pedant about it they're sort of ordered by size,", "img/nonplussed.png", null, "i mean sure, if you want to be a pedant about it they're sort of ordered by size,", "img/kt/nonplussed.png", null,
"but they're still just piled up in the same place, what's that supposed to change?", "img/coffee.png", null, "but they're still just piled up in the same place, what's that supposed to change?", "img/kt/coffee.png", null,
"why don't you try again?", "img/books-size.png", "push stack over", "why don't you try again?", "img/books-size.png", "push stack over",
"", "img/books-messy.png", "order books by colour", "", "img/books-messy.png", "order books by colour",
"", "img/books-colour.png", null, "", "img/books-colour.png", null,
"no, colours won't work either.", "img/dreamer0.png", null, "no, colours won't work either.", "img/kt/dreamer0.png", null,
"why?", "img/blast.png", null, "why?", "img/kt/blast.png", null,
"simple, i don't do colours.", "img/grin.png", null, "simple, i don't do colours.", "img/kt/grin.png", null,
"it's nothing personal, they're just not for me, you know?", "img/glad-you-asked.png", "restart" "it's nothing personal, they're just not for me, you know?", "img/kt/glad-you-asked.png", "restart"
]; ];
function setText(text) { function setText(text) {
document.getElementById('text-box').innerHTML = text; document.getElementById('text-box-content').innerHTML = text;
} }
function setImage(path) { function setImage(path) {
@ -35,12 +37,11 @@ function setImage(path) {
function setButtonText(text) { function setButtonText(text) {
console.log(text); console.log(text);
if (text == null) if (text == null) {
{
text = "next"; text = "next";
} }
document.getElementById('button').innerHTML = text; document.getElementById('button-text').innerHTML = text;
} }
function advance() { function advance() {

View File

@ -1,20 +1,87 @@
img { body
max-height: 70vh; {
width: auto; padding: 0;
margin: 0;
width: 100%;
height: 100%;
font-family: sans-serif;
color: white;
background-color: black;
} }
.centre { .column {
margin: auto; margin: 0 auto;
padding: 0; left: 50%;
width: 50%; width: 80%;
/*transform: translateX(50%);*/
height: 100%;
}
/* make column full-width for small viewports */
@media only screen and (max-width: 600px) {
.column {
left: 0;
width: 100%;
}
}
.img-container {
position: relative;
height: 60%;
width: 100%;
}
img {
object-fit: contain;
width: 100%;
height: 100%;
} }
#button { #button {
position: relative;
margin: 0;
width: 100%;
height: 15%;
}
a {
color: white;
}
#button a {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-size: 4em;
text-align: center;
text-decoration: none;
}
#button:hover a {
color: grey;
}
.text-box {
position: relative;
width: 100%;
height: 25%;
}
.text-box p {
margin: 0;
width: 80%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
word-wrap: wrap;
font-size: 2em; font-size: 2em;
} }
#text-box {
width 100%;
height: 4em;
}