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…
Reference in a new issue