forked from MapComplete/MapComplete
		
	Add layer-control-toggle to the URL bar and in the share-screen, fix #90
This commit is contained in:
		
							parent
							
								
									734f571b5d
								
							
						
					
					
						commit
						0e4cd630e6
					
				
					 4 changed files with 32 additions and 5 deletions
				
			
		| 
						 | 
				
			
			@ -127,7 +127,10 @@ export class InitUiElements {
 | 
			
		|||
 | 
			
		||||
        InitUiElements.OnlyIf(State.state.featureSwitchLayers, () => {
 | 
			
		||||
 | 
			
		||||
            const checkbox = new CheckBox(layerControl, closedFilterButton);
 | 
			
		||||
            const checkbox = new CheckBox(layerControl, closedFilterButton,
 | 
			
		||||
                QueryParameters.GetQueryParameter("layer-control-toggle", "false")
 | 
			
		||||
                    .map((str) => str !== "false", [], b => "" + b)
 | 
			
		||||
            );
 | 
			
		||||
            checkbox.AttachTo("filter__selection");
 | 
			
		||||
            State.state.bm.Location.addCallback(() => {
 | 
			
		||||
                checkbox.isEnabled.setData(false);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -441,10 +441,14 @@ export class ThemeGenerator extends UIElement {
 | 
			
		|||
    private readonly allQuestionFields: UIElement[];
 | 
			
		||||
    public url: UIEventSource<string>;
 | 
			
		||||
 | 
			
		||||
    private loginButton: Button
 | 
			
		||||
 | 
			
		||||
    constructor(connection: OsmConnection, windowHash) {
 | 
			
		||||
        super(connection.userDetails);
 | 
			
		||||
        this.userDetails = connection.userDetails;
 | 
			
		||||
        this.loginButton = new Button("Log in with OSM", () => {
 | 
			
		||||
            connection.AttemptLogin()
 | 
			
		||||
        })
 | 
			
		||||
 | 
			
		||||
        const defaultTheme = {layers: [], icon: "./assets/bug.svg"};
 | 
			
		||||
        let loadedTheme = undefined;
 | 
			
		||||
| 
						 | 
				
			
			@ -573,7 +577,7 @@ export class ThemeGenerator extends UIElement {
 | 
			
		|||
    InnerRender(): string {
 | 
			
		||||
 | 
			
		||||
        if (!this.userDetails.data.loggedIn) {
 | 
			
		||||
            return "Not logged in. You need to be logged in to create a theme."
 | 
			
		||||
            return new Combine(["Not logged in. You need to be logged in to create a theme.", this.loginButton]).Render();
 | 
			
		||||
        }
 | 
			
		||||
        if (this.userDetails.data.csCount < 500) {
 | 
			
		||||
            return "You need at least 500 changesets to create your own theme.";
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -97,7 +97,8 @@ export class ShareScreen extends UIElement {
 | 
			
		|||
            {urlName: "fs-welcome-message", human: "Enable the welcome message"},
 | 
			
		||||
            {urlName: "fs-layers", human: "Enable layer control"},
 | 
			
		||||
            {urlName: "fs-add-new", human: "Enable the 'add new POI' button"},
 | 
			
		||||
            {urlName: "fs-geolocation", human: "Enable the 'geolocate-me' button"}
 | 
			
		||||
            {urlName: "fs-geolocation", human: "Enable the 'geolocate-me' button"},
 | 
			
		||||
            {urlName: "layer-control-toggle", human: "Start with the layer control expanded", reverse:true}
 | 
			
		||||
        ]
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -106,13 +107,19 @@ export class ShareScreen extends UIElement {
 | 
			
		|||
            const checkbox = new CheckBox(
 | 
			
		||||
                new Combine([Img.checkmark, swtch.human]),
 | 
			
		||||
                new Combine([Img.no_checkmark, swtch.human]),
 | 
			
		||||
                true
 | 
			
		||||
                swtch.reverse ? false : true
 | 
			
		||||
            );
 | 
			
		||||
            optionCheckboxes.push(checkbox);
 | 
			
		||||
            optionParts.push(checkbox.isEnabled.map((isEn) => {
 | 
			
		||||
                if (isEn) {
 | 
			
		||||
                    if(swtch.reverse){
 | 
			
		||||
                       return `${swtch.urlName}=true`
 | 
			
		||||
                    }
 | 
			
		||||
                    return null;
 | 
			
		||||
                } else {
 | 
			
		||||
                    if(swtch.reverse){
 | 
			
		||||
                        return null;
 | 
			
		||||
                    }
 | 
			
		||||
                    return `${swtch.urlName}=false`
 | 
			
		||||
                }
 | 
			
		||||
            }))
 | 
			
		||||
| 
						 | 
				
			
			@ -127,7 +134,8 @@ export class ShareScreen extends UIElement {
 | 
			
		|||
            
 | 
			
		||||
            let literalText = "https://pietervdvn.github.io/MapComplete/" + layout.name + ".html"
 | 
			
		||||
 | 
			
		||||
            const parts = Utils.NoNull(optionParts.map((eventSource) => eventSource.data));
 | 
			
		||||
            const parts = 
 | 
			
		||||
                Utils.NoEmpty(Utils.NoNull(optionParts.map((eventSource) => eventSource.data)));
 | 
			
		||||
 | 
			
		||||
            let hash = "";
 | 
			
		||||
            if (State.state.layoutDefinition !== undefined) {
 | 
			
		||||
| 
						 | 
				
			
			@ -136,6 +144,7 @@ export class ShareScreen extends UIElement {
 | 
			
		|||
                parts.push("userlayout=true");
 | 
			
		||||
            }
 | 
			
		||||
            
 | 
			
		||||
 | 
			
		||||
            if (parts.length === 0) {
 | 
			
		||||
                return literalText + hash;
 | 
			
		||||
            }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										11
									
								
								Utils.ts
									
										
									
									
									
								
							
							
						
						
									
										11
									
								
								Utils.ts
									
										
									
									
									
								
							| 
						 | 
				
			
			@ -47,6 +47,17 @@ export class Utils {
 | 
			
		|||
        return ls;
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    public static NoEmpty(array: string[]): string[]{
 | 
			
		||||
        const ls: string[] = [];
 | 
			
		||||
        for (const t of array) {
 | 
			
		||||
            if (t === "") {
 | 
			
		||||
                continue;
 | 
			
		||||
            }
 | 
			
		||||
            ls.push(t);
 | 
			
		||||
        }
 | 
			
		||||
        return ls;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    public static CreateLanguagePicker(label: string | UIElement = "") {
 | 
			
		||||
 | 
			
		||||
        return new DropDown(label, State.state.layoutToUse.data.supportedLanguages.map(lang => {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue