elgaard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Reformat all files with prettier

Browse source
This commit is contained in:
Pieter Vander Vennet 2022-09-08 21:40:48 +02:00
parent e22d189376
commit b541d3eab4
382 changed files with 50893 additions and 35566 deletions
Download patch file Download diff file Expand all files Collapse all files

119
UI/Base/SubtleButton.ts
View file

@ -1,88 +1,85 @@
import Translations from "../i18n/Translations";
import Combine from "./Combine";
import BaseUIElement from "../BaseUIElement";
import Link from "./Link";
import Img from "./Img";
import {Store, UIEventSource} from "../../Logic/UIEventSource";
import {UIElement} from "../UIElement";
import {VariableUiElement} from "./VariableUIElement";
import Lazy from "./Lazy";
import Loading from "./Loading";
import Translations from "../i18n/Translations"
import Combine from "./Combine"
import BaseUIElement from "../BaseUIElement"
import Link from "./Link"
import Img from "./Img"
import { Store, UIEventSource } from "../../Logic/UIEventSource"
import { UIElement } from "../UIElement"
import { VariableUiElement } from "./VariableUIElement"
import Lazy from "./Lazy"
import Loading from "./Loading"
export class SubtleButton extends UIElement {
private readonly imageUrl: string | BaseUIElement;
private readonly message: string | BaseUIElement;
private readonly options: { url?: string | Store<string>; newTab?: boolean ; imgSize?: string};
private readonly imageUrl: string | BaseUIElement
private readonly message: string | BaseUIElement
private readonly options: { url?: string | Store<string>; newTab?: boolean; imgSize?: string }
constructor(imageUrl: string | BaseUIElement, message: string | BaseUIElement, options: {
url?: string | Store<string>,
newTab?: boolean,
imgSize?: "h-11 w-11" | string
} = undefined) {
super();
this.imageUrl = imageUrl;
this.message = message;
this.options = options;
constructor(
imageUrl: string | BaseUIElement,
message: string | BaseUIElement,
options: {
url?: string | Store<string>
newTab?: boolean
imgSize?: "h-11 w-11" | string
} = undefined
) {
super()
this.imageUrl = imageUrl
this.message = message
this.options = options
}
protected InnerRender(): string | BaseUIElement {
const classes = "block flex p-3 my-2 bg-subtle rounded-lg hover:shadow-xl hover:bg-unsubtle transition-colors transition-shadow link-no-underline";
const message = Translations.W(this.message)?.SetClass("block text-ellipsis no-images flex-shrink");
let img;
const imgClasses = "block justify-center flex-none mr-4 " + (this.options?.imgSize ?? "h-11 w-11")
const classes =
"block flex p-3 my-2 bg-subtle rounded-lg hover:shadow-xl hover:bg-unsubtle transition-colors transition-shadow link-no-underline"
const message = Translations.W(this.message)?.SetClass(
"block text-ellipsis no-images flex-shrink"
)
let img
const imgClasses =
"block justify-center flex-none mr-4 " + (this.options?.imgSize ?? "h-11 w-11")
if ((this.imageUrl ?? "") === "") {
img = undefined;
} else if (typeof (this.imageUrl) === "string") {
img = undefined
} else if (typeof this.imageUrl === "string") {
img = new Img(this.imageUrl)?.SetClass(imgClasses)
} else {
img = this.imageUrl?.SetClass(imgClasses);
img = this.imageUrl?.SetClass(imgClasses)
}
const button = new Combine([
img,
message
]).SetClass("flex items-center group w-full")
const button = new Combine([img, message]).SetClass("flex items-center group w-full")
if (this.options?.url == undefined) {
this.SetClass(classes)
return button
}
return new Link(
button,
this.options.url,
this.options.newTab ?? false
).SetClass(classes)
return new Link(button, this.options.url, this.options.newTab ?? false).SetClass(classes)
}
public OnClickWithLoading(
loadingText: BaseUIElement | string,
action: () => Promise<void> ) : BaseUIElement{
action: () => Promise<void>
): BaseUIElement {
const state = new UIEventSource<"idle" | "running">("idle")
const button = this;
button.onClick(async() => {
const button = this
button.onClick(async () => {
state.setData("running")
try{
await action()
}catch(e){
try {
await action()
} catch (e) {
console.error(e)
}finally {
} finally {
state.setData("idle")
}
})
const loading = new Lazy(() => new Loading(loadingText) )
return new VariableUiElement(state.map(st => {
if(st === "idle"){
return button
}
return loading
}))
const loading = new Lazy(() => new Loading(loadingText))
return new VariableUiElement(
state.map((st) => {
if (st === "idle") {
return button
}
return loading
})
)
}
}
}