diff --git a/public_html/README.md b/public_html/README.md index 0d08e3f74..207d6758c 100644 --- a/public_html/README.md +++ b/public_html/README.md @@ -14,26 +14,49 @@ Examples: http:///skyaware/?ringCount=3&ringBaseDistance=100&ringInterval=50 -| Parameter | Possible Values | -| :---------: | :---------: | -| banner | show/hide | -| altitudeChart | show/hide | -| aircraftTrails | show/hide | -| map | show/hide | -| sidebar | show/hide | -| zoomOut | 0 - 5 | -| zoomIn | 0 - 5 | -| moveNorth | 0 - 5 | -| moveSouth | 0 - 5 | -| moveWest | 0 - 5 | -| moveEast | 0 - 5 | -| displayUnits | nautical/imperial/metric | -| rangeRings | show/hide | -| ringCount | integer | -| ringBaseDistance | integer | -| ringInterval | integer | +| Parameter | Possible Values | Description | +| :-------- | :-------------- | :---------- | +| banner | show/hide | Show or hide the header banner | +| altitudeChart | show/hide | Show or hide the altitude chart | +| aircraftTrails | show/hide | Show or hide all aircraft trails | +| aircraftLabels | show/hide | Show or hide flight-number labels on map icons | +| aircraftLabelDetails | show/hide | When labels are shown, also display ICAO aircraft type code on a second line | +| map | show/hide | Show or hide the map panel | +| sidebar | show/hide | Show or hide the sidebar | +| zoomOut | 0 - 5 | Zoom out by a relative amount | +| zoomIn | 0 - 5 | Zoom in by a relative amount | +| zoom | 1 - 20 | Set an absolute OpenLayers zoom level | +| moveNorth | 0 - 5 | Pan the map north | +| moveSouth | 0 - 5 | Pan the map south | +| moveWest | 0 - 5 | Pan the map west | +| moveEast | 0 - 5 | Pan the map east | +| lat | -90 to 90 | Center the map at this latitude (must be used together with `lon`) | +| lon | -180 to 180 | Center the map at this longitude (must be used together with `lat`) | +| baseLayer | layer name | Select the active base map layer by name (see layer names below) | +| displayUnits | nautical/imperial/metric | Set the display units | +| rangeRings | show/hide | Show or hide range rings | +| ringCount | integer | Number of range rings | +| ringBaseDistance | integer | Radius of the innermost ring | +| ringInterval | integer | Distance between rings | +### Base layer names for `baseLayer` +| Name | Description | +| :--- | :---------- | +| osm | OpenStreetMap | +| esri_satellite | ESRI Satellite imagery | +| esri_topo | ESRI Topographic | +| esri_street | ESRI Street | +| carto_dark_all | CARTO Dark (with labels) | +| carto_dark_nolabels | CARTO Dark (no labels) | +| carto_light_all | CARTO Light (with labels) | +| carto_light_nolabels | CARTO Light (no labels) | +| bing_aerial | Bing Aerial (requires Bing API key in config.js) | +| bing_roads | Bing Roads (requires Bing API key in config.js) | +| VFR_Sectional | FAA VFR Sectional Chart (requires FAALayers enabled) | +| IFR_AreaLow | FAA IFR Area Low (requires FAALayers enabled) | +| IFR_High | FAA IFR High (requires FAALayers enabled) | +| VFR_Terminal | FAA VFR Terminal Chart (requires FAALayers enabled) | ## New World/US/Europe Basemaps and Overlays diff --git a/public_html/index.html b/public_html/index.html index ffc37386b..c58df8129 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -168,6 +168,10 @@
Show Aircraft Labels
+
+
+
Aircraft Label Details
+
Range Rings
diff --git a/public_html/planeObject.js b/public_html/planeObject.js index 8830832d5..cf8db1cc5 100644 --- a/public_html/planeObject.js +++ b/public_html/planeObject.js @@ -451,6 +451,15 @@ PlaneObject.prototype.getAltitudeColor = function(altitude) { return [h, s, l]; } +PlaneObject.prototype.getLabelText = function() { + if (this.flight === null) return null; + var text = this.flight.trim(); + if (AircraftLabelDetails && this.icaotype) { + text += '\n' + this.icaotype.trim(); + } + return text; +}; + PlaneObject.prototype.updateIcon = function() { var scaleFactor = Math.max(0.2, Math.min(1.2, 0.15 * Math.pow(1.25, ZoomLvl))).toFixed(1); @@ -472,7 +481,7 @@ PlaneObject.prototype.updateIcon = function() { //var transparentBorderWidth = (32 / baseMarker.scale / scaleFactor).toFixed(1); var svgKey = col + '!' + outline + '!' + baseMarker.svg + '!' + add_stroke + "!" + scaleFactor; - var styleKey = opacity + '!' + rotation + '!' + AircraftLabels; + var styleKey = opacity + '!' + rotation + '!' + AircraftLabels + '!' + AircraftLabelDetails; // New icon or marker change if (this.markerStyle === null || this.markerIcon === null || this.markerSvgKey != svgKey) { @@ -492,11 +501,12 @@ PlaneObject.prototype.updateIcon = function() { this.markerIcon = icon; - if (AircraftLabels && this.flight != null) { + var labelText = AircraftLabels ? this.getLabelText() : null; + if (labelText !== null) { this.markerStyle = new ol.style.Style({ image: this.markerIcon, text: new ol.style.Text({ - text: this.flight.trim(), + text: labelText, fill: new ol.style.Fill({color: 'white'}), backgroundFill: new ol.style.Stroke({color: 'rgba(0, 47, 93, 0.8'}), textAlign: 'center', @@ -532,11 +542,12 @@ PlaneObject.prototype.updateIcon = function() { this.staticIcon.setOpacity(opacity); } - if (AircraftLabels && this.flight != null) { + var labelText = AircraftLabels ? this.getLabelText() : null; + if (labelText !== null) { this.markerStyle = new ol.style.Style({ image: this.markerIcon, text: new ol.style.Text({ - text: this.flight.trim(), + text: labelText, fill: new ol.style.Fill({color: 'white'}), backgroundFill: new ol.style.Stroke({color: 'rgba(0, 47, 93, 0.8)'}), textAlign: 'center', diff --git a/public_html/script.js b/public_html/script.js index 7217613ca..08eaf25c7 100644 --- a/public_html/script.js +++ b/public_html/script.js @@ -63,6 +63,7 @@ var altitude_slider = null; var speed_slider = null; var AircraftLabels = false; +var AircraftLabelDetails = false; // piaware vs flightfeeder var isFlightFeeder = false; @@ -400,6 +401,10 @@ function initialize() { toggleAircraftLabels(true); }); + $('#aircraft_label_details_checkbox').on('click', function() { + toggleAircraftLabelDetails(true); + }); + $('#altitude_checkbox').on('click', function() { toggleAltitudeChart(true); }); @@ -475,6 +480,7 @@ function initialize() { toggleAllPlanes(false); toggleGroupByDataType(false); toggleAircraftLabels(false); + toggleAircraftLabelDetails(false); toggleAllColumns(false); toggleADSBAircraft(false); toggleUATAircraft(false); @@ -777,7 +783,13 @@ function applyUrlQueryStrings() { 'rangeRings', 'ringCount', 'ringBaseDistance', - 'ringInterval' + 'ringInterval', + 'baseLayer', + 'zoom', + 'lat', + 'lon', + 'aircraftLabels', + 'aircraftLabelDetails' ] var needReset = false; @@ -856,6 +868,44 @@ function applyUrlQueryStrings() { if (params.get('ringInterval')) { setRingInterval(params.get('ringInterval')); } + if (params.get('aircraftLabels') === 'show') { + localStorage.setItem('showAircraftLabels', 'selected'); + toggleAircraftLabels(false); + } + if (params.get('aircraftLabels') === 'hide') { + localStorage.setItem('showAircraftLabels', 'deselected'); + toggleAircraftLabels(false); + } + if (params.get('aircraftLabelDetails') === 'show') { + localStorage.setItem('aircraftLabelDetails', 'selected'); + toggleAircraftLabelDetails(false); + } + if (params.get('aircraftLabelDetails') === 'hide') { + localStorage.setItem('aircraftLabelDetails', 'deselected'); + toggleAircraftLabelDetails(false); + } + if (params.get('baseLayer')) { + setBaseLayer(params.get('baseLayer')); + } + if (params.get('zoom')) { + var z = parseFloat(params.get('zoom')); + if (!isNaN(z) && z >= 1 && z <= 20) { + ZoomLvl = z; + localStorage['ZoomLvl'] = ZoomLvl; + OLMap.getView().setZoom(ZoomLvl); + } + } + if (params.get('lat') !== null && params.get('lon') !== null) { + var lat = parseFloat(params.get('lat')); + var lon = parseFloat(params.get('lon')); + if (!isNaN(lat) && !isNaN(lon) && lat >= -90 && lat <= 90 && lon >= -180 && lon <= 180) { + CenterLat = lat; + CenterLon = lon; + localStorage['CenterLat'] = CenterLat; + localStorage['CenterLon'] = CenterLon; + OLMap.getView().setCenter(ol.proj.fromLonLat([CenterLon, CenterLat])); + } + } } // Make a LineString with 'points'-number points @@ -2002,6 +2052,27 @@ function toggleAircraftLabels(switchToggle) { localStorage.setItem('showAircraftLabels', showAircraftLabels); } +function toggleAircraftLabelDetails(switchToggle) { + if (typeof localStorage['aircraftLabelDetails'] === 'undefined') { + localStorage.setItem('aircraftLabelDetails', 'deselected'); + } + + var aircraftLabelDetails = localStorage.getItem('aircraftLabelDetails'); + if (switchToggle === true) { + aircraftLabelDetails = (aircraftLabelDetails === 'deselected') ? 'selected' : 'deselected'; + } + + if (aircraftLabelDetails === 'deselected') { + AircraftLabelDetails = false; + $('#aircraft_label_details_checkbox').removeClass('settingsCheckboxChecked'); + } else { + AircraftLabelDetails = true; + $('#aircraft_label_details_checkbox').addClass('settingsCheckboxChecked'); + } + + localStorage.setItem('aircraftLabelDetails', aircraftLabelDetails); +} + function toggleAllPlanes(switchToggle) { if (typeof localStorage['allPlanesSelection'] === 'undefined') { localStorage.setItem('allPlanesSelection','deselected'); @@ -2574,7 +2645,14 @@ function hideBanner() { updateMapSize(); } -// Helper function to restrict the range of the inputs +function setBaseLayer(name) { + ol.control.LayerSwitcher.forEachRecursive(layerGroup, function(lyr) { + if (lyr.get('type') === 'base') { + lyr.setVisible(lyr.get('name') === name); + } + }); +} + function restrictUrlRequest(c) { let v = parseFloat(c); if (v < 0) {