Covid Sim 2020 | Devpost

Default App State
Changed Progress Bar and Actions used (Infection, Recovered, Death goes up)
Policy Popup
Our Logo!
Our Github Project
Our Folder Structure and a small snippet of functions
Alerts and Popups

Inspiration

We got our inspiration from a lack of simulation for COVID-19. As a group of curious individuals, we want to create our own simulation and learn how pandemics evolve and the different variables between a good and bad solution for a virus.

What it does

Our simulator project allows for people to understand the ways in which policy affects the growth of the virus. Utilizing a simulated population of a small town, players can enact legislation to grow or spread the virus

How we built it

##Visuals: A CSS grid box acts as a game canvas and aligns the policy, the information tab, and the main image. A clever use of flexboxes allows for the icons (provided by font-awesome.com) and text to adjust with various screen sizes. Each element is given a class and id which is styled with cascading style sheets. We also learned bootstrap and try to implement a CSS library to make a few part of our game more visual.

##Back end: The back end runs majority of our game. First a variable containing all policy information is written into the code. When the page loads, the JavaScript parses the variable and generates policies with said information to be stored into an array list. Then, a script in html loops thought the array and populates the policy tab with policy items, each with their own "onclick" function. None of the code is hardcoded, making the amount of different policies infinitely expandable. Next, a series of event listeners allow players to click policy items displaying its information on a flexbox popup (cost / description). The players can confirm / deny the policy purchase and transfer the chosen policy to an arraylist of chosen polices. We coded an algorithm that takes in the 3 variables and calculate a real life infection by taking account each person and their own stats (Wealth, Eduation, etc) and have simulated contact with other.

Challenges we ran into

In the beginning, we were using typescript because we wanted to try out the languages' features, but we didn't figure out how to implement it in this specific simulator so we decided to take typescript code and convert it to javascript. During programming, it is more difficult to communicate since we are in a remote environment, we overcome that by having breaks every hour.

Accomplishments that I'm proud of

There are many accomplishments we are proud of. Firstly, we successfully incorporating Object Oriented Programming concepts into Javascript to create a more realistic simulator that will model an actually web app in real life and make the simulator more realistic. We also learned a few new libraries such as font awesome, Animista, jQuery, Bootstrap. Another accomplishment is researching and understanding real life government policies and learning how a pandemic plays out and the underlying math equations.

What I learned

We have learned a lot from COVID simulator from exploring the issues of pandemic to learning new programming concepts for creating useful apps. We also learned that hardwork and dedication is what builds the dream team.