diff --git a/ui.html b/ui.html
index 7759056..d0b250a 100644
--- a/ui.html
+++ b/ui.html
@@ -73,9 +73,14 @@
);
}
let { value, readonly } = config;
+ let valueProp = type === 'toggle' ? 'checked' : 'value';
+ // We don't want to override current input's value while user is editing it.
+ if (document.activeElement?.id === id) {
+ value = document.activeElement?.[valueProp];
+ }
let attrs = {
id,
- value,
+ [valueProp]: value,
readonly,
disabled: inProgress
};
@@ -90,11 +95,9 @@
inputElem = readonly ? value : h('input', attrs);
break;
case 'toggle': {
- let { value, ...otherAttrs } = attrs;
inputElem = h('input', {
type: 'checkbox',
- checked: value,
- ...otherAttrs
+ ...attrs
});
break;
}
@@ -124,24 +127,18 @@
}
class Settings extends Component {
- state = { pauseUpdates: false, inProgress: false, config: 'Connecting...' };
+ state = { inProgress: false, config: 'Connecting...' };
constructor() {
super();
(async () => {
while (true) {
- if (!this.state.pauseUpdates) {
- await this.refreshConfig();
- }
+ await this.refreshConfig();
await new Promise(resolve => setTimeout(resolve, 100));
}
})();
}
- pauseUpdates = () => this.setState({ pauseUpdates: true });
-
- resumeUpdates = () => this.setState({ pauseUpdates: false });
-
handleChange = async e => {
let name = e.target.id;
if (!name.startsWith('config-')) {
@@ -207,7 +204,7 @@
await queue;
// I have no idea why, but if we connect too soon, it just hangs...
- await new Promise(resolve => setTimeout(resolve, 200));
+ await new Promise(resolve => setTimeout(resolve, 500));
let canvas = document.getElementById('canvas');
let ctx = canvas.getContext('bitmaprenderer');