AFG/dump1090
3
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Merge branch 'htmlcleanup' of https://github.com/BowlesCR/dump1090 into BowlesCR-htmlcleanup

Browse source
This commit is contained in:
Oliver Jowett 2016-03-31 19:55:51 +01:00
parent 5417fa6a53 ebce0fdda6
commit d663094985
2 changed files with 862 additions and 855 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

90
public_html/gmap.html
View file

@ -1,11 +1,12 @@
<!DOCTYPE HTML>
<html> <html>
<head> <head>
<meta charset="utf-8"/> <meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="style.css" /> <link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <link rel="stylesheet" href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script> <script type="text/javascript" src="//maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<script type="text/javascript" src="config.js"></script> <script type="text/javascript" src="config.js"></script>
<script type="text/javascript" src="markers.js"></script> <script type="text/javascript" src="markers.js"></script>
<script type="text/javascript" src="dbloader.js"></script> <script type="text/javascript" src="dbloader.js"></script>
@ -18,9 +19,10 @@
<script type="text/javascript" src="coolclock/moreskins.js"></script> <script type="text/javascript" src="coolclock/moreskins.js"></script>
<title>DUMP1090</title> <title>DUMP1090</title>
</head> </head>
<body onload="initialize()"> <body onload="initialize()">
<div id="loader" class="hidden"> <div id="loader" class="hidden">
<img src="spinny.gif" id="spinny"> <img src="spinny.gif" id="spinny" alt="Loading...">
<progress id="loader_progress"></progress> <progress id="loader_progress"></progress>
</div> </div>
@ -29,7 +31,8 @@
but if we have an input control with that name then it shadows the submit() function that but if we have an input control with that name then it shadows the submit() function that
we need. So steal the submit function off a different form. Surely there is a better way?! we need. So steal the submit function off a different form. Surely there is a better way?!
--> -->
<form id="horrible_hack" class="hidden"></form> <form id="horrible_hack" class="hidden">
</form>
<form id="airframes_post" method="POST" action="http://www.airframes.org/" target="_blank" class="hidden"> <form id="airframes_post" method="POST" action="http://www.airframes.org/" target="_blank" class="hidden">
<input type="hidden" name="reg1" value=""> <input type="hidden" name="reg1" value="">
<input type="hidden" name="selcal" value=""> <input type="hidden" name="selcal" value="">
@ -40,38 +43,40 @@
<div id="map_container"> <div id="map_container">
<div id="map_canvas"></div> <div id="map_canvas"></div>
</div> </div>
<div id="sidebar_container"> <div id="sidebar_container">
<div id="sidebar_canvas"> <div id="sidebar_canvas">
<div id="timestamps"> <div id="timestamps">
<table width="100%"> <table style="width: 100%">
<tr> <tr>
<td align="center"> <canvas id="utcclock"></canvas> </td> <td style="text-align: center"> <canvas id="utcclock"></canvas> </td>
<td align="center"> <canvas id="receiverclock"></canvas> </td> <td style="text-align: center"> <canvas id="receiverclock"></canvas> </td>
</tr> </tr>
<tr> <tr>
<td align="center">UTC</td> <td style="text-align: center">UTC</td>
<td align="center">Last Update</td> <td style="text-align: center">Last Update</td>
</tr> </tr>
</table> </table>
</div> </div> <!-- timestamps -->
<div id="sudo_buttons"> <div id="sudo_buttons">
<table width="100%"> <table style="width: 100%">
<tr> <tr>
<td width="150" style="text-align: center;" class="pointer"> <td style="width: 150px; text-align: center;" class="pointer">
[ <span onclick="resetMap();">Reset Map</span> ] [ <span onclick="resetMap();">Reset Map</span> ]
</td> </td>
</tr> </tr>
</table> </table>
</div> </div> <!-- sudo_buttons -->
<div id="dump1090_infoblock"> <div id="dump1090_infoblock">
<table width="100%"> <table style="width: 100%">
<tr class="infoblock_heading"> <tr class="infoblock_heading">
<td> <td>
<b id="infoblock_name">DUMP1090</b> <b id="infoblock_name">DUMP1090</b>
</td> </td>
<td align="right"> <td style="text-align: right">
<a href="https://github.com/mutability/dump1090" id="dump1090_version" target="_blank"></a> <a href="https://github.com/mutability/dump1090" id="dump1090_version" target="_blank"></a>
</td> </td>
</tr> </tr>
@ -101,19 +106,19 @@
<td>History: <span id="dump1090_total_history">n/a</span> positions</td> <td>History: <span id="dump1090_total_history">n/a</span> positions</td>
</tr> </tr>
</table> </table>
</div> </div> <!-- dump1090_infoblock -->
<div id="selected_infoblock" class="hidden"> <div id="selected_infoblock" class="hidden">
<table width="100%"> <table style="width: 100%">
<tr class="infoblock_heading"> <tr class="infoblock_heading">
<td colspan="2"> <td colspan="2">
<b> <b>
<span id="selected_callsign" onclick="toggleFollowSelected();" class="pointer">n/a</span> <span id="selected_callsign" onclick="toggleFollowSelected();" class="pointer">n/a</span>
</b> </b>
<span id="selected_follow" onclick="toggleFollowSelected();" class="pointer">&#x21D2</span> <span id="selected_follow" onclick="toggleFollowSelected();" class="pointer">&#x21D2;</span>
<span id="selected_flag"> <span id="selected_flag">
<img width="20" height="12"> <img style="width: 20px; height=12px" src="about:blank" alt="Flag">
</span> </span>
<a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;"> <a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;">
@ -136,8 +141,8 @@
</tr> </tr>
<tr class="infoblock_body"> <tr class="infoblock_body">
<td width="55%">Altitude: <span id="selected_altitude"></span></td> <td style="width: 55%">Altitude: <span id="selected_altitude"></span></td>
<td width="45%">Squawk: <span id="selected_squawk"></span></td> <td style="width: 45%">Squawk: <span id="selected_squawk"></span></td>
</tr> </tr>
<tr class="infoblock_body"> <tr class="infoblock_body">
@ -158,41 +163,44 @@
<td colspan="2">Distance from Site: <span id="selected_sitedist">n/a</span></td> <td colspan="2">Distance from Site: <span id="selected_sitedist">n/a</span></td>
</tr> </tr>
</table> </table>
</div> </div> <!-- selected_infoblock -->
<div id="planes_table"> <div id="planes_table">
<table id="tableinfo" width="100%"> <table id="tableinfo" style="width: 100%">
<thead style="background-color: #BBBBBB; cursor: pointer;"> <thead style="background-color: #BBBBBB; cursor: pointer;">
<tr> <tr>
<td id="icao" onclick="sortByICAO();">ICAO</td> <td id="icao" onclick="sortByICAO();">ICAO</td>
<td id="flag" onclick="sortByCountry()"><!-- column for flag image --></td> <td id="flag" onclick="sortByCountry()"><!-- column for flag image --></td>
<td id="flight" onclick="sortByFlight();">Flight</td> <td id="flight" onclick="sortByFlight();">Flight</td>
<td id="squawk" onclick="sortBySquawk();" align="right">Squawk</td> <td id="squawk" onclick="sortBySquawk();" style="text-align: right">Squawk</td>
<td id="altitude" onclick="sortByAltitude();" align="right">Altitude</td> <td id="altitude" onclick="sortByAltitude();" style="text-align: right">Altitude</td>
<td id="speed" onclick="sortBySpeed();" align="right">Speed</td> <td id="speed" onclick="sortBySpeed();" style="text-align: right">Speed</td>
<td id="distance" onclick="sortByDistance();" align="right">Distance</td> <td id="distance" onclick="sortByDistance();" style="text-align: right">Distance</td>
<td id="track" onclick="sortByTrack();" align="right">Track</td> <td id="track" onclick="sortByTrack();" style="text-align: right">Track</td>
<td id="msgs" onclick="sortByMsgs();" align="right">Msgs</td> <td id="msgs" onclick="sortByMsgs();" style="text-align: right">Msgs</td>
<td id="seen" onclick="sortBySeen();" align="right">Age</td> <td id="seen" onclick="sortBySeen();" style="text-align: right">Age</td>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr id="plane_row_template" class="plane_table_row hidden"> <tr id="plane_row_template" class="plane_table_row hidden">
<td>ICAO</td> <td>ICAO</td>
<td><img width="20" height="12"></td> <td><img style="width: 20px; height=12px" src="about:blank" alt="Flag"></td>
<td>FLIGHT</td> <td>FLIGHT</td>
<td align="right">SQUAWK</td> <td style="text-align: right">SQUAWK</td>
<td align="right">ALTITUDE</td> <td style="text-align: right">ALTITUDE</td>
<td align="right">SPEED</td> <td style="text-align: right">SPEED</td>
<td align="right">DISTANCE</td> <td style="text-align: right">DISTANCE</td>
<td align="right">TRACK</td> <td style="text-align: right">TRACK</td>
<td align="right">MSGS</td> <td style="text-align: right">MSGS</td>
<td align="right">SEEN</td> <td style="text-align: right">SEEN</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div> <!-- planes_table -->
</div>
</div> </div> <!-- sidebar_canvas -->
</div> <!-- sidebar_container -->
<div id="SpecialSquawkWarning" class="hidden"> <div id="SpecialSquawkWarning" class="hidden">
<b>Squawk 7x00 is reported and shown.</b><br> <b>Squawk 7x00 is reported and shown.</b><br>
This is most likely an error in receiving or decoding.<br> This is most likely an error in receiving or decoding.<br>

7
public_html/script.js
View file

@ -450,8 +450,7 @@ function initialize_map() {
if (FollowSelected) { if (FollowSelected) {
// On manual navigation, disable follow // On manual navigation, disable follow
var selected = Planes[SelectedPlane]; var selected = Planes[SelectedPlane];
if (Math.abs(GoogleMap.getCenter().lat() - selected.position.lat()) > 0.0001 && if (Math.abs(GoogleMap.getCenter().lat() - selected.position.lat()) > 0.0001 && Math.abs(GoogleMap.getCenter().lng() - selected.position.lng()) > 0.0001) {
Math.abs(GoogleMap.getCenter().lng() - selected.position.lng()) > 0.0001) {
FollowSelected = false; FollowSelected = false;
refreshSelected(); refreshSelected();
} }
@ -469,7 +468,7 @@ function initialize_map() {
// Add home marker if requested // Add home marker if requested
if (SitePosition) { if (SitePosition) {
var markerImage = new google.maps.MarkerImage( var markerImage = new google.maps.MarkerImage(
'http://maps.google.com/mapfiles/kml/pal4/icon57.png', '//maps.google.com/mapfiles/kml/pal4/icon57.png',
new google.maps.Size(32, 32), // Image size new google.maps.Size(32, 32), // Image size
new google.maps.Point(0, 0), // Origin point of image new google.maps.Point(0, 0), // Origin point of image
new google.maps.Point(16, 16)); // Position where marker should point new google.maps.Point(16, 16)); // Position where marker should point
@ -614,7 +613,7 @@ function refreshSelected() {
$('#dump1090_infoblock').css('display','none'); $('#dump1090_infoblock').css('display','none');
$('#selected_infoblock').css('display','block'); $('#selected_infoblock').css('display','block');
$('#selected_flightaware_link').attr('href','http://flightaware.com/live/modes/'+selected.icao+'/redirect'); $('#selected_flightaware_link').attr('href','//flightaware.com/live/modes/'+selected.icao+'/redirect');
if (selected.flight !== null && selected.flight !== "") { if (selected.flight !== null && selected.flight !== "") {
$('#selected_callsign').text(selected.flight); $('#selected_callsign').text(selected.flight);