Add layer-control-toggle to the URL bar and in the share-screen, fix #90

This commit is contained in:
Pieter Vander Vennet 2020-08-22 13:02:31 +02:00
parent 734f571b5d
commit 0e4cd630e6
4 changed files with 32 additions and 5 deletions

View file

@ -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);

View file

@ -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.";

View file

@ -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) {
@ -135,6 +143,7 @@ export class ShareScreen extends UIElement {
literalText = "https://pietervdvn.github.io/MapComplete/index.html"
parts.push("userlayout=true");
}
if (parts.length === 0) {
return literalText + hash;

View file

@ -46,6 +46,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 = "") {