First iteration of the timepicker

This commit is contained in:
Pieter Vander Vennet 2020-10-04 12:55:44 +02:00
parent d1f286f466
commit 2a704a2b1d
7 changed files with 110 additions and 13 deletions

View file

@ -14,7 +14,7 @@ export default class OpeningHoursPicker extends InputElement<OpeningHour[]> {
private readonly _weekdays: UIEventSource<UIElement[]> = new UIEventSource<UIElement[]>([]);
constructor(ohs: UIEventSource<OpeningHour[]>) {
constructor(ohs: UIEventSource<OpeningHour[]> = new UIEventSource<OpeningHour[]>([])) {
super();
this._ohs = ohs;
this._backgroundTable = new OpeningHoursPickerTable(this._weekdays);

View file

@ -48,8 +48,8 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour> {
Utils.Times(id => `<td id="${this.id}-timecell-${id}-${h}-30" class="oh-timecell oh-timecell-half"><div class="oh-timecell-inner"></div></td>`, 7) +
'</tr>';
}
let days = OpeningHoursPickerTable.days.join("</th><th>");
return `<table id="oh-table-${this.id}" class="oh-table"><tr><th></th><th>${days}</tr>${rows}</table>`;
let days = OpeningHoursPickerTable.days.join("</th><th width='14%'>");
return `<table id="oh-table-${this.id}" class="oh-table"><tr><th></th><th width='14%'>${days}</th></tr>${rows}</table>`;
}
protected InnerUpdate() {

View file

@ -8,13 +8,15 @@ import {UIElement} from "../UIElement";
import {UIEventSource} from "../../Logic/UIEventSource";
import CombinedInputElement from "./CombinedInputElement";
import SimpleDatePicker from "./SimpleDatePicker";
import OpeningHoursPicker from "./OpeningHours/OpeningHoursPicker";
import {OpeningHour, OpeningHourUtils} from "../../Logic/OpeningHours";
interface TextFieldDef {
name: string,
explanation: string,
isValid: ((s: string, country?: string) => boolean),
reformat?: ((s: string, country?: string) => string),
inputHelper?: (value:UIEventSource<string>) => InputElement<string>,
inputHelper?: (value: UIEventSource<string>) => InputElement<string>,
}
export default class ValidatedTextField {
@ -141,6 +143,24 @@ export default class ValidatedTextField {
return parsePhoneNumberFromString(str, country?.toUpperCase())?.isValid() ?? false
},
(str, country: any) => parsePhoneNumberFromString(str, country?.toUpperCase()).formatInternational()
),
ValidatedTextField.tp(
"opening_hours",
"Has extra elements to easily input when a POI is opened",
(s, country) => true, // TODO
str => str, // TODO reformat with opening_hours.js
(value) => {
const input = new InputElementMap<OpeningHour[], string>(new OpeningHoursPicker(),
(a, b) => a === b,
ohs => OpeningHourUtils.ToString(ohs),
str => OpeningHourUtils.Parse(str)
)
input.GetValue().addCallback(latest => {
console.log(latest);
value.setData(latest);
})
return input;
}
)
]