Allow aircraft info box to be positioned anywhere in browser window

This commit is contained in:
Carlos Salaverria 2016-09-12 17:36:08 -05:00
parent 976302e3ca
commit 08e0bd28f6
2 changed files with 60 additions and 59 deletions

View file

@ -46,69 +46,69 @@
</form> </form>
<div id="layout_container"> <div id="layout_container">
<div id="selected_infoblock" class="hidden">
<table style="width: 100%">
<tr class="infoblock_heading">
<td colspan="2">
<b>
<span id="selected_callsign" onclick="toggleFollowSelected();" class="pointer">n/a</span>
</b>
<span id="selected_follow" onclick="toggleFollowSelected();" class="pointer">&#x21D2;</span>
<span id="selected_flag">
<img style="width: 20px; height=12px" src="about:blank" alt="Flag">
</span>
<a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;">
<span id="selected_icao"></span>
</a>
<span id="selected_registration"></span>
<span id="selected_icaotype"></span>
<span id="selected_emergency"></span>
<span id="selected_flightaware_link"></span>
</td>
</tr>
<tr id="infoblock_country" class="infoblock_body">
<td colspan="2">Country of registration: <span id="selected_country">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td style="width: 55%">Altitude: <span id="selected_altitude"></span></td>
<td style="width: 45%">Squawk: <span id="selected_squawk"></span></td>
</tr>
<tr class="infoblock_body">
<td>Speed: <span id="selected_speed">n/a</span></td>
<td>RSSI: <span id="selected_rssi">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td>Vertical rate: <span id="selected_vertical_rate">n/a</span></td>
<td>Messages: <span id="selected_message_count">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td>Track: <span id="selected_track">n/a</span></td>
<td>Last seen: <span id="selected_seen">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2">Position: <span id="selected_position">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2">Distance from Site: <span id="selected_sitedist">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2"><span id="selected_photo_link"></span></td>
</tr>
</table>
</div> <!-- selected_infoblock -->
<div id="map_container"> <div id="map_container">
<div id="map_canvas"></div> <div id="map_canvas"></div>
<a id="toggle_sidebar_button" class="hide_sidebar" href="#"></a> <a id="toggle_sidebar_button" class="hide_sidebar" href="#"></a>
<a id="expand_sidebar_button" href="#"></a> <a id="expand_sidebar_button" href="#"></a>
<div id="selected_infoblock" class="hidden">
<table style="width: 100%">
<tr class="infoblock_heading">
<td colspan="2">
<b>
<span id="selected_callsign" onclick="toggleFollowSelected();" class="pointer">n/a</span>
</b>
<span id="selected_follow" onclick="toggleFollowSelected();" class="pointer">&#x21D2;</span>
<span id="selected_flag">
<img style="width: 20px; height=12px" src="about:blank" alt="Flag">
</span>
<a href="http://www.airframes.org/" onclick="document.getElementById('horrible_hack').submit.call(document.getElementById('airframes_post')); return false;">
<span id="selected_icao"></span>
</a>
<span id="selected_registration"></span>
<span id="selected_icaotype"></span>
<span id="selected_emergency"></span>
<span id="selected_flightaware_link"></span>
</td>
</tr>
<tr id="infoblock_country" class="infoblock_body">
<td colspan="2">Country of registration: <span id="selected_country">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td style="width: 55%">Altitude: <span id="selected_altitude"></span></td>
<td style="width: 45%">Squawk: <span id="selected_squawk"></span></td>
</tr>
<tr class="infoblock_body">
<td>Speed: <span id="selected_speed">n/a</span></td>
<td>RSSI: <span id="selected_rssi">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td>Vertical rate: <span id="selected_vertical_rate">n/a</span></td>
<td>Messages: <span id="selected_message_count">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td>Track: <span id="selected_track">n/a</span></td>
<td>Last seen: <span id="selected_seen">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2">Position: <span id="selected_position">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2">Distance from Site: <span id="selected_sitedist">n/a</span></td>
</tr>
<tr class="infoblock_body">
<td colspan="2"><span id="selected_photo_link"></span></td>
</tr>
</table>
</div> <!-- selected_infoblock -->
</div> </div>
<div id="sidebar_container"> <div id="sidebar_container">
<div id="splitter" class="ui-resizable-handle ui-resizable-w"></div> <div id="splitter" class="ui-resizable-handle ui-resizable-w"></div>

View file

@ -17,6 +17,7 @@ html, body {
background: #ffffff; background: #ffffff;
box-shadow: 4px 4px 10px #444444; box-shadow: 4px 4px 10px #444444;
cursor: pointer; cursor: pointer;
z-index: 9999;
} }
#map_container { #map_container {