Skip to content

Commit

Permalink
Some Polish
Browse files Browse the repository at this point in the history
  • Loading branch information
Nerin3 committed Jun 13, 2023
1 parent 89ec52e commit 87bbbce
Show file tree
Hide file tree
Showing 3 changed files with 22 additions and 20 deletions.
0 audio/click.ogg → audio/click1.ogg
View file
File renamed without changes.
32 changes: 16 additions & 16 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,14 @@ <h1 class="category-title text-center">Welcome Mortal</h2>
<div class="category container-xl text-center mt-2 px-0 py-2 rounded d-none" id="unwelcome">
<h1 class="category-title category-bg mb-0 py-3 px-5 rounded-top">Starting Karma Values</h2>
<div class="container-xl category-bg shadow-lg rounded p-4">
<div class="row justify-content-center g-2">
<div class="row row-cols-2 row-cols-lg-5 justify-content-center g-2">
<div class="col">
<div class="card choice karma" id="uneventful" data-karma="-50">
<div class="card-header card-img-overlay">
<h2 class="category-title text-center">Uneventful<br>Life</h2>
<h4 class="category-title text-center">-50 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>My, my, it seems you've led quite an uneventful and rather unfortunate life, haven't you? This presents a unique challenge for you, dear soul. To even begin anew, you must choose some particularly interesting options to balance the scales. I can't wait to see what you decide.</span></div>
</div>
</div>
Expand All @@ -45,7 +45,7 @@ <h4 class="category-title text-center">-50 Karma</h4>
<h2 class="category-title text-center">Average<br>Person</h2>
<h4 class="category-title text-center">0 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Ah, it appears you've led a rather average life, neither exceptionally good nor terribly bad. A blank canvas, so to speak. You'll have the opportunity to paint a new story for your soul. What strokes of fortune and misfortune will you choose this time? I'm quite curious to find out.</span></div>
</div>
</div>
Expand All @@ -55,7 +55,7 @@ <h4 class="category-title text-center">0 Karma</h4>
<h2 class="category-title text-center">Impactful<br>Life</h2>
<h4 class="category-title text-center">50 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Well now, it seems you've left quite an impact on the world in your previous life. A commendable feat. I wonder if you'll continue to make waves in your new life or if you'll choose a quieter path. Either way, the choices you make will surely amuse me.</span></div>
</div>
</div>
Expand All @@ -65,7 +65,7 @@ <h4 class="category-title text-center">50 Karma</h4>
<h2 class="category-title text-center">High Profile<br>Life</h2>
<h4 class="category-title text-center">100 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Impressive! You've had a significant impact on the world, touching the lives of many others. Now, will you carry this legacy into your next life, or will you forge a new path entirely? I'm positively giddy at the prospect of observing your journey.</span></div>
</div>
</div>
Expand All @@ -75,7 +75,7 @@ <h4 class="category-title text-center">100 Karma</h4>
<h2 class="category-title text-center">Changed<br>The World</h2>
<h4 class="category-title text-center">200 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Incredible! You've practically changed the world yourself. A rare accomplishment indeed. Seeing how you'll navigate the choices before you fills me with unparalleled excitement. No matter what you decide, your next life will undoubtedly be a thrilling spectacle.</span></div>
</div>
</div>
Expand All @@ -85,14 +85,14 @@ <h4 class="category-title text-center">200 Karma</h4>
<div class="category container-xl text-center mt-2 px-0 py-2 rounded d-none after-karma" data-reveals="changed-world, high-profile, impactful, average, uneventful">
<h1 class="category-title category-bg mb-0 py-3 px-5 rounded-top">World Selection</h2>
<div class="container-xl category-bg shadow-lg rounded p-4">
<div class="row row-cols-4 justify-content-center g-2">
<div class="row row-cols-2 row-cols-lg-4 justify-content-center g-2">
<div class="col">
<div class="card choice" id="arborea" data-karma="-5">
<div class="card-header card-img-overlay">
<h2 class="category-title text-center">Arborea</h2>
<h4 class="category-title text-center">-5 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Ah, the realm of Arborea, a classic fantasy world filled with magic, mythical creatures, and various races. Here, you may find yourself embroiled in epic quests, forging alliances, and battling fearsome foes. Will you embrace the age of heroes and carve out a legend of your own?</span></div>
</div>
</div>
Expand All @@ -102,17 +102,17 @@ <h4 class="category-title text-center">-5 Karma</h4>
<h2 class="category-title text-center">Earth</h2>
<h4 class="category-title text-center">0 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Perhaps you desire a return to familiarity? This world is much like the one you've left behind, save for your absence. You'll navigate the complexities of modern society, with all its challenges and opportunities. Will you seize the chance to rewrite your story?</span></div>
</div>
</div>
<div class="col">
<div class="card choice" id="future" data-karma="-5" data-requires="average, impactful, xor">
<div class="card choice" id="future" data-karma="-5">
<div class="card-header card-img-overlay">
<h2 class="category-title text-center">Future</h2>
<h4 class="category-title text-center">-5 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>"Behold, a vision of Earth 400 years hence, where humanity has taken to the stars and made contact with other sentient beings. Advanced technology, interstellar travel, and the infinite possibilities of the cosmos await you. Are you prepared to embrace the unknown and explore the final frontier?</span></div>
</div>
</div>
Expand All @@ -122,7 +122,7 @@ <h4 class="category-title text-center">-5 Karma</h4>
<h2 class="category-title text-center">Wutian</h2>
<h4 class="category-title text-center">-5 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>The Eastern Fantasy realm of Wutian offers a world steeped in martial arts, mysticism, and the pursuit of cultivation. Here, you'll embark on a journey of self-discovery, honing your skills to attain enlightenment and unearth hidden power. Will you walk the path of the martial hero and conquer the heavens?</span></div>
</div>
</div>
Expand All @@ -132,7 +132,7 @@ <h4 class="category-title text-center">-5 Karma</h4>
<h2 class="category-title text-center">Nocturne</h2>
<h4 class="category-title text-center">15 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>In the dark and foreboding world of Nocturne, you'll face nightmarish creatures and twisted horrors. This realm is not for the faint of heart, but within the darkness lie secrets and power beyond imagination. Are you willing to confront the shadows and emerge triumphant?</span></div>
</div>
</div>
Expand All @@ -142,7 +142,7 @@ <h4 class="category-title text-center">15 Karma</h4>
<h2 class="category-title text-center">Gaia</h2>
<h4 class="category-title text-center">5 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span =>Travel back to the dawn of civilization in the prehistoric realm of Gaia. A world of untamed wilderness, where the first seeds of agriculture and society are taking root. Will you become a pioneer, guiding the course of history and shaping the future of your people?</span></div>
</div>
</div>
Expand All @@ -152,7 +152,7 @@ <h4 class="category-title text-center">5 Karma</h4>
<h2 class="category-title text-center">Midgard</h2>
<h4 class="category-title text-center">5 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Welcome to Midgard, a world where the pantheons of ancient mythologies coexist and hold true power. Gods and monsters roam this realm, and you may find yourself caught in the midst of their eternal struggles. Can you navigate the divine tapestry and claim a place among the legends?</span></div>
</div>
</div>
Expand All @@ -162,7 +162,7 @@ <h4 class="category-title text-center">5 Karma</h4>
<h2 class="category-title text-center">Personal</h2>
<h4 class="category-title text-center">-20 Karma</h4>
</div>
<img src="https://placehold.co/400x600" class="card-img" alt="...">
<img src="https://placehold.co/300x400" class="card-img" alt="...">
<div class="card-body text-white p-2 text-center fs-6 bg-gradient"><span>Lastly, I present you with the option to create your own world, limited only by your imagination. However, this choice comes at a cost, as shaping a realm tailored to your desires will require extra Karma. Are you prepared to pay the price for a world of your own design?</span></div>
</div>
</div>
Expand Down
10 changes: 6 additions & 4 deletions js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ document.getElementById("previous")

let counter = 0;
const next = () => {
playSE('audio/click.ogg');
playSE('audio/click1.ogg');
counter++;
fx.setText(phrases[counter]);
if (counter == 1) document.getElementById("previous").removeAttribute("disabled");
Expand All @@ -157,7 +157,7 @@ const next = () => {
}
}
const previous = () => {
playSE('audio/click.ogg');
playSE('audio/click1.ogg');
if (counter == phrases.length - 1) {
document.getElementById("next").removeAttribute("disabled");
document.getElementById("accept").classList.add("d-none");
Expand All @@ -168,7 +168,7 @@ const previous = () => {
}

const accept = () => {
playSE('audio/click.ogg');
playSE('audio/click1.ogg');
changeAudio(document.getElementById("bgm"), 'audio/bgm2.ogg', document.getElementById('customRange1').value);
anime({
targets: '#welcome',
Expand Down Expand Up @@ -342,9 +342,11 @@ const setChoice = (element) => {
}
choiceActivator(element);
requireDeactivator(nephew);
playSE('audio/click1.ogg');
} else {
requireDeactivator(element);
playSE('audio/click2.ogg');
}
playSE('audio/click2.ogg');

hideHandler();
}

0 comments on commit 87bbbce

Please sign in to comment.