forked from MapComplete/MapComplete
		
	Intermediate refactoring
This commit is contained in:
		
							parent
							
								
									069cddf034
								
							
						
					
					
						commit
						7b80e945bb
					
				
					 16 changed files with 43 additions and 44 deletions
				
			
		|  | @ -88,7 +88,6 @@ export class LayerDefinition { | ||||||
|         } |         } | ||||||
|     } = undefined) { |     } = undefined) { | ||||||
|         if (options === undefined) { |         if (options === undefined) { | ||||||
|             console.log("No options!") |  | ||||||
|             return; |             return; | ||||||
|         } |         } | ||||||
|         this.name = options.name; |         this.name = options.name; | ||||||
|  | @ -100,7 +99,6 @@ export class LayerDefinition { | ||||||
|         this.title = options.title; |         this.title = options.title; | ||||||
|         this.elementsToShow = options.elementsToShow; |         this.elementsToShow = options.elementsToShow; | ||||||
|         this.style = options.style; |         this.style = options.style; | ||||||
|         console.log(this) |  | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     asLayer(basemap: Basemap, allElements: ElementStorage, changes: Changes, userDetails: UIEventSource<UserDetails>, selectedElement: UIEventSource<any>, |     asLayer(basemap: Basemap, allElements: ElementStorage, changes: Changes, userDetails: UIEventSource<UserDetails>, selectedElement: UIEventSource<any>, | ||||||
|  |  | ||||||
|  | @ -1,10 +1,8 @@ | ||||||
| import {LayerDefinition} from "../LayerDefinition"; | import {LayerDefinition} from "../LayerDefinition"; | ||||||
| import L from "leaflet"; | import L from "leaflet"; | ||||||
| import {And, Or, Regex, Tag} from "../../Logic/TagsFilter"; | import {And, Or, Tag} from "../../Logic/TagsFilter"; | ||||||
| import {QuestionDefinition} from "../../Logic/Question"; |  | ||||||
| import {TagRenderingOptions} from "../TagRendering"; | import {TagRenderingOptions} from "../TagRendering"; | ||||||
| import {NameInline} from "../Questions/NameInline"; | import {NameInline} from "../Questions/NameInline"; | ||||||
| import {NameQuestion} from "../Questions/NameQuestion"; |  | ||||||
| import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload"; | import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload"; | ||||||
| 
 | 
 | ||||||
| export class Bookcases extends LayerDefinition { | export class Bookcases extends LayerDefinition { | ||||||
|  |  | ||||||
|  | @ -294,7 +294,19 @@ class TagRendering extends UIElement implements TagDependantUIElement { | ||||||
|         const elements = []; |         const elements = []; | ||||||
| 
 | 
 | ||||||
|         if (options.mappings !== undefined) { |         if (options.mappings !== undefined) { | ||||||
|  |              | ||||||
|  |             const previousTexts= []; | ||||||
|             for (const mapping of options.mappings) { |             for (const mapping of options.mappings) { | ||||||
|  |                 console.log(mapping); | ||||||
|  |                 if(mapping.k === null){ | ||||||
|  |                     continue; | ||||||
|  |                 } | ||||||
|  |                 if(previousTexts.indexOf(mapping.txt) >= 0){ | ||||||
|  |                     continue; | ||||||
|  |                 } | ||||||
|  |                 previousTexts.push(mapping.txt); | ||||||
|  |                  | ||||||
|  |                 console.log("PUshed") | ||||||
|                 elements.push(this.InputElementForMapping(mapping)); |                 elements.push(this.InputElementForMapping(mapping)); | ||||||
|             } |             } | ||||||
|         } |         } | ||||||
|  | @ -350,6 +362,7 @@ class TagRendering extends UIElement implements TagDependantUIElement { | ||||||
|                 } else if (tag instanceof Tag) { |                 } else if (tag instanceof Tag) { | ||||||
|                     return tag.value |                     return tag.value | ||||||
|                 } |                 } | ||||||
|  |                 console.log("Could not decode tag to string", tag) | ||||||
|                 return undefined; |                 return undefined; | ||||||
|             } |             } | ||||||
| 
 | 
 | ||||||
|  | @ -447,7 +460,7 @@ class TagRendering extends UIElement implements TagDependantUIElement { | ||||||
| 
 | 
 | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
| 
 | 
 | ||||||
|         if (this.IsQuestioning() || this._editMode.data) { |         if (this.IsQuestioning() || this._editMode.data) { | ||||||
|             // Not yet known or questioning, we have to ask a question
 |             // Not yet known or questioning, we have to ask a question
 | ||||||
|  | @ -492,5 +505,10 @@ class TagRendering extends UIElement implements TagDependantUIElement { | ||||||
|         return TagUtils.ApplyTemplate(template, tags); |         return TagUtils.ApplyTemplate(template, tags); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|  |      | ||||||
|  |     InnerUpdate(htmlElement: HTMLElement) { | ||||||
|  |         super.InnerUpdate(htmlElement); | ||||||
|  |         this._questionElement.Update(); // Another manual update for them
 | ||||||
|  |     } | ||||||
| 
 | 
 | ||||||
| } | } | ||||||
|  | @ -60,7 +60,6 @@ export class Imgur { | ||||||
|             } |             } | ||||||
| 
 | 
 | ||||||
|              |              | ||||||
|             console.log(data); |  | ||||||
|             const licenseInfo = new LicenseInfo(); |             const licenseInfo = new LicenseInfo(); | ||||||
|              |              | ||||||
|             licenseInfo.licenseShortName = data.license; |             licenseInfo.licenseShortName = data.license; | ||||||
|  |  | ||||||
|  | @ -57,8 +57,7 @@ export class LayerUpdater { | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     private handleFail(reason: any) { |     private handleFail(reason: any) { | ||||||
|         console.log("QUERY FAILED", reason); |         console.log("QUERY FAILED (retrying in 1 sec)", reason); | ||||||
|         console.log("Retrying in 1s") |  | ||||||
|         this.previousBounds = undefined; |         this.previousBounds = undefined; | ||||||
|         const self = this; |         const self = this; | ||||||
|         window.setTimeout( |         window.setTimeout( | ||||||
|  | @ -73,7 +72,6 @@ export class LayerUpdater { | ||||||
|         } |         } | ||||||
|         console.log("Zoom level: ",this._map.map.getZoom(), "Least needed zoom:", this._minzoom) |         console.log("Zoom level: ",this._map.map.getZoom(), "Least needed zoom:", this._minzoom) | ||||||
|         if (this._map.map.getZoom() < this._minzoom || this._map.Location.data.zoom < this._minzoom) { |         if (this._map.map.getZoom() < this._minzoom || this._map.Location.data.zoom < this._minzoom) { | ||||||
|             console.log("Not running query: zoom not sufficient"); |  | ||||||
|             return; |             return; | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -18,7 +18,7 @@ export class Button extends UIElement { | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
| 
 | 
 | ||||||
|         return "<form>" + |         return "<form>" + | ||||||
|             "<button id='button-"+this.id+"' type='button' "+this._clss+">" + this._text.Render() +  "</button>" + |             "<button id='button-"+this.id+"' type='button' "+this._clss+">" + this._text.Render() +  "</button>" + | ||||||
|  |  | ||||||
|  | @ -8,7 +8,7 @@ export class FixedUiElement extends UIElement { | ||||||
|         this._html = html ?? ""; |         this._html = html ?? ""; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         return this._html; |         return this._html; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -12,16 +12,8 @@ export class VariableUiElement extends UIElement { | ||||||
| 
 | 
 | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         return this._html.data; |         return this._html.data; | ||||||
|     } |     } | ||||||
|      |      | ||||||
|     InnerUpdate(htmlElement: HTMLElement) { |  | ||||||
|         super.InnerUpdate(htmlElement); |  | ||||||
|         if(this._innerUpdate !== undefined){ |  | ||||||
|             this._innerUpdate(htmlElement); |  | ||||||
|         } |  | ||||||
|     } |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| } | } | ||||||
|  | @ -26,7 +26,7 @@ export class InputElementWrapper<T> extends InputElement<T>{ | ||||||
|         return this.input.GetValue(); |         return this.input.GetValue(); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         return this.pre.Render() + this.input.Render() + this.post.Render(); |         return this.pre.Render() + this.input.Render() + this.post.Render(); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -62,7 +62,7 @@ export class RadioButton<T> extends InputElement<T> { | ||||||
|         return 'radio-' + this.id + '-' + i; |         return 'radio-' + this.id + '-' + i; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
| 
 | 
 | ||||||
|         let body = ""; |         let body = ""; | ||||||
|         let i = 0; |         let i = 0; | ||||||
|  | @ -83,14 +83,16 @@ export class RadioButton<T> extends InputElement<T> { | ||||||
|         if (t === undefined) { |         if (t === undefined) { | ||||||
|             return; |             return; | ||||||
|         } |         } | ||||||
|  |         console.log("Trying to find an option for", t) | ||||||
|         // We check that what is selected matches the previous rendering
 |         // We check that what is selected matches the previous rendering
 | ||||||
|         for (let i = 0; i < this._elements.length; i++) { |         for (let i = 0; i < this._elements.length; i++) { | ||||||
|             const e = this._elements[i]; |             const e = this._elements[i]; | ||||||
|             if (e.IsValid(t)) { |             if (e.IsValid(t)) { | ||||||
|                 this._selectedElementIndex.setData(i); |                 this._selectedElementIndex.setData(i); | ||||||
|                 e.GetValue().setData(t); |                 e.GetValue().setData(t); | ||||||
|  |                 const radio = document.getElementById(this.IdFor(i)); | ||||||
|                 // @ts-ignore
 |                 // @ts-ignore
 | ||||||
|                 document.getElementById(this.IdFor(i)).checked = true; |                 radio?.checked = true; | ||||||
|                 return; |                 return; | ||||||
|             } |             } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -18,8 +18,8 @@ export class TextField<T> extends InputElement<T> { | ||||||
| 
 | 
 | ||||||
|     constructor(options: { |     constructor(options: { | ||||||
|         placeholder?: string | UIElement, |         placeholder?: string | UIElement, | ||||||
|         toString?: (t: T) => string, |         toString: (t: T) => string, | ||||||
|         fromString?: (string: string) => T, |         fromString: (string: string) => T, | ||||||
|         value?: UIEventSource<T> |         value?: UIEventSource<T> | ||||||
|     }) { |     }) { | ||||||
|         super(undefined); |         super(undefined); | ||||||
|  | @ -33,15 +33,18 @@ export class TextField<T> extends InputElement<T> { | ||||||
|         this.mappedValue.addCallback((t) => this.value.setData(options.toString(t))); |         this.mappedValue.addCallback((t) => this.value.setData(options.toString(t))); | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|         this._placeholder =  |         options.placeholder = options.placeholder ?? ""; | ||||||
|             typeof(options.placeholder) === "string" ? new FixedUiElement(options.placeholder) : |         if (options.placeholder instanceof UIElement) { | ||||||
|                 (options.placeholder ?? new FixedUiElement("")); |             this._placeholder = options.placeholder | ||||||
|  |         } else { | ||||||
|  |             this._placeholder = new FixedUiElement(options.placeholder); | ||||||
|  |         } | ||||||
|         this._toString = options.toString ?? ((t) => ("" + t)); |         this._toString = options.toString ?? ((t) => ("" + t)); | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|         const self = this; |         const self = this; | ||||||
|         this.mappedValue.addCallback((t) => { |         this.mappedValue.addCallback((t) => { | ||||||
|             if (t === undefined && t === null) { |             if (t === undefined || t === null) { | ||||||
|                 return; |                 return; | ||||||
|             } |             } | ||||||
|             const field = document.getElementById('text-' + this.id); |             const field = document.getElementById('text-' + this.id); | ||||||
|  | @ -57,7 +60,7 @@ export class TextField<T> extends InputElement<T> { | ||||||
|         return this.mappedValue; |         return this.mappedValue; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |      InnerRender(): string { | ||||||
|         return "<form onSubmit='return false' class='form-text-field'>" + |         return "<form onSubmit='return false' class='form-text-field'>" + | ||||||
|             "<input type='text' placeholder='" + this._placeholder.InnerRender() + "' id='text-" + this.id + "'>" + |             "<input type='text' placeholder='" + this._placeholder.InnerRender() + "' id='text-" + this.id + "'>" + | ||||||
|             "</form>"; |             "</form>"; | ||||||
|  |  | ||||||
|  | @ -45,7 +45,6 @@ export class MessageBoxHandler { | ||||||
|     update() { |     update() { | ||||||
|         const wrapper = document.getElementById("messagesboxmobilewrapper"); |         const wrapper = document.getElementById("messagesboxmobilewrapper"); | ||||||
|         const gen = this._uielement.data; |         const gen = this._uielement.data; | ||||||
|         console.log("Generator: ", gen); |  | ||||||
|         if (gen === undefined) { |         if (gen === undefined) { | ||||||
|             wrapper.classList.add("hidden") |             wrapper.classList.add("hidden") | ||||||
|             if (location.hash !== "") { |             if (location.hash !== "") { | ||||||
|  | @ -55,10 +54,6 @@ export class MessageBoxHandler { | ||||||
|         } |         } | ||||||
|         location.hash = "#element" |         location.hash = "#element" | ||||||
|         wrapper.classList.remove("hidden"); |         wrapper.classList.remove("hidden"); | ||||||
|       /*  gen() |  | ||||||
|             ?.HideOnEmpty(true) |  | ||||||
|             ?.AttachTo("messagesbox") |  | ||||||
|             ?.Activate();*/ |  | ||||||
| 
 | 
 | ||||||
|         gen() |         gen() | ||||||
|             ?.HideOnEmpty(true) |             ?.HideOnEmpty(true) | ||||||
|  |  | ||||||
|  | @ -12,7 +12,7 @@ export class SaveButton extends UIElement { | ||||||
|         this._value = value; |         this._value = value; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         if (this._value.data === undefined || |         if (this._value.data === undefined || | ||||||
|             this._value.data === null |             this._value.data === null | ||||||
|             || this._value.data === "" |             || this._value.data === "" | ||||||
|  |  | ||||||
|  | @ -60,7 +60,7 @@ export class SimpleAddUI extends UIElement { | ||||||
|         } |         } | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         const header = "<h2>Geen selectie</h2>" + |         const header = "<h2>Geen selectie</h2>" + | ||||||
|             "Je klikte ergens waar er nog geen gezochte data is.<br/>"; |             "Je klikte ergens waar er nog geen gezochte data is.<br/>"; | ||||||
|         if (!this._userDetails.data.loggedIn) { |         if (!this._userDetails.data.loggedIn) { | ||||||
|  | @ -83,10 +83,6 @@ export class SimpleAddUI extends UIElement { | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     InnerUpdate(htmlElement: HTMLElement) { |     InnerUpdate(htmlElement: HTMLElement) { | ||||||
|         super.InnerUpdate(htmlElement); |  | ||||||
|         for (const button of this._addButtons) { |  | ||||||
|             button.Update(); |  | ||||||
|         } |  | ||||||
|         this._userDetails.data.osmConnection.registerActivateOsmAUthenticationClass(); |         this._userDetails.data.osmConnection.registerActivateOsmAUthenticationClass(); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -100,7 +100,7 @@ export abstract class UIElement { | ||||||
|         return this; |         return this; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected abstract InnerRender(): string; |     public abstract InnerRender(): string; | ||||||
| 
 | 
 | ||||||
|     public Activate(): void { |     public Activate(): void { | ||||||
|         for (const i in this) { |         for (const i in this) { | ||||||
|  |  | ||||||
|  | @ -58,7 +58,7 @@ export class UserBadge extends UIElement { | ||||||
| 
 | 
 | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     protected InnerRender(): string { |     InnerRender(): string { | ||||||
|         const user = this._userDetails.data; |         const user = this._userDetails.data; | ||||||
|         if (!user.loggedIn) { |         if (!user.loggedIn) { | ||||||
|             return "<div class='activate-osm-authentication'>Klik hier om aan te melden bij OSM</div>"; |             return "<div class='activate-osm-authentication'>Klik hier om aan te melden bij OSM</div>"; | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue