some more filtering options

html/index.html

@@ -631,16 +631,17 @@
 					<div id="sidebar-table">
 						<div id="dump1090_infoblock">
 							<table style="width: 100%">
+                                <td>
+                                    <div class="button-flex buttonTable" id="show_map_button"><span class="buttonText">Show Map</span></div>
+                                </td>
 								<tr class="infoblock_heading">
-									<td>
-										<form id="search_form">
-											<input id="search_input" name="searchBox" type="text" class="searchInput" maxlength="8">
+                                    <td>
+                                        <form id="search_form">
+                                            <span class="infoBlockTitleText">Search:</span><!--
+                                            --><input id="search_input" name="searchBox" type="text" class="searchInput" maxlength="8">
 										</form>
 									</td>
 
-									<td>
-										<div class="button-flex buttonTable" id="show_map_button"><span class="buttonText">Show Map</span></div>
-									</td>
 									<td style="text-align: right">
 										<a href="https://github.com/wiedehopf/tar1090#tar1090" id="dump1090_version" target="_blank">tar1090 on github</a>
 									</td>
@@ -660,7 +661,7 @@
 						</div> <!-- dump1090_infoblock -->
 
 						<form id="altitude_filter_form">
-							<label><span class="infoBlockTitleText">Filter by Altitude:</span></label>
+							<label><span class="infoBlockTitleText">Filter by altitude:</span></label>
 							<br>
 							<input id="altitude_filter_min" name="minAltitude" type="text" class="altitudeFilterInput" maxlength="5">
 							<label for="minAltitude" class="altitudeUnit"></label>
@@ -670,6 +671,23 @@
 							<button style="font: small" type="submit">Filter</button>
 							<button style="font: small" id="altitude_filter_reset_button">Reset</button>
 
+						</form>
+						<form id="callsign_filter_form">
+							<label><span class="infoBlockTitleText">Filter by callsign/ident:</span></label>
+							<br>
+							<input id="callsign_filter" name="callsign" type="text" class="altitudeFilterInput" maxlength="8">
+							<button style="font: small" type="submit">Filter</button>
+							<button style="font: small" id="callsign_filter_reset_button">Reset</button>
+
+						</form>
+
+						<form id="type_filter_form">
+							<label><span class="infoBlockTitleText">Filter by type:</span></label>
+							<br>
+							<input id="type_filter" name="type" type="text" class="altitudeFilterInput" maxlength="8">
+							<button style="font: small" type="submit">Filter</button>
+							<button style="font: small" id="type_filter_reset_button">Reset</button>
+
 						</form>
 
 						<div id="planes_table">

html/planeObject.js

@@ -213,6 +213,14 @@ PlaneObject.prototype.isFiltered = function() {
     if (!filterTracks && this.altFiltered(this.altitude))
         return true;
 
+    if (this.filter.type && (!this.icaoType || !this.icaoType.match(this.filter.type)) ) {
+        return true;
+    }
+
+    if (this.filter.callsign && (!this.flight || !this.flight.match(this.filter.callsign)) ) {
+        return true;
+    }
+
     // filter out ground vehicles
     if (typeof this.filter.groundVehicles !== 'undefined' && this.filter.groundVehicles === 'filtered') {
         if (typeof this.category === 'string' && this.category.startsWith('C')) {
@@ -1149,6 +1157,7 @@ PlaneObject.prototype.updateFeatures = function(now, last, redraw) {
     // Only clear the plane if it's not selected individually
     if (
         (this.seen < 58 && this.position != null && this.seen_pos < 60)
+        || (globeIndex && this.position != null && this.seen_pos < 180)
         || (this.selected && !SelectedAllPlanes && !multiSelect)
         || (noVanish && this.position != null)
     ) {

html/script.js

@@ -589,6 +589,8 @@ $('#sidebar_container').on('resize', function() {
 
     // Set up altitude filter button event handlers and validation options
     $("#altitude_filter_form").submit(onFilterByAltitude);
+    $("#type_filter_form").submit(updateTypeFilter);
+    $("#callsign_filter_form").submit(updateCallsignFilter);
 
     $("#search_form").submit(onSearch);
 
@@ -599,6 +601,8 @@ $('#sidebar_container').on('resize', function() {
 
 
 $("#altitude_filter_reset_button").click(onResetAltitudeFilter);
+$("#callsign_filter_reset_button").click(onResetCallsignFilter);
+$("#type_filter_reset_button").click(onResetTypeFilter);
 
 $('#settingsCog').on('click', function() {
     $('#settings_infoblock').toggle();
@@ -1138,6 +1142,9 @@ function initialize_map() {
         if (e.defaultPrevented ) {
             return; // Do nothing if the event was already processed
         }
+        if (e.target.type == "text") {
+            return;
+        }
         if (e.srcElement.nodeName == 'INPUT') {
             return;
         }
@@ -1426,6 +1433,12 @@ function refreshPageTitle() {
 function refreshSelected() {
 
 
+    if (SelectedPlane && SelectedPlane.isFiltered()) {
+        SelectedPlane.selected = false;
+        SelectedPlane.clearLines();
+        SelectedPlane = null;
+    }
+
     if (!SelectedPlane) {
         setSelectedInfoBlockVisibility();
         return;
@@ -2697,6 +2710,48 @@ function onSearch(e) {
     return false;
 }
 
+function onResetCallsignFilter(e) {
+    $("#callsign_filter").val("");
+    $("#callsign_filter").blur();
+
+    updateCallsignFilter();
+}
+
+function updateCallsignFilter(e) {
+    if (e)
+        e.preventDefault();
+
+    $("#callsign_filter").blur();
+
+    PlaneFilter.callsign = $("#callsign_filter").val().trim().toUpperCase();
+
+    refreshSelected();
+    refreshHighlighted();
+    refreshTableInfo();
+}
+
+
+function onResetTypeFilter(e) {
+    $("#type_filter").val("");
+    $("#type_filter").blur();
+
+    updateTypeFilter();
+}
+
+function updateTypeFilter(e) {
+    if (e)
+        e.preventDefault();
+
+    $("#type_filter").blur();
+    var type = $("#type_filter").val().trim();
+
+    PlaneFilter.type = type.toUpperCase();
+
+    refreshSelected();
+    refreshHighlighted();
+    refreshTableInfo();
+}
+
 function onResetAltitudeFilter(e) {
     $("#altitude_filter_min").val("");
     $("#altitude_filter_max").val("");
@@ -2707,6 +2762,17 @@ function onResetAltitudeFilter(e) {
     refreshTableInfo();
 }
 
+function onFilterByAltitude(e) {
+    e.preventDefault();
+    $("#type_filter").blur();
+
+    updatePlaneFilter();
+
+    refreshSelected();
+    refreshHighlighted();
+    refreshTableInfo();
+}
+
 function updatePlaneFilter() {
     var minAltitude = parseFloat($("#altitude_filter_min").val().trim());
     var maxAltitude = parseFloat($("#altitude_filter_max").val().trim());

html/style.css

@@ -233,7 +233,6 @@ div#loader { z-index: 99; position: absolute; left: 0; top: 0; bottom: 0; right:
 }
 .hidden { display: none; }
 
-.infoblock_heading    { font-size: larger; }
 .infoblock_heading a  { text-decoration: none; color: blue; font-size: x-small;}
 
 .dim    { opacity: 0.3; filter:alpha(opacity=30); /* For IE8 and earlier */ }