Bunker 21 — Weather
Weather plays an important part in Bunker 21, whether it affects the type of creature that shows up at the bunker or even the power levels of the computer system etc. Here’s how it works
A Pattern on Two Levels
As I progress through each component I noticed a simple pattern emerge; Calculate something, then pass it to the global state to be utilized in the future. In this case there’s also a weather ‘pattern’ and that’s what I want my program to remember.
Weather.js
Here’s the main weather component. Taking it from the top, we import the usual, React and Component, and Connect for Redux; the other two imports are a helper to select the weather pattern and the ‘addWeather’ action to pass data to/through redux to store in the global state.
Weather is a class component, with a state of ‘pattern;’ as soon as the component is mounted ‘componentDidmount’ kicks in and sets an interval between 200000 milliseconds and 50000 milliseconds (200 seconds, and 50 seconds but that’s subject to change as the game is balanced.) Inside the setInterval block state is set when calling the WeatherGen() helper, then that state (pattern) is passed to redux to keep track of; finally the state is rendered inside a div.
WeatherGen.js
The helper’s block consist of an array of patterns, the ones with I wanted to have priority in repetition when being randomly selected are repeated a bunch of times more than others, for example there are 8 ‘Sunny/Clear’ strings in the array vs only one of ‘Snow,’ so ‘Sunny/Clear’ is more probable to be selected.
The return value of WeatherGen() is selectPattern() which when called returns one of the patterns/strings inside the constant wPatterns, selected with:
const i = Math.floor(Math.random() * 36)Conclusion
For now we the weather is just a string displayed on the browser, but because it’s being stored in redux it can potentially do so much more.
As the different components are built the entire project will come together bit by bit, it’s just a matter of time. Until next week!
