commit 18/09/2025
This commit is contained in:
302
html/webpage/assets/js/broadcastzones.js
Normal file
302
html/webpage/assets/js/broadcastzones.js
Normal file
@@ -0,0 +1,302 @@
|
||||
/**
|
||||
* @typedef {Object} BroadcastZone
|
||||
* @property {number} index
|
||||
* @property {string} description
|
||||
* @property {String} SoundChannel
|
||||
* @property {String} Box
|
||||
* @property {String} Relay
|
||||
*/
|
||||
|
||||
/**
|
||||
* List of broadcast zones available
|
||||
* @type {BroadcastZone[]}
|
||||
*/
|
||||
let BroadcastZoneList = [];
|
||||
|
||||
/**
|
||||
* Currently selected broadcast zone row in the table
|
||||
* @type {JQuery<HTMLElement>|null}
|
||||
*/
|
||||
let selectedBroadcastZoneRow = null;
|
||||
|
||||
/**
|
||||
* Fill broadcast zone table body with values
|
||||
* @param {BroadcastZone[]} vv values to fill
|
||||
*/
|
||||
function fill_broadcastzonetablebody(vv) {
|
||||
$('#broadcastzonetablebody').empty();
|
||||
if (!Array.isArray(vv) || vv.length === 0) return;
|
||||
vv.forEach(item => {
|
||||
const row = `<tr>
|
||||
<td>${item.index}</td>
|
||||
<td>${item.description}</td>
|
||||
<td>${item.soundChannel}</td>
|
||||
<td>${item.box}</td>
|
||||
<td>${item.relay}</td>
|
||||
</tr>`;
|
||||
$('#broadcastzonetablebody').append(row);
|
||||
let $addedrow = $('#broadcastzonetablebody tr:last');
|
||||
$addedrow.click(function () {
|
||||
if (selectedBroadcastZoneRow) {
|
||||
selectedBroadcastZoneRow.find('td').css('background-color', '');
|
||||
if (selectedBroadcastZoneRow.is($(this))) {
|
||||
selectedBroadcastZoneRow = null;
|
||||
$('#btnRemove').prop('disabled', true);
|
||||
$('#btnEdit').prop('disabled', true);
|
||||
return;
|
||||
}
|
||||
}
|
||||
$(this).find('td').css('background-color', '#ffeeba');
|
||||
selectedBroadcastZoneRow = $(this);
|
||||
$('#btnRemove').prop('disabled', false);
|
||||
$('#btnEdit').prop('disabled', false);
|
||||
});
|
||||
});
|
||||
$('#tablesize').text("Table Size: " + vv.length);
|
||||
}
|
||||
|
||||
/**
|
||||
* Reload broadcast zones from server
|
||||
* @param {String} APIURL API URL endpoint (default "BroadcastZones/")
|
||||
*/
|
||||
function reloadBroadcastZones(APIURL = "BroadcastZones/") {
|
||||
BroadcastZoneList = [];
|
||||
fetchAPI(APIURL + "List", "GET", {}, null, (okdata) => {
|
||||
if (Array.isArray(okdata)) {
|
||||
//console.log("reloadBroadcastZones : ", okdata)
|
||||
BroadcastZoneList = okdata;
|
||||
fill_broadcastzonetablebody(BroadcastZoneList);
|
||||
} else console.log("reloadBroadcastZones: okdata is not array");
|
||||
}, (errdata) => {
|
||||
alert("Error loading broadcast zones : " + errdata.message);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
console.log("broadcastzones.js loaded successfully");
|
||||
selectedBroadcastZoneRow = null;
|
||||
let $btnClear = $('#btnClear');
|
||||
let $btnAdd = $('#btnAdd');
|
||||
let $btnEdit = $('#btnEdit');
|
||||
let $btnRemove = $('#btnRemove');
|
||||
let $btnExport = $('#btnExport');
|
||||
let $btnImport = $('#btnImport');
|
||||
$btnEdit.prop('disabled', true);
|
||||
$btnRemove.prop('disabled', true);
|
||||
let APIURL_BroadcastZone = "BroadcastZones/";
|
||||
|
||||
|
||||
let $broadcastzonemodal = $('#broadcastzonemodal');
|
||||
let $broadcastzoneindex = $broadcastzonemodal.find('#broadcastzoneindex');
|
||||
let $broadcastzonedescription = $broadcastzonemodal.find('#broadcastzonedescription');
|
||||
let $broadcastzonesoundchannel = $broadcastzonemodal.find('#broadcastzonesoundchannel');
|
||||
let $broadcastzonebox = $broadcastzonemodal.find('#broadcastzonebox');
|
||||
|
||||
|
||||
|
||||
let $findzone = $('#findzone');
|
||||
$findzone.on('input', function () {
|
||||
let searchTerm = $findzone.val().trim().toLowerCase();
|
||||
if (searchTerm.length > 0) {
|
||||
selectedBroadcastZoneRow = null;
|
||||
let filtered = broadcastzonedata.filter(item => item.description.toLowerCase().includes(searchTerm) || item.box.toLowerCase().includes(searchTerm) || item.soundChannel.toLowerCase().includes(searchTerm) || item.relay.toLowerCase().includes(searchTerm));
|
||||
fill_broadcastzonetablebody(filtered);
|
||||
} else {
|
||||
selectedBroadcastZoneRow = null;
|
||||
fill_broadcastzonetablebody(broadcastzonedata);
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Find Checkbox for relays 1 to 32
|
||||
* Checkbox id is 01 to 32 with leading zero for 1 to 9
|
||||
* @param {number} id 1 - 32
|
||||
* @returns JQuery<HTMLElement>
|
||||
*/
|
||||
function cbRelay(id) {
|
||||
return $broadcastzonemodal.find('#R' + (id < 10 ? '0' : '') + id);
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear broadcast zone modal to default state
|
||||
*/
|
||||
function clearBroadcastZoneModal() {
|
||||
$broadcastzoneindex.prop('disabled', true).val('');
|
||||
$broadcastzonedescription.val('');
|
||||
$broadcastzonesoundchannel.val('');
|
||||
$broadcastzonebox.val('');
|
||||
for (let i = 1; i <= 32; i++) {
|
||||
cbRelay(i).prop('checked', false);
|
||||
}
|
||||
}
|
||||
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
|
||||
$btnClear.click(() => {
|
||||
DoClear(APIURL_BroadcastZone, "BroadcastZones", (okdata) => {
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
alert("Success clear broadcast zones: " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error clear broadcast zones: " + errdata.message);
|
||||
});
|
||||
});
|
||||
|
||||
$btnAdd.click(() => {
|
||||
$broadcastzonemodal.modal('show');
|
||||
clearBroadcastZoneModal();
|
||||
|
||||
$broadcastzonemodal.off('click.broadcastzonesave').on('click.broadcastzonesave', '#broadcastzonesave', function () {
|
||||
|
||||
let description = $broadcastzonedescription.val().trim();
|
||||
let soundChannel = $broadcastzonesoundchannel.val().trim();
|
||||
let box = $broadcastzonebox.val().trim();
|
||||
let relayArray = [];
|
||||
for (let i = 1; i <= 32; i++) {
|
||||
if (cbRelay(i).is(':checked')) {
|
||||
relayArray.push(i);
|
||||
}
|
||||
}
|
||||
let relay = relayArray.join(';');
|
||||
if (description.length === 0) {
|
||||
alert("Description cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (soundChannel.length === 0) {
|
||||
alert("Sound Channel cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (box.length === 0) {
|
||||
alert("Box cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (relayArray.length === 0) {
|
||||
alert("At least one relay must be selected");
|
||||
return;
|
||||
}
|
||||
let bz = {
|
||||
description: description,
|
||||
SoundChannel: soundChannel,
|
||||
Box: box,
|
||||
Relay: relay
|
||||
};
|
||||
fetchAPI(APIURL_BroadcastZone + "Add", "POST", bz, null, (okdata) => {
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
alert("Success add new broadcast zone: " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error add new broadcast zone: " + errdata.message);
|
||||
});
|
||||
|
||||
$broadcastzonemodal.modal('hide');
|
||||
});
|
||||
$broadcastzonemodal.off('click.broadcastzoneclose').on('click.broadcastzoneclose', '#broadcastzoneclose', function () {
|
||||
$broadcastzonemodal.modal('hide');
|
||||
});
|
||||
});
|
||||
|
||||
$btnRemove.click(() => {
|
||||
if (selectedBroadcastZoneRow) {
|
||||
let cells = selectedBroadcastZoneRow.find('td');
|
||||
/** @type {BroadcastZone} */
|
||||
let bz = {
|
||||
index: cells.eq(0).text(),
|
||||
description: cells.eq(1).text(),
|
||||
SoundChannel: cells.eq(2).text(),
|
||||
Box: cells.eq(3).text(),
|
||||
Relay: cells.eq(4).text()
|
||||
};
|
||||
if (confirm(`Are you sure to delete broadcast zone [${bz.index}] Description=${bz.description}?`)) {
|
||||
fetchAPI(APIURL_BroadcastZone + "DeleteByIndex/" + bz.index, "DELETE", {}, null, (okdata) => {
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
alert("Success delete broadcast zone: " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error delete broadcast zone: " + errdata.message);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$btnEdit.click(() => {
|
||||
if (selectedBroadcastZoneRow) {
|
||||
let cells = selectedBroadcastZoneRow.find('td');
|
||||
/** @type {BroadcastZone} */
|
||||
let bz = {
|
||||
index: cells.eq(0).text(),
|
||||
description: cells.eq(1).text(),
|
||||
SoundChannel: cells.eq(2).text(),
|
||||
Box: cells.eq(3).text(),
|
||||
Relay: cells.eq(4).text()
|
||||
};
|
||||
if (confirm(`Are you sure to edit broadcast zone [${bz.index}] Description=${bz.description} SoundChannel=${bz.SoundChannel} Box=${bz.Box} Relay=${bz.Relay}?`)) {
|
||||
$broadcastzonemodal.modal('show');
|
||||
clearBroadcastZoneModal();
|
||||
$broadcastzoneindex.val(bz.index);
|
||||
$broadcastzonedescription.val(bz.description);
|
||||
$broadcastzonesoundchannel.val(bz.SoundChannel);
|
||||
$broadcastzonebox.val(bz.Box);
|
||||
if (bz.Relay) {
|
||||
bz.Relay.split(';').forEach(relayId => {
|
||||
let id = parseInt(relayId, 10);
|
||||
cbRelay(id).prop('checked', true);
|
||||
});
|
||||
}
|
||||
$broadcastzonemodal.off('click.broadcastzonesave').on('click.broadcastzonesave', '#broadcastzonesave', function () {
|
||||
let description = $broadcastzonedescription.val().trim();
|
||||
let soundChannel = $broadcastzonesoundchannel.val().trim();
|
||||
let box = $broadcastzonebox.val().trim();
|
||||
let relayArray = [];
|
||||
for (let i = 1; i <= 32; i++) {
|
||||
if (cbRelay(i).is(':checked')) {
|
||||
relayArray.push(i);
|
||||
}
|
||||
}
|
||||
let relay = relayArray.join(';');
|
||||
if (description.length === 0) {
|
||||
alert("Description cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (soundChannel.length === 0) {
|
||||
alert("Sound Channel cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (box.length === 0) {
|
||||
alert("Box cannot be empty");
|
||||
return;
|
||||
}
|
||||
if (relayArray.length === 0) {
|
||||
alert("At least one relay must be selected");
|
||||
return;
|
||||
}
|
||||
let bzUpdate = {
|
||||
description: description,
|
||||
SoundChannel: soundChannel,
|
||||
Box: box,
|
||||
Relay: relay
|
||||
};
|
||||
fetchAPI(APIURL_BroadcastZone + "UpdateByIndex/" + bz.index, "PATCH", bzUpdate, null, (okdata) => {
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
alert("Success edit broadcast zone: " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error edit broadcast zone: " + errdata.message);
|
||||
});
|
||||
$broadcastzonemodal.modal('hide');
|
||||
});
|
||||
$broadcastzonemodal.off('click.broadcastzoneclose').on('click.broadcastzoneclose', '#broadcastzoneclose', function () {
|
||||
$broadcastzonemodal.modal('hide');
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$btnExport.click(() => {
|
||||
DoExport(APIURL_BroadcastZone, "broadcastzones.xlsx", {});
|
||||
});
|
||||
|
||||
$btnImport.click(() => {
|
||||
DoImport(APIURL_BroadcastZone, (okdata) => {
|
||||
reloadBroadcastZones(APIURL_BroadcastZone);
|
||||
alert("Success import broadcast zones: " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error importing broadcast zones from XLSX: " + errdata.message);
|
||||
});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user