contrapunctus/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

87
UI/Input/FileSelectorButton.ts
View file

@ -1,54 +1,55 @@
import BaseUIElement from "../BaseUIElement";
import {InputElement} from "./InputElement";
import {UIEventSource} from "../../Logic/UIEventSource";
import BaseUIElement from "../BaseUIElement"
import { InputElement } from "./InputElement"
import { UIEventSource } from "../../Logic/UIEventSource"
export default class FileSelectorButton extends InputElement<FileList> {
private static _nextid
IsSelected: UIEventSource<boolean>
private readonly _value = new UIEventSource<FileList>(undefined)
private readonly _label: BaseUIElement
private readonly _acceptType: string
private readonly allowMultiple: boolean
private static _nextid;
IsSelected: UIEventSource<boolean>;
private readonly _value = new UIEventSource<FileList>(undefined);
private readonly _label: BaseUIElement;
private readonly _acceptType: string;
private readonly allowMultiple: boolean;
constructor(label: BaseUIElement, options?:
{
acceptType: "image/*" | string,
constructor(
label: BaseUIElement,
options?: {
acceptType: "image/*" | string
allowMultiple: true | boolean
}) {
super();
this._label = label;
this._acceptType = options?.acceptType ?? "image/*";
}
) {
super()
this._label = label
this._acceptType = options?.acceptType ?? "image/*"
this.SetClass("block cursor-pointer")
label.SetClass("cursor-pointer")
this.allowMultiple = options?.allowMultiple ?? true
}
GetValue(): UIEventSource<FileList> {
return this._value;
return this._value
}
IsValid(t: FileList): boolean {
return true;
return true
}
protected InnerConstructElement(): HTMLElement {
const self = this;
const self = this
const el = document.createElement("form")
const label = document.createElement("label")
label.appendChild(this._label.ConstructElement())
el.appendChild(label)
const actualInputElement = document.createElement("input");
actualInputElement.style.cssText = "display:none";
actualInputElement.type = "file";
actualInputElement.accept = this._acceptType;
actualInputElement.name = "picField";
actualInputElement.multiple = this.allowMultiple;
actualInputElement.id = "fileselector" + FileSelectorButton._nextid;
FileSelectorButton._nextid++;
const actualInputElement = document.createElement("input")
actualInputElement.style.cssText = "display:none"
actualInputElement.type = "file"
actualInputElement.accept = this._acceptType
actualInputElement.name = "picField"
actualInputElement.multiple = this.allowMultiple
actualInputElement.id = "fileselector" + FileSelectorButton._nextid
FileSelectorButton._nextid++
label.htmlFor = actualInputElement.id;
label.htmlFor = actualInputElement.id
actualInputElement.onchange = () => {
if (actualInputElement.files !== null) {
@ -56,7 +57,7 @@ export default class FileSelectorButton extends InputElement<FileList> {
}
}
el.addEventListener('submit', e => {
el.addEventListener("submit", (e) => {
if (actualInputElement.files !== null) {
self._value.setData(actualInputElement.files)
}
@ -65,22 +66,20 @@ export default class FileSelectorButton extends InputElement<FileList> {
el.appendChild(actualInputElement)
el.addEventListener('dragover', (event) => {
event.stopPropagation();
event.preventDefault();
el.addEventListener("dragover", (event) => {
event.stopPropagation()
event.preventDefault()
// Style the drag-and-drop as a "copy file" operation.
event.dataTransfer.dropEffect = 'copy';
});
event.dataTransfer.dropEffect = "copy"
})
el.addEventListener('drop', (event) => {
event.stopPropagation();
event.preventDefault();
const fileList = event.dataTransfer.files;
el.addEventListener("drop", (event) => {
event.stopPropagation()
event.preventDefault()
const fileList = event.dataTransfer.files
this._value.setData(fileList)
});
})
return el;
return el
}
}
}