Go to file
2018-08-26 17:48:07 +02:00
build Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
config Upgrade to Webpack 4 + improve the build system 2018-08-06 23:29:17 +02:00
po Use Zanata to handle translations 2018-07-20 15:15:26 +02:00
scripts Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
server Store datetime as naive UTC datetimes (no TZ info) in db, to avoid issues with SQLite 2018-08-02 11:19:44 +02:00
src Fix a bug in automatic refetch of reports after a given distance 2018-08-26 17:48:07 +02:00
static Fix OpenGraph icon, OG does not support SVG 2018-07-11 16:54:02 +02:00
support Update nginx config 2018-07-18 15:07:40 +02:00
tests Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
.babelrc Upgrade to Webpack 4 + improve the build system 2018-08-06 23:29:17 +02:00
.editorconfig Display reports on the map 2018-06-26 11:04:23 +02:00
.eslintignore Initial commit 2018-06-25 18:29:57 +02:00
.eslintrc.js Initial commit 2018-06-25 18:29:57 +02:00
.gitignore Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
.po2json.sh Use Zanata to handle translations 2018-07-20 15:15:26 +02:00
.postcssrc.js Initial commit 2018-06-25 18:29:57 +02:00
humans.txt Use font-display CSS property and add OpenGraph meta tags 2018-07-11 01:51:26 +02:00
index.html Display an error message when JS is disabled. 2018-07-11 20:34:46 +02:00
LICENSE.md Add some doc 2018-06-26 15:36:45 +02:00
package.json Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
README.md Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
requirements.txt Initial commit 2018-06-25 18:29:57 +02:00
robots.txt Add robots.txt and humans.txt files 2018-07-10 19:23:32 +02:00
wsgi.py Add a WSGI file 2018-06-26 15:55:52 +02:00
yarn.lock Move map from Leaflet to OpenLayers 2018-08-26 17:48:03 +02:00
zanata.xml Use Zanata to handle translations 2018-07-20 15:15:26 +02:00

Cyclassist

Track and share issues (work, interruption in routes, parked cars) in realtime on bike lanes!

This app is made of two parts: a client webapp and a server part to store and serve the issues. This code is the code running behind https://cyclo.phyks.me/ (the stable and official instance).

A sandbox instance if you want to try it out without polluting the main instance is available at https://cyclo-dev.phyks.me. Please note however this is a sandbox instance which might be ahead of the official https://cyclo.phyks.me instance from time to time, so that it might break from time to time.

As of current version, only the client side part (code running on your local device) handles your geolocation. Your precise geolocation is never sent to the server or any external resource. However, the map background is downloaded on demand from Thunderforest so they could know the location of the displayed map.

OpenData

The data collected by https://cyclo.phyks.me/ is available under an ODbL license. You can get the most up to date JSON dump of available reports at https://cyclo.phyks.me/api/v1/reports.

Statistics about the instance can be fetched at https://cyclo.phyks.me/api/v1/stats.

Hosting your own

Client part

Build setup

# Install JS dependencies
yarn install

# Serve with hot reload at localhost:8080
yarn dev

# Build for production with minification
yarn build

# Build for production and view the bundle analyzer report
yarn build --report

Useful environment variables

You can pass a few environment variables to the yarn build|dev commands to adapt the behavior to your needs.

  • PUBLIC_PATH=https://.../foobar to serve the app from a subdirectory.
  • API_BASE_URL=https://... to specify the location of the server (defaults to /). The value should end with a trailing slash.
  • THUNDERFOREST_API_KEY= to pass an API key server to use for Thunderforest tiles (OpenCycleMap, etc).
  • API_TOKEN= to pass a token required to access the server side API (check below in the server part environment variables for more details).

You should also have a look at the build variables under the config/ subdirectory.

Geographical extension

While the frontend could theoretically work in the entire world without much modifications, it is currently written with mainland France in mind, mostly because that is the territory the authors are most familiar with. Additionnally, this limits the volume of geographical data (such as OSM extracts) to handle and makes managing the app easier.

You could of course easily extend it to support other territories. The French-specific parts of the code so far are:

Notes

We are using A la carte Vuetify components to reduce the size of the build. Check that any extra components you might use is indeed included in src/vuetify.js file. The yarn list-vuetify-components command might be useful to help you determine which components are used across the code.

Server part

Build setup

# Install Python dependencies
pip install -r requirements.txt

# Start the server
python -m server

It is better to use a dedicated virtualenv if you can :)

API routes are all listed within server/routes.py file, with documentation strings.

Useful environment variables

You can pass a few environment variables to the python -m server command to adapt its behavior:

  • HOST= to specify the host to listen to (defaults to 127.0.0.1 which means localhost only).
  • PORT= to specify the port to listen on (defaults to 8081).
  • DATABASE= to specify a database URL to connect to (defaults to sqlite:///reports.db which means a SQLite database named reports.db in the current working directory).
  • API_TOKEN= to specify a token required to POST data to the API.

Serving in production

You can use the wsgi.py script at the root of the git repository to serve the server side part. You can find some uwsgi and nginx base config files under the support folder.

Contributing

The quickest way to get started is to simply run

API_BASE_URL=http://127.0.0.1:8081/ yarn dev

to spawn the client-side webapp, listening on localhost:8080 and

python -m server

to spawn the server-side part, listening on localhost:8081.

Useful scripts for dev

You can run scripts/gps_to_gpx.py on your GPX trace to create a src/tools/mock_gpx.json file ready to be used as a mocking source for the position data (just edit the src/constants.js file accordingly).

Translating

Translation is done directly on Zanata.

To add new strings to localize, edit the src/i18n/en.json file with your new strings (and only this file). Then, you can run yarn push-locales to send the updated locales to translate and yarn pull-locales to fetch the translated files. To use these scripts you will need the Translate-toolkit(pip install translate-toolkit) and the Zanata Python CLI client.

License

This software is licensed under an MIT license, unless explicitly mentionned otherwise.

Icons are made from the original works:

Beep sound is provided under CC0 license and coming from freesound.org.

The map background is using tiles from <a href="https://carto.com/location-data-services/basemaps/">Carto.com or <a href="http://thunderforest.com/">Thunderforest, thanks to <a href="https://www.openstreetmap.org/copyright">OpenStreetMap contributors and <a href="http://leafletjs.com/">Leaflet.

Manual location picking uses the awesome API from <a href="https://adresse.data.gouv.fr">adresse.data.gouv.fr.