toggle filter

This commit is contained in:
Bavo Vanderghote 2020-07-22 12:05:29 +02:00
parent c56c076ab3
commit e2ae83536e
3 changed files with 9 additions and 7 deletions

View file

@ -11,13 +11,14 @@ export class CheckBox extends UIElement{
private readonly _showEnabled: string|UIElement; private readonly _showEnabled: string|UIElement;
private readonly _showDisabled: string|UIElement; private readonly _showDisabled: string|UIElement;
constructor(data: UIEventSource<boolean>, showEnabled: string|UIElement, showDisabled: string|UIElement) { constructor(showEnabled: string|UIElement, showDisabled: string|UIElement, data: UIEventSource<boolean> = undefined) {
super(data); super(data);
this._data = data; this._data = data??new UIEventSource(false);
this._showEnabled = showEnabled; this._showEnabled = showEnabled;
this._showDisabled = showDisabled; this._showDisabled = showDisabled;
const self = this;
this.onClick(() => { this.onClick(() => {
data.setData(!data.data); self._data.setData(!self._data.data);
}) })

View file

@ -12,9 +12,9 @@ export class LayerSelection extends UIElement{
this._checkboxes = []; this._checkboxes = [];
for (const layer of layers) { for (const layer of layers) {
this._checkboxes.push(new CheckBox( this._checkboxes.push(new CheckBox(
layer.isDisplayed, new Combine([layer.layerDef.name, `<img src="${layer.layerDef.icon}" alt="layer.layerDef.icon">`]),
new Combine([layer.layerDef.name, `<img src="${layer.layerDef.icon}" alt="${layer.layerDef.icon}">`]), layer.layerDef.name,
layer.layerDef.name)); layer.isDisplayed));
} }
} }

View file

@ -314,7 +314,8 @@ locationControl.ping();
// --------------- Setting up filter ui -------- // --------------- Setting up filter ui --------
new LayerSelection(flayers).AttachTo("filter__selection"); new CheckBox(new LayerSelection(flayers), `Click here`).AttachTo("filter__selection")
// --------------- Setting up toggle button for filter ui -------- // --------------- Setting up toggle button for filter ui --------