@stadiamaps/ferrostar-webcomponents 0.1.4 → 0.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
margin: 0 15px;
|
|
88
88
|
white-space: nowrap;
|
|
89
89
|
}
|
|
90
|
-
`],V([c()],x.prototype,"tripState",2),x=V([v("arrival-view")],x);class H{constructor(){this.simulationState=null,this.lastLocation=null,this.lastHeading=null,this.warpFactor=1,this.updateCallback=()=>{}}setSimulatedRoute(t){this.simulationState=m.locationSimulationFromRoute(t,10),this.start()}async start(){for(;this.simulationState!==null;){await new Promise(a=>setTimeout(a,1/this.warpFactor*1e3));const t=this.simulationState,e=m.advanceLocationSimulation(t);if(t===e)return;this.simulationState=e,this.lastLocation=e.current_location,this.updateCallback&&this.updateCallback()}}stop(){this.simulationState=null}}class R{constructor(){this.geolocationWatchId=null,this.lastLocation=null,this.lastHeading=null,this.updateCallback=()=>{}}start(){if(navigator.geolocation&&!this.geolocationWatchId){const t={enableHighAccuracy:!0};this.geolocationWatchId=navigator.geolocation.watchPosition(e=>{this.lastLocation={coordinates:{lat:e.coords.latitude,lng:e.coords.longitude},horizontalAccuracy:e.coords.accuracy,courseOverGround:{degrees:Math.floor(e.coords.heading||0)},timestamp:e.timestamp,speed:
|
|
90
|
+
`],V([c()],x.prototype,"tripState",2),x=V([v("arrival-view")],x);class H{constructor(){this.simulationState=null,this.lastLocation=null,this.lastHeading=null,this.warpFactor=1,this.updateCallback=()=>{}}setSimulatedRoute(t){this.simulationState=m.locationSimulationFromRoute(t,10),this.start()}async start(){for(;this.simulationState!==null;){await new Promise(a=>setTimeout(a,1/this.warpFactor*1e3));const t=this.simulationState,e=m.advanceLocationSimulation(t);if(t===e)return;this.simulationState=e,this.lastLocation=e.current_location,this.updateCallback&&this.updateCallback()}}stop(){this.simulationState=null}}class R{constructor(){this.geolocationWatchId=null,this.lastLocation=null,this.lastHeading=null,this.updateCallback=()=>{}}start(){if(navigator.geolocation&&!this.geolocationWatchId){const t={enableHighAccuracy:!0};this.geolocationWatchId=navigator.geolocation.watchPosition(e=>{let a=null;e.coords.speed&&(a={value:e.coords.speed}),this.lastLocation={coordinates:{lat:e.coords.latitude,lng:e.coords.longitude},horizontalAccuracy:e.coords.accuracy,courseOverGround:{degrees:Math.floor(e.coords.heading||0)},timestamp:e.timestamp,speed:a},this.updateCallback&&this.updateCallback()},e=>alert(e.message),t)}}stop(){this.lastLocation=null,navigator.geolocation&&this.geolocationWatchId&&(navigator.geolocation.clearWatch(this.geolocationWatchId),this.geolocationWatchId=null)}}var W1=Object.defineProperty,K1=Object.getOwnPropertyDescriptor,g=(l,t,e,a)=>{for(var i=a>1?void 0:a?K1(t,e):t,o=l.length-1,r;o>=0;o--)(r=l[o])&&(i=(a?r(t,e,i):r(i))||i);return a&&i&&W1(t,e,i),i};s.FerrostarMap=class extends n.LitElement{constructor(){super(),this.valhallaEndpointUrl="",this.styleUrl="",this.profile="",this.center=null,this.pitch=60,this.zoom=6,this.httpClient=fetch,this.costingOptions={},this._tripState=null,this.useIntegratedSearchBox=!1,this.useVoiceGuidance=!1,this.routeAdapter=null,this.map=null,this.searchBox=null,this.navigationController=null,this.currentLocationMapMarker=null,this.lastSpokenInstructionText=null,this.httpClient===fetch&&(this.httpClient=this.httpClient.bind(window))}updated(t){t.has("locationProvider")&&this.locationProvider&&(this.locationProvider.updateCallback=this.onLocationUpdated.bind(this)),this.map&&(t.has("styleUrl")&&this.map.setStyle(this.styleUrl),t.has("center")&&(t.get("center")===null&&this.center!==null?this.map.jumpTo({center:this.center}):this.center!==null&&this.map.flyTo({center:this.center})),t.has("pitch")&&this.map.setPitch(this.pitch),t.has("zoom")&&this.map.setZoom(this.zoom))}firstUpdated(){this.map=new A.Map({container:this.shadowRoot.getElementById("map"),style:this.styleUrl?this.styleUrl:"https://demotiles.maplibre.org/style.json",center:this.center??[0,0],pitch:this.pitch,bearing:0,zoom:this.zoom}),this.useIntegratedSearchBox&&(this.searchBox=new j.MapLibreSearchControl({onResultSelected:async t=>{await this.startNavigationFromSearch(t.geometry.coordinates)}}),this.map.addControl(this.searchBox,"top-left"))}async getRoutes(t,e){this.routeAdapter=new m.RouteAdapter(this.valhallaEndpointUrl,this.profile,JSON.stringify(this.costingOptions));const a=this.routeAdapter.generateRequest(t,e).get("body"),i=await this.httpClient(this.valhallaEndpointUrl,{method:"POST",body:new Uint8Array(a).buffer}),o=new Uint8Array(await i.arrayBuffer());return this.routeAdapter.parseResponse(o)}startNavigation(t,e){this.useIntegratedSearchBox&&this.map?.removeControl(this.searchBox),this.navigationController=new m.NavigationController(t,e),this.locationProvider.updateCallback=this.onLocationUpdated.bind(this);const a=this.locationProvider.lastLocation?this.locationProvider.lastLocation:{coordinates:t.geometry[0],horizontalAccuracy:0,courseOverGround:null,timestamp:Date.now(),speed:null};this._tripState=this.navigationController.getInitialState(a),this.clearMap(),this.map?.addSource("route",{type:"geojson",data:{type:"Feature",properties:{},geometry:{type:"LineString",coordinates:t.geometry.map(i=>[i.lng,i.lat])}}}),this.map?.addLayer({id:"route",type:"line",source:"route",layout:{"line-join":"round","line-cap":"round"},paint:{"line-color":"#3700B3","line-width":8}}),this.map?.setCenter(t.geometry[0]),this.currentLocationMapMarker=new A.Marker().setLngLat(t.geometry[0]).addTo(this.map)}async startNavigationFromSearch(t){const e=[{coordinate:{lat:t[1],lng:t[0]},kind:"Break"}];for((!this.locationProvider||this.locationProvider instanceof H)&&(this.locationProvider=new R),this.locationProvider.start();!this.locationProvider.lastLocation;)await new Promise(r=>setTimeout(r,100));const i=(await this.getRoutes(this.locationProvider.lastLocation,e))[0],o={stepAdvance:{RelativeLineStringDistance:{minimumHorizontalAccuracy:25,automaticAdvanceDistance:10}},routeDeviationTracking:{StaticThreshold:{minimumHorizontalAccuracy:25,maxAcceptableDeviation:10}}};this.startNavigation(i,o)}async stopNavigation(){this.clearMap(),this.routeAdapter?.free(),this.routeAdapter=null,this.navigationController?.free(),this.navigationController=null,this._tripState=null,this.locationProvider&&(this.locationProvider.updateCallback=null),this.useIntegratedSearchBox&&this.map?.addControl(this.searchBox,"top-left")}onLocationUpdated(){this.navigationController&&(this._tripState=this.navigationController.updateUserLocation(this.locationProvider.lastLocation,this._tripState),this.currentLocationMapMarker?.setLngLat(this.locationProvider.lastLocation.coordinates),this.map?.easeTo({center:this.locationProvider.lastLocation.coordinates,bearing:this.locationProvider.lastLocation.courseOverGround.degrees||0}),this.useVoiceGuidance&&this._tripState.Navigating?.spokenInstruction&&this._tripState.Navigating?.spokenInstruction.text!==this.lastSpokenInstructionText&&(this.lastSpokenInstructionText=this._tripState.Navigating?.spokenInstruction.text,window.speechSynthesis.cancel(),window.speechSynthesis.speak(new SpeechSynthesisUtterance(this._tripState.Navigating?.spokenInstruction.text))))}clearMap(){this.map?.getLayer("route")&&this.map?.removeLayer("route"),this.map?.getSource("route")&&this.map?.removeSource("route"),this.currentLocationMapMarker?.remove()}render(){return n.html`
|
|
91
91
|
<div id="map">
|
|
92
92
|
<instructions-view .tripState=${this._tripState}></instructions-view>
|
|
93
93
|
<div id="bottom-component">
|