No Description

gwillz 3ad9377fa9 Fix building w/ fresh css. 2 weeks ago
examples 5f132ca718 Added styles to examples. 2 weeks ago
maps e4f07cc55b Added multi day/multi bin support. 2 weeks ago
src 3ad9377fa9 Fix building w/ fresh css. 2 weeks ago
.gitignore 0b2cdbb491 Added svg, css rollup plugins. 2 weeks ago
README.md 4a0d67dac9 Update readme. 2 weeks ago
package-lock.json 0b2cdbb491 Added svg, css rollup plugins. 2 weeks ago
package.json b67771b409 Combine rollup configs. 2 weeks ago
rollup.config.js 3ad9377fa9 Fix building w/ fresh css. 2 weeks ago
test.http e16cdcef6c Move tests into examples; added api example. 2 weeks ago
tsconfig.client.json 55ad36618a Added lib, api routes, common utils. 2 weeks ago
tsconfig.json d6d0e0aebc Added server, injecting code, crank.js, date-fns. 2 weeks ago
tsconfig.server.json 55ad36618a Added lib, api routes, common utils. 2 weeks ago

README.md

My Bin Day

Yet another utility for discovering your bin day. Heavily over-engineered - but it was fun.

Mostly, it was a chance to discover some tech I haven't used before. In particular, Rollup, Turf, and Crank.

Tech

  • Typescript
  • Rollup.js
  • Crank.js
  • Express.js
  • Turf.js
  • date-fns
  • markdown-it

Usage

There are 4 ways to use this library.

Crank Widget

Example: Crank Widget

Endpoint: /js/widget.js?map=...&target=...

  • map the config name
  • target the DOM element ID

This renders a widget into your page which then prompts for your GPS location.

JS Library

Example: Library

Endpoint: /js/lib.js?map=...

  • map the config name

This imports a globally library Binday which exposes the methods for retrieving your bin day/week.

  • Binday.getWeek() which recycling week is it?
  • Binday.getDay({ latitude, longitude}) what day is my bin collection?

Static Widget

Example: Static Widget

Endpoint: /widget?map=...&lat=...&lng=...

  • map the config name
  • lat your latitude
  • lng your longitude

This returns a JS-free HTML copy of the widget.

REST API

Example: API

Endpoint: /api/bins?map=...&lat=...&lng=...

  • map the config name
  • lat your latitude
  • lng your longitude

This returns a JSON body of your bin collection data.

{
    "bin_day": "wednesday",
    "bin_week": "green"
}

Additional API endpoints

  • /api/maps To list all configs provided and a link view their map on geojson.io.
  • /api/geojson?map=... Returns the geojson component.

Creating new maps

This is a config file.

{
    "bin_pattern": ["yellow", "green"],
    "map": { "type": "FeatureCollection", "features": [...] }
}

Config bin_pattern

The pattern of bins from week 1 of the current year.

i.e. ['yellow', 'green', 'blue'] should produce:

  • Week 1: yellow
  • Week 2: green
  • Week 3: blue
  • Week 4: yellow
  • Week 5: green
  • etcetera...

Config map

A GeoJSON object in WGS84 coordinates.

This is a simple FeatureCollection with just Polygon or MultiPolygon children. Most importantly, these should contain a property called weekday that contains whichever day applies to that zone.

Use geojson.io to create your own.

Authors

License

MIT