Code Monkey home page Code Monkey logo

coronastatus's Introduction

Coronastatus (archived)

Report your health status to get a better overview of COVID-19 in your country

What is this?

We don't know how many people have COVID-19. So we made a website where people can self-report symptoms. We plot the submissions on a map and show graphs with trends.

How can I help?

We need people who can help translate the site, develop new features, project leads for new and existing countries, and much more. Join our group chat: https://t.me/onzecorona

In what countries have you launched Coronastatus?

Why?

The government is working on this, but they're too slow in getting something out fast.

Mentions in the media

Title Country URL
Self-report system for monitoring COVID19 needs to be in place immediately! 🇳🇴 Read here
Are you ill? Health services will soon let you self-report symtoms. 🇳🇴 Read here
Developers take on COVID-19 with open-source projects, hackathons 🇺🇸 Read here

Who's behind this?

A bunch of developers from around the world that wanted to help out. This is not an official website from the health services.

How can I contribute?

Join our Telegram group chat here: https://t.me/onzecorona or reach out on [email protected]

Click on "Issues" in the menu above to see what we need help with.

How to launch the site in your country

Adding a new language should be pretty straightforward. If you need help, you can always ask in the Telegram group chat or contact us by email. The following is needed in order to set up a new language:

  • Set up a new config file: cp config.example.json config.json. COUNTRY_CODE should be the Alpha-2-code listed here: https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes
  • In app/locales you have to add
    • Translations for all the sentences in en.json. The translations should be placed in {LOCALE}.json (LOCALE should be one of the locales from here). The keys are the same in all the {LOCALE}.json-files, and the values are the translations. We recommend translating everything in the file first, and then testing the site in order to verify that the translations look ok in context. Some texts conains {{ SOME_VALUE }}. The content in {{ }} will be replaced with a country specific variable.
    • sort the locales alphabetically by keys. You can use a helper script to sort it: yarn sort:locales
  • In app/countrySpecific/{COUNTRY-CODE}/ you have to add (follow filename convention of the files that are already there):
    • config.ts. Copy from app/countrySpecific/en/config.ts, and change the values so that it fits your country (ask in Telegram if you wonder what the different values mean).
    • text-variables.ts. Copy from app/countrySpecific/en/text-variables.ts and fill in variables for the country you add. These values will always be rendered, regardless of which locale the user use.
    • A word list that is used for generating unique profile links. If you are ok with english words, you can use this. If the word list contains between 1000 and 10000 words, you should set PASSCODE_LENGTH: 4 in the config. If it contains more than 10000 words, PASSCODE_LENGTH: 3 should be sufficient.
    • List of municipalities (we can help with this Check Here).
    • List of postal code coordinates (we have a script for this Check Here).
  • Configure URL paths in app/domain/urls.ts (set up for the COUNTRY_CODE you added)
  • Write a privacy statement in app/views/privacy-statement/{COUNTRY_CODE}-privacy-statement.ejs.
  • Add a mapping from the locale you added to a corresponding flag in app/domain/flags.ts. The code (two letters) of the flag can be found here.
  • You also need a domain (preferably coronastatus.tld if it is available), and a server to run the app on. We can assist you with setting this up.
  • Generate images for social media etc. using this guide
  • We can host the site for you if you want that. Just send a message to us in Telegram. This makes it easier to maintain and deploy new changes to all the sites. We will give you access to the server as well. If you insist on hosting it yourself, please add your name to the README here

Start developing

You can either install and run everything on your own machine or build a docker image and run the the local development environment using docker. Choose one of the ways below that fits best to you:

Developing on your own machine

Prerequisities

Download & install:

Steps

  1. Clone the repository

git clone https://github.com/BustByte/coronastatus

  1. Move into the newly cloned directory

cd coronastatus

  1. Install dependencies with our package manager

yarn

  1. Create a configuration file from the example provided in this repo.

cp config.example.json config.json

  1. Start the development webserver

yarn dev

  1. Open your browser and navigate to http://localhost:7272/

  2. Before you create a pull request run the linter. Warnings are ok, but errors should be fixed.

yarn lint

Developing using docker

Prerequisities

Download & install:

Steps

  1. Clone the repository

git clone https://github.com/BustByte/coronastatus

  1. Move into the newly cloned directory

cd coronastatus

  1. Create a configuration file from the example provided in this repo

cp config.example.json config.json

  1. Install node modules:

docker-compose run --rm app yarn

  1. Start the development container & display the container logs:

docker-compose up -d; docker-compose logs -f

  1. Open your browser and navigate to http://localhost:7272/

  2. Before you create a pull request run the linter. Warnings are ok, but errors should be fixed.

docker-compose exec app yarn lint

Generating social images

Social images (social media share image, Twitter header and generic banner) can be generated by running yarn build:images while your dev server is running. They will be placed in the static folder, in the language you defined in your config (make sure LOCALE, BASE_URL and COUNTRY_CODE is set correctly). The social-image.png is then automatically linked as social media share image.

Contributors ✨

We're working on updating this section to include everyone who has devoted time and attention to this project. Stay put!

coronastatus's People

Contributors

alexandrusavin avatar andrezzoid avatar arildwtv avatar bertrandlalo avatar bitbonsai avatar btutal avatar fossecode avatar fredrikpe avatar fvybiral avatar janmande avatar jinjie avatar jkspn avatar kalapathar avatar kilian avatar lseelenbinder avatar mantasbandonis avatar mepa1363 avatar michaelmcmillan avatar mihai-sysbio avatar randriana avatar rootalgorithm avatar rubentd avatar sbocinec avatar sergioprates avatar snikanes avatar sondrehj avatar tarasmatsyk avatar tkrunning avatar waltergammarota avatar zerbfra avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

coronastatus's Issues

Translation efforts for Dutch and English

Update translations are ongoing, see this comment for the plan.


  • Here is the google sheet, I'll start copying strings over from the EJS files.
  • There are four columns: KEY, Norwegian, which I'll copy over, and empty Dutch and English
  • Filling in the Dutch and English translation is a free for all:
  1. empty space: click on it so it's locked, find the translation, fill it in, move to the next
  2. filled translation: click on it so it's locked, check if you agree, then make the cell green. If you don't agree, update and someone else will check

This way, translations are seen by at least two people without it being a hassle or blocking.

  • Green translations can be added to the repo. Not sure what the best course of action for that is (considering prevention of merge conflicts on the translation files) but maybe someone has an idea there (like, add the KEY to the sheet first? i dunno)

Add link: "Do you need this service in your country?"

Now that we expand the service to the Netherlands, we see the value in providing this service to other countries, as well. The Netherlands might just be the first. If visitors from other countries visit our site, they might wonder whether their country can adopt the same service.

That's why I suggest that we put a link in the "About the service" section:

"The Coronastatus service is currently used in Norway and the Netherlands. Do you need this service in your country? Let us know, and we will help you set it up with minimal effort!"

Get zip codes with coordinates for the Netherlands into the app

Here are the things we need to solve:

  • Create a copy of municipalities.json where the key is the municipality and the zip codes are the zip codes within that municipality.
  • Create a copy of postalCodeCoordinates.json where the zip code is the key and the coordinates are where the latitude and longitude of that zip code (WGS 84 coordinate system).

I found these two files, but I'm struggling a little bit with figuring out what a municipality in the Netherlands how a zip code relates to that.
NL.txt
readme.txt

Får ikke lagret uten å velge symptomer

Hvis man klikker på lagre uten å ha valgt symptomer, får man følgende melding:

An invalid form control with name='symptom-start' is not focusable.

non-selected

Dette er fordi symptom-start input elementet har attributten required https://github.com/BustByte/coronastatus.no/blob/03e9117ee99ca3cc472bc4cab12855c5a4b36c26/app/views/pages/form.ejs#L131

This issue occurs on Chrome if a form field fails validation, but due to the respective invalid control not being focusable the browser's attempt to display the message "Please fill out this field" next to it fails as well.

Mangler symptom?

Burde forkjølelse/snufsing/nysing være med i listen over symptomer? Man får råd om å holde seg hjemme når man har disse symptomene, men jeg finner de ikke i listen, så da blir jeg registrert som symptomfri selv om jeg har de.

Be clear about what "visualization" means

Hvilken type visualisering innebærer dette, kun den som er vist i kartet, eller annen (feks. av Kvinne 45, Storhaug)?:

"Vi vil aggregere opp disse dataene og visualisere dem anonymt. På denne måten kan offentligheten få et innblikk i hvor store mørketallene potensielt kan være»,

Ta med karantene-status i skjemaet

Tenker det er interessant å få statistikk på hvor mange som sitter i lovpålagt karantene.
Hva gjør vi evt. med eksisterende data som mangler dette?

Enhancement: create dashboard or other high-value personalized screen

Ref #172 and the use of cookies to track the anonymous user. If we're comfortable with the use of cookies in a legal sense, I think it creates a great opportunity to further improve the user experience by creating a high-value page that uses information stored in cookies and that is tailored to the user.

For instance, consider something like a dashboard that shows information based on the user's zip/postal code, for instance a local map -- exactly like what happens when I open the regular map, it zooms in on my location. Other presented data could be based on my age, my status, etc. I haven't thought enough about about what data I'd like to see, but off the top of my head it would be great to be able to quickly look on my phone and bring up the latest stats for my area. I think this combined with a home screen icon would greatly increase repeat visits.

This creates an opportunity to optimize for the repeat visit where we'd like to let the user easily get an overview of the general situation, but also a place where we can request that they update their own data if their situation has changed. Said differently, show the general homepage on first visit (explain all the stuff and get informed consent) and then on repeat visits show something that is tailored to the user without none of the general stuff -- short and sweet, just the facts, ma'am.

Enhancement: make "user page" add-to-homescreen capable

A browser bookmark is nice, but an icon on the home screen is nicer. :)

Suggestion: identify or create a page that is high value to the user and make it possible for the user to add that page to the home screen with a nice icon and label. PWA supports this. See also the issue with setting a cookie with the generated phrase so that the user can be taken directly to his edit view.

If the user primarily wants to update their SA (situational awareness -- check the latest situation in their area) -- then combining that information with a CTA to update their data if it's been more than x days, where x is maybe 2 or 3, is a great place to get their attention.

I'm guessing most users are using this on mobile so a prominent 'update my situation' link is good if I recently updated, but if it's been more than x days then put the edit view in front of the information I'm seeking so I can't ignore it -- if it's easy to make a few edits and submit users are more likely to do it, especially when they see something about their own situation being outdated.

Enhancement: easier data edit on repeat visit

Currently a unique phrase is generated and displayed when the user submits the data form. The user is requested to make a note of the phrase so that he can revisit the site and update the submitted data later. This may create some friction or unnecessary work for the user which may cause them to not be able to update their entry or submit duplicate data.

Suggestion:

Consider creating and displaying the phrase as done already, but also include a link that the user can click and bookmark. The link contains the generated phrase. Clicking the link shows the form with the user's already submitted data (edit view).

Also consider setting a cookie with the phrase and date of last update. The cookie is used to show edit view as above. This will also support a call to action when the user later visits the site. It also helps the user if they for some reason don't bookmark the previous link or make a note of the code. The CTA can then say something like: "It's been 3 days since you updated your situation. Has anything changed? Please update."

Summary: create parameterized link for bookmarking + set phrase in cookie and show edit view with CTA on repeat visit.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.