API & Client - tile server for map can be changed - fix #54

Makefile.custom.config.example

@@ -1,7 +1,7 @@
 WORKERS_PROCESSES = 1
 
 export REACT_APP_API_URL=
-export REACT_APP_THUNDERFOREST_API_KEY=
+export TILE_SERVER_URL=
 export WEATHER_API=
 export UI_URL=
 export EMAIL_URL=

docs/_sources/api/activities.rst.txt

@@ -10,6 +10,7 @@ Activities
     activities.get_segment_chart_data,
     activities.get_segment_gpx,
     activities.get_map,
+    activities.get_map_tile,
     activities.post_activity,
     activities.post_activity_no_gpx,
     activities.update_activity,

docs/_sources/installation.rst.txt

@@ -25,7 +25,6 @@ Prerequisites
 -  `Poetry <https://poetry.eustace.io>`__
 -  `Yarn <https://yarnpkg.com>`__ and
    `serve <https://github.com/zeit/serve>`__
--  API key from `ThunderForest <http://thunderforest.com>`__
 -  API key from `Dark Sky <https://darksky.net/dev>`__ [not mandatory]
 -  SMTP provider
 
@@ -186,21 +185,22 @@ The following environment variables must be defined in **Makefile.custom.config*
 
 .. cssclass:: table-bordered table-striped
 
-===================================== ======================================= ====================================
+===================================== ======================================== ====================================
-variable                              description                             app default value
+variable                              description                              app default value
-===================================== ======================================= ====================================
+===================================== ======================================== ====================================
-``REACT_APP_API_URL``                 Fittrackee API URL                      no default value, must be initialized
+``REACT_APP_API_URL``                 Fittrackee API URL                       no default value, must be initialized
-``REACT_APP_GPX_LIMIT_IMPORT``        max. number of gpx file in zip archive  10 (*deprecated in 0.3.0*)
+``REACT_APP_GPX_LIMIT_IMPORT``        max. number of gpx file in zip archive   10 (*deprecated in 0.3.0*)
-``REACT_APP_MAX_SINGLE_FILE_SIZE``    max. size of a gpx or picture file      1MB (*deprecated in 0.3.0*)
+``REACT_APP_MAX_SINGLE_FILE_SIZE``    max. size of a gpx or picture file       1MB (*deprecated in 0.3.0*)
-``REACT_APP_MAX_ZIP_FILE_SIZE``       max. size of a zip archive              10MB (*deprecated in 0.3.0*)
+``REACT_APP_MAX_ZIP_FILE_SIZE``       max. size of a zip archive               10MB (*deprecated in 0.3.0*)
-``REACT_APP_ALLOW_REGISTRATION``      allows users to register                true (*deprecated in 0.3.0*)
+``REACT_APP_ALLOW_REGISTRATION``      allows users to register                 true (*deprecated in 0.3.0*)
-``REACT_APP_THUNDERFOREST_API_KEY``   ThunderForest API key                   no default value, must be initialized
+``REACT_APP_THUNDERFOREST_API_KEY``   ThunderForest API key                    (*deprecated*, use ``TILE_SERVER_URL`` instead)
-``UI_URL``                            application URL                         no default value, must be initialized
+``TILE_SERVER_URL``                   Tile server URL (with api key if needed) ``https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png``
-``EMAIL_URL``                         email URL with credentials              no default value, must be initialized (see below)
+``UI_URL``                            application URL                          no default value, must be initialized
-``SENDER_EMAIL``                      application sender email address        no default value, must be initialized
+``EMAIL_URL``                         email URL with credentials               no default value, must be initialized (see below)
-``REDIS_URL``                         Redis instance used by Dramatiq         local Redis instance
+``SENDER_EMAIL``                      application sender email address         no default value, must be initialized
-``WORKERS_PROCESSES``                 number of process used by Dramatiq      no default value, must be initialized
+``REDIS_URL``                         Redis instance used by Dramatiq          local Redis instance
-===================================== ======================================= ====================================
+``WORKERS_PROCESSES``                 number of process used by Dramatiq       no default value, must be initialized
+===================================== ======================================== ====================================
 
 .. warning::
     Since FitTrackee 0.3.0, some applications parameters are now stored in database.

docs/api/activities.html

@@ -636,7 +636,6 @@
 <p><strong>Example request</strong>:</p>
 <div class="highlight-http notranslate"><div class="highlight"><pre><span></span><span class="nf">GET</span> <span class="nn">/api/activities/map/fa33f4d996844a5c73ecd1ae24456ab8?1563529507772</span>
   <span class="kr">HTTP</span><span class="o">/</span><span class="m">1.1</span>
-<span class="na">Content-Type</span><span class="o">:</span> <span class="l">application/json</span>
 </pre></div>
 </div>
 <p><strong>Example response</strong>:</p>
@@ -666,6 +665,32 @@
 </dl>
 </dd></dl>
 
+<dl class="http get">
+<dt id="get--api-activities-map_tile-(s)-(z)-(x)-(y).png">
+<code class="sig-name descname">GET </code><code class="sig-name descname">/api/activities/map_tile/</code><span class="sig-paren">(</span><em class="sig-param">s</em><span class="sig-paren">)</span><code class="sig-name descname">/</code><span class="sig-paren">(</span><em class="sig-param">z</em><span class="sig-paren">)</span><code class="sig-name descname">/</code><span class="sig-paren">(</span><em class="sig-param">x</em><span class="sig-paren">)</span><code class="sig-name descname">/</code><span class="sig-paren">(</span><em class="sig-param">y</em><span class="sig-paren">)</span><code class="sig-name descname">.png</code><a class="headerlink" href="#get--api-activities-map_tile-(s)-(z)-(x)-(y).png" title="Permalink to this definition">¶</a></dt>
+<dd><p>Get map tile from tile server.</p>
+<p><strong>Example request</strong>:</p>
+<div class="highlight-http notranslate"><div class="highlight"><pre><span></span><span class="nf">GET</span> <span class="nn">/api/activities/map_tile/c/13/4109/2930.png</span> <span class="kr">HTTP</span><span class="o">/</span><span class="m">1.1</span>
+</pre></div>
+</div>
+<p><strong>Example response</strong>:</p>
+<div class="highlight-http notranslate"><div class="highlight"><pre><span></span><span class="kr">HTTP</span><span class="o">/</span><span class="m">1.1</span> <span class="m">200</span> <span class="ne">OK</span>
+<span class="na">Content-Type</span><span class="o">:</span> <span class="l">image/png</span>
+</pre></div>
+</div>
+<dl class="field-list simple">
+<dt class="field-odd">Parameters</dt>
+<dd class="field-odd"><ul class="simple">
+<li><p><strong>s</strong> (<em>string</em>) – subdomain</p></li>
+<li><p><strong>z</strong> (<em>string</em>) – zoom</p></li>
+<li><p><strong>x</strong> (<em>string</em>) – index of the tile along the map’s x axis</p></li>
+<li><p><strong>y</strong> (<em>string</em>) – index of the tile along the map’s y axis</p></li>
+</ul>
+</dd>
+</dl>
+<p>Status codes are status codes returned by tile server</p>
+</dd></dl>
+
 <dl class="http post">
 <dt id="post--api-activities">
 <code class="sig-name descname">POST </code><code class="sig-name descname">/api/activities</code><a class="headerlink" href="#post--api-activities" title="Permalink to this definition">¶</a></dt>

docs/http-routingtable.html

@@ -160,6 +160,11 @@
        <td>
        <a href="api/activities.html#get--api-activities-map-(map_id)"><code class="xref">GET /api/activities/map/(map_id)</code></a></td><td>
        <em></em></td></tr>
+     <tr>
+       <td></td>
+       <td>
+       <a href="api/activities.html#get--api-activities-map_tile-(s)-(z)-(x)-(y).png"><code class="xref">GET /api/activities/map_tile/(s)/(z)/(x)/(y).png</code></a></td><td>
+       <em></em></td></tr>
      <tr>
        <td></td>
        <td>

docs/installation.html

@@ -176,7 +176,6 @@
 <li><p><a class="reference external" href="https://poetry.eustace.io">Poetry</a></p></li>
 <li><p><a class="reference external" href="https://yarnpkg.com">Yarn</a> and
 <a class="reference external" href="https://github.com/zeit/serve">serve</a></p></li>
-<li><p>API key from <a class="reference external" href="http://thunderforest.com">ThunderForest</a></p></li>
 <li><p>API key from <a class="reference external" href="https://darksky.net/dev">Dark Sky</a> [not mandatory]</p></li>
 <li><p>SMTP provider</p></li>
 </ul>
@@ -329,9 +328,9 @@ $ make upgrade-db
 <p>The following environment variables must be defined in <strong>Makefile.custom.config</strong>:</p>
 <table class="table-bordered table-striped docutils align-default">
 <colgroup>
-<col style="width: 30%" />
+<col style="width: 28%" />
 <col style="width: 31%" />
-<col style="width: 39%" />
+<col style="width: 41%" />
 </colgroup>
 <thead>
 <tr class="row-odd"><th class="head"><p>variable</p></th>
@@ -362,25 +361,29 @@ $ make upgrade-db
 </tr>
 <tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">REACT_APP_THUNDERFOREST_API_KEY</span></code></p></td>
 <td><p>ThunderForest API key</p></td>
-<td><p>no default value, must be initialized</p></td>
+<td><p>(<em>deprecated</em>, use <code class="docutils literal notranslate"><span class="pre">TILE_SERVER_URL</span></code> instead)</p></td>
 </tr>
-<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">UI_URL</span></code></p></td>
+<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">TILE_SERVER_URL</span></code></p></td>
+<td><p>Tile server URL (with api key if needed)</p></td>
+<td><p><code class="docutils literal notranslate"><span class="pre">https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png</span></code></p></td>
+</tr>
+<tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">UI_URL</span></code></p></td>
 <td><p>application URL</p></td>
 <td><p>no default value, must be initialized</p></td>
 </tr>
-<tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">EMAIL_URL</span></code></p></td>
+<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">EMAIL_URL</span></code></p></td>
 <td><p>email URL with credentials</p></td>
 <td><p>no default value, must be initialized (see below)</p></td>
 </tr>
-<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">SENDER_EMAIL</span></code></p></td>
+<tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">SENDER_EMAIL</span></code></p></td>
 <td><p>application sender email address</p></td>
 <td><p>no default value, must be initialized</p></td>
 </tr>
-<tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">REDIS_URL</span></code></p></td>
+<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">REDIS_URL</span></code></p></td>
 <td><p>Redis instance used by Dramatiq</p></td>
 <td><p>local Redis instance</p></td>
 </tr>
-<tr class="row-even"><td><p><code class="docutils literal notranslate"><span class="pre">WORKERS_PROCESSES</span></code></p></td>
+<tr class="row-odd"><td><p><code class="docutils literal notranslate"><span class="pre">WORKERS_PROCESSES</span></code></p></td>
 <td><p>number of process used by Dramatiq</p></td>
 <td><p>no default value, must be initialized</p></td>
 </tr>

docsrc/source/api/activities.rst

@@ -10,6 +10,7 @@ Activities
     activities.get_segment_chart_data,
     activities.get_segment_gpx,
     activities.get_map,
+    activities.get_map_tile,
     activities.post_activity,
     activities.post_activity_no_gpx,
     activities.update_activity,

docsrc/source/installation.rst

@@ -25,7 +25,6 @@ Prerequisites
 -  `Poetry <https://poetry.eustace.io>`__
 -  `Yarn <https://yarnpkg.com>`__ and
    `serve <https://github.com/zeit/serve>`__
--  API key from `ThunderForest <http://thunderforest.com>`__
 -  API key from `Dark Sky <https://darksky.net/dev>`__ [not mandatory]
 -  SMTP provider
 
@@ -186,21 +185,22 @@ The following environment variables must be defined in **Makefile.custom.config*
 
 .. cssclass:: table-bordered table-striped
 
-===================================== ======================================= ====================================
+===================================== ======================================== ====================================
-variable                              description                             app default value
+variable                              description                              app default value
-===================================== ======================================= ====================================
+===================================== ======================================== ====================================
-``REACT_APP_API_URL``                 Fittrackee API URL                      no default value, must be initialized
+``REACT_APP_API_URL``                 Fittrackee API URL                       no default value, must be initialized
-``REACT_APP_GPX_LIMIT_IMPORT``        max. number of gpx file in zip archive  10 (*deprecated in 0.3.0*)
+``REACT_APP_GPX_LIMIT_IMPORT``        max. number of gpx file in zip archive   10 (*deprecated in 0.3.0*)
-``REACT_APP_MAX_SINGLE_FILE_SIZE``    max. size of a gpx or picture file      1MB (*deprecated in 0.3.0*)
+``REACT_APP_MAX_SINGLE_FILE_SIZE``    max. size of a gpx or picture file       1MB (*deprecated in 0.3.0*)
-``REACT_APP_MAX_ZIP_FILE_SIZE``       max. size of a zip archive              10MB (*deprecated in 0.3.0*)
+``REACT_APP_MAX_ZIP_FILE_SIZE``       max. size of a zip archive               10MB (*deprecated in 0.3.0*)
-``REACT_APP_ALLOW_REGISTRATION``      allows users to register                true (*deprecated in 0.3.0*)
+``REACT_APP_ALLOW_REGISTRATION``      allows users to register                 true (*deprecated in 0.3.0*)
-``REACT_APP_THUNDERFOREST_API_KEY``   ThunderForest API key                   no default value, must be initialized
+``REACT_APP_THUNDERFOREST_API_KEY``   ThunderForest API key                    (*deprecated*, use ``TILE_SERVER_URL`` instead)
-``UI_URL``                            application URL                         no default value, must be initialized
+``TILE_SERVER_URL``                   Tile server URL (with api key if needed) ``https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png``
-``EMAIL_URL``                         email URL with credentials              no default value, must be initialized (see below)
+``UI_URL``                            application URL                          no default value, must be initialized
-``SENDER_EMAIL``                      application sender email address        no default value, must be initialized
+``EMAIL_URL``                         email URL with credentials               no default value, must be initialized (see below)
-``REDIS_URL``                         Redis instance used by Dramatiq         local Redis instance
+``SENDER_EMAIL``                      application sender email address         no default value, must be initialized
-``WORKERS_PROCESSES``                 number of process used by Dramatiq      no default value, must be initialized
+``REDIS_URL``                         Redis instance used by Dramatiq          local Redis instance
-===================================== ======================================= ====================================
+``WORKERS_PROCESSES``                 number of process used by Dramatiq       no default value, must be initialized
+===================================== ======================================== ====================================
 
 .. warning::
     Since FitTrackee 0.3.0, some applications parameters are now stored in database.

fittrackee_api/fittrackee_api/activities/activities.py

@@ -3,8 +3,17 @@ import os
 import shutil
 from datetime import datetime, timedelta
 
+import requests
 from fittrackee_api import appLog, db
-from flask import Blueprint, current_app, jsonify, request, send_file
+from flask import (
+    Blueprint,
+    Response,
+    current_app,
+    jsonify,
+    request,
+    send_file,
+    stream_with_context,
+)
 from sqlalchemy import exc
 
 from ..users.utils import (
@@ -681,7 +690,6 @@ def get_map(map_id):
 
       GET /api/activities/map/fa33f4d996844a5c73ecd1ae24456ab8?1563529507772
         HTTP/1.1
-      Content-Type: application/json
 
     **Example response**:
 
@@ -718,6 +726,46 @@ def get_map(map_id):
         return jsonify(response_object), 500
 
 
+@activities_blueprint.route(
+    '/activities/map_tile/<s>/<z>/<x>/<y>.png', methods=['GET']
+)
+def get_map_tile(s, z, x, y):
+    """
+    Get map tile from tile server.
+
+    **Example request**:
+
+    .. sourcecode:: http
+
+      GET /api/activities/map_tile/c/13/4109/2930.png HTTP/1.1
+
+    **Example response**:
+
+    .. sourcecode:: http
+
+      HTTP/1.1 200 OK
+      Content-Type: image/png
+
+    :param string s: subdomain
+    :param string z: zoom
+    :param string x: index of the tile along the map's x axis
+    :param string y: index of the tile along the map's y axis
+
+    Status codes are status codes returned by tile server
+
+    """
+    url = current_app.config["TILE_SERVER_URL"].format(s=s, z=z, x=x, y=y)
+    headers = {'User-Agent': 'Mozilla/5.0'}
+    response = requests.get(url, headers=headers)
+    return (
+        Response(
+            response.content,
+            content_type=response.headers['content-type'],
+        ),
+        response.status_code,
+    )
+
+
 @activities_blueprint.route('/activities', methods=['POST'])
 @authenticate
 def post_activity(auth_user_id):

fittrackee_api/fittrackee_api/config.py

@@ -28,6 +28,9 @@ class BaseConfig:
     EMAIL_URL = os.environ.get('EMAIL_URL')
     SENDER_EMAIL = os.environ.get('SENDER_EMAIL')
     DRAMATIQ_BROKER = broker
+    TILE_SERVER_URL = os.environ.get(
+        'TILE_SERVER_URL', 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
+    )
 
 
 class DevelopmentConfig(BaseConfig):

fittrackee_client/src/components/Activity/ActivityDisplay/ActivityMap.jsx

@@ -4,7 +4,7 @@ import { GeoJSON, Map, Marker, TileLayer } from 'react-leaflet'
 import { connect } from 'react-redux'
 
 import { getActivityGpx, getSegmentGpx } from '../../../actions/activities'
-import { thunderforestApiKey } from '../../../utils'
+import { apiUrl } from '../../../utils'
 import { getGeoJson } from '../../../utils/activities'
 
 class ActivityMap extends React.Component {
@@ -62,8 +62,8 @@ class ActivityMap extends React.Component {
             <TileLayer
               // eslint-disable-next-line max-len
               attribution='&copy; <a href="http://www.thunderforest.com/">Thunderforest</a>, &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
-              // eslint-disable-next-line max-len
+              url={`${apiUrl}activities/map_tile/{s}/{z}/{x}/{y}.png`}
-              url={`https://{s}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png?apikey=${thunderforestApiKey}`}
+
             />
             <GeoJSON
               // hash as a key to force re-rendering

fittrackee_client/src/utils/index.js

@@ -19,10 +19,6 @@ export const getFileSizeInMB = fileSize => {
 
 export const version = '0.3.0-beta' // version stored in 'utils' for now
 export const apiUrl = `${process.env.REACT_APP_API_URL}/api/`
-/* prettier-ignore */
-export const thunderforestApiKey = `${
-  process.env.REACT_APP_THUNDERFOREST_API_KEY
-}`
 
 export const userFilters = [
   { key: 'activities_count', label: 'activities count' },