forked from MapComplete/MapComplete
53 lines
1.6 KiB
TypeScript
53 lines
1.6 KiB
TypeScript
|
import {UIElement} from "../UIElement";
|
||
|
|
import {UIEventSource} from "../../Logic/UIEventSource";
|
||
|
|
import Translations from "../i18n/Translations";
|
||
|
|
import {CheckBox} from "../Input/CheckBox";
|
||
|
|
import Combine from "../Base/Combine";
|
||
|
|
import {State} from "../../State";
|
||
|
|
import {Tag} from "../../Logic/Tags";
|
||
|
|
|
||
|
|
|
||
|
|
export default class DeleteImage extends UIElement {
|
||
|
|
private readonly key: string;
|
||
|
|
private readonly tags: UIEventSource<any>;
|
||
|
|
|
||
|
|
private readonly isDeletedBadge: UIElement;
|
||
|
|
private readonly deleteDialog: UIElement;
|
||
|
|
|
||
|
|
constructor(key: string, tags: UIEventSource<any>) {
|
||
|
|
super(tags);
|
||
|
|
this.tags = tags;
|
||
|
|
this.key = key;
|
||
|
|
|
||
|
|
this.isDeletedBadge = Translations.t.image.isDeleted;
|
||
|
|
|
||
|
|
const style = "display:block;color:white;width:100%;"
|
||
|
|
const deleteButton = Translations.t.image.doDelete.Clone()
|
||
|
|
.SetStyle(style+"background:#ff8c8c;")
|
||
|
|
.onClick(() => {
|
||
|
|
State.state?.changes.addTag(tags.data.id, new Tag(key, ""));
|
||
|
|
});
|
||
|
|
|
||
|
|
const cancelButton = Translations.t.general.cancel;
|
||
|
|
this.deleteDialog = new CheckBox(
|
||
|
|
new Combine([
|
||
|
|
deleteButton,
|
||
|
|
cancelButton
|
||
|
|
|
||
|
|
]).SetStyle("display:flex;flex-direction:column;"),
|
||
|
|
"<img src='./assets/delete.svg' style='width:1.5em;'>"
|
||
|
|
)
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
InnerRender(): string {
|
||
|
|
|
||
|
|
const value = this.tags.data[this.key];
|
||
|
|
if (value === undefined || value === "") {
|
||
|
|
return this.isDeletedBadge.Render();
|
||
|
|
}
|
||
|
|
|
||
|
|
return this.deleteDialog.Render();
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|