Bunker 21 — The Story So Far
It’s been a couple of weeks since I started this project and I’ve been having a blast, here’s a rundown on how things are coming along so far.
The UI
I’m keeping it simple on that front. I’m more interested in the gameplay than the actual looks of the Bunker 21, less is more as they say and I want to keep it retro, all you’re seeing is an old monitor after all.
This is where warnings are displayed, anything from approaching enemies to environmental conditions
Up next we have the ‘DataPad’ component housing all the character and environmental data
And that looks like this (it’s a work in progress) >>>
Here is where story data is displayed, the ‘plot’ as soon as I figure out what that is exactly,
and finally, the ‘Action Pad,’ where all the player actions take place. Currently they’re all bunched up together but I’ll give them their proper space with React Router,
Latest Additions
I’m going to summarize these components as they’re all currently very similar.
Hunger.js, PowRem.js, Sleep.js, Thirst.js
They all follow the same patter, so to illustrate I’ll literally illustrate with a screenshot,
First we import the hungerLevels constant. It’s basically an array of hunger conditions; when looking at the other components the array contains a set of conditions related to the component. It looks like this,
The initial state >
currentHungerLevel: hungerLevels[0]display ‘Full’ as ‘full’ is the first index position of hungerLevels.
When the component mounts it sets an interval (the timing will change eventually) where it sets the state to the next index position of hungerLevels utilizing the ‘ind’ variable which in turn is incremented after setting state. When through a conditional the ind variable equals 7 the interval is cleared/stopped, that prevents the index position going into the negative and displaying ‘undefined’ on the browser (undefined because there’s nothing at hungerLevels[-1] etc.)
The same pattern was followed for the other components as al they do is lower the player hunger/sleep/etc states. The choice to have the constants imported was for legibility and making it easier to adjust in the future, I could add many more ‘sleep’ state for example and the component would still work fine. The only exception being Power Remaining (PowRem.js) as there was no constant involved, just reducing the 100% to 0%
Conclusion
Despite what i’ve done so far I’m just getting started and I haven’t reached the ‘main’ part of the game development yet, which is the actual gameplay. Thats’s where I’ll probably spend some time stuck in problems that I’ll love to solve.
Without further ado, I must go, and I’ll be back next week with some exciting Bunker 21 developments.
