Web interface with map where user can place pin for testing

Closes: #21

lookup.py

@@ -410,5 +410,35 @@ def reports() -> str:
     )
 
 
+@app.route("/pin/<lat>/<lon>")
+def pin_detail(lat: str, lon: str) -> Response:
+    """Details for map pin location."""
+    reply = lat_lon_to_wikidata(float(lat), float(lon))
+    element = reply["result"].pop("element", None)
+    geojson = reply["result"].pop("geojson", None)
+
+    css = HtmlFormatter().get_style_defs(".highlight")
+
+    html = render_template(
+        "pin_detail.html",
+        lat=lat,
+        lon=lon,
+        str=str,
+        element_id=element,
+        geojson=geojson,
+        css=css,
+        **reply,
+    )
+
+    return jsonify(html=html)
+
+
+@app.route("/map")
+def map_page() -> str:
+    """Map page."""
+    css = HtmlFormatter().get_style_defs(".highlight")
+    return render_template("map.html", css=css)
+
+
 if __name__ == "__main__":
     app.run(host="0.0.0.0")

templates/index.html

@@ -16,6 +16,8 @@ Wikidata Query service (WDQS)</li>
 <li>Return the most specific Wikidata QID and Commons Category.</li>
 </ol>
 
+<p><a href="{{ url_for("map_page") }}">Interactive map with clickable pin for geocode testing</a>: click on any location within the map to place a pin and see the geocoding results for that specific point.</p>
+
 <form>
 Latitude/Longitude: <input name="q"/> (e.g. 54.375, -2.999) <input type="submit" value="go"/>
 </form>