Skip to content

Commit

Permalink
Initial commit
Browse files Browse the repository at this point in the history
  • Loading branch information
Lukas Funk committed Mar 29, 2021
0 parents commit f74df96
Show file tree
Hide file tree
Showing 8 changed files with 350 additions and 0 deletions.
103 changes: 103 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
# EqualStreetNames City Template

If you want to replicate the EqualStreetNames project in your city, here is the how-to !

## Setup

1. Click on the "Use this template" button above

1. Find the *OpenStreetMap* relation of your city (example, [Brussels](https://www.openstreetmap.org/relation/54094))

1. Add the relation identifier in `config.php` (*example for Brussels*)

```diff
- 'relationId' => 0,
+ 'relationId' => 54094,
```

1. Update the *Overpass* queries :

`overpass/relation-full-json` (*example for Brussels*)

```diff
- ( area["admin_level"=""]["wikidata"=""]; )->.a;
+ ( area["admin_level"="8"]["wikidata"="Q12994"]; )->.a;
```

`overpass/way-full-json` (*example for Brussels*)

```diff
- ( area["admin_level"=""]["wikidata"=""]; )->.a;
+ ( area["admin_level"="8"]["wikidata"="Q12994"]; )->.a;
```

1. Update the HTML files (replace `MyCity` by the name of your city in all the `index.html` files, add languages, ...). Don't forget to set `app.countries` to the correct value in the `index.html` files.
Optionally you can change the style using `app.style`, it can be a Mapbox pre-defined style (see [API Reference](https://docs.mapbox.com/mapbox-gl-js/api/#map)) or your custom style (see [Style Specification](https://docs.mapbox.com/mapbox-gl-js/style-spec/))

## Integrate your city to the project

1. Let us know you're ready to add a new city to the project by [opening a new issue](https://github.com/EqualStreetNames/equalstreetnames/issues).

1. You have 2 options:

1. Transfer your repository to the EqualStreetNames organization.

If you choose to do so, you stay of course "owner" of the repository, we'll create a team for you (and anyone you want) that will have admin rights on your repository.
We'll help you maintain and manage your repository.
We'll also setup an automated data update (usually once a week) and automated deployment of the website (if you need it).

1. Keep the ownership of your repository.

We'll just link your repository as sub-module in the [`cities` folder](https://github.com/EqualStreetNames/equalstreetnames/tree/master/cities).
You'll have to maintain your repository, update the data, and the sub-module yourself.

## Run your city locally

1. Clone the main repository

```cmd
git clone https://github.com/EqualStreetNames/equalstreetnames.git
```

1. Copy/Link your repository in the `cities` folder of the main repository (`cities/my-country/my-city`).

1. Run the data update (in the root folder of the main repository)

```cmd
composer install
composer run update-data -- --city=my-country/my-city
```

1. Run the website locally (in the root folder of the main repository)

1. If you're still in the process of testing, you might need to add your city to the `package.json` beforehand.

In the `"scripts"` section:

```diff
+ "serve:my-country:my-city": "parcel serve \"cities/my-country/my-city/html/**/index.html\" --global app --out-dir dist/my-country/my-city"
```

In the `"staticFiles"."staticPath"` section:

```diff
+ {
+ "outDirPattern": "**/dist/my-country/my-city",
+ "staticPath": "cities/my-country/my-city/data"
+ }
```

1. Create a [Mapbox token](https://docs.mapbox.com/help/how-mapbox-works/access-tokens/)

1. Create a file named `.env` in the root directory of the project

1. Add the following line to the `.env` file: `MAPBOX_TOKEN=[your Mapbox token]` replacing `[your Mapbox token]` with the token you created

1. Install JavaScript dependencies and run it

```cmd
npm install
npm run serve:my-country:my-city
```

1. Open <http://localhost:1234/>
Empty file added assets/style.css
Empty file.
31 changes: 31 additions & 0 deletions config.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<?php

declare(strict_types=1);

return [
'relationId' => 0,

'languages' => ['en'],

'exclude' => [
'relation' => [],
'way' => [],
],

'gender' => [
'relation' => [],
'way' => [],
],

'instances' => [
'Q5' => true, // human
'Q2985549' => true, // mononymous person
'Q20643955' => true, // human biblical figure

'Q8436' => false, // family
'Q101352' => false, // family name
'Q327245' => false, // team
'Q3046146' => false, // married couple
'Q13417114' => false, // noble family
],
];
Empty file added data/.gitkeep
Empty file.
150 changes: 150 additions & 0 deletions html/en/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
<!doctype html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link rel="stylesheet" href="../../../../../resources/style.scss">
<link rel="stylesheet" href="../../assets/style.css">

<title>EqualStreetNames.MyCity</title>
</head>

<body>
<div id="loader-wrapper">
<div id="loader-title">EqualStreetNames.MyCity</div>
<div id="loader"></div>
<div id="loader-status">Loading...</div>
</div>

<nav class="navbar navbar-expand-lg navbar-dark fixed-top">
<a class="navbar-brand" href="#">EqualStreetNames.MyCity</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" class="btn btn-primary" data-toggle="modal" href="#contact">
<i class="fas fa-envelope"></i>
Contact
</a>
</li>
<li class="nav-item">
<a class="nav-link" target="_blank" href="https://github.com/openknowledgebe/equalstreetnames/">
<i class="fab fa-github"></i>
GitHub
</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
aria-haspopup="true" aria-expanded="false">English</a>
<div class="dropdown-menu dropdown-menu-right">
<!-- <a class="dropdown-item" href="../fr/index.html">Français</a> -->
</div>
</li>
</ul>
</div>
</nav>

<main class="flex-fill">
<div id="map"></div>
<div id="chart-overlay" class="d-none d-sm-block">
<div id="gender-chart">
<table id="gender-chart-legend" class="table table-borderless table-sm">
<tbody>
<tr class="gender-chart-label" data-gender="m">
<td class="text-center"><i class="fas fa-lg fa-mars"></i></td>
<td>Male (cis)</td>
<td class="text-right gender-chart-count"></td>
<td class="text-right gender-chart-pct"></td>
</tr>
<tr class="gender-chart-label" data-gender="f">
<td class="text-center"><i class="fas fa-lg fa-venus"></i></td>
<td>Female (cis)</td>
<td class="text-right gender-chart-count"></td>
<td class="text-right gender-chart-pct"></td>
</tr>
<tr class="gender-chart-label" data-gender="mx">
<td class="text-center"><i class="fas fa-lg fa-transgender-alt"></i></td>
<td>Male (trans)</td>
<td class="text-right gender-chart-count"></td>
<td class="text-right gender-chart-pct"></td>
</tr>
<tr class="gender-chart-label" data-gender="fx">
<td class="text-center"><i class="fas fa-lg fa-transgender-alt"></i></td>
<td>Female (trans)</td>
<td class="text-right gender-chart-count"></td>
<td class="text-right gender-chart-pct"></td>
</tr>
</tbody>
</table>
<canvas width="250" height="100"></canvas>
</div>
<div id="count-information" class="small">
Out of <span id="count-total"></span> streetnames, <span id="count-person"></span> have been found to be
named after a person.
</div>
</main>

<div id="contact" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<i class="fas fa-envelope"></i>
Contact
</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<p>
Interested in replicating EqualStreetNames in another city?<br>
Interested in hosting workshops or organizing a workshop in your municipality?<br>
</p>

<p>
Please contact us via
<ul>
<li>
Open Knowledge Belgium:
<a href="mailto:[email protected]">[email protected]</a>
</li>
</ul>
</p>
</div>
</div>
</div>
</div>

<script src="../../../../../resources/index.ts"></script>
<script>
app.countries = "be";
app.style = "mapbox://styles/mapbox/dark-v10";
app.init();
</script>
<!-- Fathom - simple website analytics - https://usefathom.com -->
<script>
(function (f, a, t, h, o, m) {
a[h] = a[h] || function () {
(a[h].q = a[h].q || []).push(arguments)
};
o = f.createElement('script'),
m = f.getElementsByTagName('script')[0];
o.async = 1; o.src = t; o.id = 'fathom-script';
m.parentNode.insertBefore(o, m)
})(document, window, 'https://cdn.usefathom.com/tracker.js', 'fathom');
if (process.env.FATHOM_TOKEN) {
fathom('set', 'siteId', process.env.FATHOM_TOKEN);
fathom('trackPageview');
}
</script>
<!-- / Fathom -->
</body>

</html>
39 changes: 39 additions & 0 deletions html/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<!doctype html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<title>EqualStreetNames.MyCity</title>
<style>
html,
body {
height: 100vh;
width: 100vw;
}
</style>
</head>

<body class="d-flex align-items-center flex-column">

<div class="list-group text-center mt-3">
<a href="./en/index.html" class="list-group-item list-group-item-action">
English
</a>
</div>

<script>
(function () {
var language = navigator.language || navigator.browserLanguage;

switch (language.slice(0, 2)) {
case "en": document.location.href = "./en/index.html"; break;
}
})();
</script>

</body>

</html>
14 changes: 14 additions & 0 deletions overpass/relation-full-json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/**
* Get all the relevant relations in Brussels Region.
*/
[out:json][timeout:300];
( area["admin_level"=""]["wikidata"=""]; )->.a; // Set "admin_level" and "wikidata" to the correct information of your city
(
relation["type"="associatedStreet"](area.a);
relation["type"="street"](area.a);
relation["type"="multipolygon"]["place"]["name"](area.a);
relation["type"="multipolygon"]["highway"]["name"](area.a);
);
out body;
>;
out skel qt;
13 changes: 13 additions & 0 deletions overpass/way-full-json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
/**
* Get all the highway ways in Brussels Region.
* Filter out bus stops and service highways.
*/
[out:json][timeout:300];
( area["admin_level"=""]["wikidata"=""]; )->.a; // Set "admin_level" and "wikidata" to the correct information of your city
(
way["highway"]["name"]["highway"!="bus_stop"]["highway"!="elevator"]["highway"!="platform"]["highway"!="service"](area.a);
way["place"="square"]["name"](area.a);
);
out body;
>;
out skel qt;

0 comments on commit f74df96

Please sign in to comment.