From 4bfa367f643d1c644dada6776fda660df530b92b Mon Sep 17 00:00:00 2001 From: Jacek Kowalski <Jacek@jacekk.info> Date: Wed, 13 Mar 2019 23:41:33 +0000 Subject: [PATCH] Use arrays to store vehicle data and TTSS URLs --- index.js | 18 - map.js | 435 +++++++++++++++++++++--------------------------------- common.js | 11 index.html | 4 map.html | 4 5 files changed, 184 insertions(+), 288 deletions(-) diff --git a/common.js b/common.js index 12021ce..6733d46 100644 --- a/common.js +++ b/common.js @@ -1,9 +1,12 @@ "use strict"; -//var ttss_trams_base = 'http://www.ttss.krakow.pl/internetservice'; -var ttss_trams_base = 'proxy_tram.php'; -//var ttss_buses_base = 'http://91.223.13.70/internetservice'; -var ttss_buses_base = 'proxy_bus.php'; +var ttss_urls = { + t: 'proxy_tram.php', + // t: 'http://www.ttss.krakow.pl/internetservice', + b: 'proxy_bus.php', + // b: 'http://91.223.13.70/internetservice', +}; +var ttss_types = ['t', 'b']; // Special directions var special_directions = { diff --git a/index.html b/index.html index 7476401..4326199 100644 --- a/index.html +++ b/index.html @@ -135,7 +135,7 @@ </div> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" crossorigin="anonymous"></script> <script type="text/javascript" src="lang_pl.js?v4" id="lang_script"></script> - <script type="text/javascript" src="common.js?v4"></script> - <script type="text/javascript" src="index.js?v2"></script> + <script type="text/javascript" src="common.js?v7"></script> + <script type="text/javascript" src="index.js?v3"></script> </body> </html> diff --git a/index.js b/index.js index 3d5d73c..a3695c9 100644 --- a/index.js +++ b/index.js @@ -88,14 +88,9 @@ loading_start(); - var url = ttss_trams_base; + var prefix = stopId.substr(0, 1); var stop = stopId.substr(1); - var prefix = 't'; - if(stopId.startsWith('b')) { - url = ttss_buses_base; - stop = stopId.substr(1); - prefix = 'b'; - } + var url = ttss_urls[prefix]; stop_id = stopId; @@ -191,14 +186,9 @@ console.log('loadRoute(' + tripId + ')'); - var url = ttss_trams_base; + var prefix = tripId.substr(0, 1); var trip = tripId.substr(1); - var prefix = 't'; - if(tripId.startsWith('b')) { - url = ttss_buses_base; - trip = tripId.substr(1); - prefix = 'b'; - } + var url = ttss_urls[prefix]; route_id = tripId; route_vehicle_info = vehicleInfo; diff --git a/map.html b/map.html index 9a36875..7741718 100644 --- a/map.html +++ b/map.html @@ -25,7 +25,7 @@ <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"></script> <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v5.3.0/build/ol.js" integrity="sha384-iQkGyyH4ioz3m+maM3s9MX1Oq67mACa4B9Z3ovUv3Sv37LJ96fx3WnZfLoiC3Wfl" crossorigin="anonymous"></script> <script tyle="text/javascript" src="lang_pl.js?v6" id="lang_script"></script> -<script tyle="text/javascript" src="common.js?v6"></script> -<script tyle="text/javascript" src="map.js?v16"></script> +<script tyle="text/javascript" src="common.js?v7"></script> +<script tyle="text/javascript" src="map.js?v17"></script> </body> </html> diff --git a/map.js b/map.js index 8e78e93..f16133c 100644 --- a/map.js +++ b/map.js @@ -1,7 +1,7 @@ "use strict"; var ttss_refresh = 10000; // 10 seconds -var ttss_position_type = 'CORRECTED'; +var ttss_position_type = 'RAW'; var geolocation = null; var geolocation_set = 0; @@ -11,17 +11,11 @@ var geolocation_source = null; var geolocation_layer = null; -var trams_xhr = null; -var trams_timer = null; -var trams_last_update = 0; -var trams_source = null; -var trams_layer = null; - -var buses_xhr = null; -var buses_timer = null; -var buses_last_update = 0; -var buses_source = null; -var buses_layer = null; +var vehicles_xhr = {}; +var vehicles_timer = {}; +var vehicles_last_update = {}; +var vehicles_source = {}; +var vehicles_layer = {}; var vehicles_info = {}; @@ -217,10 +211,10 @@ })); } -function markStops(stops, type, routeStyle) { +function markStops(stops, ttss_type, routeStyle) { stop_selected_source.clear(); - var style = stops_layer['s'+type].getStyle().clone(); + var style = stops_layer['s' + ttss_type].getStyle().clone(); if(routeStyle) { style.getImage().setRadius(5); @@ -253,29 +247,29 @@ function unstyleSelectedFeatures() { stop_selected_source.clear(); route_source.clear(); - if(feature_clicked && (feature_clicked.getId().startsWith('t') || feature_clicked.getId().startsWith('b'))) { + if(feature_clicked && ttss_types.indexOf(feature_clicked.getId().substr(0, 1)) >= 0) { styleVehicle(feature_clicked); } } -function updateTrams() { - if(trams_timer) clearTimeout(trams_timer); - if(trams_xhr) trams_xhr.abort(); - trams_xhr = $.get( - ttss_trams_base + '/geoserviceDispatcher/services/vehicleinfo/vehicles' +function updateVehicles(prefix) { + if(vehicles_timer[prefix]) clearTimeout(vehicles_timer[prefix]); + if(vehicles_xhr[prefix]) vehicles_xhr[prefix].abort(); + vehicles_xhr[prefix] = $.get( + ttss_urls[prefix] + '/geoserviceDispatcher/services/vehicleinfo/vehicles' + '?positionType=' + ttss_position_type + '&colorType=ROUTE_BASED' - + '&lastUpdate=' + encodeURIComponent(trams_last_update) + + '&lastUpdate=' + encodeURIComponent(vehicles_last_update[prefix]) ).done(function(data) { - trams_last_update = data.lastUpdate; + vehicles_last_update[prefix] = data.lastUpdate; for(var i = 0; i < data.vehicles.length; i++) { var vehicle = data.vehicles[i]; - var vehicle_feature = trams_source.getFeatureById('t' + vehicle.id); - if(vehicle.isDeleted) { + var vehicle_feature = vehicles_source[prefix].getFeatureById(prefix + vehicle.id); + if(vehicle.isDeleted || !vehicle.latitude || !vehicle.longitude) { if(vehicle_feature) { - trams_source.removeFeature(vehicle_feature); + vehicles_source[prefix].removeFeature(vehicle_feature); if(feature_clicked && feature_clicked.getId() === vehicle_feature.getId()) { featureClicked(); } @@ -291,14 +285,14 @@ } vehicle.geometry = getGeometry(vehicle); - vehicle.vehicle_type = parseVehicle('t' + vehicle.id); + vehicle.vehicle_type = parseVehicle(prefix + vehicle.id); if(!vehicle_feature) { vehicle_feature = new ol.Feature(vehicle); - vehicle_feature.setId('t' + vehicle.id); + vehicle_feature.setId(prefix + vehicle.id); styleVehicle(vehicle_feature); - trams_source.addFeature(vehicle_feature); + vehicles_source[prefix].addFeature(vehicle_feature); } else { vehicle_feature.setProperties(vehicle); vehicle_feature.getStyle().getImage().setRotation(Math.PI * parseFloat(vehicle.heading ? vehicle.heading : 0) / 180.0); @@ -306,68 +300,12 @@ } } - trams_timer = setTimeout(function() { - updateTrams(); + vehicles_timer[prefix] = setTimeout(function() { + updateVehicles(prefix); }, ttss_refresh); }).fail(fail_ajax); - return trams_xhr; -} - -function updateBuses() { - if(buses_timer) clearTimeout(buses_timer); - if(buses_xhr) buses_xhr.abort(); - - buses_xhr = $.get( - ttss_buses_base + '/geoserviceDispatcher/services/vehicleinfo/vehicles' - + '?positionType=RAW' - + '&colorType=ROUTE_BASED' - + '&lastUpdate=' + encodeURIComponent(buses_last_update) - ).done(function(data) { - buses_last_update = data.lastUpdate; - - for(var i = 0; i < data.vehicles.length; i++) { - var vehicle = data.vehicles[i]; - - var vehicle_feature = buses_source.getFeatureById('b' + vehicle.id); - if(vehicle.isDeleted || !vehicle.latitude || !vehicle.longitude) { - if(vehicle_feature) { - buses_source.removeFeature(vehicle_feature); - if(feature_clicked && feature_clicked.getId() === vehicle_feature.getId()) { - featureClicked(); - } - } - continue; - } - - var vehicle_name_space = vehicle.name.indexOf(' '); - vehicle.line = vehicle.name.substr(0, vehicle_name_space); - vehicle.direction = vehicle.name.substr(vehicle_name_space+1); - if(special_directions[vehicle.direction]) { - vehicle.line = special_directions[vehicle.direction]; - } - - vehicle.geometry = getGeometry(vehicle); - vehicle.vehicle_type = parseVehicle('b' + vehicle.id); - - if(!vehicle_feature) { - vehicle_feature = new ol.Feature(vehicle); - vehicle_feature.setId('b' + vehicle.id); - - styleVehicle(vehicle_feature); - buses_source.addFeature(vehicle_feature); - } else { - vehicle_feature.setProperties(vehicle); - vehicle_feature.getStyle().getImage().setRotation(Math.PI * parseFloat(vehicle.heading) / 180.0); - } - } - - buses_timer = setTimeout(function() { - updateBuses(); - }, ttss_refresh); - }).fail(fail_ajax); - - return buses_xhr; + return vehicles_xhr[prefix]; } function updateStopSource(stops, prefix) { @@ -394,27 +332,19 @@ } } -function updateStops(base, suffix) { +function updateStops(stop_type, ttss_type) { + var methods = { + 's': 'stops', + 'p': 'stopPoints', + }; return $.get( - base + '/geoserviceDispatcher/services/stopinfo/stops' + ttss_urls[ttss_type] + '/geoserviceDispatcher/services/stopinfo/' + methods[stop_type] + '?left=-648000000' + '&bottom=-324000000' + '&right=648000000' + '&top=324000000' ).done(function(data) { - updateStopSource(data.stops, 's' + suffix); - }).fail(fail_ajax); -} - -function updateStopPoints(base, suffix) { - return $.get( - base + '/geoserviceDispatcher/services/stopinfo/stopPoints' - + '?left=-648000000' - + '&bottom=-324000000' - + '&right=648000000' - + '&top=324000000' - ).done(function(data) { - updateStopSource(data.stopPoints, 'p' + suffix); + updateStopSource(data[methods[stop_type]], stop_type + ttss_type); }).fail(fail_ajax); } @@ -422,16 +352,11 @@ if(path_xhr) path_xhr.abort(); var featureId = feature.getId(); - var vehicleId = featureId.substr(1); - - var url = ttss_trams_base; - if(featureId.startsWith('b')) { - url = ttss_buses_base; - } + var ttss_type = featureId.substr(0, 1); path_xhr = $.get( - url + '/geoserviceDispatcher/services/pathinfo/vehicle' - + '?id=' + encodeURIComponent(vehicleId) + ttss_urls[ttss_type] + '/geoserviceDispatcher/services/pathinfo/vehicle' + + '?id=' + encodeURIComponent(featureId.substr(1)) ).done(function(data) { if(!data || !data.paths || !data.paths[0] || !data.paths[0].wayPoints) return; @@ -457,14 +382,10 @@ if(feature_timer) clearTimeout(feature_timer); var featureId = feature.getId(); - - var url = ttss_trams_base; - if(featureId.startsWith('b')) { - url = ttss_buses_base; - } + var ttss_type = featureId.substr(0, 1); feature_xhr = $.get( - url + '/services/tripInfo/tripPassages' + ttss_urls[ttss_type] + '/services/tripInfo/tripPassages' + '?tripId=' + encodeURIComponent(feature.get('tripId')) + '&mode=departure' ).done(function(data) { @@ -490,7 +411,7 @@ addCellWithText(tr, data.actual[i].actualTime || data.actual[i].plannedTime); addCellWithText(tr, data.actual[i].stop_seq_num + '. ' + data.actual[i].stop.name); - stopsToMark.push('s' + featureId.substr(0,1) + data.actual[i].stop.id); + stopsToMark.push('s' + ttss_type + data.actual[i].stop.id); if(data.actual[i].status == 'STOPPING') { tr.className = 'success'; @@ -498,7 +419,7 @@ table.appendChild(tr); } - markStops(stopsToMark, featureId.substr(0,1), true); + markStops(stopsToMark, ttss_type, true); feature_timer = setTimeout(function() { vehicleTable(feature, table); }, ttss_refresh); }).fail(fail_ajax_popup); @@ -508,13 +429,10 @@ if(feature_xhr) feature_xhr.abort(); if(feature_timer) clearTimeout(feature_timer); - var url = ttss_trams_base; - if(featureId.substr(1,1) == 'b') { - url = ttss_buses_base; - } + var ttss_type = featureId.substr(1, 1); feature_xhr = $.get( - url + '/services/passageInfo/stopPassages/' + stopType + ttss_urls[ttss_type] + '/services/passageInfo/stopPassages/' + stopType + '?' + stopType + '=' + encodeURIComponent(stopId) + '&mode=departure' ).done(function(data) { @@ -576,7 +494,7 @@ var div = document.createElement('div'); - var type; + var typeName; var name = feature.get('name'); var additional; var table = document.createElement('table'); @@ -587,43 +505,47 @@ var tabular_data = true; - switch(feature.getId().substr(0, 1)) { - case 'l': - tabular_data = false; - type = ''; - name = lang.type_location; - break; - case 't': - case 'b': - type = lang.type_tram; - if(feature.getId().startsWith('b')) { - type = lang.type_bus; - } - - var span = displayVehicle(feature.get('vehicle_type')); - - additional = document.createElement('p'); - if(span.title) { - setText(additional, span.title); - } else { - setText(additional, feature.getId()); - } - additional.insertBefore(span, additional.firstChild); - - addElementWithText(thead, 'th', lang.header_time); - addElementWithText(thead, 'th', lang.header_stop); - - vehicleTable(feature, tbody); - vehiclePath(feature); - - styleVehicle(feature, true); - break; - case 's': - type = lang.type_stop_tram; + var type = feature.getId().substr(0, 1); + // Location + if(type == 'l') { + tabular_data = false; + typeName = ''; + name = lang.type_location; + } + // Vehicle + else if(ttss_types.indexOf(type) >= 0) { + typeName = lang.type_bus; + if(type == 't') { + typeName = lang.type_tram; + } + + var span = displayVehicle(feature.get('vehicle_type')); + + additional = document.createElement('p'); + if(span.title) { + setText(additional, span.title); + } else { + setText(additional, feature.getId()); + } + additional.insertBefore(span, additional.firstChild); + + addElementWithText(thead, 'th', lang.header_time); + addElementWithText(thead, 'th', lang.header_stop); + + vehicleTable(feature, tbody); + vehiclePath(feature); + + styleVehicle(feature, true); + } + // Stop or stop point + else if(['s', 'p'].indexOf(type) >= 0) { + if(type == 's') { + typeName = lang.type_stop_tram; var second_type = lang.departures_for_buses; var mapping = stops_mapping['sb']; + if(feature.getId().startsWith('sb')) { - type = lang.type_stop_bus; + typeName = lang.type_stop_bus; second_type = lang.departures_for_trams; mapping = stops_mapping['st']; } @@ -638,19 +560,11 @@ } ); } + } else { + typeName = lang.type_stoppoint_tram; - addElementWithText(thead, 'th', lang.header_line); - addElementWithText(thead, 'th', lang.header_direction); - addElementWithText(thead, 'th', lang.header_time); - addElementWithText(thead, 'th', lang.header_delay); - - stopTable('stop', feature.get('shortName'), tbody, feature.getId()); - markStops([feature], feature.getId().substr(1,1)); - break; - case 'p': - type = lang.type_stoppoint_tram; if(feature.getId().startsWith('pb')) { - type = lang.type_stoppoint_bus; + typeName = lang.type_stoppoint_bus; } additional = document.createElement('p'); @@ -662,22 +576,25 @@ featureClicked(mapping[feature.get('shortName')]); } ); - - addElementWithText(thead, 'th', lang.header_line); - addElementWithText(thead, 'th', lang.header_direction); - addElementWithText(thead, 'th', lang.header_time); - addElementWithText(thead, 'th', lang.header_delay); - - stopTable('stopPoint', feature.get('stopPoint'), tbody, feature.getId()); - markStops([feature], feature.getId().substr(1,1)); - break; + } + + addElementWithText(thead, 'th', lang.header_line); + addElementWithText(thead, 'th', lang.header_direction); + addElementWithText(thead, 'th', lang.header_time); + addElementWithText(thead, 'th', lang.header_delay); + + stopTable('stop', feature.get('shortName'), tbody, feature.getId()); + markStops([feature], feature.getId().substr(1,1)); + } else { + panel.close(); + return; } var loader = addElementWithText(tbody, 'td', lang.loading); loader.className = 'active'; loader.colSpan = thead.childNodes.length; - addParaWithText(div, type).className = 'type'; + addParaWithText(div, typeName).className = 'type'; addParaWithText(div, name).className = 'name'; if(additional) { @@ -737,37 +654,34 @@ featureClicked(feature); }}(feature)); - var type = ''; - switch(feature.getId().substr(0, 1)) { - case 'l': - type = ''; - name = lang.type_location; - break; - case 't': - case 'b': - type = lang.type_tram; - if(feature.getId().startsWith('b')) { - type = lang.type_bus; - } - if(feature.get('vehicle_type').num) { - type += ' ' + feature.get('vehicle_type').num; - } - break; - case 's': - type = lang.type_stop_tram; - if(feature.getId().startsWith('sb')) { - type = lang.type_stop_bus; - } - break; - case 'p': - type = lang.type_stoppoint_tram; - if(feature.getId().startsWith('pb')) { - type = lang.type_stoppoint_bus; - } - break; + var type = feature.getId().substr(0, 1); + var typeName = ''; + if(type == 'l') { + typeName = ''; + name = lang.type_location; + } else if(ttss_types.indexOf(type) >= 0) { + typeName = lang.type_bus; + if(type == 't') { + typeName = lang.type_tram; + } + if(feature.get('vehicle_type').num) { + typeName += ' ' + feature.get('vehicle_type').num; + } + } else if(type == 's') { + typeName = lang.type_stop_tram; + if(feature.getId().startsWith('sb')) { + typeName = lang.type_stop_bus; + } + } else if (type == 'p') { + typeName = lang.type_stoppoint_tram; + if(feature.getId().startsWith('pb')) { + typeName = lang.type_stoppoint_bus; + } + } else { + continue; } - addElementWithText(a, 'span', type).className = 'small'; + addElementWithText(a, 'span', typeName).className = 'small'; a.appendChild(document.createTextNode(' ')); addElementWithText(a, 'span', feature.get('name')); @@ -786,12 +700,11 @@ feature = returnClosest(point, feature, stops_source[type].getClosestFeatureToCoordinate(point)); } }); - if(trams_layer.getVisible()) { - feature = returnClosest(point, feature, trams_source.getClosestFeatureToCoordinate(point)); - } - if(buses_layer.getVisible()) { - feature = returnClosest(point, feature, buses_source.getClosestFeatureToCoordinate(point)); - } + ttss_types.forEach(function(type) { + if(vehicles_layer[type].getVisible()) { + feature = returnClosest(point, feature, vehicles_source[type].getClosestFeatureToCoordinate(point)); + } + }); if(getDistance(point, feature) > map.getView().getResolution() * 20) { feature = null; @@ -850,16 +763,10 @@ stopId = window.location.hash.substr(2,1) + 't' + window.location.hash.substr(3); } else if(window.location.hash.match(/^#![sp][tb]-?[0-9]+$/)) { stopId = window.location.hash.substr(2); - } else if(window.location.hash == '#!RAW') { - ttss_position_type = 'RAW'; } if(vehicleId) { - if(vehicleId.startsWith('b')) { - feature = buses_source.getFeatureById(vehicleId); - } else { - feature = trams_source.getFeatureById(vehicleId); - } + feature = vehicles_source[vehicleId.substr(0, 1)].getFeatureById(vehicleId); } else if(stopId) { feature = stops_source[stopId.substr(0,2)].getFeatureById(stopId); } @@ -900,6 +807,16 @@ panel = new Panel(document.getElementById('panel')); + route_source = new ol.source.Vector({ + features: [], + }); + route_layer = new ol.layer.Vector({ + source: route_source, + style: new ol.style.Style({ + stroke: new ol.style.Stroke({ color: [255, 153, 0, .8], width: 5 }) + }), + }); + stops_type.forEach(function(type) { stops_source[type] = new ol.source.Vector({ features: [], @@ -920,28 +837,14 @@ visible: false, }); - trams_source = new ol.source.Vector({ - features: [], - }); - trams_layer = new ol.layer.Vector({ - source: trams_source, - }); - - buses_source = new ol.source.Vector({ - features: [], - }); - buses_layer = new ol.layer.Vector({ - source: buses_source, - }); - - route_source = new ol.source.Vector({ - features: [], - }); - route_layer = new ol.layer.Vector({ - source: route_source, - style: new ol.style.Style({ - stroke: new ol.style.Stroke({ color: [255, 153, 0, .8], width: 5 }) - }), + ttss_types.forEach(function(type) { + vehicles_source[type] = new ol.source.Vector({ + features: [], + }); + vehicles_layer[type] = new ol.layer.Vector({ + source: vehicles_source[type], + }); + vehicles_last_update[type] = 0; }); ol.style.IconImageCache.shared.setSize(512); @@ -995,22 +898,23 @@ }); geolocation_button.addEventListener('click', trackingToggle); + var layers = [ + new ol.layer.Tile({ + source: new ol.source.OSM(), + }), + route_layer, + geolocation_layer, + ]; + stops_type.forEach(function(type) { + layers.push(stops_layer[type]); + }); + layers.push(stop_selected_layer); + ttss_types.forEach(function(type) { + layers.push(vehicles_layer[type]); + }); map = new ol.Map({ target: 'map', - layers: [ - new ol.layer.Tile({ - source: new ol.source.OSM(), - }), - route_layer, - geolocation_layer, - stops_layer['st'], - stops_layer['sb'], - stops_layer['pt'], - stops_layer['pb'], - stop_selected_layer, - buses_layer, - trams_layer, - ], + layers: layers, view: new ol.View({ center: ol.proj.fromLonLat([19.94, 50.06]), zoom: 14, @@ -1060,17 +964,16 @@ map.getView().on('change:resolution', change_resolution); change_resolution(); - $.when( + var future_requests = [ updateVehicleInfo(), - updateTrams(), - updateBuses(), - updateStops(ttss_trams_base, 't'), - updateStops(ttss_buses_base, 'b'), - updateStopPoints(ttss_trams_base, 't'), - updateStopPoints(ttss_buses_base, 'b'), - ).done(function() { - hash(); + ]; + ttss_types.forEach(function(type) { + future_requests.push(updateVehicles(type)); }); + stops_type.forEach(function(type) { + future_requests.push(updateStops(type.substr(0,1), type.substr(1,1))); + }); + $.when(future_requests).done(hash); window.addEventListener('hashchange', hash); -- Gitblit v1.9.1