iobroker.vis-2
Version:
Next generation graphical user interface for ioBroker.
288 lines (287 loc) • 9.12 kB
JavaScript
import { q as __mf_1, a as React, __tla as __tla_0 } from "./iobroker_vis__loadShare__react__loadShare__.js-QKtVi7r1.js";
import { N as __mf_19, O as __mf_22, __tla as __tla_1 } from "./iobroker_vis__loadShare___mf_0_mui_mf_1_material__loadShare__.js-B8Z0SsW4.js";
import { c as __mf_2, __tla as __tla_2 } from "./iobroker_vis__loadShare___mf_0_iobroker_mf_1_adapter_mf_2_react_mf_2_v5__loadShare__.js-CsN8r17m.js";
let visRxWidget;
let __tla = Promise.all([
(() => {
try {
return __tla_0;
} catch {
}
})(),
(() => {
try {
return __tla_1;
} catch {
}
})(),
(() => {
try {
return __tla_2;
} catch {
}
})()
]).then(async () => {
var __awaiter = function(thisArg, _arguments, P, generator) {
function adopt(value) {
return value instanceof P ? value : new P(function(resolve) {
resolve(value);
});
}
return new (P || (P = Promise))(function(resolve, reject) {
function fulfilled(value) {
try {
step(generator.next(value));
} catch (e) {
reject(e);
}
}
function rejected(value) {
try {
step(generator["throw"](value));
} catch (e) {
reject(e);
}
}
function step(result) {
result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
}
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
const POSSIBLE_MUI_STYLES = [
"background-color",
"border",
"background",
"background-image",
"background-position",
"background-repeat",
"background-size",
"background-clip",
"background-origin",
"color",
"box-sizing",
"border-width",
"border-style",
"border-color",
"border-radius",
"box-shadow",
"text-align",
"text-shadow",
"font-family",
"font-size",
"font-weight",
"line-height",
"font-style",
"font-variant",
"letter-spacing",
"word-spacing"
];
visRxWidget = class extends __mf_1 {
constructor(props) {
super(props);
this.refService = React.createRef();
this.getIdSubscribeState = (id, cb) => __awaiter(this, void 0, void 0, function* () {
const result = yield this.props.context.socket.getState(id);
this.props.context.socket.subscribeState(id, () => cb(id, result));
});
this.onStateChanged = this.onStateChanged.bind(this);
const widget = this.props.context.views[this.props.view].widgets[this.props.id];
this.state = {
values: {},
data: JSON.parse(JSON.stringify(widget.data || {})),
style: JSON.parse(JSON.stringify(widget.style || {})),
rxData: JSON.parse(JSON.stringify(widget.data || {})),
rxStyle: JSON.parse(JSON.stringify(widget.style || {}))
};
this.linkContext = {
IDs: [],
bindings: {},
visibility: {},
lastChanges: {},
signals: {},
widgetAttrInfo: {}
};
}
getWidgetInfo() {
throw new Error("not implemented");
}
static getI18nPrefix() {
return "";
}
static getText(text) {
if (!text) {
return "";
}
if (typeof text === "object") {
return text[__mf_2.getLanguage()] || text.en;
}
return text;
}
static t(key, ...args) {
return __mf_2.t(`${this.getI18nPrefix()}${key}`, ...args);
}
static getLanguage() {
return __mf_2.getLanguage();
}
renderWidgetBody(_props) {
return null;
}
onStateUpdated(_id, _state) {
}
formatValue(value, round) {
var _a;
if (typeof value === "number") {
if (round === 0) {
value = Math.round(value);
} else {
value = Math.round(value * 100) / 100;
}
if ((_a = this.props.context.systemConfig) === null || _a === void 0 ? void 0 : _a.common) {
if (this.props.context.systemConfig.common.isFloatComma) {
value = value.toString().replace(".", ",");
}
}
}
return value === void 0 || value === null ? "" : value.toString();
}
wrapContent(content, addToHeader, cardContentStyle, headerStyle, onCardClick, components) {
var _a, _b;
const MyCard = (components === null || components === void 0 ? void 0 : components.Card) || __mf_19;
const MyCardContent = (components === null || components === void 0 ? void 0 : components.CardContent) || __mf_22;
const style = Object.assign({
width: "calc(100% - 8px)",
height: "calc(100% - 8px)",
margin: 4
}, (_b = (_a = this.props.customSettings) === null || _a === void 0 ? void 0 : _a.viewStyle) === null || _b === void 0 ? void 0 : _b.visCard);
Object.keys(this.state.rxStyle).forEach((attr) => {
const value = this.state.rxStyle[attr];
if (value !== null && value !== void 0 && POSSIBLE_MUI_STYLES.includes(attr)) {
attr = attr.replace(/(-\w)/g, (text) => text[1].toUpperCase());
style[attr] = value;
}
});
this.wrappedContent = true;
const widgetTitle = this.state.rxData.widgetTitle;
return React.createElement(MyCard, {
className: "vis_rx_widget_card",
style,
onClick: onCardClick
}, React.createElement(MyCardContent, {
className: "vis_rx_widget_card_content",
style: Object.assign({
display: "flex",
flexDirection: "column",
alignItems: "center",
height: "calc(100% - 32px)",
paddingBottom: 16,
position: "relative"
}, cardContentStyle)
}, widgetTitle ? React.createElement("div", {
className: "vis_rx_widget_card_name",
style: {
display: "flex",
justifyContent: "space-between",
width: "100%",
alignItems: "center"
}
}, React.createElement("div", {
className: "vis_rx_widget_card_name_div",
style: Object.assign({
fontSize: 24,
paddingTop: 0,
paddingBottom: 4
}, headerStyle)
}, widgetTitle), addToHeader || null) : addToHeader || null, content));
}
onStateChanged(id, state) {
if (!state) {
return;
}
const values = JSON.parse(JSON.stringify(this.state.values));
if (state.val !== void 0) {
values[`${id}.val`] = state.val;
}
if (state.ts !== void 0) {
values[`${id}.ts`] = state.ts;
}
if (state.from !== void 0) {
values[`${id}.from`] = state.from;
}
if (state.lc !== void 0) {
values[`${id}.lc`] = state.lc;
}
if (state.ts !== void 0) {
values[`${id}.ts`] = state.ts;
}
this.onStateUpdated(id, state);
this.setState({
values
});
}
componentDidMount() {
return __awaiter(this, void 0, void 0, function* () {
var _a, _b;
(_b = (_a = this.getWidgetInfo()) === null || _a === void 0 ? void 0 : _a.visAttrs) === null || _b === void 0 ? void 0 : _b.forEach((group) => {
var _a2;
return (_a2 = group === null || group === void 0 ? void 0 : group.fields) === null || _a2 === void 0 ? void 0 : _a2.forEach((field) => {
if ((field === null || field === void 0 ? void 0 : field.type) === "id") {
Object.keys(this.state.data).forEach((dataKey) => {
if (dataKey.match(new RegExp(`^${field.name}[0-9]*$`))) {
const oid = this.state.data[dataKey];
if (!this.linkContext.IDs.includes(oid)) {
this.linkContext.IDs.push(oid);
}
}
});
}
});
});
for (let i = 0; i < this.linkContext.IDs.length; i++) {
yield this.getIdSubscribeState(this.linkContext.IDs[i], this.onStateChanged);
}
});
}
componentWillUnmount() {
this.linkContext.IDs.forEach((oid) => this.props.context.socket.unsubscribeState(oid, this.onStateChanged));
}
getWidgetView(_view, _props) {
return React.createElement("div", {
style: {
width: "100%",
height: "100%"
}
}, "DEMO VIEW");
}
getWidgetInWidget(_view, _wid, _props) {
return null;
}
render() {
var _a, _b;
return React.createElement("div", {
ref: this.refService,
style: {
width: (_a = this.state.style) === null || _a === void 0 ? void 0 : _a.width,
height: (_b = this.state.style) === null || _b === void 0 ? void 0 : _b.height
}
}, this.renderWidgetBody({
className: "",
overlayClassNames: [],
style: {},
id: "defaultID",
refService: this.refService,
widget: {
tpl: "tplDemo",
data: {},
style: {},
widgetSet: "demoSet"
}
}));
}
};
visRxWidget.POSSIBLE_MUI_STYLES = POSSIBLE_MUI_STYLES;
});
export {
visRxWidget as VisRxWidget,
__tla
};