forked from MapComplete/MapComplete
		
	UI(basemap): add language support: labels now show in the selected language
This commit is contained in:
		
							parent
							
								
									5dc6d82cd0
								
							
						
					
					
						commit
						2a603852a6
					
				
					 7 changed files with 5458 additions and 45 deletions
				
			
		|  | @ -4,9 +4,12 @@ import { RasterLayerPolygon } from "../../Models/RasterLayers" | |||
| import { RasterLayerProperties } from "../../Models/RasterLayerProperties" | ||||
| import { Utils } from "../../Utils" | ||||
| import { VectorSourceSpecification } from "@maplibre/maplibre-gl-style-spec" | ||||
| import { ProtomapsLanguageSupport } from "./ProtomapsLanguageSupport" | ||||
| 
 | ||||
| class SingleBackgroundHandler { | ||||
|     // Value between 0 and 1.0
 | ||||
|     /** | ||||
|      * Current opacity of this layer, Value between 0 and 1.0 | ||||
|      * */ | ||||
|     public opacity = new UIEventSource<number>(0.0) | ||||
|     private _map: Store<MLMap> | ||||
|     private _background: UIEventSource<RasterLayerPolygon | undefined> | ||||
|  | @ -18,15 +21,18 @@ class SingleBackgroundHandler { | |||
|      */ | ||||
|     public static readonly DEACTIVATE_AFTER = 60 | ||||
|     private fadeStep = 0.1 | ||||
|     private _languageSupport: ProtomapsLanguageSupport | ||||
| 
 | ||||
|     constructor( | ||||
|         map: Store<MLMap>, | ||||
|         targetLayer: RasterLayerPolygon, | ||||
|         background: UIEventSource<RasterLayerPolygon | undefined> | ||||
|         background: UIEventSource<RasterLayerPolygon | undefined>, | ||||
|         languageSupport: ProtomapsLanguageSupport | ||||
|     ) { | ||||
|         this._targetLayer = targetLayer | ||||
|         this._map = map | ||||
|         this._background = background | ||||
|         this._languageSupport = languageSupport | ||||
| 
 | ||||
|         background.addCallback(async () => { | ||||
|             await this.update() | ||||
|  | @ -64,7 +70,7 @@ class SingleBackgroundHandler { | |||
|                 map.removeLayer(<string>this._targetLayer.properties.id) | ||||
|             } | ||||
|         } catch (e) { | ||||
|             console.warn("Could not (try to) remove the raster layer", e) | ||||
|             // Probably already removed
 | ||||
|         } | ||||
|     } | ||||
| 
 | ||||
|  | @ -95,7 +101,7 @@ class SingleBackgroundHandler { | |||
|     private async enable() { | ||||
|         let ttl = 15 | ||||
|         await this.awaitStyleIsLoaded() | ||||
|         while (!this.tryEnable() && ttl > 0) { | ||||
|         while (this._background.data.properties.id === this._targetLayer.properties.id && !this.tryEnable() && ttl > 0) { | ||||
|             ttl-- | ||||
|             await Utils.waitFor(250) | ||||
|         } | ||||
|  | @ -137,6 +143,11 @@ class SingleBackgroundHandler { | |||
|             if (background.type === "vector") { | ||||
|                 const styleToSet = background.style ?? background.url | ||||
|                 map.setStyle(styleToSet) | ||||
|                 this.awaitStyleIsLoaded().then(() => { | ||||
|                     console.log("UPDATING") | ||||
|                     this._languageSupport.update() | ||||
|                 }) | ||||
| 
 | ||||
|             } else { | ||||
|                 map.addLayer( | ||||
|                     { | ||||
|  | @ -150,6 +161,9 @@ class SingleBackgroundHandler { | |||
|                     addLayerBeforeId | ||||
|                 ) | ||||
|                 this.opacity.addCallbackAndRun((o) => { | ||||
|                     if (map.getStyle() === undefined || map.getLayer(background.id) === undefined) { | ||||
|                         return true | ||||
|                     } | ||||
|                     try { | ||||
|                         map.setPaintProperty(background.id, "raster-opacity", o) | ||||
|                     } catch (e) { | ||||
|  | @ -166,27 +180,43 @@ class SingleBackgroundHandler { | |||
|         Stores.Chronic( | ||||
|             8, | ||||
|             () => this.opacity.data > 0 && this._deactivationTime !== undefined | ||||
|         ).addCallback(() => this.opacity.setData(Math.max(0, this.opacity.data - this.fadeStep))) | ||||
|         ).addCallback(() => { | ||||
|             try { | ||||
|                 this.opacity.setData(Math.max(0, this.opacity.data - this.fadeStep)) | ||||
|             } catch (e) { | ||||
|                 // The layer probably got pruned; we just unregister
 | ||||
|                 return true | ||||
|             } | ||||
|         }) | ||||
|     } | ||||
| 
 | ||||
|     private fadeIn() { | ||||
|         Stores.Chronic( | ||||
|             8, | ||||
|             () => this.opacity.data < 1.0 && this._deactivationTime === undefined | ||||
|         ).addCallback(() => this.opacity.setData(Math.min(1.0, this.opacity.data + this.fadeStep))) | ||||
|         ).addCallback(() => { | ||||
|             try { | ||||
|                 this.opacity.setData(Math.min(1.0, this.opacity.data + this.fadeStep)) | ||||
|             } catch (e) { | ||||
|                 // The layer probably got pruned; we just unregister
 | ||||
|                 return true | ||||
|             } | ||||
|         }) | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| export default class RasterLayerHandler { | ||||
|     private _singleLayerHandlers: Record<string, SingleBackgroundHandler> = {} | ||||
|     private _languageSupport: ProtomapsLanguageSupport | ||||
| 
 | ||||
|     constructor(map: Store<MLMap>, background: UIEventSource<RasterLayerPolygon | undefined>) { | ||||
|         background.addCallbackAndRunD((l) => { | ||||
|             const key = l.properties.id | ||||
|             if (!this._singleLayerHandlers[key]) { | ||||
|                 this._singleLayerHandlers[key] = new SingleBackgroundHandler(map, l, background) | ||||
|                 this._singleLayerHandlers[key] = new SingleBackgroundHandler(map, l, background, this._languageSupport) | ||||
|             } | ||||
|         }) | ||||
|         this._languageSupport = new ProtomapsLanguageSupport(map) | ||||
|     } | ||||
| 
 | ||||
|     public static prepareSource( | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue