uwap/mqtt-control-map
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Debounce all outgoing ui events (Also Fixes 44)

Browse source
This commit is contained in:
uwap 2018-07-08 21:52:13 +02:00
parent 0bc208b84e
commit e5cf1b2f9e
3 changed files with 27 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

45
config/rzl.js
View file

@ -759,8 +759,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: "kitchen_light_brightness",
delayedApply: true
topic: "kitchen_light_brightness"
},
{
type: "slider",
@ -768,8 +767,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: "kitchen_light_color",
delayedApply: true
topic: "kitchen_light_color"
},
{
type: "section",
@ -781,8 +779,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65537"),
delayedApply: true
topic: floalt.brightness("65537")
},
{
type: "slider",
@ -790,8 +787,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65537"),
delayedApply: true
topic: floalt.color("65537")
},
{
type: "section",
@ -803,8 +799,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65538"),
delayedApply: true
topic: floalt.brightness("65538")
},
{
type: "slider",
@ -812,8 +807,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65538"),
delayedApply: true
topic: floalt.color("65538")
},
{
type: "section",
@ -825,8 +819,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65539"),
delayedApply: true
topic: floalt.brightness("65539")
},
{
type: "slider",
@ -834,8 +827,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65539"),
delayedApply: true
topic: floalt.color("65539")
},
{
type: "section",
@ -847,8 +839,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65540"),
delayedApply: true
topic: floalt.brightness("65540")
},
{
type: "slider",
@ -856,8 +847,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65540"),
delayedApply: true
topic: floalt.color("65540")
}
]
},
@ -881,8 +871,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: "kitchen_sink_light_brightness",
delayedApply: true
topic: "kitchen_sink_light_brightness"
}
]
},
@ -901,8 +890,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65544"),
delayedApply: true
topic: floalt.brightness("65544")
},
{
type: "slider",
@ -910,8 +898,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65544"),
delayedApply: true
topic: floalt.color("65544")
},
{
type: "section",
@ -923,8 +910,7 @@ const config : Config = {
max: 100,
text: "Helligkeit",
icon: mdi("brightness-7"),
topic: floalt.brightness("65543"),
delayedApply: true
topic: floalt.brightness("65543")
},
{
type: "slider",
@ -932,8 +918,7 @@ const config : Config = {
max: 100,
text: "Farbtemperatur",
icon: mdi("weather-sunset-down"),
topic: floalt.color("65543"),
delayedApply: true
topic: floalt.color("65543")
}
]
},

16
src/components/UiItemList/UiItem.js
View file

@ -2,6 +2,7 @@
import React from "react";
import keys from "lodash/keys";
import map from "lodash/map";
import debounce from "lodash/debounce";
import ListItemSecondaryAction from "@material-ui/core/ListItemSecondaryAction";
import ListItemText from "@material-ui/core/ListItemText";
import ListSubheader from "@material-ui/core/ListSubheader";
@ -71,9 +72,15 @@ export class UiControl<I: UIControl> extends UiItem<I> {
`Missing topic in ${this.props.item.type} "${this.props.item.text}"`
);
}
this.props.onChangeState(this.props.item.topic, next);
this.debouncedChange(next);
}
debouncedChange = debounce((next: string) =>
this.props.onChangeState(this.props.item.topic, next), 50, {
leading: true,
trailing: true
});
getValue() {
const control = this.props.item;
const topic: string = control.topic || "";
@ -181,10 +188,9 @@ export class Slider extends UiControl<UISlider> {
value={parseFloat(this.getValue())}
min={this.props.item.min || 0} max={this.props.item.max || 0}
step={this.props.item.step || 1}
onChange={(e, v) =>
this.props.item.delayedApply || this.runPrimaryAction(e, v)}
onDragEnd={this.runPrimaryAction}
disabled={!this.isEnabled()} />
onChange={this.runPrimaryAction}
disabled={!this.isEnabled()}
style={{marginLeft: 40}} />
];
}
}

3
src/config/flowtypes.js
View file

@ -55,8 +55,7 @@ export type UISlider = $ReadOnly<{|
enableCondition?: (s: State) => boolean,
min?: number,
max?: number,
step?: number,
delayedApply?: boolean
step?: number
|}>;
export type UISection = $ReadOnly<{|