Merge pull request #21 from drakeapps/master
Update skyview with extended mode S data fields
This commit is contained in:
Oliver Jowett
GitHub
commit
ed23dbd6db
|
|
@ -12,7 +12,8 @@ var UnitLabels = {
|
|||
'altitude': { metric: "m", imperial: "ft", nautical: "ft"},
|
||||
'speed': { metric: "km/h", imperial: "mph", nautical: "kt" },
|
||||
'distance': { metric: "km", imperial: "mi", nautical: "NM" },
|
||||
'verticalRate': { metric: "m/s", imperial: "ft/min", nautical: "ft/min" }
|
||||
'verticalRate': { metric: "m/s", imperial: "ft/min", nautical: "ft/min" },
|
||||
'distanceShort': {metric: "m", imperial: "ft", nautical: "m"}
|
||||
};
|
||||
|
||||
// formatting helpers
|
||||
|
|
@ -91,6 +92,17 @@ function format_altitude_long(alt, vr, displayUnits) {
|
|||
}
|
||||
}
|
||||
|
||||
// alt ground/airborne
|
||||
function format_onground (alt) {
|
||||
if (alt === null) {
|
||||
return "n/a";
|
||||
} else if (alt === "ground") {
|
||||
return "on ground";
|
||||
} else {
|
||||
return "airborne";
|
||||
}
|
||||
}
|
||||
|
||||
// alt in feet
|
||||
function convert_altitude(alt, displayUnits) {
|
||||
if (displayUnits === "metric") {
|
||||
|
|
@ -156,6 +168,16 @@ function format_distance_long(dist, displayUnits, fixed) {
|
|||
return dist_text;
|
||||
}
|
||||
|
||||
function format_distance_short (dist, displayUnits) {
|
||||
if (dist === null) {
|
||||
return "n/a";
|
||||
}
|
||||
|
||||
var dist_text = Math.round(convert_distance_short(dist, displayUnits)) + NBSP + get_unit_label("distanceShort", displayUnits);
|
||||
|
||||
return dist_text;
|
||||
}
|
||||
|
||||
// dist in meters
|
||||
function convert_distance(dist, displayUnits) {
|
||||
if (displayUnits === "metric") {
|
||||
|
|
@ -167,6 +189,15 @@ function convert_distance(dist, displayUnits) {
|
|||
return (dist / 1852); // meters to nautical miles
|
||||
}
|
||||
|
||||
// dist in meters
|
||||
// converts meters to feet or just returns meters
|
||||
function convert_distance_short(dist, displayUnits) {
|
||||
if (displayUnits === "imperial") {
|
||||
return (dist / 0.3048); // meters to feet
|
||||
}
|
||||
return dist; // just meters
|
||||
}
|
||||
|
||||
// rate in ft/min
|
||||
function format_vert_rate_brief(rate, displayUnits) {
|
||||
if (rate === null || rate === undefined) {
|
||||
|
|
@ -225,3 +256,52 @@ function format_data_source(source) {
|
|||
|
||||
return "";
|
||||
}
|
||||
|
||||
function format_nac_p (value) {
|
||||
switch (value) {
|
||||
case 0:
|
||||
return "EPU ≥ 18.52 km";
|
||||
case 1:
|
||||
return "EPU < 18.52 km";
|
||||
case 2:
|
||||
return "EPU < 7.408 km";
|
||||
case 3:
|
||||
return "EPU < 3.704 km";
|
||||
case 4:
|
||||
return "EPU < 1852 m";
|
||||
case 5:
|
||||
return "EPU < 926 m";
|
||||
case 6:
|
||||
return "EPU < 555.6 m";
|
||||
case 7:
|
||||
return "EPU < 185.2 m";
|
||||
case 8:
|
||||
return "EPU < 92.6 m";
|
||||
case 9:
|
||||
return "EPU < 30 m";
|
||||
case 10:
|
||||
return "EPU < 10 m";
|
||||
case 11:
|
||||
return "EPU < 3 m";
|
||||
default:
|
||||
return "n/a";
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
function format_nac_v (value) {
|
||||
switch (value) {
|
||||
case 0:
|
||||
return "Unknown or 10 m/s";
|
||||
case 1:
|
||||
return "< 10 m/s";
|
||||
case 2:
|
||||
return "< 3 m/s";
|
||||
case 3:
|
||||
return "< 1 m/s";
|
||||
case 4:
|
||||
return "< 0.3 m/s";
|
||||
default:
|
||||
return "n/a";
|
||||
}
|
||||
}
|
||||
|
|
|
|||
BIN
public_html/images/icon-information@2x.png
Normal file
BIN
public_html/images/icon-information@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
public_html/images/toggle-height@2x.png
Normal file
BIN
public_html/images/toggle-height@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 780 B |
BIN
public_html/images/toggle-width@2x.png
Normal file
BIN
public_html/images/toggle-width@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 778 B |
|
|
@ -2,13 +2,13 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
||||
<link rel="stylesheet" type="text/css" href="style.css?v=2" />
|
||||
<link rel="stylesheet" href="jquery/jquery-ui-1.11.4-smoothness.css" />
|
||||
<script src="jquery/jquery-3.0.0.min.js"></script>
|
||||
<script src="jquery/jquery-ui-1.11.4.min.js"></script>
|
||||
<script src="jquery/plugins/jquery.validate.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="ol/ol-4.4.2.css" type="text/css" />
|
||||
<link rel="stylesheet" href="ol/ol-4.4.2.css" type="text/css" />
|
||||
<script src="ol/ol-4.4.2.js" type="text/javascript"></script>
|
||||
|
||||
<link rel="stylesheet" href="ol/ol3-layerswitcher.css" type="text/css"/>
|
||||
|
|
@ -18,11 +18,11 @@
|
|||
<script type="text/javascript" src="markers.js"></script>
|
||||
<script type="text/javascript" src="dbloader.js"></script>
|
||||
<script type="text/javascript" src="registrations.js"></script>
|
||||
<script type="text/javascript" src="planeObject.js"></script>
|
||||
<script type="text/javascript" src="formatter.js"></script>
|
||||
<script type="text/javascript" src="planeObject.js?v=2"></script>
|
||||
<script type="text/javascript" src="formatter.js?v=2"></script>
|
||||
<script type="text/javascript" src="flags.js"></script>
|
||||
<script type="text/javascript" src="layers.js"></script>
|
||||
<script type="text/javascript" src="script.js"></script>
|
||||
<script type="text/javascript" src="script.js?v=2"></script>
|
||||
<title>PiAware Skyview</title>
|
||||
</head>
|
||||
|
||||
|
|
@ -63,182 +63,7 @@
|
|||
|
||||
<div id="layout_container">
|
||||
|
||||
<div id="selected_infoblock" class="hidden">
|
||||
<div class="highlightedTitle">
|
||||
<span id="selected_flightaware_link" class="link rightLink"></span>
|
||||
<span class="identLarge"><span id="selected_callsign">n/a</span></span>
|
||||
<span class="identSmall"><span id="selected_icao">n/a</span></span>
|
||||
</div>
|
||||
<div class="highlightedInfo">
|
||||
<div class="infoBlockTopSection">
|
||||
<div class="infoRow removePadding">
|
||||
<div class="infoHeading infoRowFluid">Registration: </div>
|
||||
<div class="infoData infoRowFluid"><span id="selected_registration">n/a</span></div>
|
||||
</div>
|
||||
<div class="infoRow removePadding">
|
||||
<div class="infoHeading infoRowFluid">Country of registration: </div>
|
||||
<div class="infoData infoRowFluid"><span id="selected_country">n/a</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlock45pxSection lightGreyBackground">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Aircraft Type:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_icaotype"></span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
Source:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_source"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Squawk:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_squawk"></span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
Groundspeed:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_gs">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Altitude:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_altitude"></span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
Distance:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_sitedist">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection lightGreyBackground">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Ground track:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_track">n/a</span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
Position:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_position">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Vertical Rate:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_vertical_rate">n/a</span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
Last Seen:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_seen">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Messages:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_message_count">n/a</span>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
RSSI:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_rssi">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="extendedData" class="hidden">
|
||||
<div class="infoBlockSection lightGreyBackground">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Alt (geom):</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_alt_geom"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">Geom rate:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_geom_rate"/></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="infoBlockSection">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Mag heading:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_mag_heading"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">True heading:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_true_heading"/></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Roll:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_roll"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">Track rate:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_track_rate"/></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="infoBlockSection lightGreyBackground">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">IAS:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_ias"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">TAS:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_tas"/></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Mach:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_mach"/></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="infoBlockSection">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Nav alt:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_nav_altitude"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">Nav heading:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_nav_heading"/></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">Nav modes:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_nav_modes"/></div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">Nav QNH:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4"><span id="selected_nav_qnh"/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection lightGreyBackground">
|
||||
<div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">ADS-B:</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2"><span id="selected_version"/></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;" class="link rightLink">
|
||||
AirFrames.org
|
||||
</a>
|
||||
<span id="selected_photo_link" class="link"></span>
|
||||
</div>
|
||||
|
||||
</div> <!-- selected_infoblock -->
|
||||
|
||||
|
||||
<div id="highlighted_infoblock">
|
||||
<div class="highlightedTitle">
|
||||
|
|
@ -246,6 +71,10 @@
|
|||
<span class="identSmall"><span id="highlighted_icao">n/a</span></span>
|
||||
</div>
|
||||
<div class="highlightedInfo">
|
||||
<div class="infoRow">
|
||||
<div class="infoHeading infoRowTitle">Registration: </div>
|
||||
<div class="infoData infoRowContent"><span id="highlighted_registration">n/a</span></div>
|
||||
</div>
|
||||
<div class="infoRow">
|
||||
<div class="infoHeading infoRowTitle">Aircraft Type: </div>
|
||||
<div class="infoData infoRowContent"><span id="higlighted_icaotype">n/a</span></div>
|
||||
|
|
@ -258,11 +87,23 @@
|
|||
<div class="infoHeading infoRowTitle">Speed: </div>
|
||||
<div class="infoData infoRowContent"><span id="highlighted_speed">n/a</span></div>
|
||||
</div>
|
||||
<div class="infoRow">
|
||||
<div class="infoHeading infoRowTitle">Source: </div>
|
||||
<div class="infoData infoRowContent"><span id="highlighted_source">n/a</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="settings_infoblock">
|
||||
<div id="settings_close" class="settingsCloseBox"></div>
|
||||
<div id="units_container">
|
||||
<label for="units_selector"><span class="infoBlockTitleText">Units:</span></label>
|
||||
<select name="units_selector" id="units_selector">
|
||||
<option value="nautical">Aeronautical</option>
|
||||
<option value="metric">Metric</option>
|
||||
<option value="imperial">Imperial</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="settingsColumn">
|
||||
<div class="settingsOptionContainer">
|
||||
<div class="infoBlockTitleText">Overlay Toggles</div>
|
||||
|
|
@ -326,114 +167,473 @@
|
|||
<div id="sidebar_container">
|
||||
<div id="splitter" class="ui-resizable-handle ui-resizable-w"></div>
|
||||
<div id="sidebar_canvas">
|
||||
|
||||
<div id="dump1090_infoblock">
|
||||
<table style="width: 100%">
|
||||
<tr class="infoblock_heading">
|
||||
<td>
|
||||
<div class="button buttonTable" id="show_map_button"><span class="buttonText">Show Map</span></div>
|
||||
</td>
|
||||
<td style="text-align: right">
|
||||
<a href="https://github.com/flightaware/dump1090" id="dump1090_version" target="_blank"></a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="infoblock_body">
|
||||
<td><span class="infoBlockTitleText">Total Aircraft:</span> <span id="dump1090_total_ac">n/a</span></td>
|
||||
<td><span class="infoBlockTitleText">Messages:</span> <span id="dump1090_message_rate">n/a</span>/sec</td>
|
||||
</tr>
|
||||
|
||||
<tr class="infoblock_body">
|
||||
<td><span class="infoBlockTitleText">With Positions:</span> <span id="dump1090_total_ac_positions">n/a</span></td>
|
||||
<td><span class="infoBlockTitleText">History:</span> <span id="dump1090_total_history">n/a</span> positions</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div> <!-- dump1090_infoblock -->
|
||||
|
||||
<div id="units_container">
|
||||
<label for="units_selector"><span class="infoBlockTitleText">Units:</span></label>
|
||||
<select name="units_selector" id="units_selector">
|
||||
<option value="nautical">Aeronautical</option>
|
||||
<option value="metric">Metric</option>
|
||||
<option value="imperial">Imperial</option>
|
||||
</select>
|
||||
|
||||
|
||||
<div id="sidebar-table">
|
||||
<div id="dump1090_infoblock">
|
||||
<table style="width: 100%">
|
||||
<tr class="infoblock_heading">
|
||||
<td>
|
||||
<div class="button buttonTable" id="show_map_button"><span class="buttonText">Show Map</span></div>
|
||||
</td>
|
||||
<td style="text-align: right">
|
||||
<a href="https://github.com/flightaware/dump1090" id="dump1090_version" target="_blank"></a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="infoblock_body">
|
||||
<td><span class="infoBlockTitleText">Total Aircraft:</span> <span id="dump1090_total_ac">n/a</span></td>
|
||||
<td><span class="infoBlockTitleText">Messages:</span> <span id="dump1090_message_rate">n/a</span>/sec</td>
|
||||
</tr>
|
||||
|
||||
<tr class="infoblock_body">
|
||||
<td><span class="infoBlockTitleText">With Positions:</span> <span id="dump1090_total_ac_positions">n/a</span></td>
|
||||
<td><span class="infoBlockTitleText">History:</span> <span id="dump1090_total_history">n/a</span> positions</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div> <!-- dump1090_infoblock -->
|
||||
|
||||
<form id="altitude_filter_form">
|
||||
<label><span class="infoBlockTitleText">Filter by Altitude:</span></label>
|
||||
<input id="altitude_filter_min" name="minAltitude" type="text" class="altitudeFilterInput" maxlength="5">
|
||||
<label for="minAltitude" class="altitudeUnit"></label>
|
||||
<span> to </span>
|
||||
<input id="altitude_filter_max" name="maxAltitude" type="text" class="altitudeFilterInput" maxlength="5">
|
||||
<label for="maxAltitude" class="altitudeUnit"></label>
|
||||
<button type="submit">Filter</button>
|
||||
<button id="altitude_filter_reset_button">Reset</button>
|
||||
</form>
|
||||
|
||||
<div id="planes_table">
|
||||
<table id="tableinfo" style="width: 100%">
|
||||
<thead class="aircraft_table_header">
|
||||
<tr>
|
||||
<td id="icao" onclick="sortByICAO();">ICAO</td>
|
||||
<td id="flag" onclick="sortByCountry()"><!-- column for flag image --></td>
|
||||
<td id="flight" onclick="sortByFlight();">Ident</td>
|
||||
<td id="registration" onclick="sortByRegistration();">Registration</td>
|
||||
<td id="aircraft_type" onclick="sortByAircraftType();"> Aircraft type</td>
|
||||
<td id="squawk" onclick="sortBySquawk();">Squawk</td>
|
||||
<td id="altitude" onclick="sortByAltitude();">Altitude (<span class="altitudeUnit"></span>)</td>
|
||||
<td id="speed" onclick="sortBySpeed();">Speed (<span class="speedUnit"></span>)</td>
|
||||
<td id="vert_rate" onclick="sortByVerticalRate();">Vertical Rate (<span class="verticalRateUnit"></span>)</td>
|
||||
<td id="distance" onclick="sortByDistance();">Distance (<span class="distanceUnit"></span>)</td>
|
||||
<td id="track" onclick="sortByTrack();">Heading</td>
|
||||
<td id="msgs" onclick="sortByMsgs();">Msgs</td>
|
||||
<td id="seen" onclick="sortBySeen();">Age</td>
|
||||
<td id="rssi" onclick="sortByRssi();">RSSI</td>
|
||||
<td id="lat" onclick="sortByLatitude();">Latitude</td>
|
||||
<td id="lon" onclick="sortByLongitude();">Longitude</td>
|
||||
<td id="data_source" onclick="sortByDataSource();">Data Source</td>
|
||||
<td id="airframes_mode_s_link">Airframes.org</td>
|
||||
<td id="flightaware_mode_s_link">FlightAware</td>
|
||||
<td id="flightaware_photo_link">Photos</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="plane_row_template" class="plane_table_row hidden">
|
||||
<td class="icaoCodeColumn">ICAO</td>
|
||||
<td><img style="width: 20px; height=12px" src="about:blank" alt="Flag"></td>
|
||||
<td>FLIGHT</td>
|
||||
<td>REGISTRATION</td>
|
||||
<td>AIRCRAFT_TYPE</td>
|
||||
<td style="text-align: right">SQUAWK</td>
|
||||
<td style="text-align: right">ALTITUDE</td>
|
||||
<td style="text-align: right">SPEED</td>
|
||||
<td style="text-align: right">VERT_RATE</td>
|
||||
<td style="text-align: right">DISTANCE</td>
|
||||
<td style="text-align: right">TRACK</td>
|
||||
<td style="text-align: right">MSGS</td>
|
||||
<td style="text-align: right">SEEN</td>
|
||||
<td style="text-align: right">RSSI</td>
|
||||
<td style="text-align: right">LAT</td>
|
||||
<td style="text-align: right">LON</td>
|
||||
<td style="text-align: right">DATA_SOURCE</td>
|
||||
<td style="text-align: center">AIRFRAMES_MODE_S_LINK</td>
|
||||
<td style="text-align: center">FLIGHTAWARE_MODE_S_LINK</td>
|
||||
<td style="text-align: center">FLIGHTAWARE_PHOTO_LINK</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="legend">
|
||||
<div class="legendBox vPosition"></div>
|
||||
<div class="legendTitle">ADS-B</div>
|
||||
<div class="legendBox mlat"></div>
|
||||
<div class="legendTitle">MLAT</div>
|
||||
<div class="legendBox other"></div>
|
||||
<div class="legendTitle">Other</div>
|
||||
<div class="legendBox tisb"></div>
|
||||
<div class="legendTitle">TIS-B</div>
|
||||
</div>
|
||||
</div> <!-- planes_table -->
|
||||
</div>
|
||||
|
||||
<form id="altitude_filter_form">
|
||||
<label><span class="infoBlockTitleText">Filter by Altitude:</span></label>
|
||||
<input id="altitude_filter_min" name="minAltitude" type="text" class="altitudeFilterInput" maxlength="5">
|
||||
<label for="minAltitude" class="altitudeUnit"></label>
|
||||
<span> to </span>
|
||||
<input id="altitude_filter_max" name="maxAltitude" type="text" class="altitudeFilterInput" maxlength="5">
|
||||
<label for="maxAltitude" class="altitudeUnit"></label>
|
||||
<button type="submit">Filter</button>
|
||||
<button id="altitude_filter_reset_button">Reset</button>
|
||||
</form>
|
||||
|
||||
|
||||
</div> <!-- sidebar_canvas -->
|
||||
|
||||
|
||||
<div id="planes_table">
|
||||
<table id="tableinfo" style="width: 100%">
|
||||
<thead class="aircraft_table_header">
|
||||
<tr>
|
||||
<td id="icao" onclick="sortByICAO();">ICAO</td>
|
||||
<td id="flag" onclick="sortByCountry()"><!-- column for flag image --></td>
|
||||
<td id="flight" onclick="sortByFlight();">Ident</td>
|
||||
<td id="registration" onclick="sortByRegistration();">Registration</td>
|
||||
<td id="aircraft_type" onclick="sortByAircraftType();"> Aircraft type</td>
|
||||
<td id="squawk" onclick="sortBySquawk();">Squawk</td>
|
||||
<td id="altitude" onclick="sortByAltitude();">Altitude (<span class="altitudeUnit"></span>)</td>
|
||||
<td id="speed" onclick="sortBySpeed();">Speed (<span class="speedUnit"></span>)</td>
|
||||
<td id="vert_rate" onclick="sortByVerticalRate();">Vertical Rate (<span class="verticalRateUnit"></span>)</td>
|
||||
<td id="distance" onclick="sortByDistance();">Distance (<span class="distanceUnit"></span>)</td>
|
||||
<td id="track" onclick="sortByTrack();">Heading</td>
|
||||
<td id="msgs" onclick="sortByMsgs();">Msgs</td>
|
||||
<td id="seen" onclick="sortBySeen();">Age</td>
|
||||
<td id="rssi" onclick="sortByRssi();">RSSI</td>
|
||||
<td id="lat" onclick="sortByLatitude();">Latitude</td>
|
||||
<td id="lon" onclick="sortByLongitude();">Longitude</td>
|
||||
<td id="data_source" onclick="sortByDataSource();">Data Source</td>
|
||||
<td id="airframes_mode_s_link">Airframes.org</td>
|
||||
<td id="flightaware_mode_s_link">FlightAware</td>
|
||||
<td id="flightaware_photo_link">Photos</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="plane_row_template" class="plane_table_row hidden">
|
||||
<td class="icaoCodeColumn">ICAO</td>
|
||||
<td><img style="width: 20px; height=12px" src="about:blank" alt="Flag"></td>
|
||||
<td>FLIGHT</td>
|
||||
<td>REGISTRATION</td>
|
||||
<td>AIRCRAFT_TYPE</td>
|
||||
<td style="text-align: right">SQUAWK</td>
|
||||
<td style="text-align: right">ALTITUDE</td>
|
||||
<td style="text-align: right">SPEED</td>
|
||||
<td style="text-align: right">VERT_RATE</td>
|
||||
<td style="text-align: right">DISTANCE</td>
|
||||
<td style="text-align: right">TRACK</td>
|
||||
<td style="text-align: right">MSGS</td>
|
||||
<td style="text-align: right">SEEN</td>
|
||||
<td style="text-align: right">RSSI</td>
|
||||
<td style="text-align: right">LAT</td>
|
||||
<td style="text-align: right">LON</td>
|
||||
<td style="text-align: right">DATA_SOURCE</td>
|
||||
<td style="text-align: center">AIRFRAMES_MODE_S_LINK</td>
|
||||
<td style="text-align: center">FLIGHTAWARE_MODE_S_LINK</td>
|
||||
<td style="text-align: center">FLIGHTAWARE_PHOTO_LINK</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="legend">
|
||||
<div class="legendBox vPosition"></div>
|
||||
<div class="legendTitle">ADS-B</div>
|
||||
<div class="legendBox mlat"></div>
|
||||
<div class="legendTitle">MLAT</div>
|
||||
<div class="legendBox other"></div>
|
||||
<div class="legendTitle">Other</div>
|
||||
<div class="legendBox tisb"></div>
|
||||
<div class="legendTitle">TIS-B</div>
|
||||
</div>
|
||||
</div> <!-- planes_table -->
|
||||
<div id="selected_infoblock" class="hidden">
|
||||
|
||||
<div id="splitter-infoblock" class="ui-resizable-handle ui-resizable-n"></div>
|
||||
<div id="close-button">Close</div>
|
||||
<div class="infoblock-container">
|
||||
|
||||
</div> <!-- sidebar_canvas -->
|
||||
<div class="highlightedTitle">
|
||||
<span class="identLarge" title="Typically the air traffic control callsign or the aircraft's registration, as entered into the transponder by the pilot."><span id="selected_callsign">n/a</span></span>
|
||||
<span class="identSmall" title="The aircraft's unique ICAO identification number shown in hexadecimal format."><span id="selected_icao">n/a</span></span>
|
||||
</div>
|
||||
|
||||
<div class="infoBlockTopSection">
|
||||
<span id="selected_flightaware_link" class=""></span>
|
||||
<div class="infoRow removePadding">
|
||||
<div class="infoHeading infoRowFluid"><span title="The alphanumeric registration code assigned by the country in which the aircraft is registered.">Registration</span>: </div>
|
||||
<div class="infoData infoRowFluid"><span id="selected_registration">n/a</span></div>
|
||||
</div>
|
||||
<div class="infoRow removePadding">
|
||||
<div class="infoHeading infoRowFluid">Country of registration: </div>
|
||||
<div class="infoData infoRowFluid"><span id="selected_country">n/a</span></div>
|
||||
</div>
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
Aircraft Type:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_icaotype"></span> <span class="lightblue-link" id="selected_photo_link"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Location
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Latitude and longitude coordinates of the aircraft's last known position.">Position</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_position">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Whether the aircraft is reporting it is on the ground or airborne.">Air/Ground Status</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_onground">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Distance of the aircraft from your ADS-B site at its last known position.">Distance</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_sitedist">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Speed
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="The speed of the aircraft over the ground.">Groundspeed</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_speed">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Indicated airspeed (the airspeed read directly from the airspeed indicator on the aircraft)">IAS</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_ias">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="True airspeed (the speed of the aircraft relative to the airmass in which it is flying)">TAS</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_tas">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="The ratio of the speed of the aircraft to the speed of sound in the surrounding space.">Mach Number</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_mach">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Altitude
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="The uncorrected pressure-derived height of the aircraft above mean sea level (based on barometric pressure).">Altitude (Barometric)</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_altitude"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="The height of the aircraft (usually height above the WGS84 ellipsoid and derived from avionics which may by inertial or GNSS/satellite-based).">Altitude (Geometric)</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_altitude_geo">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Rate of climb or descent (derived from barometric altitude).">Vertical Rate (Barometric)</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_vertical_rate">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection3">
|
||||
<span title="Rate of climb or descent (derived from avionics which may by inertial or GNSS/satellite-based).">Vertical Rate (Geometric)</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection4">
|
||||
<span id="selected_vertical_rate_geo">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Direction
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Direction the aircraft is traveling over the ground.">Ground Track</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_track">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Rate of turn of the ground track.">Track Rate</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_trackrate">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The aircraft's nose heading relative to magnetic north.">Magnetic Heading</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_mag_heading">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The aircraft's roll angle.">Roll</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_roll">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The aircraft's nose heading relative to true north.">True Heading</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_true_heading">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Navigation
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The selected altitude in the aircraft's flight management system.">Selected Altitude</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nav_altitude">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The enabled navigation modes as reported by the aircraft (i.e., auto-pilot, Traffic Collision Avoidance System, altitude hold, approach, LNAV approach, and/or VNAV approach).">Modes</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nav_modes">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The selected heading in the aircraft's flight management system.">Selected Heading</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nav_heading">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The altimeter/QNH setting used by the aircraft's navigation systems.">QNH</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nav_qnh">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Tracking Information
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Data source for the reported aircraft data (e.g., ADS-B, MLAT, Other Mode S)">Source</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_source">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The total number of messages received from the aircraft by your ADS-B site.">Messages</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_message_count">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="For ADS-B-equipped aircraft, the version of ADS-B to which the aircraft conforms, as reported by the aircraft.">ADS-B Version</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_version">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Indicated signal strength of the signal received by your ADS-B site from the aircraft.">RSSI</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_rssi">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Aircraft category code as reported by the aircraft. This indicates the type of aircraft and, for airplanes, a relative indicator of its size.">Category</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_category">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="The last time your ADS-B site received a message from the aircraft.">Last Seen</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_seen">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="A 4-digit octal code assigned to the aircraft by Air Traffic Control.">Squawk</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_squawk"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sectionTitle">
|
||||
<div class="section-title-content">
|
||||
Accuracy
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBlockSection">
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Navigation accuracy category of the position (95% bound on positions).">NAC<sub>P</sub></sub></span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nac_p">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Surveillance integrity level (probability of positions lying outside the claimed radius of containment).">SIL</span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_sil">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Navigation accuracy category of the velocity (95% bound on velocities).">NAC<sub>V</sub></span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nac_v">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Whether the reported pressure altitude has been crosschecked against another source of pressure altitude.">NIC<sub>BARO</sub></span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_nic_baro">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoRowLine">
|
||||
<div class="infoHeading infoRowFluid fourColumnSection1">
|
||||
<span title="Radius of containment. The reported position of the aircraft is expected to be within this distance of the true position, with a failure rate defined by SIL.">R<sub>C</sub></span>:
|
||||
</div>
|
||||
<div class="infoData infoRowFluid fourColumnSection2">
|
||||
<span id="selected_rc">n/a</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="bottom-info-container">
|
||||
<img src="images/icon-information@2x.png" width="18" height="18"><div class="bottom-info-text"> Learn more about Mode S data type by hovering over each data label.</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom-container">
|
||||
<div class="selected_airframe">
|
||||
<a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;">
|
||||
airframes.org
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div> <!-- selected_infoblock -->
|
||||
|
||||
|
||||
|
||||
|
||||
</div> <!-- sidebar_container -->
|
||||
</div> <!-- layout_container -->
|
||||
|
||||
|
|
|
|||
|
|
@ -5,8 +5,8 @@ function PlaneObject(icao) {
|
|||
this.icao = icao;
|
||||
this.icaorange = findICAORange(icao);
|
||||
this.flight = null;
|
||||
this.squawk = null;
|
||||
this.selected = false;
|
||||
this.squawk = null;
|
||||
this.selected = false;
|
||||
this.category = null;
|
||||
|
||||
// Basic location information
|
||||
|
|
@ -29,6 +29,13 @@ function PlaneObject(icao) {
|
|||
this.nav_heading = null;
|
||||
this.nav_modes = null;
|
||||
this.nav_qnh = null;
|
||||
this.rc = null;
|
||||
|
||||
this.nac_p = null;
|
||||
this.nac_v = null;
|
||||
this.nic_baro = null;
|
||||
this.sil_type = null;
|
||||
this.sil = null;
|
||||
|
||||
this.baro_rate = null;
|
||||
this.geom_rate = null;
|
||||
|
|
@ -438,8 +445,9 @@ PlaneObject.prototype.updateData = function(receiver_timestamp, data) {
|
|||
|
||||
var fields = ["alt_baro", "alt_geom", "gs", "ias", "tas", "track",
|
||||
"track_rate", "mag_heading", "true_heading", "mach",
|
||||
"roll", "nav_altitude", "nav_heading", "nav_modes",
|
||||
"nav_qnh", "baro_rate", "geom_rate",
|
||||
"roll", "nav_altitude", "nav_heading", "nav_modes",
|
||||
"nac_p", "nac_v", "nic_baro", "sil_type", "sil",
|
||||
"nav_qnh", "baro_rate", "geom_rate", "rc",
|
||||
"squawk", "category", "version"];
|
||||
|
||||
for (var i = 0; i < fields.length; ++i) {
|
||||
|
|
|
|||
|
|
@ -203,11 +203,59 @@ function initialize() {
|
|||
}
|
||||
|
||||
// Set up map/sidebar splitter
|
||||
$("#sidebar_container").resizable({handles: {w: '#splitter'}});
|
||||
$("#sidebar_container").resizable({
|
||||
handles: {
|
||||
w: '#splitter'
|
||||
},
|
||||
minWidth: 350
|
||||
});
|
||||
|
||||
// Set up aircraft information panel
|
||||
$("#selected_infoblock").draggable({containment: "parent"});
|
||||
// Set up datablock splitter
|
||||
$('#selected_infoblock').resizable({
|
||||
handles: {
|
||||
s: '#splitter-infoblock'
|
||||
},
|
||||
containment: "#sidebar_container",
|
||||
minHeight: 50
|
||||
});
|
||||
|
||||
$('#close-button').on('click', function() {
|
||||
if (SelectedPlane !== null) {
|
||||
var selectedPlane = Planes[SelectedPlane];
|
||||
SelectedPlane = null;
|
||||
selectedPlane.selected = null;
|
||||
selectedPlane.clearLines();
|
||||
selectedPlane.updateMarker();
|
||||
refreshSelected();
|
||||
refreshHighlighted();
|
||||
$('#selected_infoblock').hide();
|
||||
}
|
||||
});
|
||||
|
||||
// this is a little hacky, but the best, most consitent way of doing this. change the margin bottom of the table container to the height of the overlay
|
||||
$('#selected_infoblock').on('resize', function() {
|
||||
$('#sidebar_canvas').css('margin-bottom', $('#selected_infoblock').height() + 'px');
|
||||
});
|
||||
// look at the window resize to resize the pop-up infoblock so it doesn't float off the bottom or go off the top
|
||||
$(window).on('resize', function() {
|
||||
var topCalc = ($(window).height() - $('#selected_infoblock').height() - 60);
|
||||
// check if the top will be less than zero, which will be overlapping/off the screen, and set the top correctly.
|
||||
if (topCalc < 0) {
|
||||
topCalc = 0;
|
||||
$('#selected_infoblock').css('height', ($(window).height() - 60) +'px');
|
||||
}
|
||||
$('#selected_infoblock').css('top', topCalc + 'px');
|
||||
});
|
||||
|
||||
// to make the infoblock responsive
|
||||
$('#sidebar_container').on('resize', function() {
|
||||
if ($('#sidebar_container').width() < 500) {
|
||||
$('#selected_infoblock').addClass('infoblock-container-small');
|
||||
} else {
|
||||
$('#selected_infoblock').removeClass('infoblock-container-small');
|
||||
}
|
||||
});
|
||||
|
||||
// Set up event handlers for buttons
|
||||
$("#toggle_sidebar_button").click(toggleSidebarVisibility);
|
||||
$("#expand_sidebar_button").click(expandSidebar);
|
||||
|
|
@ -331,21 +379,22 @@ function initialize() {
|
|||
}
|
||||
|
||||
var CurrentHistoryFetch = null;
|
||||
var PositionHistoryBuffer = []
|
||||
var PositionHistoryBuffer = [];
|
||||
var HistoryItemsReturned = 0;
|
||||
function start_load_history() {
|
||||
if (PositionHistorySize > 0 && window.location.hash != '#nohistory') {
|
||||
$("#loader_progress").attr('max',PositionHistorySize);
|
||||
console.log("Starting to load history (" + PositionHistorySize + " items)");
|
||||
//Load history items in parallel
|
||||
for (var i = 0; i < PositionHistorySize; i++) {
|
||||
load_history_item(i);
|
||||
}
|
||||
}
|
||||
if (PositionHistorySize > 0 && window.location.hash != '#nohistory') {
|
||||
$("#loader_progress").attr('max',PositionHistorySize);
|
||||
console.log("Starting to load history (" + PositionHistorySize + " items)");
|
||||
//Load history items in parallel
|
||||
for (var i = 0; i < PositionHistorySize; i++) {
|
||||
load_history_item(i);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function load_history_item(i) {
|
||||
console.log("Loading history #" + i);
|
||||
$("#loader_progress").attr('value',i);
|
||||
|
||||
$.ajax({ url: 'data/history_' + i + '.json',
|
||||
timeout: 5000,
|
||||
|
|
@ -353,20 +402,20 @@ function load_history_item(i) {
|
|||
dataType: 'json' })
|
||||
|
||||
.done(function(data) {
|
||||
PositionHistoryBuffer.push(data);
|
||||
HistoryItemsReturned++;
|
||||
$("#loader_progress").attr('value',HistoryItemsReturned);
|
||||
if (HistoryItemsReturned == PositionHistorySize) {
|
||||
end_load_history();
|
||||
}
|
||||
PositionHistoryBuffer.push(data);
|
||||
HistoryItemsReturned++;
|
||||
$("#loader_progress").attr('value',HistoryItemsReturned);
|
||||
if (HistoryItemsReturned == PositionHistorySize) {
|
||||
end_load_history();
|
||||
}
|
||||
})
|
||||
|
||||
.fail(function(jqxhr, status, error) {
|
||||
//Doesn't matter if it failed, we'll just be missing a data point
|
||||
HistoryItemsReturned++;
|
||||
if (HistoryItemsReturned == PositionHistorySize) {
|
||||
end_load_history();
|
||||
}
|
||||
//Doesn't matter if it failed, we'll just be missing a data point
|
||||
HistoryItemsReturned++;
|
||||
if (HistoryItemsReturned == PositionHistorySize) {
|
||||
end_load_history();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -587,9 +636,9 @@ function initialize_map() {
|
|||
if (FollowSelected) {
|
||||
// On manual navigation, disable follow
|
||||
var selected = Planes[SelectedPlane];
|
||||
if (typeof selected === 'undefined' ||
|
||||
(Math.abs(center[0] - selected.position[0]) > 0.0001 &&
|
||||
Math.abs(center[1] - selected.position[1]) > 0.0001)) {
|
||||
if (typeof selected === 'undefined' ||
|
||||
(Math.abs(center[0] - selected.position[0]) > 0.0001 &&
|
||||
Math.abs(center[1] - selected.position[1]) > 0.0001)){
|
||||
FollowSelected = false;
|
||||
refreshSelected();
|
||||
refreshHighlighted();
|
||||
|
|
@ -856,18 +905,18 @@ function refreshSelected() {
|
|||
} else {
|
||||
$('#selected_callsign').text('n/a');
|
||||
}
|
||||
$('#selected_flightaware_link').html(getFlightAwareModeSLink(selected.icao, selected.flight, "FlightAware.com"));
|
||||
$('#selected_flightaware_link').html(getFlightAwareModeSLink(selected.icao, selected.flight, "Visit Flight Page"));
|
||||
|
||||
if (selected.registration !== null) {
|
||||
$('#selected_registration').text(selected.registration);
|
||||
} else {
|
||||
$('#selected_registration').text("");
|
||||
$('#selected_registration').text("n/a");
|
||||
}
|
||||
|
||||
if (selected.icaotype !== null) {
|
||||
$('#selected_icaotype').text(selected.icaotype);
|
||||
} else {
|
||||
$('#selected_icaotype').text("");
|
||||
$('#selected_icaotype').text("n/a");
|
||||
}
|
||||
|
||||
// Not using this logic for the redesigned info panel at the time, but leaving it in if/when adding it back
|
||||
|
|
@ -879,7 +928,9 @@ function refreshSelected() {
|
|||
// emerg.className = 'hidden';
|
||||
// }
|
||||
|
||||
$("#selected_altitude").text(format_altitude_long(selected.altitude, selected.vert_rate, DisplayUnits));
|
||||
$("#selected_altitude").text(format_altitude_long(selected.altitude, selected.vert_rate, DisplayUnits));
|
||||
|
||||
$('#selected_onground').text(format_onground(selected.altitude));
|
||||
|
||||
if (selected.squawk === null || selected.squawk === '0000') {
|
||||
$('#selected_squawk').text('n/a');
|
||||
|
|
@ -887,11 +938,14 @@ function refreshSelected() {
|
|||
$('#selected_squawk').text(selected.squawk);
|
||||
}
|
||||
|
||||
$('#selected_gs').text(format_speed_long(selected.gs, DisplayUnits));
|
||||
$('#selected_vertical_rate').text(format_vert_rate_long(selected.vert_rate, DisplayUnits));
|
||||
$('#selected_speed').text(format_speed_long(selected.gs, DisplayUnits));
|
||||
$('#selected_ias').text(format_speed_long(selected.ias, DisplayUnits));
|
||||
$('#selected_tas').text(format_speed_long(selected.tas, DisplayUnits));
|
||||
$('#selected_vertical_rate').text(format_vert_rate_long(selected.baro_rate, DisplayUnits));
|
||||
$('#selected_vertical_rate_geo').text(format_vert_rate_long(selected.geom_rate, DisplayUnits));
|
||||
$('#selected_icao').text(selected.icao.toUpperCase());
|
||||
$('#airframes_post_icao').attr('value',selected.icao);
|
||||
$('#selected_track').text(format_track_long(selected.track));
|
||||
$('#selected_track').text(format_track_long(selected.track));
|
||||
|
||||
if (selected.seen <= 1) {
|
||||
$('#selected_seen').text('now');
|
||||
|
|
@ -917,8 +971,8 @@ function refreshSelected() {
|
|||
$('#selected_position').text(format_latlng(selected.position));
|
||||
} else {
|
||||
$('#selected_position').text(format_latlng(selected.position));
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$('#selected_follow').removeClass('hidden');
|
||||
if (FollowSelected) {
|
||||
$('#selected_follow').css('font-weight', 'bold');
|
||||
|
|
@ -927,21 +981,22 @@ function refreshSelected() {
|
|||
$('#selected_follow').css('font-weight', 'normal');
|
||||
}
|
||||
}
|
||||
if (selected.getDataSource() === "adsb_icao") {
|
||||
$('#selected_source').text("ADS-B");
|
||||
} else if (selected.getDataSource() === "tisb_trackfile" || selected.getDataSource() === "tisb_icao" || selected.getDataSource() === "tisb_other") {
|
||||
$('#selected_source').text("TIS-B");
|
||||
} else if (selected.getDataSource() === "mlat") {
|
||||
$('#selected_source').text("MLAT");
|
||||
} else {
|
||||
$('#selected_source').text("Other");
|
||||
}
|
||||
if (selected.getDataSource() === "adsb_icao") {
|
||||
$('#selected_source').text("ADS-B");
|
||||
} else if (selected.getDataSource() === "tisb_trackfile" || selected.getDataSource() === "tisb_icao" || selected.getDataSource() === "tisb_other") {
|
||||
$('#selected_source').text("TIS-B");
|
||||
} else if (selected.getDataSource() === "mlat") {
|
||||
$('#selected_source').text("MLAT");
|
||||
} else {
|
||||
$('#selected_source').text("Other");
|
||||
}
|
||||
$('#selected_category').text(selected.category ? selected.category : "n/a");
|
||||
$('#selected_sitedist').text(format_distance_long(selected.sitedist, DisplayUnits));
|
||||
$('#selected_rssi').text(selected.rssi.toFixed(1) + ' dBFS');
|
||||
$('#selected_message_count').text(selected.messages);
|
||||
$('#selected_photo_link').html(getFlightAwarePhotoLink(selected.registration));
|
||||
|
||||
$('#selected_alt_geom').text(format_altitude_long(selected.alt_geom, selected.geom_rate, DisplayUnits));
|
||||
$('#selected_photo_link').html(getFlightAwarePhotoLink(selected.registration));
|
||||
|
||||
$('#selected_altitude_geom').text(format_altitude_long(selected.alt_geom, selected.geom_rate, DisplayUnits));
|
||||
$('#selected_mag_heading').text(format_track_long(selected.mag_heading));
|
||||
$('#selected_true_heading').text(format_track_long(selected.true_heading));
|
||||
$('#selected_ias').text(format_speed_long(selected.ias, DisplayUnits));
|
||||
|
|
@ -957,9 +1012,9 @@ function refreshSelected() {
|
|||
$('#selected_roll').text(selected.roll.toFixed(1));
|
||||
}
|
||||
if (selected.track_rate == null) {
|
||||
$('#selected_track_rate').text('n/a');
|
||||
$('#selected_trackrate').text('n/a');
|
||||
} else {
|
||||
$('#selected_track_rate').text(selected.track_rate.toFixed(2));
|
||||
$('#selected_trackrate').text(selected.track_rate.toFixed(2));
|
||||
}
|
||||
$('#selected_geom_rate').text(format_vert_rate_long(selected.geom_rate, DisplayUnits));
|
||||
if (selected.nav_qnh == null) {
|
||||
|
|
@ -973,7 +1028,58 @@ function refreshSelected() {
|
|||
$('#selected_nav_modes').text("n/a");
|
||||
} else {
|
||||
$('#selected_nav_modes').text(selected.nav_modes.join());
|
||||
}
|
||||
}
|
||||
if (selected.nic_baro == null) {
|
||||
$('#selected_nic_baro').text("n/a");
|
||||
} else {
|
||||
if (selected.nic_baro == 1) {
|
||||
$('#selected_nic_baro').text("cross-checked");
|
||||
} else {
|
||||
$('#selected_nic_baro').text("not cross-checked");
|
||||
}
|
||||
}
|
||||
|
||||
$('#selected_nac_p').text(format_nac_p(selected.nac_p));
|
||||
$('#selected_nac_v').text(format_nac_v(selected.nac_v));
|
||||
if (selected.rc == null) {
|
||||
$('#selected_rc').text("n/a");
|
||||
} else if (selected.rc == 0) {
|
||||
$('#selected_rc').text("unknown");
|
||||
} else {
|
||||
$('#selected_rc').text(format_distance_short(selected.rc, DisplayUnits));
|
||||
}
|
||||
|
||||
if (selected.sil == null || selected.sil_type == null) {
|
||||
$('#selected_sil').text("n/a");
|
||||
} else {
|
||||
var sampleRate = "";
|
||||
var silDesc = "";
|
||||
if (selected.sil_type == "perhour") {
|
||||
sampleRate = " per flight hour";
|
||||
} else if (selected.sil_type == "persample") {
|
||||
sampleRate = " per sample";
|
||||
}
|
||||
|
||||
switch (selected.sil) {
|
||||
case 0:
|
||||
silDesc = "> 1×10<sup>-3</sup>";
|
||||
break;
|
||||
case 1:
|
||||
silDesc = "≤ 1×10<sup>-3</sup>";
|
||||
break;
|
||||
case 2:
|
||||
silDesc = "≤ 1×10<sup>-5</sup>";
|
||||
break;
|
||||
case 3:
|
||||
silDesc = "≤ 1×10<sup>-7</sup>";
|
||||
break;
|
||||
default:
|
||||
silDesc = "n/a";
|
||||
sampleRate = "";
|
||||
break;
|
||||
}
|
||||
$('#selected_sil').html(silDesc + sampleRate);
|
||||
}
|
||||
|
||||
if (selected.version == null) {
|
||||
$('#selected_version').text('none');
|
||||
|
|
@ -986,7 +1092,8 @@ function refreshSelected() {
|
|||
} else {
|
||||
$('#selected_version').text('v' + selected.version);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function refreshHighlighted() {
|
||||
// this is following nearly identical logic, etc, as the refreshSelected function, but doing less junk for the highlighted pane
|
||||
|
|
@ -1004,6 +1111,48 @@ function refreshHighlighted() {
|
|||
|
||||
$('#highlighted_infoblock').show();
|
||||
|
||||
// Get info box position and size
|
||||
var infoBox = $('#highlighted_infoblock');
|
||||
var infoBoxPosition = infoBox.position();
|
||||
if (typeof infoBoxOriginalPosition.top === 'undefined') {
|
||||
infoBoxOriginalPosition.top = infoBoxPosition.top;
|
||||
infoBoxOriginalPosition.left = infoBoxPosition.left;
|
||||
} else {
|
||||
infoBox.css("left", infoBoxOriginalPosition.left);
|
||||
infoBox.css("top", infoBoxOriginalPosition.top);
|
||||
infoBoxPosition = infoBox.position();
|
||||
}
|
||||
var infoBoxExtent = getExtent(infoBoxPosition.left, infoBoxPosition.top, infoBox.outerWidth(), infoBox.outerHeight());
|
||||
|
||||
// Get map size
|
||||
var mapCanvas = $('#map_canvas');
|
||||
var mapExtent = getExtent(0, 0, mapCanvas.width(), mapCanvas.height());
|
||||
|
||||
var marker = highlighted.marker;
|
||||
var markerCoordinates = highlighted.marker.getGeometry().getCoordinates();
|
||||
var markerPosition = OLMap.getPixelFromCoordinate(markerCoordinates);
|
||||
|
||||
// Check for overlap
|
||||
//FIXME TODO: figure out this/remove this check
|
||||
if (isPointInsideExtent(markerPosition[0], markerPosition[1], infoBoxExtent) || true) {
|
||||
// Array of possible new positions for info box
|
||||
var candidatePositions = [];
|
||||
candidatePositions.push( { x: 40, y: 80 } );
|
||||
candidatePositions.push( { x: markerPosition[0] + 20, y: markerPosition[1] + 60 } );
|
||||
|
||||
// Find new position
|
||||
for (var i = 0; i < candidatePositions.length; i++) {
|
||||
var candidatePosition = candidatePositions[i];
|
||||
var candidateExtent = getExtent(candidatePosition.x, candidatePosition.y, infoBox.outerWidth(), infoBox.outerHeight());
|
||||
|
||||
if (!isPointInsideExtent(markerPosition[0], markerPosition[1], candidateExtent) && isPointInsideExtent(candidatePosition.x, candidatePosition.y, mapExtent)) {
|
||||
// Found a new position that doesn't overlap marker - move box to that position
|
||||
infoBox.css("left", candidatePosition.x);
|
||||
infoBox.css("top", candidatePosition.y);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (highlighted.flight !== null && highlighted.flight !== "") {
|
||||
$('#highlighted_callsign').text(highlighted.flight);
|
||||
} else {
|
||||
|
|
@ -1013,9 +1162,24 @@ function refreshHighlighted() {
|
|||
if (highlighted.icaotype !== null) {
|
||||
$('#higlighted_icaotype').text(highlighted.icaotype);
|
||||
} else {
|
||||
$('#higlighted_icaotype').text("");
|
||||
$('#higlighted_icaotype').text("n/a");
|
||||
}
|
||||
|
||||
if (highlighted.getDataSource() === "adsb_icao") {
|
||||
$('#highlighted_source').text("ADS-B");
|
||||
} else if (highlighted.getDataSource() === "tisb_trackfile" || highlighted.getDataSource() === "tisb_icao" || highlighted.getDataSource() === "tisb_other") {
|
||||
$('#highlighted_source').text("TIS-B");
|
||||
} else if (highlighted.getDataSource() === "mlat") {
|
||||
$('#highlighted_source').text("MLAT");
|
||||
} else {
|
||||
$('#highlighted_source').text("Other");
|
||||
}
|
||||
|
||||
if (highlighted.registration !== null) {
|
||||
$('#highlighted_registration').text(highlighted.registration);
|
||||
} else {
|
||||
$('#highlighted_registration').text("n/a");
|
||||
}
|
||||
|
||||
$('#highlighted_speed').text(format_speed_long(highlighted.speed, DisplayUnits));
|
||||
|
||||
|
|
@ -1213,7 +1377,6 @@ function sortBy(id,sc,se) {
|
|||
function selectPlaneByHex(hex,autofollow) {
|
||||
//console.log("select: " + hex);
|
||||
// If SelectedPlane has something in it, clear out the selected
|
||||
removeHighlight();
|
||||
if (SelectedAllPlanes) {
|
||||
deselectAllPlanes();
|
||||
}
|
||||
|
|
@ -1223,6 +1386,8 @@ function selectPlaneByHex(hex,autofollow) {
|
|||
Planes[SelectedPlane].clearLines();
|
||||
Planes[SelectedPlane].updateMarker();
|
||||
$(Planes[SelectedPlane].tr).removeClass("selected");
|
||||
// scroll the infoblock back to the top for the next plane to be selected
|
||||
$('.infoblock-container').scrollTop(0);
|
||||
}
|
||||
|
||||
// If we are clicking the same plane, we are deselecting it.
|
||||
|
|
@ -1255,10 +1420,6 @@ function selectPlaneByHex(hex,autofollow) {
|
|||
}
|
||||
|
||||
function highlightPlaneByHex(hex) {
|
||||
// if we've selected a plane, don't show the highlighting box
|
||||
if (SelectedPlane != null) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (hex != null) {
|
||||
HighlightedPlane = hex;
|
||||
|
|
@ -1424,10 +1585,12 @@ function setSelectedInfoBlockVisibility() {
|
|||
|
||||
if (planeSelected && mapIsVisible) {
|
||||
$('#selected_infoblock').show();
|
||||
$('#sidebar_canvas').css('margin-bottom', $('#selected_infoblock').height() + 'px');
|
||||
}
|
||||
else {
|
||||
$('#selected_infoblock').hide();
|
||||
}
|
||||
$('#sidebar_canvas').css('margin-bottom', 0);
|
||||
}
|
||||
}
|
||||
|
||||
// Reposition selected plane info box if it overlaps plane marker
|
||||
|
|
@ -1446,21 +1609,8 @@ function adjustSelectedInfoBlockPosition() {
|
|||
// Get marker position
|
||||
var marker = selectedPlane.marker;
|
||||
var markerCoordinates = selectedPlane.marker.getGeometry().getCoordinates();
|
||||
var markerPosition = OLMap.getPixelFromCoordinate(markerCoordinates);
|
||||
|
||||
// Get info box position and size
|
||||
var infoBox = $('#selected_infoblock');
|
||||
var infoBoxPosition = infoBox.position();
|
||||
if (typeof infoBoxOriginalPosition.top === 'undefined') {
|
||||
infoBoxOriginalPosition.top = infoBoxPosition.top;
|
||||
infoBoxOriginalPosition.left = infoBoxPosition.left;
|
||||
} else {
|
||||
infoBox.css("left", infoBoxOriginalPosition.left);
|
||||
infoBox.css("top", infoBoxOriginalPosition.top);
|
||||
infoBoxPosition = infoBox.position();
|
||||
}
|
||||
var infoBoxExtent = getExtent(infoBoxPosition.left, infoBoxPosition.top, infoBox.outerWidth(), infoBox.outerHeight());
|
||||
|
||||
var markerPosition = OLMap.getPixelFromCoordinate(markerCoordinates);
|
||||
|
||||
// Get map size
|
||||
var mapCanvas = $('#map_canvas');
|
||||
var mapExtent = getExtent(0, 0, mapCanvas.width(), mapCanvas.height());
|
||||
|
|
@ -1684,7 +1834,7 @@ function getFlightAwareModeSLink(code, ident, linkText) {
|
|||
|
||||
function getFlightAwarePhotoLink(registration) {
|
||||
if (registration !== null && registration !== "") {
|
||||
return "<a target=\"_blank\" href=\"https://flightaware.com/photos/aircraft/" + registration.replace(/[^0-9a-z]/ig,'') + "\">See Aircraft Photos</a>";
|
||||
return "<a target=\"_blank\" href=\"https://flightaware.com/photos/aircraft/" + registration.replace(/[^0-9a-z]/ig,'') + "\">See Photos</a>";
|
||||
}
|
||||
|
||||
return "";
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
html, body {
|
||||
-ms-overflow-style: -ms-autohiding-scrollbar;
|
||||
margin: 0; padding: 0; background-color: #ffffff; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 10pt; overflow: auto; height: 100%;
|
||||
font-size: 10pt; overflow: hidden; height: 100%;
|
||||
}
|
||||
|
||||
#layout_container {
|
||||
|
|
@ -9,15 +10,27 @@ html, body {
|
|||
}
|
||||
|
||||
#selected_infoblock {
|
||||
position: absolute;
|
||||
left: 40px;
|
||||
top: 60px;
|
||||
min-width: 394px;
|
||||
padding: 10px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
margin: 0;
|
||||
background: #ffffff;
|
||||
box-shadow: 4px 4px 10px #444444;
|
||||
cursor: pointer;
|
||||
z-index: 9999;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
}
|
||||
.infoblock-container {
|
||||
overflow: scroll;
|
||||
height: 100%;
|
||||
}
|
||||
#sidebar_canvas {
|
||||
padding: 10px;
|
||||
overflow: scroll;
|
||||
}
|
||||
#sidebar_container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 500px;
|
||||
left: 0 !important;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#map_container {
|
||||
|
|
@ -85,15 +98,9 @@ html, body {
|
|||
background-size: cover;
|
||||
}
|
||||
|
||||
#sidebar_container {
|
||||
display: flex;
|
||||
width: 500px;
|
||||
left: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
#splitter {
|
||||
cursor: col-resize;
|
||||
cursor: ew-resize;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 125px;
|
||||
|
|
@ -106,10 +113,44 @@ html, body {
|
|||
background-position: 0px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
background-image: url("images/column-adjust.png");
|
||||
background-image: url("images/toggle-width@2x.png");
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
#splitter-infoblock {
|
||||
cursor: ns-resize;
|
||||
display: inline-block;
|
||||
position: absolute ;
|
||||
top: 0px;
|
||||
right: 0;
|
||||
margin-left: auto;
|
||||
width: 24px;
|
||||
height: 4px;
|
||||
background-size: 24px 25px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0px;
|
||||
border: none;
|
||||
width: 100%;
|
||||
border-bottom: #234c75;
|
||||
background-color: #65819e;
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
#close-button {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
color: #00A0E2;
|
||||
right: 30px;
|
||||
margin-left: auto;
|
||||
font-size: 75%;
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
padding: 3px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.ol-zoom-in {
|
||||
background-image: url("images/zoom-in.png");
|
||||
background-size: cover;
|
||||
|
|
@ -134,11 +175,7 @@ html, body {
|
|||
left: 10px !important;
|
||||
}
|
||||
|
||||
#sidebar_canvas {
|
||||
flex: 1 1 auto;
|
||||
padding: 10px;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
|
||||
div#SpecialSquawkWarning { position: absolute; bottom: 25px; right: 430px; border: 2px solid red;
|
||||
background-color: #FFFFA3; opacity: 0.75; filter:alpha(opacity=75); padding: 5px;
|
||||
|
|
@ -257,22 +294,35 @@ select.error, textarea.error, input.error {
|
|||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.infoHeading
|
||||
{
|
||||
.infoHeading {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
color: #002F5D;
|
||||
color: rgb(0, 47, 93);
|
||||
}
|
||||
|
||||
.infoData
|
||||
{
|
||||
.infoHeading sub {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.infoData {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: #000000;
|
||||
color: rgb(0, 0, 0);
|
||||
}
|
||||
|
||||
.sectionTitle {
|
||||
width: 100%;
|
||||
text-transform: uppercase;
|
||||
color: #fff;
|
||||
background: #002F5D;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.section-title-content {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
.legend
|
||||
|
|
@ -301,8 +351,7 @@ select.error, textarea.error, input.error {
|
|||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-indent: 16px
|
||||
color: #000000;
|
||||
text-indent: 16px;
|
||||
color: rgb(0, 0, 0);
|
||||
}
|
||||
|
||||
|
|
@ -316,24 +365,6 @@ select.error, textarea.error, input.error {
|
|||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.infoHeading
|
||||
{
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: #666666;
|
||||
color: rgb(102, 102, 102);
|
||||
}
|
||||
|
||||
.infoData
|
||||
{
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: #000000;
|
||||
color: rgb(0, 0, 0);
|
||||
}
|
||||
|
||||
#header {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
|
|
@ -407,6 +438,10 @@ select.error, textarea.error, input.error {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.lightblue-link, .lightblue-link a {
|
||||
color: #00A0E2;
|
||||
}
|
||||
|
||||
.buttonHeader {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
|
@ -440,7 +475,7 @@ select.error, textarea.error, input.error {
|
|||
height: 36px;
|
||||
border-bottom: 1px solid #00A0E2;
|
||||
padding-left: 18px;
|
||||
padding-top: 14px;
|
||||
padding-top: 18px;
|
||||
}
|
||||
|
||||
.highlightedInfo {
|
||||
|
|
@ -471,12 +506,10 @@ select.error, textarea.error, input.error {
|
|||
|
||||
.infoRowTitle {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.infoRowContent {
|
||||
display: inline-block;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.infoRowFluid {
|
||||
|
|
@ -487,6 +520,13 @@ select.error, textarea.error, input.error {
|
|||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.infoRowLine {
|
||||
width: 49%;
|
||||
display: inline-block;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
.removePadding {
|
||||
padding: 0;
|
||||
}
|
||||
|
|
@ -518,22 +558,6 @@ select.error, textarea.error, input.error {
|
|||
background-color: #efefef;
|
||||
}
|
||||
|
||||
.fourColumnSection1 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.fourColumnSection2 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.fourColumnSection3 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.fourColumnSection4 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#dump1090_infoblock {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
|
@ -569,7 +593,6 @@ select.error, textarea.error, input.error {
|
|||
}
|
||||
|
||||
.legendTitle {
|
||||
/*margin-left: auto;*/
|
||||
line-height: 19px;
|
||||
display: inline-block;
|
||||
padding-right: 20px;
|
||||
|
|
@ -655,6 +678,45 @@ select.error, textarea.error, input.error {
|
|||
outline: none;
|
||||
}
|
||||
|
||||
.bottom-container {
|
||||
width: 100%;
|
||||
margin-top: 8px;
|
||||
padding: 40px 0px;
|
||||
text-align: center;
|
||||
background-color: #eee;
|
||||
}
|
||||
#selected_flightaware_link a {
|
||||
background-color: #00a0e2;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
float: right;
|
||||
margin-right: 25px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.bottom-info-container {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
text-align: center;
|
||||
color: #002F5D;
|
||||
line-height: 18px;
|
||||
}
|
||||
.bottom-info-container img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.bottom-info-container .bottom-info-text {
|
||||
vertical-align: middle;
|
||||
display: inline;
|
||||
}
|
||||
.selected_airframe a {
|
||||
color: #002F5D;
|
||||
}
|
||||
|
||||
.infoblock-container-small .infoRowFluid {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Retina 2x images */
|
||||
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
|
||||
.settingsCloseBox {
|
||||
|
|
@ -672,9 +734,6 @@ select.error, textarea.error, input.error {
|
|||
.ol-zoom-in {
|
||||
background-image: url("images/zoom-in@2x.png");
|
||||
}
|
||||
#splitter {
|
||||
background-image: url("images/column-adjust@2x.png");
|
||||
}
|
||||
#toggle_sidebar_button.show_sidebar {
|
||||
background-image: url("images/table-icon@2x.png");
|
||||
}
|
||||
|
|
@ -703,9 +762,6 @@ select.error, textarea.error, input.error {
|
|||
.ol-zoom-in {
|
||||
background-image: url("images/zoom-in@3x.png");
|
||||
}
|
||||
#splitter {
|
||||
background-image: url("images/column-adjust@3x.png");
|
||||
}
|
||||
#toggle_sidebar_button.show_sidebar {
|
||||
background-image: url("images/table-icon@3x.png");
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue