Air-Quality-Web/client_src/js/UI.mjs

62 lines
1.6 KiB
JavaScript
Raw Normal View History

2019-01-18 21:25:30 +00:00
"use strict";
import SmartSettings from 'smartsettings';
import NanoModal from 'nanomodal';
2019-01-18 21:25:30 +00:00
import Config from './Config.mjs';
import GetFromUrl from './Helpers/GetFromUrl.mjs';
2019-01-18 21:25:30 +00:00
class UI {
constructor(in_config, in_map_manager) {
this.config = in_config;
2019-01-18 21:25:30 +00:00
this.map_manager = in_map_manager;
this.ui_panel = new SmartSettings("Settings");
// this.ui_panel.watch((event) => console.log(event));
}
async setup() {
this.reading_types = JSON.parse(
await GetFromUrl(`${this.config.api_root}?action=list-reading-types`)
);
2019-01-18 21:25:30 +00:00
this.ui_panel.loadConfig([
{
type: "range",
name: "Heatmap Blob Radius",
items: [
0.001, // min
0.05, // max
Config.heatmap.blob_radius, // initial value
0.001 // step
],
callback: ((event) => {
this.map_manager.heatmap.overlay_config.radius = parseFloat(event.target.value);
}).bind(this)
},
{
type: "select",
name: "Reading Type",
items: this.reading_types.map((type) => type.friendly_text),
callback: ((event) => {
let new_type = this.reading_types.find((type) => type.friendly_text == event.target.value).id;
this.map_manager.heatmap.update_reading_type(new_type);
}).bind(this)
},
{
type: "button",
name: `${Config.version}, built ${Config.build_date.toDateString()}`,
callback: (async (_event) => {
NanoModal(
await GetFromUrl(`${Config.api_root}?action=changelog`)
).show();
})
2019-01-18 21:25:30 +00:00
}
]);
this.ui_panel.setIndex("Reading Type", this.reading_types.findIndex((type) => type.id == "PM25"));
2019-01-18 21:25:30 +00:00
}
}
export default UI;