Commit 831dcbec authored by Elias Ojala's avatar Elias Ojala

Browse Speedtest.net servers (map)

parent 6d98da03
......@@ -80,5 +80,15 @@ server {
passenger_enabled off;
}
location /assets/libs/leaflet {
alias /app/node_modules/leaflet/dist;
passenger_enabled off;
}
location /assets/libs/leaflet.markercluster {
alias /app/node_modules/leaflet.markercluster/dist;
passenger_enabled off;
}
access_log off;
}
......@@ -15,4 +15,10 @@ a.text-code:focus, a.text-code:hover {
/* /tools/ */
.tools-margin {
margin-left: 0 !important;
}
/* /explore/speedtest-servers/map */
#speedtestServerMap {
width: 100%;
height: 640px;
}
\ No newline at end of file
var map = L.map('speedtestServerMap', {
maxZoom: 12
}).setView([40.00, 10.00], 2);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
var markers = L.markerClusterGroup();
/* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round */
function round_to_precision(x, precision) {
var y = +x + (precision === undefined ? 0.5 : precision/2);
return y - (y % (precision === undefined ? 1 : +precision));
}
function speedtestDataParser(data) {
data.forEach(server => {
const lat = round_to_precision(server.lat, 0.01);
const lon = round_to_precision(server.lon, 0.01);
markers.addLayer(
L.marker([lat, lon])
.bindPopup(`${server.name}, ${server.country} (sponsored by ${server.sponsor})`)
);
});
}
map.addLayer(markers);
\ No newline at end of file
......@@ -117,6 +117,8 @@ app.use("/assets/libs/datatables.net/js/", express.static("node_modules/datatabl
app.use("/assets/libs/datatables.net-bs4/css/", express.static("node_modules/datatables.net-bs4/css/"));
app.use("/assets/libs/datatables.net-bs4/js/", express.static("node_modules/datatables.net-bs4/js/"));
app.use("/assets/libs/datatables.net-responsive/js/", express.static("node_modules/datatables.net-responsive/js/"));
app.use("/assets/libs/leaflet/", express.static("node_modules/leaflet/dist/"));
app.use("/assets/libs/leaflet.markercluster/", express.static("node_modules/leaflet.markercluster/dist/"));
// In production, minify HTML
if (production) {
......@@ -153,7 +155,7 @@ app.use(/*(req: Request, res: Response, next: NextFunction) => {*/
/* tslint:disable:object-literal-sort-keys */
policy: {
"default-src": "'none'",
"img-src": "'self' data: https://screenshots.lelux.fi/api/png",
"img-src": "'self' data: https://*.tile.openstreetmap.org",
"style-src": "'self' 'unsafe-inline'",
"font-src": "'self'",
......
......@@ -102,8 +102,13 @@ import { DataReturnFormat } from "../app";
/**
* Browse Speedtest.net servers
*/
router.get("/speedtest-servers/", (req: Request, res: Response, next: NextFunction) => {
let format: DataReturnFormat;
router.get("/speedtest-servers/:isMap?", (req: Request, res: Response, next: NextFunction) => {
let format: DataReturnFormat | "map";
/**
* Allows / or /map, else returns 404 ( next() )
*/
let isMapOrNot: boolean = false;
switch (req.query.format) {
case DataReturnFormat.Json:
......@@ -122,7 +127,21 @@ router.get("/speedtest-servers/", (req: Request, res: Response, next: NextFuncti
break;
}
if(format) {
switch (req.params.isMap) {
case "map":
isMapOrNot = (format === DataReturnFormat.Html) ? true : false;
format = "map";
break;
case "" || undefined:
isMapOrNot = true;
break;
default:
break;
}
if(format && isMapOrNot) {
Axios.get(`https://www.speedtest.net/speedtest-servers.php`)
.then(x => x.data)
.then(rawXmlData => {
......@@ -146,9 +165,15 @@ router.get("/speedtest-servers/", (req: Request, res: Response, next: NextFuncti
res.json(servers);
} else if(format === DataReturnFormat.Jsonp) {
res.jsonp(servers);
} else if(format === "map") {
res.render("explore/speedtest-servers/map.twig", {
title: `Browse Speedtest.net servers (map)`,
canonical_url: `/explore/speedtest-servers/map`,
servers,
});
} else {
res.render("explore/speedtest-servers.twig", {
title: `Browse Speedtest.net servers`,
res.render("explore/speedtest-servers/table.twig", {
title: `Browse Speedtest.net servers (table)`,
canonical_url: `/explore/speedtest-servers/`,
servers,
});
......
......@@ -19,6 +19,7 @@
<a class="dropdown-item" href="/tld/">Top Level Domains</a>
<a class="dropdown-item" href="/tor-relay/">Tor relays</a>
<a class="dropdown-item" href="/explore/speedtest-servers/">Speedtest.net servers</a>
<a class="dropdown-item" href="/explore/speedtest-servers/map">Speedtest.net servers (map)</a>
</div>
</li>
<li class="nav-item dropdown">
......
......@@ -7,10 +7,16 @@
<ul>
<li><a href="/explore/speedtest-servers?format=json">JSON format</a></li>
<li><a href="/explore/speedtest-servers/">HTML format</a></li>
<li><a href="/explore/speedtest-servers/">HTML format (table)</a></li>
<li><a href="/explore/speedtest-servers/map">HTML format (map)</a></li>
<li><a href="https://www.speedtest.net/speedtest-servers.php">XML format</a> (original)</li>
</ul>
<p>Also available as <a href="https://en.wikipedia.org/wiki/JSONP">JSONP</a> at
<a class="text-monospace text-code" href="/explore/speedtest-servers?format=jsonp&amp;callback=speedtestDataParser">
https://telcodb.net/explore/speedtest-servers?format=jsonp&amp;callback=speedtestDataParser</a>.
You alternatively may change the callback (<code>speedtestDataParser</code>), but we do not recommend doing so for caching reasons.</p>
<hr>
<p><a href="/docs/">Go back to documentation</a></p>
{% endblock %}
\ No newline at end of file
{% extends 'layouts/default.twig' %}
{% block body %}
<h1>{{ title|e}}</h1>
<div id="speedtestServerMap"></div>
<p>Also available in <a href="/docs/speedtest-servers-json/">JSON/JSONP/XML</a>.</p>
{% endblock %}
{% block javascripts %}
<link rel="stylesheet" href="/assets/libs/leaflet/leaflet.css" />
<link rel="stylesheet" href="/assets/libs/leaflet.markercluster/MarkerCluster.css" />
<link rel="stylesheet" href="/assets/libs/leaflet.markercluster/MarkerCluster.Default.css" />
<script src="/assets/libs/leaflet/leaflet.js"></script>
<script src="/assets/libs/leaflet.markercluster/leaflet.markercluster.js"></script>
<script src="/assets/js/pages/explore/speedtest-servers/map.js"></script>
<script src="/explore/speedtest-servers?format=jsonp&amp;callback=speedtestDataParser"></script>
{% endblock %}
\ No newline at end of file
{% extends 'layouts/default.twig' %}
{% block body %}
<h1>{{ title|e}}</td></h1>
<h1>{{ title|e}}</h1>
<table class="table" id="speedtestServerTable">
<thead>
......@@ -36,12 +36,12 @@
</tbody>
</table>
<p>Also available in <a href="/docs/speedtest-servers-json/">JSON</a> and <a href="https://www.speedtest.net/speedtest-servers.php">XML</a>.</p>
<p>Also available in <a href="/docs/speedtest-servers-json/">JSON/JSONP/XML</a>.</p>
{% endblock %}
{% block javascripts %}
{# Datatables #}
<script src="/assets/js/pages/explore/speedtest-servers.js"></script>
<script src="/assets/js/pages/explore/speedtest-servers/table.js"></script>
<link rel="stylesheet" type="text/css" href="/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css"/>
<script type="text/javascript" src="/assets/libs/datatables.net/js/jquery.dataTables.min.js"></script>
......
......@@ -2424,6 +2424,16 @@ latest-version@^3.0.0:
dependencies:
package-json "^4.0.0"
leaflet.markercluster@^1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/leaflet.markercluster/-/leaflet.markercluster-1.4.1.tgz#b53f2c4f2ca7306ddab1dbb6f1861d5e8aa6c5e5"
integrity sha512-ZSEpE/EFApR0bJ1w/dUGwTSUvWlpalKqIzkaYdYB7jaftQA/Y2Jav+eT4CMtEYFj+ZK4mswP13Q2acnPBnhGOw==
leaflet@^1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.5.1.tgz#9afb9d963d66c870066b1342e7a06f92840f46bf"
integrity sha512-ekM9KAeG99tYisNBg0IzEywAlp0hYI5XRipsqRXyRTeuU8jcuntilpp+eFf5gaE0xubc9RuSNIVtByEKwqFV0w==
locutus@^2.0.5:
version "2.0.11"
resolved "https://registry.yarnpkg.com/locutus/-/locutus-2.0.11.tgz#83f85109971fd3dd620482a04381916e4a31d4f0"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment