Nothing-to-See-Here/NTSH-Control
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Lots of changes

Browse Source 
-   ✅ Feedback van dataSensor array
-   ✅ dataSliders min/max and unit
-   ✅ Camera before Unity
-   ✅ Restart knop buiten service mode
-   ✅ Operator phonenumber button
-   ✅ Gracefull shutdown
-   ✅ Out of service control
This commit is contained in:
Mees van der Wijk
2025-10-23 17:45:35 +02:00
parent f07ba57168
commit cd33670361
36 changed files with 1444 additions and 277 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
frontend/views/dashboard/dist/dashboard.unity.js vendored
View File

@@ -48,6 +48,10 @@ var DashboardUnity = /** @class */ (function () {
this.uptimeInfo = document.querySelector('.ntsh_dashboard-unity-uptime');
this.webSocketStatus = document.querySelector('.ntsh_dashboard-unity-websocketstatus');
this.webSocketInfo = document.querySelector('.ntsh_dashboard-unity-websocketinfo');
this.outOfServiceStatus = document.querySelector('.ntsh_dashboard-unity-outofservicestatus');
this.outOfServiceInfo = document.querySelector('.ntsh_dashboard-unity-outofserviceinfo');
this.enableOutOfServiceButton = document.querySelector('.ntsh_dashboard-unity-enableoutofservice');
this.disableOutOfServiceButton = document.querySelector('.ntsh_dashboard-unity-disableoutofservice');
this.zedStreamStatus = document.querySelector('.ntsh_dashboard-unity-zedstreamstatus');
this.zedStreamInfo = document.querySelector('.ntsh_dashboard-unity-zedstreaminfo');
this.zedStreamFps = document.querySelector('.ntsh_dashboard-unity-zedstreamfps');
@@ -56,6 +60,7 @@ var DashboardUnity = /** @class */ (function () {
this.timelineStanding = document.querySelector('.ntsh_dashboard-unity-timeline-standing');
this.timelineProgress = document.querySelector('.ntsh_dashboard-unity-timeline-progress');
this.parametersTable = document.querySelector('.ntsh_dashboard-unity-parameters');
this.sensorsTable = document.querySelector('.ntsh_dashboard-unity-sensors');
this.errorContainer = document.querySelector('.ntsh_dashboard-unity-error');
this.errorText = document.querySelector('.ntsh_dashboard-unity-errortext');
this._Main = Main;
@@ -73,7 +78,7 @@ var DashboardUnity = /** @class */ (function () {
}
(0, utils_1.setStatusState)(this.processStatus, {
RUNNING: 'green',
STOPPED: 'red',
STOPPED: 'gray',
STARTING: 'yellow',
PROBLEM: 'red',
}[state.state]);
@@ -99,6 +104,28 @@ var DashboardUnity = /** @class */ (function () {
FAILED: 'red',
}[state.state]);
this.webSocketInfo.innerText = (_a = state.message) !== null && _a !== void 0 ? _a : '';
// ----------- Out of Service -----------
(0, utils_1.setStatusState)(this.outOfServiceStatus, state.parameters.outOfService == null
? 'gray'
: state.parameters.outOfService
? 'red'
: 'green');
this.outOfServiceInfo.innerText =
state.parameters.outOfService == null
? ''
: state.parameters.outOfService
? 'Out of Service'
: 'Operational';
this.enableOutOfServiceButton.style.display =
state.parameters.outOfService == null ||
state.parameters.outOfService
? 'none'
: 'flex';
this.disableOutOfServiceButton.style.display =
state.parameters.outOfService &&
state.parameters.outOfService != null
? 'flex'
: 'none';
// ----------- ZED Stream -----------
(0, utils_1.setStatusState)(this.zedStreamStatus, state.parameters.zedReady ? 'green' : 'red');
this.zedStreamInfo.innerText = state.parameters.zedReady
@@ -113,9 +140,10 @@ var DashboardUnity = /** @class */ (function () {
this.timelineStanding.innerText = state.parameters.timelineStanding
? 'Yes'
: 'No';
(0, utils_1.setProgressState)(this.timelineProgress, state.parameters.timelineProgress);
(0, utils_1.setProgressState)(this.timelineProgress, Math.round(state.parameters.timelineProgress * 100), 0, 100, '%');
// ----------- Parameters -----------
this.renderParameterSliders(state.parameters.parameters);
this.renderParameterSliders(state.state == 'CONNECTED' ? state.parameters.sliders : []);
this.renderParameterSensors(state.state == 'CONNECTED' ? state.parameters.sensors : []);
// ----------- Error -----------
if (((_b = state === null || state === void 0 ? void 0 : state.error) !== null && _b !== void 0 ? _b : '').trim().length > 0)
this.webSocketError = state.error;
@@ -123,55 +151,107 @@ var DashboardUnity = /** @class */ (function () {
this.webSocketError = null;
this.updateError();
};
DashboardUnity.prototype.renderParameterSliders = function (parameters) {
DashboardUnity.prototype.renderParameterSliders = function (sliders) {
var _this = this;
if (parameters.length === 0)
return;
var existingSliders = this.parametersTable.querySelectorAll('.ntsh_dashboard-unity-parameter-row');
if (existingSliders.length !== parameters.length) {
if (existingSliders.length !== sliders.length) {
this.parametersTable.innerHTML = '';
parameters.forEach(function (param) {
var row = (0, morphux_1.ce)('tr', 'ntsh_dashboard-unity-parameter-row');
var nameCell = (0, morphux_1.ce)('td');
nameCell.appendChild((0, morphux_1.ce)('div', 'mux_text', null, param.sliderName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1.ce)('td', 'no-service');
progressCell.appendChild((0, utils_1.createProgress)(param.outputValue));
row.appendChild(progressCell);
var sliderCell = (0, morphux_1.ce)('td', 'only-service');
var sliderProgress = (0, utils_1.createProgress)(param.outputValue);
var sliderValue = sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
var resizer = new morphux_1.MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: function () { return sliderProgress.clientWidth; },
if (sliders.length === 0) {
var row = (0, morphux_1.ce)('tr');
var cell = (0, morphux_1.ce)('td');
cell.appendChild((0, morphux_1.ce)('div', ['mux_text', 'ntsh_dashboard-unity-parameters-loading'], null, 'Waiting for Unity...'));
row.appendChild(cell);
this.parametersTable.appendChild(row);
}
else
sliders.forEach(function (slider) {
var _a, _b;
var multiplierFactor = (_a = slider.visualMultiplier) !== null && _a !== void 0 ? _a : 1;
var decimalPlacesFactor = Math.pow(10, ((_b = slider.decimalPlaces) !== null && _b !== void 0 ? _b : 0));
var value = Math.round(slider.outputValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor;
var row = (0, morphux_1.ce)('tr', 'ntsh_dashboard-unity-parameter-row');
var nameCell = (0, morphux_1.ce)('td');
nameCell.appendChild((0, morphux_1.ce)('div', 'mux_text', null, slider.sliderName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1.ce)('td', 'no-service');
progressCell.appendChild((0, utils_1.createProgress)(value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit));
row.appendChild(progressCell);
var sliderCell = (0, morphux_1.ce)('td', 'only-service');
var sliderProgress = (0, utils_1.createProgress)(value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
var sliderValue = sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
var resizer = new morphux_1.MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: function () { return sliderProgress.clientWidth; },
});
var lastValue = -1;
resizer.on('resized', function (size) {
var percentage = Math.round((size / sliderProgress.clientWidth) * 100) / 100;
var actualValue = slider.min + percentage * (slider.max - slider.min);
if (actualValue === lastValue)
return;
lastValue = actualValue;
_this._Main.socket.emit('unityWebSocket', 'parameterValue', slider.sliderIndex, actualValue);
(0, utils_1.setProgressState)(sliderProgress, Math.round(actualValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
});
row.appendChild(sliderCell);
_this.parametersTable.appendChild(row);
});
var lastPercentage = -1;
resizer.on('resized', function (size) {
var percentage = Math.round((size / sliderProgress.clientWidth) * 100) /
100;
if (percentage === lastPercentage)
return;
lastPercentage = percentage;
_this._Main.socket.emit('unityWebSocket', 'parameterValue', param.sliderIndex, percentage);
(0, utils_1.setProgressState)(sliderProgress, percentage);
});
row.appendChild(sliderCell);
_this.parametersTable.appendChild(row);
});
}
else {
existingSliders.forEach(function (row, index) {
var value = parameters[index].outputValue;
var _a, _b;
var slider = sliders[index];
var multiplierFactor = (_a = slider.visualMultiplier) !== null && _a !== void 0 ? _a : 1;
var decimalPlacesFactor = Math.pow(10, ((_b = slider.decimalPlaces) !== null && _b !== void 0 ? _b : 0));
var value = Math.round(slider.outputValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor;
var progressElement = row.querySelector('.no-service .ntsh_progress');
(0, utils_1.setProgressState)(progressElement, value);
(0, utils_1.setProgressState)(progressElement, value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
var sliderElement = row.querySelector('.only-service .ntsh_progress');
if (sliderElement.querySelector('.mux_resizer-moving') == null)
(0, utils_1.setProgressState)(sliderElement, value);
(0, utils_1.setProgressState)(sliderElement, value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
});
}
};
DashboardUnity.prototype.renderParameterSensors = function (sensors) {
var _this = this;
var existingSensors = this.sensorsTable.querySelectorAll('.ntsh_dashboard-unity-sensor-row');
if (existingSensors.length !== sensors.length) {
this.sensorsTable.innerHTML = '';
if (sensors.length === 0) {
var row = (0, morphux_1.ce)('tr');
var cell = (0, morphux_1.ce)('td');
cell.appendChild((0, morphux_1.ce)('div', ['mux_text', 'ntsh_dashboard-unity-sensors-loading'], null, 'Waiting for Unity...'));
row.appendChild(cell);
this.sensorsTable.appendChild(row);
}
else
sensors.forEach(function (sensor) {
var row = (0, morphux_1.ce)('tr', 'ntsh_dashboard-unity-sensor-row');
var nameCell = (0, morphux_1.ce)('td');
nameCell.appendChild((0, morphux_1.ce)('div', 'mux_text', null, sensor.deviceName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1.ce)('td');
progressCell.appendChild((0, utils_1.createProgress)(Math.round(sensor.outputValue * 100), 0, 100, '%'));
row.appendChild(progressCell);
_this.sensorsTable.appendChild(row);
});
}
else {
existingSensors.forEach(function (row, index) {
var value = sensors[index].outputValue;
var progressElement = row.querySelector('.ntsh_progress');
(0, utils_1.setProgressState)(progressElement, Math.round(value * 100), 0, 100, '%');
});
}
};
@@ -202,10 +282,23 @@ var DashboardUnity = /** @class */ (function () {
return [2 /*return*/];
});
}); });
this.enableOutOfServiceButton.addEventListener('click', function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.executeCommand('enableOutOfService', 'Are you sure you want to set the installation to "Out of Service"?', 'unityWebSocket');
return [2 /*return*/];
});
}); });
this.disableOutOfServiceButton.addEventListener('click', function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.executeCommand('disableOutOfService', 'Are you sure you want to set the installation to "Operational"?', 'unityWebSocket');
return [2 /*return*/];
});
}); });
};
DashboardUnity.prototype.executeCommand = function (command, message) {
return __awaiter(this, void 0, void 0, function () {
DashboardUnity.prototype.executeCommand = function (command_1, message_1) {
return __awaiter(this, arguments, void 0, function (command, message, type) {
var confirmed;
if (type === void 0) { type = 'unityRunner'; }
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, morphux_1.MorphFeature.Confirm({
@@ -218,9 +311,9 @@ var DashboardUnity = /** @class */ (function () {
return [2 /*return*/];
morphux_1.MorphFeature.Loader({
active: true,
message: "Requesting Unity Runner ".concat(command, "..."),
message: "Dispatching command...",
});
this._Main.socket.emit('unityRunner', command, function (response) {
this._Main.socket.emit(type, command, function (response) {
morphux_1.MorphFeature.Loader({ active: false });
if (!response.succeed)
return morphux_1.MorphFeature.Alert({
@@ -229,7 +322,7 @@ var DashboardUnity = /** @class */ (function () {
});
morphux_1.MorphFeature.Notification({
level: 'success',
message: "Unity Runner is ".concat(command, "ing..."),
message: "Dispatched command",
});
});
return [2 /*return*/];

2
frontend/views/dashboard/dist/dashboard.unity.js.map vendored
View File

File diff suppressed because one or more lines are too long

106
frontend/views/dashboard/dist/menubar.js vendored
View File

@@ -45,6 +45,9 @@ var MenuBar = /** @class */ (function () {
this.container = document.querySelector('.ntsh_menubar');
this._Main = main;
this.build();
this._Main.socket.on('supportNumber', function (number) {
_this.supportNumber = number;
});
setTimeout(function () {
if ((localStorage === null || localStorage === void 0 ? void 0 : localStorage.getItem('serviceMode')) === 'true')
_this.toggleServiceMode(true, true);
@@ -53,10 +56,49 @@ var MenuBar = /** @class */ (function () {
MenuBar.prototype.build = function () {
var _this = this;
this.menubar = new Component_MenuBar_1.ComponentMenuBar({
mobile: {
left: [
{
type: 'icon',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: function () { return __awaiter(_this, void 0, void 0, function () {
var mobileMenu;
return __generator(this, function (_a) {
mobileMenu = document.querySelector('.mux_mobilemenu');
mobileMenu === null || mobileMenu === void 0 ? void 0 : mobileMenu.click();
this.restartInstallation();
return [2 /*return*/];
});
}); },
},
],
right: [
{
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: function () { return _this.showSupport(); },
},
],
},
left: [
{
type: 'image',
url: '/img/morphix_logo_white.png',
type: 'normal',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: function () { return __awaiter(_this, void 0, void 0, function () {
var mobileMenu;
return __generator(this, function (_a) {
mobileMenu = document.querySelector('.mux_mobilemenu');
mobileMenu === null || mobileMenu === void 0 ? void 0 : mobileMenu.click();
this.restartInstallation();
return [2 /*return*/];
});
}); },
},
{
type: 'normal',
@@ -92,7 +134,16 @@ var MenuBar = /** @class */ (function () {
],
right: [
{
type: 'normal',
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: function () { return _this.showSupport(); },
},
{
type: document.body.classList.contains('ntsh_service')
? 'normal'
: 'icon',
text: document.body.classList.contains('ntsh_service')
? 'Exit Service'
: 'Service Mode',
@@ -115,6 +166,55 @@ var MenuBar = /** @class */ (function () {
this.container.innerHTML = '';
this.container.appendChild(this.menubar.container);
};
MenuBar.prototype.showSupport = function () {
return __awaiter(this, void 0, void 0, function () {
var dialog, callAnchor;
return __generator(this, function (_a) {
dialog = new morphux_1.MorphComponent.Dialog({
title: 'Contact Support',
width: 'medium',
height: 'auto',
okButtonVisible: false,
cancelButtonVisible: false,
});
this.supportNumber.slice();
callAnchor = (0, morphux_1.ce)('a', 'ntsh_callanchor', { href: "tel:".concat(this.supportNumber) }, "+".concat(this.supportNumber));
dialog.content.appendChild(callAnchor);
setTimeout(function () { return callAnchor.click(); }, 100);
return [2 /*return*/];
});
});
};
MenuBar.prototype.restartInstallation = function () {
return __awaiter(this, void 0, void 0, function () {
var confirmed;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, morphux_1.MorphFeature.Confirm({
title: 'Restart Installation',
message: 'Are you sure you want to restart the installation?',
})];
case 1:
confirmed = _a.sent();
if (!confirmed)
return [2 /*return*/];
morphux_1.MorphFeature.Loader({
active: true,
message: 'Restarting installation...',
});
this._Main.socket.emit('restartInstallation', function (response) {
morphux_1.MorphFeature.Loader({ active: false });
if (!response.succeed)
return morphux_1.MorphFeature.Alert({
title: 'Error',
message: response.message,
});
});
return [2 /*return*/];
}
});
});
};
MenuBar.prototype.toggleServiceMode = function (mode, skipPin) {
return __awaiter(this, void 0, void 0, function () {
var newMode, servicePin;

2
frontend/views/dashboard/dist/menubar.js.map vendored
View File

File diff suppressed because one or more lines are too long

13
frontend/views/dashboard/dist/utils.js vendored
View File

@@ -21,18 +21,19 @@ var setStatusState = function (statusElement, state) {
statusElement.classList.add("ntsh_status-".concat(state));
};
exports.setStatusState = setStatusState;
var setProgressState = function (progressElement, percentage) {
var value = progressElement.querySelector('.ntsh_progress-value');
value.style.width = "".concat(percentage * 100, "%");
var setProgressState = function (progressElement, value, min, max, unit) {
var percentage = (value - min) / (max - min);
var progressValue = progressElement.querySelector('.ntsh_progress-value');
progressValue.style.width = "".concat(percentage * 100, "%");
var label = progressElement.querySelector('.ntsh_progress-label');
label.innerText = "".concat(Math.round(percentage * 100), "%");
label.innerText = "".concat(value).concat(unit);
};
exports.setProgressState = setProgressState;
var createProgress = function (value) {
var createProgress = function (value, min, max, unit) {
var progress = (0, morphux_1.ce)('div', 'ntsh_progress');
progress.appendChild((0, morphux_1.ce)('div', 'ntsh_progress-value'));
progress.appendChild((0, morphux_1.ce)('div', 'ntsh_progress-label'));
(0, exports.setProgressState)(progress, value);
(0, exports.setProgressState)(progress, value, min, max, unit);
return progress;
};
exports.createProgress = createProgress;

2
frontend/views/dashboard/dist/utils.js.map vendored
View File

@@ -1 +1 @@
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../ts/utils.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../ts/utils.ts"],"names":[],"mappings":"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"}

35
frontend/views/dashboard/index.html
View File

@@ -138,6 +138,29 @@
<td>
</td>
</tr>
<tr>
<td>
<div class="mux_text">Service</div>
</td>
<td>
<div class="ntsh_status ntsh_dashboard-unity-outofservicestatus"></div>
</td>
<td>
<div class="ntsh_dashboard-unity-outofserviceinfo mux_text">
</div>
</td>
<td>
<div class="ntsh_buttons">
<div class="ntsh_button mux_text ntsh_dashboard-unity-enableoutofservice">
Set Out of Service
</div>
<div class="ntsh_button mux_text ntsh_dashboard-unity-disableoutofservice">
Set Operational
</div>
</div>
</td>
</tr>
</table>
<div class="ntsh_dashboard-error ntsh_dashboard-unity-error">
@@ -229,6 +252,18 @@
</tr>
</table>
</div>
<div class="ntsh_dashboard-box ntsh_dashboard-unitysensors">
<div class="ntsh_dashboard-box-header mux_header">Sensors</div>
<table class="ntsh_vertical ntsh_dashboard-unity-sensors">
<tr>
<td>
<div class="mux_text ntsh_dashboard-unity-sensors-loading">Waiting for Unity...
</div>
</td>
</tr>
</table>
</div>
</div>
</div>

333
frontend/views/dashboard/script.js
View File

@@ -11628,6 +11628,17 @@
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __assign = (commonjsGlobal && commonjsGlobal.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(Component_MenuBar, "__esModule", { value: true });
Component_MenuBar.ComponentMenuBar = void 0;
var Index_1 = requireIndex();
@@ -11854,15 +11865,27 @@
var inner = (0, CE_1.ce)('div', 'mux_mobilemenu-inner');
this.mobileMenu = new ComponentMenuBar({
direction: 'vertical',
left: this._leftItems.filter(function (item) {
left: this._leftItems
.filter(function (item) {
if (item.uniqueIdentifier == undefined)
return true;
return !_this.mobileIgnoreItems.includes(item.uniqueIdentifier);
})
.map(function (item) {
if (item.type !== 'icon')
return item;
return __assign(__assign({}, item), { type: 'normal' });
}),
right: this._rightItems.filter(function (item) {
right: this._rightItems
.filter(function (item) {
if (item.uniqueIdentifier == undefined)
return true;
return !_this.mobileIgnoreItems.includes(item.uniqueIdentifier);
})
.map(function (item) {
if (item.type !== 'icon')
return item;
return __assign(__assign({}, item), { type: 'normal' });
}),
});
this.mobileMenu.setSelected(this.selected);
@@ -14399,6 +14422,9 @@
this.container = document.querySelector('.ntsh_menubar');
this._Main = main;
this.build();
this._Main.socket.on('supportNumber', function (number) {
_this.supportNumber = number;
});
setTimeout(function () {
if ((localStorage === null || localStorage === void 0 ? void 0 : localStorage.getItem('serviceMode')) === 'true')
_this.toggleServiceMode(true, true);
@@ -14407,10 +14433,49 @@
MenuBar.prototype.build = function () {
var _this = this;
this.menubar = new Component_MenuBar_1.ComponentMenuBar({
mobile: {
left: [
{
type: 'icon',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: function () { return __awaiter$4(_this, void 0, void 0, function () {
var mobileMenu;
return __generator$4(this, function (_a) {
mobileMenu = document.querySelector('.mux_mobilemenu');
mobileMenu === null || mobileMenu === void 0 ? void 0 : mobileMenu.click();
this.restartInstallation();
return [2 /*return*/];
});
}); },
},
],
right: [
{
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: function () { return _this.showSupport(); },
},
],
},
left: [
{
type: 'image',
url: '/img/morphix_logo_white.png',
type: 'normal',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: function () { return __awaiter$4(_this, void 0, void 0, function () {
var mobileMenu;
return __generator$4(this, function (_a) {
mobileMenu = document.querySelector('.mux_mobilemenu');
mobileMenu === null || mobileMenu === void 0 ? void 0 : mobileMenu.click();
this.restartInstallation();
return [2 /*return*/];
});
}); },
},
{
type: 'normal',
@@ -14446,7 +14511,16 @@
],
right: [
{
type: 'normal',
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: function () { return _this.showSupport(); },
},
{
type: document.body.classList.contains('ntsh_service')
? 'normal'
: 'icon',
text: document.body.classList.contains('ntsh_service')
? 'Exit Service'
: 'Service Mode',
@@ -14469,6 +14543,55 @@
this.container.innerHTML = '';
this.container.appendChild(this.menubar.container);
};
MenuBar.prototype.showSupport = function () {
return __awaiter$4(this, void 0, void 0, function () {
var dialog, callAnchor;
return __generator$4(this, function (_a) {
dialog = new morphux_1$5.MorphComponent.Dialog({
title: 'Contact Support',
width: 'medium',
height: 'auto',
okButtonVisible: false,
cancelButtonVisible: false,
});
this.supportNumber.slice();
callAnchor = (0, morphux_1$5.ce)('a', 'ntsh_callanchor', { href: "tel:".concat(this.supportNumber) }, "+".concat(this.supportNumber));
dialog.content.appendChild(callAnchor);
setTimeout(function () { return callAnchor.click(); }, 100);
return [2 /*return*/];
});
});
};
MenuBar.prototype.restartInstallation = function () {
return __awaiter$4(this, void 0, void 0, function () {
var confirmed;
return __generator$4(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, morphux_1$5.MorphFeature.Confirm({
title: 'Restart Installation',
message: 'Are you sure you want to restart the installation?',
})];
case 1:
confirmed = _a.sent();
if (!confirmed)
return [2 /*return*/];
morphux_1$5.MorphFeature.Loader({
active: true,
message: 'Restarting installation...',
});
this._Main.socket.emit('restartInstallation', function (response) {
morphux_1$5.MorphFeature.Loader({ active: false });
if (!response.succeed)
return morphux_1$5.MorphFeature.Alert({
title: 'Error',
message: response.message,
});
});
return [2 /*return*/];
}
});
});
};
MenuBar.prototype.toggleServiceMode = function (mode, skipPin) {
return __awaiter$4(this, void 0, void 0, function () {
var newMode, servicePin;
@@ -14671,18 +14794,19 @@
statusElement.classList.add("ntsh_status-".concat(state));
};
exports.setStatusState = setStatusState;
var setProgressState = function (progressElement, percentage) {
var value = progressElement.querySelector('.ntsh_progress-value');
value.style.width = "".concat(percentage * 100, "%");
var setProgressState = function (progressElement, value, min, max, unit) {
var percentage = (value - min) / (max - min);
var progressValue = progressElement.querySelector('.ntsh_progress-value');
progressValue.style.width = "".concat(percentage * 100, "%");
var label = progressElement.querySelector('.ntsh_progress-label');
label.innerText = "".concat(Math.round(percentage * 100), "%");
label.innerText = "".concat(value).concat(unit);
};
exports.setProgressState = setProgressState;
var createProgress = function (value) {
var createProgress = function (value, min, max, unit) {
var progress = (0, morphux_1.ce)('div', 'ntsh_progress');
progress.appendChild((0, morphux_1.ce)('div', 'ntsh_progress-value'));
progress.appendChild((0, morphux_1.ce)('div', 'ntsh_progress-label'));
(0, exports.setProgressState)(progress, value);
(0, exports.setProgressState)(progress, value, min, max, unit);
return progress;
};
exports.createProgress = createProgress;
@@ -15520,6 +15644,10 @@
this.uptimeInfo = document.querySelector('.ntsh_dashboard-unity-uptime');
this.webSocketStatus = document.querySelector('.ntsh_dashboard-unity-websocketstatus');
this.webSocketInfo = document.querySelector('.ntsh_dashboard-unity-websocketinfo');
this.outOfServiceStatus = document.querySelector('.ntsh_dashboard-unity-outofservicestatus');
this.outOfServiceInfo = document.querySelector('.ntsh_dashboard-unity-outofserviceinfo');
this.enableOutOfServiceButton = document.querySelector('.ntsh_dashboard-unity-enableoutofservice');
this.disableOutOfServiceButton = document.querySelector('.ntsh_dashboard-unity-disableoutofservice');
this.zedStreamStatus = document.querySelector('.ntsh_dashboard-unity-zedstreamstatus');
this.zedStreamInfo = document.querySelector('.ntsh_dashboard-unity-zedstreaminfo');
this.zedStreamFps = document.querySelector('.ntsh_dashboard-unity-zedstreamfps');
@@ -15528,6 +15656,7 @@
this.timelineStanding = document.querySelector('.ntsh_dashboard-unity-timeline-standing');
this.timelineProgress = document.querySelector('.ntsh_dashboard-unity-timeline-progress');
this.parametersTable = document.querySelector('.ntsh_dashboard-unity-parameters');
this.sensorsTable = document.querySelector('.ntsh_dashboard-unity-sensors');
this.errorContainer = document.querySelector('.ntsh_dashboard-unity-error');
this.errorText = document.querySelector('.ntsh_dashboard-unity-errortext');
this._Main = Main;
@@ -15545,7 +15674,7 @@
}
(0, utils_1.setStatusState)(this.processStatus, {
RUNNING: 'green',
STOPPED: 'red',
STOPPED: 'gray',
STARTING: 'yellow',
PROBLEM: 'red',
}[state.state]);
@@ -15571,6 +15700,28 @@
FAILED: 'red',
}[state.state]);
this.webSocketInfo.innerText = (_a = state.message) !== null && _a !== void 0 ? _a : '';
// ----------- Out of Service -----------
(0, utils_1.setStatusState)(this.outOfServiceStatus, state.parameters.outOfService == null
? 'gray'
: state.parameters.outOfService
? 'red'
: 'green');
this.outOfServiceInfo.innerText =
state.parameters.outOfService == null
? ''
: state.parameters.outOfService
? 'Out of Service'
: 'Operational';
this.enableOutOfServiceButton.style.display =
state.parameters.outOfService == null ||
state.parameters.outOfService
? 'none'
: 'flex';
this.disableOutOfServiceButton.style.display =
state.parameters.outOfService &&
state.parameters.outOfService != null
? 'flex'
: 'none';
// ----------- ZED Stream -----------
(0, utils_1.setStatusState)(this.zedStreamStatus, state.parameters.zedReady ? 'green' : 'red');
this.zedStreamInfo.innerText = state.parameters.zedReady
@@ -15585,9 +15736,10 @@
this.timelineStanding.innerText = state.parameters.timelineStanding
? 'Yes'
: 'No';
(0, utils_1.setProgressState)(this.timelineProgress, state.parameters.timelineProgress);
(0, utils_1.setProgressState)(this.timelineProgress, Math.round(state.parameters.timelineProgress * 100), 0, 100, '%');
// ----------- Parameters -----------
this.renderParameterSliders(state.parameters.parameters);
this.renderParameterSliders(state.state == 'CONNECTED' ? state.parameters.sliders : []);
this.renderParameterSensors(state.state == 'CONNECTED' ? state.parameters.sensors : []);
// ----------- Error -----------
if (((_b = state === null || state === void 0 ? void 0 : state.error) !== null && _b !== void 0 ? _b : '').trim().length > 0)
this.webSocketError = state.error;
@@ -15595,55 +15747,107 @@
this.webSocketError = null;
this.updateError();
};
DashboardUnity.prototype.renderParameterSliders = function (parameters) {
DashboardUnity.prototype.renderParameterSliders = function (sliders) {
var _this = this;
if (parameters.length === 0)
return;
var existingSliders = this.parametersTable.querySelectorAll('.ntsh_dashboard-unity-parameter-row');
if (existingSliders.length !== parameters.length) {
if (existingSliders.length !== sliders.length) {
this.parametersTable.innerHTML = '';
parameters.forEach(function (param) {
var row = (0, morphux_1$1.ce)('tr', 'ntsh_dashboard-unity-parameter-row');
var nameCell = (0, morphux_1$1.ce)('td');
nameCell.appendChild((0, morphux_1$1.ce)('div', 'mux_text', null, param.sliderName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1$1.ce)('td', 'no-service');
progressCell.appendChild((0, utils_1.createProgress)(param.outputValue));
row.appendChild(progressCell);
var sliderCell = (0, morphux_1$1.ce)('td', 'only-service');
var sliderProgress = (0, utils_1.createProgress)(param.outputValue);
var sliderValue = sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
var resizer = new morphux_1$1.MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: function () { return sliderProgress.clientWidth; },
if (sliders.length === 0) {
var row = (0, morphux_1$1.ce)('tr');
var cell = (0, morphux_1$1.ce)('td');
cell.appendChild((0, morphux_1$1.ce)('div', ['mux_text', 'ntsh_dashboard-unity-parameters-loading'], null, 'Waiting for Unity...'));
row.appendChild(cell);
this.parametersTable.appendChild(row);
}
else
sliders.forEach(function (slider) {
var _a, _b;
var multiplierFactor = (_a = slider.visualMultiplier) !== null && _a !== void 0 ? _a : 1;
var decimalPlacesFactor = Math.pow(10, ((_b = slider.decimalPlaces) !== null && _b !== void 0 ? _b : 0));
var value = Math.round(slider.outputValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor;
var row = (0, morphux_1$1.ce)('tr', 'ntsh_dashboard-unity-parameter-row');
var nameCell = (0, morphux_1$1.ce)('td');
nameCell.appendChild((0, morphux_1$1.ce)('div', 'mux_text', null, slider.sliderName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1$1.ce)('td', 'no-service');
progressCell.appendChild((0, utils_1.createProgress)(value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit));
row.appendChild(progressCell);
var sliderCell = (0, morphux_1$1.ce)('td', 'only-service');
var sliderProgress = (0, utils_1.createProgress)(value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
var sliderValue = sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
var resizer = new morphux_1$1.MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: function () { return sliderProgress.clientWidth; },
});
var lastValue = -1;
resizer.on('resized', function (size) {
var percentage = Math.round((size / sliderProgress.clientWidth) * 100) / 100;
var actualValue = slider.min + percentage * (slider.max - slider.min);
if (actualValue === lastValue)
return;
lastValue = actualValue;
_this._Main.socket.emit('unityWebSocket', 'parameterValue', slider.sliderIndex, actualValue);
(0, utils_1.setProgressState)(sliderProgress, Math.round(actualValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
});
row.appendChild(sliderCell);
_this.parametersTable.appendChild(row);
});
var lastPercentage = -1;
resizer.on('resized', function (size) {
var percentage = Math.round((size / sliderProgress.clientWidth) * 100) /
100;
if (percentage === lastPercentage)
return;
lastPercentage = percentage;
_this._Main.socket.emit('unityWebSocket', 'parameterValue', param.sliderIndex, percentage);
(0, utils_1.setProgressState)(sliderProgress, percentage);
});
row.appendChild(sliderCell);
_this.parametersTable.appendChild(row);
});
}
else {
existingSliders.forEach(function (row, index) {
var value = parameters[index].outputValue;
var _a, _b;
var slider = sliders[index];
var multiplierFactor = (_a = slider.visualMultiplier) !== null && _a !== void 0 ? _a : 1;
var decimalPlacesFactor = Math.pow(10, ((_b = slider.decimalPlaces) !== null && _b !== void 0 ? _b : 0));
var value = Math.round(slider.outputValue *
multiplierFactor *
decimalPlacesFactor) / decimalPlacesFactor;
var progressElement = row.querySelector('.no-service .ntsh_progress');
(0, utils_1.setProgressState)(progressElement, value);
(0, utils_1.setProgressState)(progressElement, value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
var sliderElement = row.querySelector('.only-service .ntsh_progress');
if (sliderElement.querySelector('.mux_resizer-moving') == null)
(0, utils_1.setProgressState)(sliderElement, value);
(0, utils_1.setProgressState)(sliderElement, value, slider.min * multiplierFactor, slider.max * multiplierFactor, slider.unit);
});
}
};
DashboardUnity.prototype.renderParameterSensors = function (sensors) {
var _this = this;
var existingSensors = this.sensorsTable.querySelectorAll('.ntsh_dashboard-unity-sensor-row');
if (existingSensors.length !== sensors.length) {
this.sensorsTable.innerHTML = '';
if (sensors.length === 0) {
var row = (0, morphux_1$1.ce)('tr');
var cell = (0, morphux_1$1.ce)('td');
cell.appendChild((0, morphux_1$1.ce)('div', ['mux_text', 'ntsh_dashboard-unity-sensors-loading'], null, 'Waiting for Unity...'));
row.appendChild(cell);
this.sensorsTable.appendChild(row);
}
else
sensors.forEach(function (sensor) {
var row = (0, morphux_1$1.ce)('tr', 'ntsh_dashboard-unity-sensor-row');
var nameCell = (0, morphux_1$1.ce)('td');
nameCell.appendChild((0, morphux_1$1.ce)('div', 'mux_text', null, sensor.deviceName));
row.appendChild(nameCell);
var progressCell = (0, morphux_1$1.ce)('td');
progressCell.appendChild((0, utils_1.createProgress)(Math.round(sensor.outputValue * 100), 0, 100, '%'));
row.appendChild(progressCell);
_this.sensorsTable.appendChild(row);
});
}
else {
existingSensors.forEach(function (row, index) {
var value = sensors[index].outputValue;
var progressElement = row.querySelector('.ntsh_progress');
(0, utils_1.setProgressState)(progressElement, Math.round(value * 100), 0, 100, '%');
});
}
};
@@ -15674,10 +15878,23 @@
return [2 /*return*/];
});
}); });
this.enableOutOfServiceButton.addEventListener('click', function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.executeCommand('enableOutOfService', 'Are you sure you want to set the installation to "Out of Service"?', 'unityWebSocket');
return [2 /*return*/];
});
}); });
this.disableOutOfServiceButton.addEventListener('click', function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.executeCommand('disableOutOfService', 'Are you sure you want to set the installation to "Operational"?', 'unityWebSocket');
return [2 /*return*/];
});
}); });
};
DashboardUnity.prototype.executeCommand = function (command, message) {
return __awaiter(this, void 0, void 0, function () {
DashboardUnity.prototype.executeCommand = function (command_1, message_1) {
return __awaiter(this, arguments, void 0, function (command, message, type) {
var confirmed;
if (type === void 0) { type = 'unityRunner'; }
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, morphux_1$1.MorphFeature.Confirm({
@@ -15690,9 +15907,9 @@
return [2 /*return*/];
morphux_1$1.MorphFeature.Loader({
active: true,
message: "Requesting Unity Runner ".concat(command, "..."),
message: "Dispatching command...",
});
this._Main.socket.emit('unityRunner', command, function (response) {
this._Main.socket.emit(type, command, function (response) {
morphux_1$1.MorphFeature.Loader({ active: false });
if (!response.succeed)
return morphux_1$1.MorphFeature.Alert({
@@ -15701,7 +15918,7 @@
});
morphux_1$1.MorphFeature.Notification({
level: 'success',
message: "Unity Runner is ".concat(command, "ing..."),
message: "Dispatched command",
});
});
return [2 /*return*/];

2
frontend/views/dashboard/script.js.map
View File

File diff suppressed because one or more lines are too long

21
frontend/views/dashboard/scss/dashboard.scss
View File

@@ -38,6 +38,13 @@
}
}
.ntsh_dashboard-unity-sensors {
.ntsh_dashboard-unity-sensors-loading {
text-align: center;
color: #9d9d9d;
}
}
table {
width: 100%;
@@ -175,4 +182,18 @@
}
}
}
.ntsh_callanchor {
width: 100%;
background: #202020;
margin-bottom: calc(var(--mux-edge-offset) * -1);
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
padding: var(--mux-edge-offset) 0px;
color: #fff;
font-family: monospace;
letter-spacing: 0px;
}

3
frontend/views/dashboard/scss/index.scss
View File

@@ -17,7 +17,7 @@ body {
}
.mux_menubar-locater.mux_left {
.mux_menubar-item {
.mux_menubar-item:not([uid="restart_installation"]) {
display: none;
}
}
@@ -32,6 +32,7 @@ body {
display: none;
}
}
}
.sn {

20
frontend/views/dashboard/style.css
View File

@@ -2400,6 +2400,10 @@ body {
text-align: center;
color: #9d9d9d;
}
.ntsh_dashboard .ntsh_dashboard-unity-sensors .ntsh_dashboard-unity-sensors-loading {
text-align: center;
color: #9d9d9d;
}
.ntsh_dashboard table {
width: 100%;
}
@@ -2506,6 +2510,20 @@ body {
background: #5a5a5a;
}
.ntsh_callanchor {
width: 100%;
background: #202020;
margin-bottom: calc(var(--mux-edge-offset) * -1);
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
padding: var(--mux-edge-offset) 0px;
color: #fff;
font-family: monospace;
letter-spacing: 0px;
}
.ntsh_tabs {
position: absolute;
inset: 50px 0 0 0;
@@ -2555,7 +2573,7 @@ body {
body:not(.ntsh_service) .ntsh_buttons {
display: none;
}
body:not(.ntsh_service) .mux_menubar-locater.mux_left .mux_menubar-item {
body:not(.ntsh_service) .mux_menubar-locater.mux_left .mux_menubar-item:not([uid=restart_installation]) {
display: none;
}
body:not(.ntsh_service) .only-service {

2
frontend/views/dashboard/style.css.map
View File

File diff suppressed because one or more lines are too long

344
frontend/views/dashboard/ts/dashboard.unity.ts
View File

@@ -35,6 +35,19 @@ export class DashboardUnity {
'.ntsh_dashboard-unity-websocketinfo'
);
outOfServiceStatus: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-outofservicestatus'
);
outOfServiceInfo: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-outofserviceinfo'
);
enableOutOfServiceButton: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-enableoutofservice'
);
disableOutOfServiceButton: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-disableoutofservice'
);
zedStreamStatus: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-zedstreamstatus'
);
@@ -63,6 +76,10 @@ export class DashboardUnity {
'.ntsh_dashboard-unity-parameters'
);
sensorsTable: HTMLTableElement = document.querySelector(
'.ntsh_dashboard-unity-sensors'
);
errorContainer: HTMLDivElement = document.querySelector(
'.ntsh_dashboard-unity-error'
);
@@ -91,7 +108,7 @@ export class DashboardUnity {
this.processStatus,
{
RUNNING: 'green',
STOPPED: 'red',
STOPPED: 'gray',
STARTING: 'yellow',
PROBLEM: 'red',
}[state.state] as StatusType
@@ -126,6 +143,33 @@ export class DashboardUnity {
);
this.webSocketInfo.innerText = state.message ?? '';
// ----------- Out of Service -----------
setStatusState(
this.outOfServiceStatus,
state.parameters.outOfService == null
? 'gray'
: state.parameters.outOfService
? 'red'
: 'green'
);
this.outOfServiceInfo.innerText =
state.parameters.outOfService == null
? ''
: state.parameters.outOfService
? 'Out of Service'
: 'Operational';
this.enableOutOfServiceButton.style.display =
state.parameters.outOfService == null ||
state.parameters.outOfService
? 'none'
: 'flex';
this.disableOutOfServiceButton.style.display =
state.parameters.outOfService &&
state.parameters.outOfService != null
? 'flex'
: 'none';
// ----------- ZED Stream -----------
setStatusState(
this.zedStreamStatus,
@@ -146,11 +190,19 @@ export class DashboardUnity {
: 'No';
setProgressState(
this.timelineProgress,
state.parameters.timelineProgress
Math.round(state.parameters.timelineProgress * 100),
0,
100,
'%'
);
// ----------- Parameters -----------
this.renderParameterSliders(state.parameters.parameters);
this.renderParameterSliders(
state.state == 'CONNECTED' ? state.parameters.sliders : []
);
this.renderParameterSensors(
state.state == 'CONNECTED' ? state.parameters.sensors : []
);
// ----------- Error -----------
if ((state?.error ?? '').trim().length > 0)
@@ -159,78 +211,210 @@ export class DashboardUnity {
this.updateError();
}
private renderParameterSliders(parameters: UnityParameters['parameters']) {
if (parameters.length === 0) return;
private renderParameterSliders(sliders: UnityParameters['sliders']) {
const existingSliders = this.parametersTable.querySelectorAll(
'.ntsh_dashboard-unity-parameter-row'
);
if (existingSliders.length !== parameters.length) {
if (existingSliders.length !== sliders.length) {
this.parametersTable.innerHTML = '';
parameters.forEach((param) => {
const row = ce('tr', 'ntsh_dashboard-unity-parameter-row');
const nameCell = ce('td');
nameCell.appendChild(
ce('div', 'mux_text', null, param.sliderName)
if (sliders.length === 0) {
const row = ce('tr');
const cell = ce('td');
cell.appendChild(
ce(
'div',
['mux_text', 'ntsh_dashboard-unity-parameters-loading'],
null,
'Waiting for Unity...'
)
);
row.appendChild(nameCell);
const progressCell = ce('td', 'no-service');
progressCell.appendChild(createProgress(param.outputValue));
row.appendChild(progressCell);
const sliderCell = ce('td', 'only-service');
const sliderProgress = createProgress(param.outputValue);
const sliderValue: HTMLDivElement =
sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
const resizer = new MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: () => sliderProgress.clientWidth,
});
let lastPercentage: number = -1;
resizer.on('resized', (size) => {
const percentage =
Math.round((size / sliderProgress.clientWidth) * 100) /
100;
if (percentage === lastPercentage) return;
lastPercentage = percentage;
this._Main.socket.emit(
'unityWebSocket',
'parameterValue',
param.sliderIndex,
percentage
);
setProgressState(sliderProgress, percentage);
});
row.appendChild(sliderCell);
row.appendChild(cell);
this.parametersTable.appendChild(row);
});
} else
sliders.forEach((slider) => {
const multiplierFactor = slider.visualMultiplier ?? 1;
const decimalPlacesFactor =
10 ** (slider.decimalPlaces ?? 0);
const value =
Math.round(
slider.outputValue *
multiplierFactor *
decimalPlacesFactor
) / decimalPlacesFactor;
const row = ce('tr', 'ntsh_dashboard-unity-parameter-row');
const nameCell = ce('td');
nameCell.appendChild(
ce('div', 'mux_text', null, slider.sliderName)
);
row.appendChild(nameCell);
const progressCell = ce('td', 'no-service');
progressCell.appendChild(
createProgress(
value,
slider.min * multiplierFactor,
slider.max * multiplierFactor,
slider.unit
)
);
row.appendChild(progressCell);
const sliderCell = ce('td', 'only-service');
const sliderProgress = createProgress(
value,
slider.min * multiplierFactor,
slider.max * multiplierFactor,
slider.unit
);
const sliderValue: HTMLDivElement =
sliderProgress.querySelector('.ntsh_progress-value');
sliderValue.classList.add('mux_resizer');
sliderCell.appendChild(sliderProgress);
const resizer = new MorphComponent.Resizer({
existingContainer: sliderValue,
direction: 'right',
relative: true,
min: 0,
max: () => sliderProgress.clientWidth,
});
let lastValue: number = -1;
resizer.on('resized', (size) => {
const percentage =
Math.round(
(size / sliderProgress.clientWidth) * 100
) / 100;
var actualValue =
slider.min + percentage * (slider.max - slider.min);
if (actualValue === lastValue) return;
lastValue = actualValue;
this._Main.socket.emit(
'unityWebSocket',
'parameterValue',
slider.sliderIndex,
actualValue
);
setProgressState(
sliderProgress,
Math.round(
actualValue *
multiplierFactor *
decimalPlacesFactor
) / decimalPlacesFactor,
slider.min * multiplierFactor,
slider.max * multiplierFactor,
slider.unit
);
});
row.appendChild(sliderCell);
this.parametersTable.appendChild(row);
});
} else {
existingSliders.forEach((row, index) => {
const value = parameters[index].outputValue;
const slider = sliders[index];
const multiplierFactor = slider.visualMultiplier ?? 1;
const decimalPlacesFactor = 10 ** (slider.decimalPlaces ?? 0);
const value =
Math.round(
slider.outputValue *
multiplierFactor *
decimalPlacesFactor
) / decimalPlacesFactor;
const progressElement: HTMLDivElement = row.querySelector(
'.no-service .ntsh_progress'
);
setProgressState(progressElement, value);
setProgressState(
progressElement,
value,
slider.min * multiplierFactor,
slider.max * multiplierFactor,
slider.unit
);
const sliderElement: HTMLDivElement = row.querySelector(
'.only-service .ntsh_progress'
);
if (sliderElement.querySelector('.mux_resizer-moving') == null)
setProgressState(sliderElement, value);
setProgressState(
sliderElement,
value,
slider.min * multiplierFactor,
slider.max * multiplierFactor,
slider.unit
);
});
}
}
private renderParameterSensors(sensors: UnityParameters['sensors']) {
const existingSensors = this.sensorsTable.querySelectorAll(
'.ntsh_dashboard-unity-sensor-row'
);
if (existingSensors.length !== sensors.length) {
this.sensorsTable.innerHTML = '';
if (sensors.length === 0) {
const row = ce('tr');
const cell = ce('td');
cell.appendChild(
ce(
'div',
['mux_text', 'ntsh_dashboard-unity-sensors-loading'],
null,
'Waiting for Unity...'
)
);
row.appendChild(cell);
this.sensorsTable.appendChild(row);
} else
sensors.forEach((sensor) => {
const row = ce('tr', 'ntsh_dashboard-unity-sensor-row');
const nameCell = ce('td');
nameCell.appendChild(
ce('div', 'mux_text', null, sensor.deviceName)
);
row.appendChild(nameCell);
const progressCell = ce('td');
progressCell.appendChild(
createProgress(
Math.round(sensor.outputValue * 100),
0,
100,
'%'
)
);
row.appendChild(progressCell);
this.sensorsTable.appendChild(row);
});
} else {
existingSensors.forEach((row, index) => {
const value = sensors[index].outputValue;
const progressElement: HTMLDivElement =
row.querySelector('.ntsh_progress');
setProgressState(
progressElement,
Math.round(value * 100),
0,
100,
'%'
);
});
}
}
@@ -264,9 +448,29 @@ export class DashboardUnity {
'Are you sure you want to restart the Unity Runner process?'
);
});
this.enableOutOfServiceButton.addEventListener('click', async () => {
this.executeCommand(
'enableOutOfService',
'Are you sure you want to set the installation to "Out of Service"?',
'unityWebSocket'
);
});
this.disableOutOfServiceButton.addEventListener('click', async () => {
this.executeCommand(
'disableOutOfService',
'Are you sure you want to set the installation to "Operational"?',
'unityWebSocket'
);
});
}
private async executeCommand(command: string, message: string) {
private async executeCommand(
command: string,
message: string,
type: 'unityRunner' | 'unityWebSocket' = 'unityRunner'
) {
const confirmed = await MorphFeature.Confirm({
title: 'Are you sure?',
message,
@@ -275,10 +479,10 @@ export class DashboardUnity {
MorphFeature.Loader({
active: true,
message: `Requesting Unity Runner ${command}...`,
message: `Dispatching command...`,
});
this._Main.socket.emit(
'unityRunner',
type,
command,
(response: { succeed: boolean; message?: string }) => {
MorphFeature.Loader({ active: false });
@@ -291,7 +495,7 @@ export class DashboardUnity {
MorphFeature.Notification({
level: 'success',
message: `Unity Runner is ${command}ing...`,
message: `Dispatched command`,
});
}
);
@@ -322,7 +526,16 @@ interface UnityParameters {
zedPath: string;
zedReady: boolean;
zedFPS: string;
parameters: UnitySocketMessageHeartbeat['heartbeat']['dataSliders'];
outOfService: boolean;
sliders: UnityParameterSlider[];
sensors: UnitySocketMessageHeartbeat['heartbeat']['dataSensors'];
}
type UnityHeartbeatSlider =
UnitySocketMessageHeartbeat['heartbeat']['dataSliders'][number];
interface UnityParameterSlider extends UnityHeartbeatSlider {
visualMultiplier: number;
decimalPlaces: number;
}
interface UnitySocketMessageBase {
@@ -332,10 +545,18 @@ interface UnitySocketMessageBase {
interface UnitySocketMessageHeartbeat extends UnitySocketMessageBase {
type: 'heartbeat_data';
heartbeat: {
dataSensors: {
sensorIndex: number;
deviceName: string;
outputValue: number;
}[];
dataSliders: {
sliderIndex: number;
sliderName: string;
outputValue: number;
min: number;
max: number;
unit: string;
}[];
dataTimeline: {
isStanding: boolean;
@@ -349,5 +570,6 @@ interface UnitySocketMessageHeartbeat extends UnitySocketMessageBase {
streamInputPort: number;
zedGrabError: number;
};
showOutOfService?: boolean;
};
}

105
frontend/views/dashboard/ts/menuBar.ts
View File

@@ -1,4 +1,4 @@
import { MorphComponent, MorphFeature } from 'morphux';
import { ce, MorphComponent, MorphFeature } from 'morphux';
import { Main } from './main';
import { ComponentMenuBar } from 'morphux/dist/Components/MenuBar/Component.MenuBar';
@@ -9,11 +9,17 @@ export class MenuBar {
menubar: ComponentMenuBar;
supportNumber: string;
constructor(main: Main) {
this._Main = main;
this.build();
this._Main.socket.on('supportNumber', (number: string) => {
this.supportNumber = number;
});
setTimeout(() => {
if (localStorage?.getItem('serviceMode') === 'true')
this.toggleServiceMode(true, true);
@@ -22,10 +28,47 @@ export class MenuBar {
build() {
this.menubar = new ComponentMenuBar({
mobile: {
left: [
{
type: 'icon',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: async () => {
const mobileMenu: HTMLDivElement =
document.querySelector('.mux_mobilemenu');
mobileMenu?.click();
this.restartInstallation();
},
},
],
right: [
{
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: () => this.showSupport(),
},
],
},
left: [
{
type: 'image',
url: '/img/morphix_logo_white.png',
type: 'normal',
text: 'Restart',
materialIcon: 'restart_alt',
uniqueIdentifier: 'restart_installation',
click: async () => {
const mobileMenu: HTMLDivElement =
document.querySelector('.mux_mobilemenu');
mobileMenu?.click();
this.restartInstallation();
},
},
{
type: 'normal',
@@ -65,7 +108,16 @@ export class MenuBar {
right: [
{
type: 'normal',
type: 'icon',
text: 'Support',
materialIcon: 'call_quality',
uniqueIdentifier: 'call_support',
click: () => this.showSupport(),
},
{
type: document.body.classList.contains('ntsh_service')
? 'normal'
: 'icon',
text: document.body.classList.contains('ntsh_service')
? 'Exit Service'
: 'Service Mode',
@@ -90,6 +142,51 @@ export class MenuBar {
this.container.appendChild(this.menubar.container);
}
async showSupport() {
const dialog = new MorphComponent.Dialog({
title: 'Contact Support',
width: 'medium',
height: 'auto',
okButtonVisible: false,
cancelButtonVisible: false,
});
this.supportNumber.slice();
const callAnchor = ce(
'a',
'ntsh_callanchor',
{ href: `tel:${this.supportNumber}` },
`+${this.supportNumber}`
);
dialog.content.appendChild(callAnchor);
setTimeout(() => callAnchor.click(), 100);
}
async restartInstallation() {
const confirmed = await MorphFeature.Confirm({
title: 'Restart Installation',
message: 'Are you sure you want to restart the installation?',
});
if (!confirmed) return;
MorphFeature.Loader({
active: true,
message: 'Restarting installation...',
});
this._Main.socket.emit(
'restartInstallation',
(response: { succeed: boolean; message?: string }) => {
MorphFeature.Loader({ active: false });
if (!response.succeed)
return MorphFeature.Alert({
title: 'Error',
message: response.message,
});
}
);
}
async toggleServiceMode(
mode?: boolean,
skipPin?: boolean

22
frontend/views/dashboard/ts/utils.ts
View File

@@ -26,24 +26,34 @@ export type StatusType = 'green' | 'yellow' | 'red' | 'gray';
export const setProgressState = (
progressElement: HTMLDivElement,
percentage: number
value: number,
min: number,
max: number,
unit: string
) => {
const value: HTMLDivElement = progressElement.querySelector(
const percentage = (value - min) / (max - min);
const progressValue: HTMLDivElement = progressElement.querySelector(
'.ntsh_progress-value'
);
value.style.width = `${percentage * 100}%`;
progressValue.style.width = `${percentage * 100}%`;
const label: HTMLDivElement = progressElement.querySelector(
'.ntsh_progress-label'
);
label.innerText = `${Math.round(percentage * 100)}%`;
label.innerText = `${value}${unit}`;
};
export const createProgress = (value: number) => {
export const createProgress = (
value: number,
min: number,
max: number,
unit: string
) => {
const progress = ce('div', 'ntsh_progress');
progress.appendChild(ce('div', 'ntsh_progress-value'));
progress.appendChild(ce('div', 'ntsh_progress-label'));
setProgressState(progress, value);
setProgressState(progress, value, min, max, unit);
return progress;
};
export function capitalizeFirstLetter(string: string) {