48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import m from 'mithril';
|
|
import { Widget } from 'components/widgets/widget';
|
|
import { Pipe } from 'utilities/pipe';
|
|
|
|
require('./numeric-value.css');
|
|
|
|
export class NumericValue extends Widget {
|
|
private value: Pipe<number>;
|
|
private unit: string;
|
|
private decimals: number;
|
|
|
|
private integralValueElement: HTMLElement;
|
|
private decimalValueElement: HTMLElement;
|
|
|
|
constructor(vnode: any) {
|
|
super(vnode);
|
|
|
|
this.value = vnode.attrs.value || new Pipe(0.0);
|
|
this.unit = vnode.attrs.unit || '';
|
|
this.decimals = vnode.attrs.decimals || 0;
|
|
|
|
this.value.onChange(() => this.onValueChange());
|
|
}
|
|
|
|
view(vnode: m.Vnode<{}, {}>): m.Children {
|
|
return <div class="widget gauge" style={'flex: ' + this.widgetWidth}>
|
|
<p><span class="integral-value"></span><span class="decimal-value"></span><span class="unit">{this.unit}</span></p>
|
|
</div>;
|
|
}
|
|
|
|
onValueChange() {
|
|
let value = this.value.get();
|
|
|
|
let valueStr = value.toFixed(this.decimals);
|
|
let parts = valueStr.split('.');
|
|
|
|
this.integralValueElement.innerText = parts[0];
|
|
this.decimalValueElement.innerText = this.decimals > 0 ? '.' + parts[1] : '';
|
|
}
|
|
|
|
oncreate(vnode: any) {
|
|
this.integralValueElement = vnode.dom.querySelector('span.integral-value');
|
|
this.decimalValueElement = vnode.dom.querySelector('span.decimal-value');
|
|
|
|
this.onValueChange();
|
|
}
|
|
}
|