rdkartono/FA_Gateway_Java
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit 02/07/2025

Browse Source
This commit is contained in:
rdkartono
2025-07-02 16:02:07 +07:00
parent b8d185f46a
commit 86f6ec14a4
6 changed files with 1201 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/html/assets/js/connection.js
View File

@@ -5,16 +5,19 @@ console.log("Initializing websocket");
socket.onopen = () => { socket.onopen = () => {
console.log("WebSocket connected"); console.log("WebSocket connected");
window.connected = true;
}; };
socket.onerror = (err) => { socket.onerror = (err) => {
console.error("WebSocket error:", err); console.error("WebSocket error:", err);
window.connected = false;
}; };
socket.onclose = () => { socket.onclose = () => {
console.log("WebSocket closed"); console.log("WebSocket closed");
window.connected = false;
}; };
window.send_data = function(value){ window.send_data = function(value){
@@ -23,7 +26,7 @@ window.send_data = function(value){
console.log("Sent data : "+value); console.log("Sent data : "+value);
} else { } else {
setTimeout(() => send_data(value),50) setTimeout(() => send_data(value),50)
console.log("Failed to send_data, socket readyState = "+socket.readyState); //console.log("Failed to send_data, socket readyState = "+socket.readyState);
} }
} }

1004
src/html/assets/js/index.js
View File

File diff suppressed because it is too large Load Diff

2
src/html/assets/js/jquery-3.7.1.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

55
src/html/assets/js/setting.js
View File

@@ -1,10 +1,59 @@
document.addEventListener("DOMContentLoaded", function () { $(document).ready(function() {
console.log("Setting page loaded"); console.log("Setting page loaded");
$('#btnApplySetting').on('click', function() {
send_data(JSON.stringify({
request: "SET_SETTING",
args: {
smtpServer: $('#smtpServer').val(),
smtpPort: $('#smtpPort').val(),
smtpUsername: $('#smtpUsername').val(),
smtpPassword: $('#smtpPassword').val(),
smtpSSL: $('#smtpSSL').is(':checked'),
smtpSenderAddress: $('#smtpSenderAddress').val(),
smtpSenderName: $('#smtpSenderName').val(),
smtpSubject: $('#smtpSubject').val(),
vx3kIP: $('#vx3kIP').val(),
vx3kPort: $('#vx3kPort').val(),
mqttBrokerIP: $('#mqttBrokerIP').val(),
mqttPort: $('#mqttPort').val(),
mqttUsername: $('#mqttUsername').val(),
mqttPassword: $('#mqttPassword').val(),
mqttClientID: $('#mqttClientID').val(),
mqttTopic: $('#mqttTopic').val()
}
}));
});
$('#btnResetDefault').on('click', function() {
send_data(JSON.stringify({request: "RESET_DEFAULT"}));
});
socket.onmessage = (event) => { socket.onmessage = (event) => {
const data = JSON.parse(event.data); const data = JSON.parse(event.data);
console.log("Received from server:", data); console.log("Received from server:", data);
if (data.response === "GET_SETTING") {
$('#smtpServer').val(data.args.smtpServer);
$('#smtpPort').val(data.args.smtpPort);
$('#smtpUsername').val(data.args.smtpUsername);
$('#smtpPassword').val(data.args.smtpPassword);
$('#smtpSSL').prop('checked', data.args.smtpSSL);
$('#smtpSenderAddress').val(data.args.smtpSenderAddress);
$('#smtpSenderName').val(data.args.smtpSenderName);
$('#smtpSubject').val(data.args.smtpSubject);
$('#vx3kIP').val(data.args.vx3kIP);
$('#vx3kPort').val(data.args.vx3kPort);
$('#mqttBrokerIP').val(data.args.mqttBrokerIP);
$('#mqttPort').val(data.args.mqttPort);
$('#mqttUsername').val(data.args.mqttUsername);
$('#mqttPassword').val(data.args.mqttPassword);
$('#mqttClientID').val(data.args.mqttClientID);
$('#mqttTopic').val(data.args.mqttTopic);
} else if (data.response === "RESET_DEFAULT") {
alert(data.args);
} else if (data.response === "SET_SETTING") {
alert(data.args);
}
}; };
// first request to get settings
send_data(JSON.stringify({request:"GET_SETTING"})); send_data(JSON.stringify({request:"GET_SETTING"}));
}); });

137
src/html/index.html
View File

@@ -25,7 +25,144 @@
<div class="d-none d-md-block"><a class="btn btn-primary" role="button" href="#">Login</a></div> <div class="d-none d-md-block"><a class="btn btn-primary" role="button" href="#">Login</a></div>
</div> </div>
</nav> </nav>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th class="col-1">C-IN</th>
<th class="col-1">Description</th>
<th class="col-2">Email</th>
<th class="col-2">Modbus</th>
<th class="col-2">VX-3000</th>
<th class="col-2">MQTT</th>
</tr>
</thead>
<tbody>
<tr>
<td id="c1Index">1</td>
<td id="c1Description">N/A</td>
<td id="c1Email">N/A</td>
<td id="c1Modbus">N/A</td>
<td id="c1VX3K">N/A</td>
<td id="c1Mqtt">N/A</td>
</tr>
<tr>
<td id="c2Index">2</td>
<td id="c2Description">N/A</td>
<td id="c2Email">N/A</td>
<td id="c2Modbus">N/A</td>
<td id="c2VX3K">N/A</td>
<td id="c2Mqtt">N/A</td>
</tr>
<tr>
<td id="c3Index">3</td>
<td id="c3Description">N/A</td>
<td id="c3Email">N/A</td>
<td id="c3Modbus">N/A</td>
<td id="c3VX3K">N/A</td>
<td id="c3Mqtt">N/A</td>
</tr>
<tr>
<td id="c4Index">4</td>
<td id="c4Description">N/A</td>
<td id="c4Email">N/A</td>
<td id="c4Modbus">N/A</td>
<td id="c4VX3K">N/A</td>
<td id="c4Mqtt">N/A</td>
</tr>
<tr>
<td id="c5Index">5</td>
<td id="c5Description">N/A</td>
<td id="c5Email">N/A</td>
<td id="c5Modbus">N/A</td>
<td id="c5VX3K">N/A</td>
<td id="c5Mqtt">N/A</td>
</tr>
<tr>
<td id="c6Index">6</td>
<td id="c6Description">N/A</td>
<td id="c6Email">N/A</td>
<td id="c6Modbus">N/A</td>
<td id="c6VX3K">N/A</td>
<td id="c6Mqtt">N/A</td>
</tr>
<tr>
<td id="c7Index">7</td>
<td id="c7Description">N/A</td>
<td id="c7Email">N/A</td>
<td id="c7Modbus">N/A</td>
<td id="c7VX3K">N/A</td>
<td id="c7Mqtt">N/A</td>
</tr>
<tr>
<td id="c8Index">8</td>
<td id="c8Description">N/A</td>
<td id="c8Email">N/A</td>
<td id="c8Modbus">N/A</td>
<td id="c8VX3K">N/A</td>
<td id="c8Mqtt">N/A</td>
</tr>
</tbody>
</table>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="emailModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Email Setting</h4><button class="btn-close" type="button" aria-label="Close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="mb-3 form-check"><input type="radio" id="disableEmail" class="form-check-input" checked="" name="enabledisableEmail"><label class="form-label">Disable</label></div>
<div class="mb-3 form-check"><input type="radio" id="enableEmail" class="form-check-input" name="enabledisableEmail"><label class="form-label me-2">Send To</label><input class="w-50" type="email" id="emailInput" placeholder="Enter Email Address"></div>
</div>
<div class="modal-footer"><button class="btn btn-light" id="btnClose" type="button" data-bs-dismiss="modal">Close</button><button class="btn btn-primary" id="btnSave" type="button">Save</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="mqttModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">MQTT Setting</h4><button class="btn-close" type="button" aria-label="Close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="mb-3 form-check"><input type="radio" id="disableMqtt" class="form-check-input" checked="" name="enabledisableMqtt"><label class="form-label">Disable</label></div>
<div class="mb-3 form-check"><input type="radio" id="enableMqtt" class="form-check-input" name="enabledisableMqtt"><label class="form-label me-2">Enable</label></div>
</div>
<div class="modal-footer"><button class="btn btn-light" id="btnClose" type="button" data-bs-dismiss="modal">Close</button><button class="btn btn-primary" id="btnSave" type="button">Save</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="modbusModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Modbus Setting</h4><button class="btn-close" type="button" aria-label="Close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="mb-3 form-check"><input type="radio" id="disableModbus" class="form-check-input" checked="" name="enabledisableModbus"><label class="form-label">Disable</label></div>
<div class="mb-3 form-check"><input type="radio" id="enableModbus" class="form-check-input" name="enabledisableModbus"><label class="form-label me-2">Holding Register</label><input class="w-50" type="number" id="modbusRegister" placeholder="Modbus Register" min="0" max="2000"></div>
</div>
<div class="modal-footer"><button class="btn btn-light" id="btnClose" type="button" data-bs-dismiss="modal">Close</button><button class="btn btn-primary" id="btnSave" type="button">Save</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="vx3kModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">VX-3000 Setting</h4><button class="btn-close" type="button" aria-label="Close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="mb-3 form-check"><input type="radio" id="disableVX3K" class="form-check-input" checked="" name="enabledisableVX3K"><label class="form-label">Disable</label></div>
<div class="mb-3 form-check"><input type="radio" id="enableVX3K" class="form-check-input" name="enabledisableVX3K"><label class="form-label me-2">Frame ID</label><input class="w-25 me-2" type="number" id="VX3KFrameID" placeholder="Frame ID" min="0" max="39"><label class="form-label me-2">Contact ID</label><input class="w-25 me-2" type="number" id="VX3KContactID" min="0" max="15" placeholder="Contact ID"></div>
</div>
<div class="modal-footer"><button class="btn btn-light" id="btnClose" type="button" data-bs-dismiss="modal">Close</button><button class="btn btn-primary" id="btnSave" type="button">Save</button></div>
</div>
</div>
</div>
<script src="assets/bootstrap/js/bootstrap.min.js"></script> <script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/jquery-3.7.1.min.js"></script>
<script src="assets/js/connection.js"></script> <script src="assets/js/connection.js"></script>
<script src="assets/js/index.js"></script> <script src="assets/js/index.js"></script>
</body> </body>

13
src/html/setting.html
View File

@@ -94,31 +94,32 @@
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"><label class="col-form-label w-100 h-100">Username</label></div> <div class="col-md-6"><label class="col-form-label w-100 h-100">Username</label></div>
<div class="col-md-6"><input class="w-100 mt-1 mb-1" type="number" id="mqttUsername" placeholder="for login to Broker"></div> <div class="col-md-6"><input class="w-100 mt-1 mb-1" type="text" id="mqttUsername" placeholder="for login to Broker"></div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"><label class="col-form-label w-100 h-100">Password</label></div> <div class="col-md-6"><label class="col-form-label w-100 h-100">Password</label></div>
<div class="col-md-6"><input class="w-100 mt-1 mb-1" type="number" id="mqttPassword" placeholder="for login to Broker"></div> <div class="col-md-6"><input class="w-100 mt-1 mb-1" type="text" id="mqttPassword" placeholder="for login to Broker"></div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"><label class="col-form-label w-100 h-100">Client ID</label></div> <div class="col-md-6"><label class="col-form-label w-100 h-100">Client ID</label></div>
<div class="col-md-6"><input class="w-100 mt-1 mb-1" type="number" id="mqttClientID" placeholder="Client ID"></div> <div class="col-md-6"><input class="w-100 mt-1 mb-1" type="text" id="mqttClientID" placeholder="Client ID"></div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"><label class="col-form-label w-100 h-100">Topic</label></div> <div class="col-md-6"><label class="col-form-label w-100 h-100">Topic</label></div>
<div class="col-md-6"><input class="w-100 mt-1 mb-1" type="number" id="mqttTopic" placeholder="Topic"></div> <div class="col-md-6"><input class="w-100 mt-1 mb-1" type="text" id="mqttTopic" placeholder="Topic"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-6"><button class="btn btn-primary w-100 h-100" type="button">Reset Default</button></div> <div class="col-md-6"><button class="btn btn-primary w-100 h-100" id="btnResetDefault" type="button">Reset Default</button></div>
<div class="col-md-6"><button class="btn btn-primary w-100 h-100" type="button">Apply</button></div> <div class="col-md-6"><button class="btn btn-primary w-100 h-100" id="btnApplySetting" type="button">Apply</button></div>
</div> </div>
</div> </div>
</div> </div>
<script src="assets/bootstrap/js/bootstrap.min.js"></script> <script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/jquery-3.7.1.min.js"></script>
<script src="assets/js/connection.js"></script> <script src="assets/js/connection.js"></script>
<script src="assets/js/setting.js"></script> <script src="assets/js/setting.js"></script>
</body> </body>