diff --git a/public_html/config.js b/public_html/config.js
new file mode 100644
index 0000000..85b5836
--- /dev/null
+++ b/public_html/config.js
@@ -0,0 +1,16 @@
+// ----------------------------------------------------
+//
+// This file is to configure the configurable settings
+//
+// ----------------------------------------------------
+
+// The Latitude and Longitude in decimal format
+var CenterLat = 35.21928;
+var CenterLon = -80.94406;
+
+// The google maps zoom level, 0 - 16, lower is further out
+var ZoomLvl = 9;
+
+// The default marker color
+var MarkerColor = "rgb(127, 127, 127)";
+var SelectedColor = "rgb(225, 225, 225)"
diff --git a/public_html/extension.js b/public_html/extension.js
new file mode 100644
index 0000000..f71fe17
--- /dev/null
+++ b/public_html/extension.js
@@ -0,0 +1,19 @@
+// -----------------------------------------------------
+//
+// This file is so users can modify how the page acts
+// without diving to deep in the code. This way we can
+// also try out or hold custom code for ourselves and
+// not check it into the repo.
+//
+// There is a div id'ed as plane_extension for use with
+// this javascript file.
+// -----------------------------------------------------
+
+function extendedInitalize() {
+ // Write your initalization here
+ // Gets called just before the 1-sec function call loop is setup
+}
+
+function extendedPulse() {
+ // This will get called every second after all the main functions
+}
diff --git a/public_html/gmap.html b/public_html/gmap.html
index 0322c5a..ff359ad 100644
--- a/public_html/gmap.html
+++ b/public_html/gmap.html
@@ -1,14 +1,16 @@
+
-
+
+
+
-
@@ -32,7 +34,7 @@
-
+
diff --git a/public_html/planeObject.js b/public_html/planeObject.js
new file mode 100644
index 0000000..4d2a923
--- /dev/null
+++ b/public_html/planeObject.js
@@ -0,0 +1,222 @@
+var planeObject = {
+ oldlat : null,
+ oldlon : null,
+ oldalt : null,
+
+ // Basic location information
+ altitude : null,
+ speed : null,
+ track : null,
+ latitude : null,
+ longitude : null,
+
+ // Info about the plane
+ flight : null,
+ squawk : null,
+ icao : null,
+ is_selected : false,
+
+ // Data packet numbers
+ messages : null,
+ seen : null,
+
+ // Vaild...
+ vPosition : false,
+ vTrack : false,
+
+ // GMap Details
+ marker : null,
+ markerColor : MarkerColor,
+ lines : [],
+ trackdata : new Array(),
+ trackline : new Array(),
+
+ // When was this last updated?
+ updated : null,
+ reapable : false,
+
+ // Appends data to the running track so we can get a visual tail on the plane
+ // Only useful for a long running browser session.
+ funcAddToTrack : function(){
+ // TODO: Write this function out
+ this.trackdata.push([this.latitude, this.longitude, this.altitude, this.track, this.speed]);
+ this.trackline.push(new google.maps.LatLng(this.latitude, this.longitude));
+ },
+
+ // This is to remove the line from the screen if we deselect the plane
+ funcClearLine : function() {
+ console.log("Clearing line for: " + this.icao);
+ if (this.line) {
+ this.line.setMap(null);
+ this.line = null;
+ }
+ },
+
+ // Should create an icon for us to use on the map...
+ funcGetIcon : function() {
+ // If this marker is selected we should make it lighter than the rest.
+ if (this.is_selected == true) {
+ this.markerColor = SelectedColor;
+ }
+
+ // If the squawk code is one of the international emergency codes,
+ // match the info window alert color.
+ if (this.squawk == 7500) {
+ this.markerColor = "rgb(255, 85, 85)";
+ }
+ if (this.squawk == 7600) {
+ this.markerColor = "rgb(0, 255, 255)";
+ }
+ if (this.squawk == 7700) {
+ this.markerColor = "rgb(255, 255, 0)";
+ }
+
+ // If we have not overwritten color by now, an extension still could but
+ // just keep on trucking. :)
+
+ return {
+ strokeWeight: (this.is_selected ? 2 : 1),
+ path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
+ scale: 5,
+ fillColor: this.markerColor,
+ fillOpacity: 0.9,
+ rotation: this.track
+ };
+ },
+
+ // TODO: Trigger actions of a selecting a plane
+ funcSelectPlane : function(selectedPlane){
+ selectPlaneByHex(this.icao);
+ },
+
+ // Update our data
+ funcUpdateData : function(data){
+ // So we can find out if we moved
+ var oldlat = this.latitude;
+ var oldlon = this.longitude;
+ var oldalt = this.altitude;
+
+ // Update all of our data
+ this.updated = new Date().getTime();
+ this.altitude = data.altitude;
+ this.speed = data.speed;
+ this.track = data.track;
+ this.latitude = data.lat;
+ this.longitude = data.lon;
+ this.flight = data.flight;
+ this.squawk = data.squawk;
+ this.icao = data.hex;
+ this.messages = data.messages;
+ this.seen = data.seen;
+
+ // If no packet in over 58 seconds, consider the plane reapable
+ // This way we can hold it, but not show it just in case the plane comes back
+ if (this.seen > 58) {
+ this.reapable = true;
+ if (this.marker) {
+ this.marker.setMap(null);
+ this.marker = null;
+ }
+ if (this.line) {
+ this.line.setMap(null);
+ this.line = null;
+ }
+ if (SelectedPlane == this.icao) {
+ if (this.is_selected) {
+ this.is_selected = false;
+ }
+ SelectedPlane = null;
+ }
+ } else {
+ if (this.reapable == true) {
+ console.log(this.icao + ' has come back into range before the reaper!');
+ }
+ this.reapable = false;
+ }
+
+ // Is the position valid?
+ if ((data.validposition == 1) && (this.reapable == false)) {
+ this.vPosition = true;
+
+ // Detech if the plane has moved
+ changeLat = false;
+ changeLon = false;
+ changeAlt = false;
+ if (oldlat != this.latitude) {
+ changeLat = true;
+ }
+ if (oldlon != this.longitude) {
+ changeLon = true;
+ }
+ if (oldalt != this.altitude) {
+ changeAlt = true;
+ }
+ // Right now we only care about lat/long, if alt is updated only, oh well
+ if ((changeLat == true) || (changeLon == true)) {
+ this.funcAddToTrack();
+ if (this.is_selected) {
+ this.line = this.funcUpdateLines();
+ }
+ }
+ this.marker = this.funcUpdateMarker();
+ PlanesOnMap++;
+ } else {
+ this.vPosition = false;
+ }
+
+ // Do we have a valid track for the plane?
+ if (data.validtrack == 1)
+ this.vTrack = true;
+ else
+ this.vTrack = false;
+ },
+
+ // Update our marker on the map
+ funcUpdateMarker: function() {
+ if (this.marker) {
+ this.marker.setPosition(new google.maps.LatLng(this.latitude, this.longitude));
+ this.marker.setIcon(this.funcGetIcon());
+ } else {
+ this.marker = new google.maps.Marker({
+ position: new google.maps.LatLng(this.latitude, this.longitude),
+ map: GoogleMap,
+ icon: this.funcGetIcon(),
+ visable: true,
+ });
+
+ // This is so we can match icao address
+ this.marker.icao = this.icao;
+
+ // Trap clicks for this marker.
+ google.maps.event.addListener(this.marker, 'click', this.funcSelectPlane);
+ }
+
+ // Setting the marker title
+ if (this.flight.length == 0) {
+ this.marker.setTitle(this.hex);
+ } else {
+ this.marker.setTitle(this.flight+' ('+this.icao+')');
+ }
+ return this.marker;
+ },
+
+ // Update our planes tail line,
+ // TODO: Make this multi colored based on options
+ // altitude (default) or speed
+ funcUpdateLines: function() {
+ if (this.line) {
+ var path = this.line.getPath();
+ path.push(new google.maps.LatLng(this.latitude, this.longitude));
+ } else {
+ console.log("Starting new line");
+ this.line = new google.maps.Polyline({
+ strokeColor: '#000000',
+ strokeOpacity: 1.0,
+ strokeWeight: 3,
+ map: GoogleMap,
+ path: this.trackline,
+ });
+ }
+ return this.line;
+ },
+};
diff --git a/public_html/script.js b/public_html/script.js
index dfc1101..d06266c 100644
--- a/public_html/script.js
+++ b/public_html/script.js
@@ -1,221 +1,16 @@
// Define our global variables
var GoogleMap = null;
-var CenterLat = 35.21928;
-var CenterLon = -80.94406;
-var ZoomLvl = 9;
var Planes = {};
var PlanesOnMap = 0;
var PlanesOnTable = 0;
var PlanesToReap = 0;
var SelectedPlane = null;
-var planeObject = null;
var iSortCol=-1;
var bSortASC=true;
var bDefaultSortASC=true;
var iDefaultSortCol=3;
-planeObject = {
- oldlat : null,
- oldlon : null,
- oldalt : null,
-
- // Basic location information
- altitude : null,
- speed : null,
- track : null,
- latitude : null,
- longitude : null,
-
- // Info about the plane
- flight : null,
- squawk : null,
- icao : null,
-
- // Data packet numbers
- messages : null,
- seen : null,
-
- // Vaild...
- vPosition : false,
- vTrack : false,
-
- // GMap Details
- marker : null,
- lines : [],
- trackdata : new Array(),
- trackline : new Array(),
-
- // When was this last updated?
- updated : null,
- reapable : false,
-
- // Appends data to the running track so we can get a visual tail on the plane
- // Only useful for a long running browser session.
- funcAddToTrack : function(){
- // TODO: Write this function out
- this.trackdata.push([this.latitude, this.longitude, this.altitude, this.track, this.speed]);
- this.trackline.push(new google.maps.LatLng(this.latitude, this.longitude));
- },
-
- // This is to remove the line from the screen if we deselect the plane
- funcClearLine : function() {
- console.log("Clearing line for: " + this.icao);
- if (this.line) {
- this.line.setMap(null);
- this.line = null;
- }
- },
-
- // Should create an icon for us to use on the map...
- funcGetIcon : function() {
- var selected = false;
- var r = 255, g = 255, b = 0;
-
- return {
- strokeWeight: (selected ? 2 : 1),
- path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
- scale: 5,
- fillColor: 'rgb('+r+','+g+','+b+')',
- fillOpacity: 0.9,
- rotation: this.track
- };
- },
-
- // TODO: Trigger actions of a selecting a plane
- funcSelectPlane : function(selectedPlane){
- selectPlaneByHex(this.icao);
- },
-
- // Update our data
- funcUpdateData : function(data){
- // So we can find out if we moved
- var oldlat = this.latitude;
- var oldlon = this.longitude;
- var oldalt = this.altitude;
-
- // Update all of our data
- this.updated = new Date().getTime();
- this.altitude = data.altitude;
- this.speed = data.speed;
- this.track = data.track;
- this.latitude = data.lat;
- this.longitude = data.lon;
- this.flight = data.flight;
- this.squawk = data.squawk;
- this.icao = data.hex;
- this.messages = data.messages;
- this.seen = data.seen;
-
- // If no packet in over 58 seconds, consider the plane reapable
- // This way we can hold it, but not show it just in case the plane comes back
- if (this.seen > 58) {
- this.reapable = true;
- if (this.marker) {
- this.marker.setMap(null);
- this.marker = null;
- }
- if (this.line) {
- this.line.setMap(null);
- this.line = null;
- }
- if (SelectedPlane == this.icao) {
- SelectedPlane = null;
- }
- } else {
- if (this.reapable == true) {
- console.log(this.icao + ' has come back into range before the reaper!');
- }
- this.reapable = false;
- }
-
- // Is the position valid?
- if ((data.validposition == 1) && (this.reapable == false)) {
- this.vPosition = true;
-
- // Detech if the plane has moved
- changeLat = false;
- changeLon = false;
- changeAlt = false;
- if (oldlat != this.latitude) {
- changeLat = true;
- }
- if (oldlon != this.longitude) {
- changeLon = true;
- }
- if (oldalt != this.altitude) {
- changeAlt = true;
- }
- // Right now we only care about lat/long, if alt is updated only, oh well
- if ((changeLat == true) || (changeLon == true)) {
- this.funcAddToTrack();
- if (this.icao == SelectedPlane) {
- this.line = this.funcUpdateLines();
- }
- }
- this.marker = this.funcUpdateMarker();
- PlanesOnMap++;
- } else {
- this.vPosition = false;
- }
-
- // Do we have a valid track for the plane?
- if (data.validtrack == 1)
- this.vTrack = true;
- else
- this.vTrack = false;
- },
-
- // Update our marker on the map
- funcUpdateMarker: function() {
- if (this.marker) {
- this.marker.setPosition(new google.maps.LatLng(this.latitude, this.longitude));
- this.marker.setIcon(this.funcGetIcon());
- } else {
- this.marker = new google.maps.Marker({
- position: new google.maps.LatLng(this.latitude, this.longitude),
- map: GoogleMap,
- icon: this.funcGetIcon(),
- visable: true,
- });
-
- // This is so we can match icao address
- this.marker.icao = this.icao;
-
- // Trap clicks for this marker.
- google.maps.event.addListener(this.marker, 'click', this.funcSelectPlane);
- }
-
- // Setting the marker title
- if (this.flight.length == 0) {
- this.marker.setTitle(this.hex);
- } else {
- this.marker.setTitle(this.flight+' ('+this.icao+')');
- }
- return this.marker;
- },
-
- // Update our planes tail line,
- // TODO: Make this multi colored based on options
- // altitude (default) or speed
- funcUpdateLines: function() {
- if (this.line) {
- var path = this.line.getPath();
- path.push(new google.maps.LatLng(this.latitude, this.longitude));
- } else {
- console.log("Starting new line");
- this.line = new google.maps.Polyline({
- strokeColor: '#000000',
- strokeOpacity: 1.0,
- strokeWeight: 3,
- map: GoogleMap,
- path: this.trackline,
- });
- }
- return this.line;
- },
-};
-
function fetchData() {
$.getJSON('/dump1090/data.json', function(data) {
PlanesOnMap = 0
@@ -342,12 +137,16 @@ function initialize() {
GoogleMap.mapTypes.set("dark_map", styledMap);
+ // Did our crafty user need some setup?
+ extendedInitalize();
+
// Setup our timer to poll from the server.
window.setInterval(function() {
fetchData();
refreshTableInfo();
refreshSelected()
reaper();
+ extendedPulse();
}, 1000);
// Faster timer, smoother things
@@ -378,8 +177,9 @@ function reaper() {
}
// Refresh the detail window about the plane
+// TODO: Find out why when deselecting it sticks
function refreshSelected() {
- if ((SelectedPlane != "ICAO") && (SelectedPlane != null)) {
+ if (( SelectedPlane != "ICAO") && (SelectedPlane != null)) {
var selected = Planes[SelectedPlane];
if (selected.flight == "") {
selected.flight="N/A (" + selected.icao + ")";
@@ -574,12 +374,26 @@ function sortTable(szTableID,iCol) {
}
function selectPlaneByHex(hex) {
+ // If SelectedPlane has something in it, clear out the selected
if (SelectedPlane != null) {
+ Planes[SelectedPlane].is_selected = false;
Planes[SelectedPlane].funcClearLine();
- }
- SelectedPlane = hex;
- if (Planes[SelectedPlane].marker) {
- Planes[SelectedPlane].funcUpdateLines();
+ Planes[SelectedPlane].markerColor = MarkerColor;
+ // If the selected has a marker, make it not stand out
+ if (Planes[SelectedPlane].marker) {
+ Planes[SelectedPlane].marker.setIcon(Planes[SelectedPlane].funcGetIcon());
+ }
}
+ // If we are clicking the same plane, we are deselected it.
+ if (String(SelectedPlane) != String(hex)) {
+ // Assign the new selected
+ SelectedPlane = hex;
+ Planes[SelectedPlane].is_selected = true;
+ // If the selected has a marker, make it stand out
+ if (Planes[SelectedPlane].marker) {
+ Planes[SelectedPlane].funcUpdateLines();
+ Planes[SelectedPlane].marker.setIcon(Planes[SelectedPlane].funcGetIcon());
+ }
+ }
}
diff --git a/public_html/style.css b/public_html/style.css
index f43b968..459903b 100644
--- a/public_html/style.css
+++ b/public_html/style.css
@@ -15,3 +15,5 @@ div#sidebar_container { float: left; width: 410px; margin-left: -410px; height:
#selectedinfotitle { font-size: larger; }
#selectedinfo { font-size: small; }
+
+.notvisable { visable: none; }