plc_control/web/js/app.js

94 lines
3.3 KiB
JavaScript

import { withStatus } from "./api.js";
import { openChart, renderChart } from "./chart.js";
import { dom } from "./dom.js";
import { closeApiDocDrawer, openApiDocDrawer } from "./docs.js";
import {
clearPointBinding,
closeEquipmentDrawer,
loadEquipments,
openEquipmentDrawer,
resetEquipmentForm,
saveEquipment,
} from "./equipment.js";
import { startLogs, startPointSocket } from "./logs.js";
import { createPoints, loadPoints, loadTree, renderSelectedNodes, savePointBinding } from "./points.js";
import { state } from "./state.js";
import { browseNodes, loadSources, saveSource } from "./sources.js";
function bindEvents() {
dom.sourceForm.addEventListener("submit", (event) => withStatus(saveSource(event)));
dom.equipmentForm.addEventListener("submit", (event) => withStatus(saveEquipment(event)));
dom.pointBindingForm.addEventListener("submit", (event) => withStatus(savePointBinding(event)));
dom.sourceResetBtn.addEventListener("click", () => dom.sourceForm.reset());
dom.equipmentResetBtn.addEventListener("click", resetEquipmentForm);
dom.refreshEquipmentBtn.addEventListener("click", () => withStatus(loadEquipments()));
dom.newEquipmentBtn.addEventListener("click", resetEquipmentForm);
dom.browseNodesBtn.addEventListener("click", () => withStatus(browseNodes()));
dom.refreshTreeBtn.addEventListener("click", () => withStatus(loadTree()));
dom.createPointsBtn.addEventListener("click", () => withStatus(createPoints()));
dom.closeModalBtn.addEventListener("click", () => dom.pointModal.classList.add("hidden"));
dom.openSourceFormBtn.addEventListener("click", () => {
dom.sourceForm.reset();
dom.sourceId.value = "";
dom.sourceModal.classList.remove("hidden");
});
dom.closeSourceModalBtn.addEventListener("click", () => dom.sourceModal.classList.add("hidden"));
dom.clearPointBindingBtn.addEventListener("click", () => withStatus(clearPointBinding()));
dom.closePointBindingModalBtn.addEventListener("click", () => {
dom.pointBindingModal.classList.add("hidden");
});
dom.openEquipmentDrawerBtn.addEventListener("click", openEquipmentDrawer);
dom.closeEquipmentDrawerBtn.addEventListener("click", closeEquipmentDrawer);
dom.openApiDocBtn.addEventListener("click", () => withStatus(openApiDocDrawer()));
dom.closeApiDocBtn.addEventListener("click", closeApiDocDrawer);
dom.refreshChartBtn.addEventListener("click", () => {
if (!state.chartPointId) {
return;
}
withStatus(openChart(state.chartPointId, state.chartPointName));
});
dom.prevPointsBtn.addEventListener("click", () => {
if (state.pointsPage > 1) {
state.pointsPage -= 1;
withStatus(loadPoints());
}
});
dom.nextPointsBtn.addEventListener("click", () => {
const totalPages = Math.max(1, Math.ceil(state.pointsTotal / state.pointsPageSize));
if (state.pointsPage < totalPages) {
state.pointsPage += 1;
withStatus(loadPoints());
}
});
dom.equipmentKeyword.addEventListener("keydown", (event) => {
if (event.key === "Enter") {
event.preventDefault();
withStatus(loadEquipments());
}
});
}
async function bootstrap() {
bindEvents();
renderSelectedNodes();
renderChart();
startLogs();
startPointSocket();
await withStatus(loadSources());
await withStatus(loadEquipments());
await withStatus(loadPoints());
}
bootstrap();