diff --git a/public_html/gmap.html b/public_html/gmap.html index 6bdd622..e6462bf 100644 --- a/public_html/gmap.html +++ b/public_html/gmap.html @@ -18,7 +18,12 @@

Click on a plane for info.

-
[Settings]
+
[Settings]
+
+

Settings

+ + +
diff --git a/public_html/script.js b/public_html/script.js index ba89a47..96b3926 100644 --- a/public_html/script.js +++ b/public_html/script.js @@ -364,10 +364,24 @@ function printTime() { } function placeSettings() { - $('#info_settings').css('top', parseInt($('#utcTime').offset().top)); - + // Settings link var marginLeft = $('#header').width() - $('#info_settings').width(); $('#info_settings').css('left', marginLeft); + $('#info_settings').css('top', parseInt($('#utcTime').offset().top)); + + // Settings area + $('#info_settings_area').css('top', parseInt($('#geninfo').offset().top)); + $('#info_settings_area').css('left', 5); + $('#info_settings_area').css('width', parseInt($('#info').width() - 40)); +} + +function toggleSettings() { + if ($('#info_settings_area').css('display') != 'none') { + $('#info_settings_area').hide(350); + } else { + // Open settings + $('#info_settings_area').show(350); + } } function resetMap() { diff --git a/public_html/style.css b/public_html/style.css index dd6835f..db2e481 100644 --- a/public_html/style.css +++ b/public_html/style.css @@ -1,46 +1,68 @@ html { height: 100%; } body { height: 100%; margin: 0; padding: 0; font-size: small;} a { color: blue; } + #map_canvas { -height: 100%; -margin-right:390px; + height: 100%; + margin-right: 390px; } + #info { -position: absolute; -width:390px; -height:100%; -bottom:0px; -right:0px; -top:0px; -background-color: white; -border-left:1px #666 solid; -font-family:Helvetica; + position: absolute; + width: 390px; + height: 100%; + bottom: 0px; + right: 0px; + top: 0px; + background-color: white; + border-left: 1px #666 solid; + font-family: Helvetica, Sans-serif, Arial; } + #info div { -padding:0px; -padding-left:10px; -padding-right:10px; -margin:0px; + padding: 0px; + padding-left: 10px; + padding-right: 10px; + margin: 0px; } + #info div h1 { -margin-top:10px; -font-size:16px; + margin-top: 10px; + font-size: 16px; } + +#info div h2 { + margin-top: 10px; + font-size: 14px; +} + #info_settings { -position: absolute; -display: none; + position: absolute; + display: none; } + +#info_settings_area { + position: absolute; + display: none; + background-color: white; + border: 1px solid gray; +} + #tabinfo{ -height: 400px; -overflow-y: auto; + height: 400px; + overflow-y: auto; } + #tableinfo { -font-size: x-small; -font-family: monospace; + font-size: x-small; + font-family: monospace; } + #tableinforow { -cursor: pointer; + cursor: pointer; + } + #tableinforow .bold { -font-weight:bold; + font-weight:bold; }