tiny changes to CSS and logic, also closes rossengeorgiev#9

* Additonal telemtry from habitat is displayed only in 'landscape mode'
* added a WARNING to the 'chase car' page that position will be made public
* move the position of 'no vehicle' message
* 'recieved by' is now hidden, if there are no recievers (e.g. chase cars)
* ChaseCar lib now sends values that are null as 0

Author: rossengeorgiev

css/main.css

@@ -104,6 +104,8 @@ header > div {
 #main .header.empty {
     text-align: center;
     width: 100%;
+    height: 120px;
+    line-height: 100px;
     border: 0;
 }
 .row .header .arrow:after { content: "▲"; }
@@ -293,7 +295,7 @@ header > div {
     #main .data dl > dt { 
         color: #000;
         line-height: 11px;
-        margin-top: 10px;
+        margin-top: 5px;
         font-weight: bold;
         font-size: 14px;
     }

css/mobile.css

@@ -57,6 +57,9 @@ <h2>Chase car mode</h2>
                 <span>Callsign</span>
                 <span class="r"><input type="text" id="cc_callsign" style="width: 140px;"/></span>
             </div>
+            <div class="row">
+                <span><b>Warning: If you enable this, your location will be uploaded to habitat and be publicly visible on the map.</b></span>
+            </div>
             <hr>
             <div class="row">
                 <span>Last updated</span>

index.html

@@ -83,8 +83,8 @@ ChaseCar.updatePosition = function(callsign, position) {
                 'chase': true,
                 'latitude': position.coords.latitude,
                 'longitude': position.coords.longitude,
-                'altitude': position.coords.altitude,
-                'speed': position.coords.speed
+                'altitude': ((!!position.coords.altitude) ? position.coords.altitude : 0),
+                'speed': ((!!position.coords.speed) ? position.coords.speed : 0)
             }
         });
 }

js/chasecar.lib.js

@@ -218,17 +218,17 @@ function habitat_data(jsondata) {
       if (suffixes[key] !== undefined)
         suffix = " " + suffixes[key];
 
-      output.push("<b>" + name + ":</b> " + data[key] + suffix + "<br />");
+      output.push("<dt>" + data[key] + suffix + "</dt><dd>" + name + "</dd>");
     }
 
     output.sort();
     return output.join(" ");
   }
   catch (error)
   {
-    if (jsondata && jsondata != '')
-      return "<b>Data:</b> " + jsondata + "<br /> ";
-    else
+    //if (jsondata && jsondata != '')
+    // return "<b>Data:</b> " + jsondata + "<br /> ";
+    //else
       return "";
   }
 }
@@ -527,12 +527,16 @@ function updateVehicleInfo(index, position) {
            + '</div>' // right
            + '</div>' // data
            + '';
+  var c    = '<dt class="recievers">Recieved by:</dt><dd class="recievers">'
+           + position.callsign.split(",").join(", ") + '</dd>'
+
+  if(!position.callsign) c = '';
+
   // mid for portrait
   var p    = '<dt>'+position.gps_time+'</dt><dd>time</dd>'
            + '<dt>'+coords_text+'</dt><dd>time</dd>'
-           + '<dt class="recievers">Recieved by:</dt><dd class="recievers">'
-           + position.callsign.split(",").join(", ")
-           + '</dd></dl>'
+           + c // recievers if any
+           + '</dl>'
            + '</div>' // left
            + '<div class="right">'
            + '<dl>'
@@ -545,64 +549,14 @@ function updateVehicleInfo(index, position) {
            + '<dt>'+position.gps_alt+'m ('+vehicles[index].max_alt+'m)</dt><dd>altitude (max)</dd>'
            + '<dt>'+position.gps_time+'</dt><dd>time</dd>'
            + '<dt>'+coords_text+'</dt><dd>coordinates</dd>'
-           + '<dt class="recievers">Recieved by:</dt><dd class="recievers">'
-           + position.callsign.split(",").join(", ")
-           + '</dd>';
+           + habitat_data(position.data) 
+           + c // recievers if any
            + '';
 
 
   $('.portrait .vehicle'+index).html(a + p + b); 
   $('.landscape .vehicle'+index).html(a + l + b); 
   return true;
-
-           /// old code
-
-  var html = '  <div class="altitude_container" id="altitude_' + index + '">'
-           + '      <div class="altitude" style="font-size:0px; border-top: solid white ' + (98 - pixels) + 'px; height: ' + pixels + 'px;"></div>'
-           + '  </div>'
-           + '  <div class="vehicle_info_wrapper">'
-           + '    <div class="vehicle_info" style="background: url(' + image + ') no-repeat top right;">'
-           + '      <b style="font-size:12px">' + vehicle_names[index] + '</b><br />';
-
-  /* XXX OSIRIS INVISIBILITY */  if (vehicle_names[index] != "OSIRIS" && vehicle_names[index] != "PETUNIA")
-  html +=    '      <b>Time:</b> ' + position.gps_time + '<br />'
-           + '      <b>Position:</b> ' + roundNumber(position.gps_lat, 6) + ',' + roundNumber(position.gps_lon, 6) + '<br />'
-           + '      <b>Altitude:</b> ' + position.gps_alt + ' m' + ascent_text + '<br />'
-           + (vehicles[index].vehicle_type == "balloon" ? ('<b>Max. Altitude:</b> ' + vehicles[index].max_alt + ' m<br />') : '');
-
-
-  /* XXX OSIRIS INVISIBILITY */  else
-  html +=    '      <b>Sentence ID:</b> ' + position.sequence + '<br />';
-
-  html +=    optional("Heading", position.gps_heading, "&deg;")
-           + optional("Speed", position.gps_speed, " km/h")
-           + optional("Temperature", position.temp_inside, "C");
-
-     /* Use habitat data! Just add the keys you want to the habitat_data function 
-      *    if (position.vehicle == "wb8elk2")
-      *      html += whitestar_data("Data", position.data, "");
-      *    else if (position.vehicle == "apex")
-      *      html += apex_data("Data", position.data, "");
-      *    else if (position.vehicle == "picochu-1")
-      *      html += picochu_data("Data", position.data, "");
-      *    else if (position.vehicle == "DARKSIDE")
-      *      html += darkside_data("Dara", position.data, "");
-      *    else
-      *      // html += optional("Data", position.data, "");
-     */
-
-  html +=    habitat_data(position.data);
-  html +=    optional("Receivers", position.callsign.split(",").join(", "), "");
-  /* XXX OSIRIS INVISIBILITY */  if (vehicle_names[index] != "OSIRIS" && vehicle_names[index] != "PETUNIA")
-  html +=    vehicleButtons(index);
-
-  html +=    '    </div>'
-           + '  </div>'
-           + '  <div style="clear:both;"></div>';
-  
-  container.innerHTML = html;
-  //$("#debug_box").html("Height: " + container.offsetHeight);
-  $("#altitude_" + index).css("margin-top", container.offsetHeight - 100);
 }
 
 function showSignals(index, position) {