Skip to content

Commit

Permalink
MVP-ish
Browse files Browse the repository at this point in the history
  • Loading branch information
Kahn committed Aug 8, 2021
1 parent 8b87a48 commit 7e5ff2d
Show file tree
Hide file tree
Showing 11 changed files with 453 additions and 199 deletions.
7 changes: 6 additions & 1 deletion TODO.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,9 @@ Traffic heatmap (DB needed)
CC BY-SA 3.0
https://commons.wikimedia.org/wiki/File:Plane_font_awesome.svg

public/flaticon.com/ga-*.png
<div>Icons made by <a href="https://www.freepik.com" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a></div>

## Theme

Green 33cc99 A10
Expand All @@ -54,4 +57,6 @@ Local search
https://docs.mapbox.com/mapbox-gl-js/example/forward-geocode-custom-data/

Progressive taxi? / taxi markup for pilot assist
https://docs.mapbox.com/mapbox-gl-js/example/measure/
https://docs.mapbox.com/mapbox-gl-js/example/measure/

https://docs.mapbox.com/mapbox-gl-js/example/set-popup/
47 changes: 47 additions & 0 deletions block.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<h1 class="title">Traffic in VATPAC airspace</h1>
<div id="vatsim-map-iframe"></div>
<script type="application/javascript">
console.log('vatsim-map');

const targetNode = document.documentElement;
const config = { attributes: true, childList: false, subtree: false };

const callback = function(mutationsList, observer) {
console.log("MutationObserver");
// Use traditional 'for loops' for IE 11
for(const mutation of mutationsList) {
if (mutation.type === 'attributes') {
if(mutation.attributeName === "class") {
console.log(`theme observer: ${mutation.target.className}`);
if(mutation.target.className === "theme--dark"){
setTheme("dark");
}else{

setTheme("light");
}
}
}
}
};

var theme = "false";
function setTheme(theme){
console.log('setTheme')
var div = document.getElementById('vatsim-map-iframe');
if(theme == "dark"){
console.log(theme);
div.innerHTML = '<iframe src="https://vatpac.cycloptivity.net/static/map.html?theme=dark" name="vatsim-map" id="vatsim-map__dark" scrolling="no" frameborder="0" width="100%" height="500px"></iframe>';
}

if(theme == "light"){
console.log(theme);
div.innerHTML = '<iframe src="https://vatpac.cycloptivity.net/static/map.html?theme=light" name="vatsim-map" id="vatsim-map__dark" scrolling="no" frameborder="0" width="100%" height="500px"></iframe>';
}
};

setTheme("light");
const observer = new MutationObserver(callback);
observer.observe(targetNode, config);


</script>
173 changes: 100 additions & 73 deletions client.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@ import fetch from 'node-fetch';
import { xml2js } from 'xml-js';
import dms2dec from 'dms2dec';
import { lineToPolygon, lineString } from '@turf/turf';
import bunyan from 'bunyan';

var log = bunyan.createLogger({name: "vatsim-map"})
const cache = new NodeCache( { stdTTL: 15, checkperiod: 30 } );

/**
Expand All @@ -14,7 +16,7 @@ const cache = new NodeCache( { stdTTL: 15, checkperiod: 30 } );
*/

export function clearCache(){
console.log('Clearing cache')
log.info('Clearing cache')
cache.flushAll();
return true;
}
Expand All @@ -36,12 +38,20 @@ export async function getVatsimData (url) {
.then( data => {
return data;
})
.catch(err => console.log(err));
.catch(err => log.error(err));
data = res;
console.log(`cache:set url:${url} keys:${Object.keys(data).length}`)
log.info({
cache: 'set',
url: url,
keys: Object.keys(data).length
})
cache.set("vatsimData", data, 15);
}else{
console.log(`cache:get url:${url} keys:${Object.keys(data).length}`)
log.info({
cache: 'get',
url: url,
keys: Object.keys(data).length
})
}
return data;
}
Expand All @@ -55,12 +65,20 @@ export async function getVatsimAFV (url) {
.then( data => {
return data;
})
.catch(err => console.log(err));
.catch(err => log.error(err));
data = res;
console.log(`cache:set url:${url} keys:${Object.keys(data).length}`)
log.info({
cache: 'set',
url: url,
keys: Object.keys(data).length
});
cache.set("vatsimAFV", data, 15);
}else{
console.log(`cache:get url:${url} keys:${Object.keys(data).length}`)
log.info({
cache: 'get',
url: url,
keys: Object.keys(data).length
})
}
return data;
}
Expand All @@ -82,20 +100,27 @@ export async function getLineFeatures (url) {
.then( data => {
return data;
})
.catch(err => console.log(err));
.catch(err => log.error(err));
data = await xml2js(res, {compact: true, spaces: 4});
}catch(err){
throw Error(err);
}

var features = xmlToFeatures(data);
console.log(features);

console.log(`cache:set url:${url} objs:${features.length}`)
log.info({
cache: 'set',
url: url,
objs: data.length
})
cache.set(url, features, 86400);
return features;
}else{
console.log(`cache:get url:${url} objs:${data.length}`)
log.info({
cache: 'get',
url: url,
objs: data.length
})
return data;
}
}
Expand All @@ -107,70 +132,72 @@ function xmlToFeatures (data) {
// (?<latD>[+-][0-9]{2})(?<latM>[0-9]{2})(?<latS>[0-9]{2}\.[0-9]{3})(?<lonD>[+-][0-9]{3})(?<lonM>[0-9]{2})(?<lonS>[0-9]{2}\.[0-9]{3})
const re = new RegExp(/(?<latRef>[+-])(?<latD>[0-9]{2})(?<latM>[0-9]{2})(?<latS>[0-9]{2}\.[0-9]{3})(?<lonRef>[+-])(?<lonD>[0-9]{3})(?<lonM>[0-9]{2})(?<lonS>[0-9]{2}\.[0-9]{3})/g)

// Handle Maps - FIR Boundaries
try{
data.Maps.Map.Line.forEach(function(obj){
var lineStringArr = [];
var matches = [...obj._text.matchAll(re)];
matches.forEach(function(match){
// Convert vaySys DMS into decimal degrees
// https://github.com/vatSys/xml-tools/blob/master/DotAIPtoXML/DotAIPtoXML/Coordinate.cs#L119
var pos = {
latitude: [
parseInt(match.groups.latD),
parseInt(match.groups.latM),
parseFloat(match.groups.latS)
],
latRef: (match.groups.latRef == '+') ? "N" : "S",
longitude: [
parseInt(match.groups.lonD),
parseInt(match.groups.lonM),
parseFloat(match.groups.lonS)
],
lonRef: (match.groups.lonRef == '+') ? "E" : "W"
}
var [ latitude, longitude ] = dms2dec(pos.latitude,pos.latRef,pos.longitude,pos.lonRef);
// Turf is geoJSON so we continue the stupidity here with long THEN lat.
lineStringArr.push([longitude, latitude]);
});
polys.push(lineToPolygon(lineString(lineStringArr),{mutate: true, properties: {name: obj._attributes.Name}}));
})
}catch(err){
console.log(err);
if(data.Maps.Map.Line == undefined){
// Handle volumes
try{
data.Volumes.Boundary.forEach(function(obj){
var lineStringArr = [];
var matches = [...obj._text.matchAll(re)];
matches.forEach(function(match){
// Convert vaySys DMS into decimal degrees
// https://github.com/vatSys/xml-tools/blob/master/DotAIPtoXML/DotAIPtoXML/Coordinate.cs#L119
var pos = {
latitude: [
parseInt(match.groups.latD),
parseInt(match.groups.latM),
parseFloat(match.groups.latS)
],
latRef: (match.groups.latRef == '+') ? "N" : "S",
longitude: [
parseInt(match.groups.lonD),
parseInt(match.groups.lonM),
parseFloat(match.groups.lonS)
],
lonRef: (match.groups.lonRef == '+') ? "E" : "W"
}
var [ latitude, longitude ] = dms2dec(pos.latitude,pos.latRef,pos.longitude,pos.lonRef);
// Turf is geoJSON so we continue the stupidity here with long THEN lat.
lineStringArr.push([longitude, latitude]);
});
polys.push(lineToPolygon(lineString(lineStringArr),{mutate: true, properties: {name: obj._attributes.Name}}));
})
}catch(err){
log.error(err);
}
}else{
// Handle Maps - FIR Boundaries
try{
data.Maps.Map.Line.forEach(function(obj){
var lineStringArr = [];
var matches = [...obj._text.matchAll(re)];
matches.forEach(function(match){
// Convert vaySys DMS into decimal degrees
// https://github.com/vatSys/xml-tools/blob/master/DotAIPtoXML/DotAIPtoXML/Coordinate.cs#L119
var pos = {
latitude: [
parseInt(match.groups.latD),
parseInt(match.groups.latM),
parseFloat(match.groups.latS)
],
latRef: (match.groups.latRef == '+') ? "N" : "S",
longitude: [
parseInt(match.groups.lonD),
parseInt(match.groups.lonM),
parseFloat(match.groups.lonS)
],
lonRef: (match.groups.lonRef == '+') ? "E" : "W"
}
var [ latitude, longitude ] = dms2dec(pos.latitude,pos.latRef,pos.longitude,pos.lonRef);
// Turf is geoJSON so we continue the stupidity here with long THEN lat.
lineStringArr.push([longitude, latitude]);
});
polys.push(lineToPolygon(lineString(lineStringArr),{mutate: true, properties: {name: obj._attributes.Name}}));
})
}catch(err){
log.error(err);
}
}

// Handle volumes
try{
data.Volumes.Boundary.forEach(function(obj){
var lineStringArr = [];
var matches = [...obj._text.matchAll(re)];
matches.forEach(function(match){
// Convert vaySys DMS into decimal degrees
// https://github.com/vatSys/xml-tools/blob/master/DotAIPtoXML/DotAIPtoXML/Coordinate.cs#L119
var pos = {
latitude: [
parseInt(match.groups.latD),
parseInt(match.groups.latM),
parseFloat(match.groups.latS)
],
latRef: (match.groups.latRef == '+') ? "N" : "S",
longitude: [
parseInt(match.groups.lonD),
parseInt(match.groups.lonM),
parseFloat(match.groups.lonS)
],
lonRef: (match.groups.lonRef == '+') ? "E" : "W"
}
var [ latitude, longitude ] = dms2dec(pos.latitude,pos.latRef,pos.longitude,pos.lonRef);
// Turf is geoJSON so we continue the stupidity here with long THEN lat.
lineStringArr.push([longitude, latitude]);
});
polys.push(lineToPolygon(lineString(lineStringArr),{mutate: true, properties: {name: obj._attributes.Name}}));
})
}catch(err){
console.log(err);
}

return polys
};

Expand Down
Binary file removed public/aircraft.png
Binary file not shown.
Binary file added public/flaticon.com/ga-dark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/flaticon.com/ga-light.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/fontawesome/jet-dark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/fontawesome/jet-light.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed public/leader.png
Binary file not shown.
Loading

0 comments on commit 7e5ff2d

Please sign in to comment.