More work on the opening hours picker

This commit is contained in:
Pieter Vander Vennet 2020-10-06 01:37:02 +02:00
parent 4d139b45e6
commit 6563298d16
15 changed files with 321 additions and 100 deletions

View file

@ -35,8 +35,6 @@ export default class InputElementMap<T, X> extends InputElement<X> {
}), extraSources, x => {
return fromX(x);
});
this._value.addCallback(console.log)
this.IsSelected.addCallback(s => console.log("Is selected?", s))
}
GetValue(): UIEventSource<X> {

View file

@ -1,6 +1,6 @@
import {UIElement} from "../../UIElement";
import {InputElement} from "../InputElement";
import {OpeningHour, OpeningHourUtils} from "../../../Logic/OpeningHours";
import {OpeningHour, OH} from "../../../Logic/OpeningHours";
import {UIEventSource} from "../../../Logic/UIEventSource";
import OpeningHoursPickerTable from "./OpeningHoursPickerTable";
import OpeningHoursRange from "./OpeningHoursRange";
@ -17,23 +17,16 @@ export default class OpeningHoursPicker extends InputElement<OpeningHour[]> {
constructor(ohs: UIEventSource<OpeningHour[]> = new UIEventSource<OpeningHour[]>([])) {
super();
this._ohs = ohs;
this._backgroundTable = new OpeningHoursPickerTable(this._weekdays);
this._backgroundTable = new OpeningHoursPickerTable(this._weekdays, this._ohs);
const self = this;
this._backgroundTable.GetValue().addCallback(oh => {
if (oh) {
ohs.data.push(oh);
ohs.ping();
}
});
this._ohs.addCallback(ohs => {
self._ohs.setData(OpeningHourUtils.MergeTimes(ohs));
self._ohs.setData(OH.MergeTimes(ohs));
})
ohs.addCallback(ohs => {
ohs.addCallbackAndRun(ohs => {
const perWeekday: UIElement[][] = [];
for (let i = 0; i < 7; i++) {
perWeekday[i] = [];
}
@ -41,7 +34,7 @@ export default class OpeningHoursPicker extends InputElement<OpeningHour[]> {
for (const oh of ohs) {
const source = new UIEventSource<OpeningHour>(oh)
source.addCallback(_ => {
self._ohs.setData(OpeningHourUtils.MergeTimes(self._ohs.data))
self._ohs.setData(OH.MergeTimes(self._ohs.data))
})
const r = new OpeningHoursRange(source);
perWeekday[oh.weekday].push(r);
@ -52,7 +45,6 @@ export default class OpeningHoursPicker extends InputElement<OpeningHour[]> {
}
self._weekdays.ping();
});
}

View file

@ -8,19 +8,19 @@ import {UIElement} from "../../UIElement";
* This is the base-table which is selectable by hovering over it.
* It will genarate the currently selected opening hour.
*/
export default class OpeningHoursPickerTable extends InputElement<OpeningHour> {
export default class OpeningHoursPickerTable extends InputElement<OpeningHour[]> {
public readonly IsSelected: UIEventSource<boolean>;
private readonly weekdays: UIEventSource<UIElement[]>;
public static readonly days = ["Maan", "Din", "Woe", "Don", "Vrij", "Zat", "Zon"];
private readonly source: UIEventSource<OpeningHour>;
private readonly source: UIEventSource<OpeningHour[]>;
constructor(weekdays: UIEventSource<UIElement[]>, source?: UIEventSource<OpeningHour>) {
constructor(weekdays: UIEventSource<UIElement[]>, source?: UIEventSource<OpeningHour[]>) {
super(weekdays);
this.weekdays = weekdays;
this.source = source ?? new UIEventSource<OpeningHour>(undefined);
this.source = source ?? new UIEventSource<OpeningHour[]>([]);
this.IsSelected = new UIEventSource<boolean>(false);
this.SetStyle("width:100%;height:100%;display:block;");
@ -105,8 +105,9 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour> {
oh.endHour = 24;
oh.endMinutes = 0;
}
self.source.setData(oh);
self.source.data.push(oh);
}
self.source.ping();
// Clear the highlighting
for (let i = 1; i < table.rows.length; i++) {
@ -229,11 +230,11 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour> {
}
IsValid(t: OpeningHour): boolean {
IsValid(t: OpeningHour[]): boolean {
return true;
}
GetValue(): UIEventSource<OpeningHour> {
GetValue(): UIEventSource<OpeningHour[]> {
return this.source;
}

View file

@ -26,7 +26,6 @@ export default class OpeningHoursRange extends UIElement {
self.InnerUpdate(el);
})
this._deleteRange = new FixedUiElement("<img src='./assets/delete.svg'>")
.SetClass("oh-delete-range")
.onClick(() => {

View file

@ -9,7 +9,7 @@ import {UIEventSource} from "../../Logic/UIEventSource";
import CombinedInputElement from "./CombinedInputElement";
import SimpleDatePicker from "./SimpleDatePicker";
import OpeningHoursPicker from "./OpeningHours/OpeningHoursPicker";
import {OpeningHour, OpeningHourUtils} from "../../Logic/OpeningHours";
import {OpeningHour, OH} from "../../Logic/OpeningHours";
interface TextFieldDef {
name: string,
@ -148,15 +148,17 @@ export default class ValidatedTextField {
"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
str => str,
(value) => {
const input = new InputElementMap<OpeningHour[], string>(new OpeningHoursPicker(),
const sourceMapped = value.map(OH.Parse, [], OH.ToString);
const input = new InputElementMap<OpeningHour[], string>(new OpeningHoursPicker(sourceMapped),
(a, b) => a === b,
ohs => OpeningHourUtils.ToString(ohs),
str => OpeningHourUtils.Parse(str)
ohs => OH.ToString(ohs),
str => OH.Parse(str)
)
input.GetValue().addCallback(latest => {
console.log(latest);
value.setData(latest);
})
return input;

View file

@ -71,8 +71,8 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
}) {
super(tags);
this.ListenTo(Locale.language);
this.ListenTo(this._questionSkipped);
this.ListenTo(this._editMode);
this.ListenTo(this._questionSkipped);
this.ListenTo(State.state?.osmConnection?.userDetails);
const self = this;