Merge pull request #3 from erfurtjohn/v3

V3
erfurtjohn · Mar 2, 2022 · 605c5e5 · 605c5e5
2 parents acc2619 + eeadb27
commit 605c5e5
Show file tree

Hide file tree

Showing 26 changed files with 8,512 additions and 997 deletions.
diff --git a/.env.example b/.env.example
@@ -0,0 +1,9 @@
+API_HOST=
+API_PATH=
+API_PORT=
+API_AUTH=
+CENTERED_MAP=
+CONTROL_CENTER=
+CONTROL_CENTER_NAME=
+TILE_SERVER=https://a.tile.openstreetmap.de/{z}/{x}/{y}.png
+EXAMPLES=false
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,38 @@
-.vscode/*
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
 *.pem
-*.p12
-node_modules
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
+
+# vscode
+.vscode/*
diff --git a/README.md b/README.md
@@ -1,100 +1,85 @@
 # Advanced Mobile Location
-![aml-preview](https://erfurtjohn.de/aml.gif)
 
-AML (Advanced Mobile Location) is a location-based service available on smartphones for emergency purposes. When dialing the local emergency dial number (112), it sends the best available geolocation of the caller to an dedicated endpoint for making the location avaiable for the emergency call taker.
+AML (Advanced Mobile Location) ist ein Dienst zur Positionsbestimmung von Anrufern bei Nutzung der Notrufnummer 112. Wird diese Notrufnummer gewählt, aktiviert das Mobilgerät automatisch GPS und WLAN und sendet - sobald das Gerät einen Standort ermitteln konnte - über SMS oder HTTPS alle verfügbaren Standortdaten an einen Endpunkt. An diesem Endpunkt können BOS-Leitstellen die entsprechenden Daten abgreifen.
 
-This simple software allows you to enter a cell phone number which location will be visualized on a open street map with all its location information like latitude, longitude, accuracy and much more.
+In der Software kann eine Mobilfunknummer eingegeben werden, für die im Nachgang bei der entsprechenden Stelle die Standortdaten abgerufen werden, welche u.a. den Breitengrad, Längengrad und Genauigkeit beinhalten. Alle weiteren übertragenen Parameter können in der Beschreibung der Schnittstelle von der LSt Freiburg entnommen werden.
 
-**More information:**
-* [Wikipedia](https://en.wikipedia.org/wiki/Advanced_Mobile_Location)
-* [Google ELS](https://crisisresponse.google/emergencylocationservice/how-it-works/)
+**Weitere Informationen:**
 
-**Press:**
-* https://www.iphone-ticker.de/notruf-sendet-position-aml-unterstuetzung-startet-in-deutschland-148070/
-* https://www.tagesschau.de/inland/notruf-standort-technik-101.html
-* https://www.rettungsdienst.de/tipps-wissen/erste-hilfe-notruf-ortung-ueber-das-smartphone-54314
-* https://www.heise.de/mac-and-i/meldung/Standortuebermittlung-bei-Notruf-Apple-unterstuetzt-nun-AML-in-Deutschland-4614976.html
+- [Wikipedia](https://de.wikipedia.org/wiki/Advanced_Mobile_Location)
+- [Google ELS](https://www.android.com/safety/emergency-help/emergency-location-service/)
 
-## Requirements
-You will need a installed and running webserver like Apache or nginx with modules _php_ and _curl_ enabled. Furthermore you will need the SSL certificate, it's password and the user data for the HTTP basic authentication. The certificate, it's password and the user data can be requested at the [control center of Freiburg](https://ils-freiburg.de/standortdaten.php) / [public-safety answering point (PSAP) of Freiburg](https://ils-freiburg.de/standortdaten.php). This repository is managed with npm, it requires node.js (npm) for installing it's required packages.
+**Presse:**
 
-## Configuration
-To get things work, you have to modify the `config.php` and enter your individual user data and passwords. Don't forget to add the relative path to the certificate. **NOTICE:** Be sure that the certificate is in `.pem` format and not `.p12`!
-To fit the application for your needs, you can edit the lines 62-65 in `index.html` to display your correct control center, center the map, use the correct tile server and set debug mode to on/off.
+- https://www.iphone-ticker.de/notruf-sendet-position-aml-unterstuetzung-startet-in-deutschland-148070/
+- https://www.tagesschau.de/inland/notruf-standort-technik-101.html
+- https://www.rettungsdienst.de/tipps-wissen/erste-hilfe-notruf-ortung-ueber-das-smartphone-54314
+- https://www.heise.de/mac-and-i/meldung/Standortuebermittlung-bei-Notruf-Apple-unterstuetzt-nun-AML-in-Deutschland-4614976.html
+- https://www.logitel.de/blog/handys/notrufsystem-aml/
 
-### Example php configuration file
-```php
-<?php
-$curl_url = "https://url-to-server:port/get-data?number=";
-$curl_sslcert = "C:\\relative\\path\\to\\certificate.pem";
-$curl_sslcertpasswd = "ssl-certificate-password";
-$curl_user_agent = "Command Center FooBar";
-$curl_userpwd = "foo:bar";
-```
-
-### Changing default position of marker
-To change the default position of the command center marker, you just need to replace the coordinates of the variable `controlCenter` in `index.html`.
+## Anforderungen
 
-### Changing center position of map
-Basically replace the coordinates from the variable `centeredView` in `index.html`.
+Zum Betrieb der Anwendung wird nodeJS benötigt und ein entsprechend fähiger Webserver. Außerdem wird ein Clientzertifikat benötigt, sowie die Zugangsdaten der HTTP Basic Authentifikation. Das notwendige Zertifikat kann bei der [LSt Freiburg](https://ils-freiburg.de/standortdaten.php) beantragt werden.
 
-### Changing tile server
-This software makes use of the free open street map tile server, which is required for displaying the map. To change the tile server just replace the url string for the variable `tileServer` in `index.html`.
+## Konfiguration
 
-A list of some available servers can be found [here](https://wiki.openstreetmap.org/wiki/Tile_servers). An optional tile server can be found on [maptiler.com](https://maptiler.com) (registration required).
+Folgende Umgebungsvariablen können in der `.env` Datei angepasst werden:
 
-### Example configuration
-The default configuration will look like the following code snippet:
-```javascript
-let centeredView = [51.37390, 7.54550],
-    controlCenter = [51.3739, 7.54545],
-    tileServer = "https://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
-    debug = true;
-```
+| Variable            | Funktion                                                                     |
+| ------------------- | ---------------------------------------------------------------------------- |
+| API_HOST            | Host der API                                                                 |
+| API_PATH            | Pfad der API                                                                 |
+| API_PORT            | Port der API                                                                 |
+| API_AUTH            | Authentisierung der API (Basic username:password)                            |
+| CENTERED_MAP        | Koordinaten (Breitengrad, Längengrad) an der die Karte zentriert werden soll |
+| CONTROL_CENTER      | Koordinaten (Breitengrad, Längengrad) an der die LSt markiert werden soll    |
+| CONTROL_CENTER_NAME | Bezeichnung des LSt Markers                                                  |
+| TILE_SERVER         | Adresse des OSM Tile Servers.                                                |
+| EXAMPLES            | Setzt den Testmodus; zeigt die Funktion anhand von Beispieldaten             |
 
-## Debug mode
-The application comes with a small "debug mode". You can enable it in `index.html` if you set the value of variable `debug` to `true`. If you did so, you can enter any value in the phone number input field. Some example data will be loaded to display the functionallity of the application.
+Die Anwendung nutzt kostenlose OSM Tile Server, welche für die Darstellung der Karte benötigt werden. Alternative Tile Server sind [hier](https://wiki.openstreetmap.org/wiki/Tile_servers) zu finden. Optionale und u.U. kostenpflichtige Server gibt es [hier](https://maptiler.com). In der Regel wird aber jede Leitstelle einen eigenen WMS Server betreiben.
 
-## Example AML data
-As a result from the endpoint you will get an json response: An array of objects - each will represent a geolocation.
+## Installation
 
-```json
-[
-    {
-        "status": "ok",
-        "number": "1234567890",
-        "emergency_number": 112,
-        "time": "2019-111-21 09:26:55",
-        "location_latitude": "51.3739",
-        "location_longitude": "7.54545",
-        "location_time": "2019-11-21 09:26:56",
-        "location_altitude": "160.5",
-        "location_floor": "",
-        "location_source": "wifi",
-        "location_accuracy": "15.515",
-        "location_vertical_accuracy": "2.5",
-        "location_confidence": "0.6826895",
-        "location_bearing": "286.43103",
-        "location_speed": "0.08748341"
-    }
-]
-```
+Den aktuellen Release (> 3.0) herunterladen und einfach auf den entsprechenden Server hochladen. Im Anschluss alle benötigten Pakete mit dem Befehl `npm i` installieren und das Projekt erstellen: `npm run build`. Zuletzt kann die Anwendung mit `npm run start` gestartet werden.
 
-## Localization
-The software comes with a small localization using jquery's i18n library. English and german language file can be found in `src/js/lang`. 
+### Clientzertifikat
 
-### Change language
-To change the language simply edit the second line of index.html and change the value of the `lang` attribute to `en` or `de`.
+Aus der erhaltenen `.p12` Zertifikatsdatei muss das Zertifikat und der Key extrahiert werden. Dazu können die folgenden Befehle benutzt werden:
 
-### Add own language
-To add your own language you need to add a new json language file with the given language shortcut name like (en.json, de.json, ..) to `src/js/lang`. After that it's important to tell the library where your language file is stored. Append in `index.html` on line 59 with your language like in this given example for spanish:
 ```
-'es': './src/js/lang/es.json',
+openssl pkcs12 -in aml.p12 -out aml.crt.pem -clcerts -nokeys
+openssl pkcs12 -in aml.p12 -out aml.key.pem -nocerts -nodes
 ```
-And don't forget to change the `lang` attribute of the `html` in index.html in line 2.
 
-## Leaflet documentation
-The leaflet API documentation can be found [here](https://leafletjs.com/reference-1.6.0.html).
+Die extrahierten `.pem` Dateien müssen dann einfach im Hauptverzeichnis abgelegt werden.
+
+## Beispieldaten einer AML-Abfrage
+
+Als Antwort erhält man vom Endpunkt AML-Daten im JSON Format: Ein Array von Objekten. Jedes einzelne Objekt repräsentiert eine Geolocation.
+
+```json
+[
+	{
+		"status": "ok",
+		"number": "1234567890",
+		"emergency_number": 112,
+		"time": "2022-02-26 09:26:55",
+		"location_latitude": "51.3739",
+		"location_longitude": "7.54545",
+		"location_time": "2019-11-21 09:26:56",
+		"location_altitude": "160.5",
+		"location_floor": "",
+		"location_source": "wifi",
+		"location_accuracy": "15.515",
+		"location_vertical_accuracy": "2.5",
+		"location_confidence": "0.6826895",
+		"location_bearing": "286.43103",
+		"location_speed": "0.08748341"
+	}
+]
+```
 
 ## License
+
 Software is licensed under [GNU GPL 3.0](https://github.com/erfurtjohn/advanced-mobile-location/blob/master/LICENSE).