pet logic is implemented!!

This commit is contained in:
zyl 2024-06-24 23:21:00 -07:00
parent b43bcb8a7e
commit fde22ee9c2
No known key found for this signature in database
3 changed files with 279 additions and 34 deletions

View file

@ -4,22 +4,50 @@ scripts: ["js/pet.js"]
styles: ["pet.css"]
---
<div id="pet">
<noscript><p>javascript is required for the pet game!!</p></noscript>
<div id="pet-display">
<h2 class="pet-name"></h2>
<p>--pet placeholder here--</p>
<!-- TODO: make pets interactable -->
</div>
<div id="egg">
<p>whoa! you just found an egg somewhere! maybe you should watch it and see what happens..</p>
<p>whoa! you just found a weird egg! maybe you should watch it and see what happens..</p>
</div>
<div id="pet-setup" class="hidden">
<div id="adult-info" class="hidden">
<p><span class="pet-name"></span> has grown up to be an adult!! what will they do with their life now....</p>
<button class="advance">okay!</button>
</div>
<div id="elder-info" class="hidden">
<p>oh? <span class="pet-name"></span> has aged and is now an elder creature! they may not have much left in their life.... hopefully it's been a good life!</p>
<button class="advance">hopefully!!</button>
</div>
<div id="passed-away-info" class="hidden">
<p>oh... <span class="pet-name"></span> has finally gone and kicked the bucket. its story comes to an end....</p>
<button>but what's this egg lying here about..?</button>
</div>
<form id="pet-setup" class="hidden">
<p>whoa! your egg just hatched into a new creature! what should you name it?</p>
<input type="text" name="pet-name" max-length="50">
<button>name it!</button>
<input type="text" name="pet-name" min-length="3" max-length="50">
<button type="submit">name it!</button>
</form>
<div id="pet-actions">
<div name="hatched-actions" class="hidden">
<button name="feed">feed</button>
<button name="pet">pet</button>
<button name="clean">clean</button>
</div>
<button name="pause">pause</button>
</div>
<div id="debug-section">
<button id="force-update">force update</button>
<p>LS: <span name="ls"></span> A: <span name="a"></span> F: <span name="f"></span> B: <span name="b"></span> P: <span name="p"></span></p>
<div id="debug-section" class="hidden">
<button id="force-update">force update</button> <button id="reset">reset</button>
<p>LS: <span name="ls"></span> A: <span name="a"></span> F: <span name="f"></span> B: <span name="b"></span> P: <span name="p"></span> MC: <span name="mc"></span> H: <span name="h"></span></p>
</div>
</div>