Compare commits
No commits in common. "fix" and "main" have entirely different histories.
|
|
@ -129,5 +129,4 @@ dist
|
|||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
.idea
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
# Datasource local storage ignored files
|
||||
/dataSources/
|
||||
/dataSources.local.xml
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="Go" enabled="true" />
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$" />
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="HttpUrlsUsage" enabled="true" level="WEAK WARNING" enabled_by_default="true">
|
||||
<option name="ignoredUrls">
|
||||
<list>
|
||||
<option value="http://${apiServer}" />
|
||||
<option value="http://0.0.0.0" />
|
||||
<option value="http://127.0.0.1" />
|
||||
<option value="http://activemq.apache.org/schema/" />
|
||||
<option value="http://cxf.apache.org/schemas/" />
|
||||
<option value="http://java.sun.com/" />
|
||||
<option value="http://javafx.com/fxml" />
|
||||
<option value="http://javafx.com/javafx/" />
|
||||
<option value="http://json-schema.org/draft" />
|
||||
<option value="http://localhost" />
|
||||
<option value="http://maven.apache.org/POM/" />
|
||||
<option value="http://maven.apache.org/xsd/" />
|
||||
<option value="http://primefaces.org/ui" />
|
||||
<option value="http://schema.cloudfoundry.org/spring/" />
|
||||
<option value="http://schemas.xmlsoap.org/" />
|
||||
<option value="http://tiles.apache.org/" />
|
||||
<option value="http://www.ibm.com/webservices/xsd" />
|
||||
<option value="http://www.jboss.com/xml/ns/" />
|
||||
<option value="http://www.jboss.org/j2ee/schema/" />
|
||||
<option value="http://www.springframework.org/schema/" />
|
||||
<option value="http://www.springframework.org/security/tags" />
|
||||
<option value="http://www.springframework.org/tags" />
|
||||
<option value="http://www.thymeleaf.org" />
|
||||
<option value="http://www.w3.org/" />
|
||||
<option value="http://xmlns.jcp.org/" />
|
||||
</list>
|
||||
</option>
|
||||
</inspection_tool>
|
||||
</profile>
|
||||
</component>
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/client.iml" filepath="$PROJECT_DIR$/.idea/client.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
296
index.html
296
index.html
|
|
@ -4,137 +4,9 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Буревестник-client</title>
|
||||
<script src="jq.js"></script>
|
||||
<style>
|
||||
body {
|
||||
background-color: #2E2E2E;
|
||||
color: #E0E0E0;
|
||||
font-family: Arial, sans-serif;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
}
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 2vw;
|
||||
}
|
||||
.global-cont {
|
||||
position: absolute;
|
||||
top: 0%;
|
||||
height: 100%;
|
||||
width: 67%;
|
||||
left: 1%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.nc-fields{
|
||||
position: relative;
|
||||
width: 90%;
|
||||
left: 0%;
|
||||
top: 3%;
|
||||
background-color: #1E1E1E;
|
||||
padding: 3%;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.container {
|
||||
position: relative;
|
||||
width: 90%;
|
||||
left: 0%;
|
||||
top: 10%;
|
||||
background-color: #1E1E1E;
|
||||
padding: 3%;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.input-group {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
input[type="text"], input[type="number"] {
|
||||
background-color: #333;
|
||||
/* border: 1px solid #555; */
|
||||
color: #E0E0E0;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
flex: 1;
|
||||
/* width: 30%; */
|
||||
}
|
||||
button {
|
||||
background-color: #555;
|
||||
color: #E0E0E0;
|
||||
border: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
width: 30%;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #777;
|
||||
}
|
||||
.checkbox-group, .radio-group {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
align-items: center;
|
||||
}
|
||||
.log {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 3%;
|
||||
background-color: #111;
|
||||
height: 90vh;
|
||||
max-height: 90vh;
|
||||
width: 30%;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
overflow-y: scroll;
|
||||
color: green;
|
||||
font-size: 1.4vw;
|
||||
padding: 2%;
|
||||
padding-top: 2%;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.ipaddr {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
.port {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
}
|
||||
.btn-pldconn .btn-plddatawr {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
font-size: 1.4vw;
|
||||
text-align: center;
|
||||
}
|
||||
.reg-data {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
.reg-addr {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
}
|
||||
p{
|
||||
display: inline-block;
|
||||
}
|
||||
.invalid-args {
|
||||
border: 1px solid rgb(110, 0, 0);
|
||||
}
|
||||
.valid-args {
|
||||
border: 1px solid #555;
|
||||
}
|
||||
</style>
|
||||
<script src="./thirdparty/jq.js"></script>
|
||||
<script src="./thirdparty/index.js"></script>
|
||||
<link rel="stylesheet" href="./thirdparty/index.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="global-cont">
|
||||
|
|
@ -143,7 +15,7 @@
|
|||
<div class="input-group">
|
||||
<input type="text" placeholder="IP address" id="ipAddress" class="ipaddr valid-args">
|
||||
<input type="number" placeholder="Port" id="port" class="port valid-args">
|
||||
<button onclick="connect()" class="btn-pldconn">Connect</button>
|
||||
<button class="btn-pldconn" id="connect-btn">Connect</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
|
|
@ -151,6 +23,9 @@
|
|||
<label>
|
||||
<input type="radio" name="mode" value="wr"> WR
|
||||
</label>
|
||||
<label> </label>
|
||||
<label class="addr-label"><div>Address</div></label>
|
||||
<label class="data-label"><div>Data</div></label>
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<div class="checkbox-group">
|
||||
|
|
@ -161,165 +36,14 @@
|
|||
<input type="checkbox" id="inc"> INC
|
||||
</label>
|
||||
</div>
|
||||
<input type="text" placeholder="Address" id="address" class="reg-addr valid-args">
|
||||
<input type="text" placeholder="Data" id="data" class="reg-data valid-args">
|
||||
<input type="text" placeholder="Reg-address" id="address" class="reg-addr valid-args">
|
||||
<button onclick="send()" class="btn-plddatawr">Send</button>
|
||||
<button class="btn-plddatawr" id="send-btn">Send</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="log" id="log">
|
||||
Logs will appear here... <br>
|
||||
<div class="log-desc">Logs</div><br>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var isConnected = false;
|
||||
var apiIsAlive = false;
|
||||
// TODO: change to valid url
|
||||
var apiServer = "http://localhost:8080"
|
||||
|
||||
function hello_api() {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: `${apiServer}/hello`,
|
||||
data: "",
|
||||
contentType: "application/json",
|
||||
success: function(status){
|
||||
console.log(status)
|
||||
ok_msg_conn("API-Server is running. Connection established");
|
||||
apiIsAlive = true;
|
||||
},
|
||||
error: function(er,status){
|
||||
err_msg_conn(`API-Server unreachable. Error: ${JSON.stringify(er)}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
function connect_pld(ip, port) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: `${apiServer}/connect`,
|
||||
data: JSON.stringify({
|
||||
"ip_address": ip,
|
||||
"port": port
|
||||
}),
|
||||
// dataType: "json",
|
||||
contentType: "application/json",
|
||||
success: function(data){
|
||||
ok_msg_conn(`Successfully connected to PLD ${ip}:${port}`);
|
||||
isConnected = true;
|
||||
return true;
|
||||
},
|
||||
error: function(er){
|
||||
err_msg_conn(`Cannot open web-socket with ${ip}:${port}. Error: ${JSON.stringify(er)}`);
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
function sendData(data, address, wrd, inc) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: `${apiServer}/send`,
|
||||
data: JSON.stringify({
|
||||
"request_type": "0x01",
|
||||
"data_size": "ryzhi xyi",
|
||||
"additional_header": {
|
||||
"wrd": wrd,
|
||||
"auto_increment": inc,
|
||||
"register_address": address
|
||||
},
|
||||
"data" : data,
|
||||
}),
|
||||
// dataType: "json",
|
||||
contentType: "application/json",
|
||||
success: function(data){
|
||||
ok_msg_conn(`Successfully sent data to ${address}`);
|
||||
return true;
|
||||
},
|
||||
error: function(er){
|
||||
err_msg_conn(`Cannot send data to ${address}. Error: ${JSON.stringify(er)}`);
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
hello_api();
|
||||
|
||||
function connect() {
|
||||
if (!apiIsAlive) {
|
||||
err_msg_conn("Cannot work without API-Server. Check it health...");
|
||||
return;
|
||||
}
|
||||
const ipAddress = document.getElementById('ipAddress').value;
|
||||
const port = document.getElementById('port').value;
|
||||
if (ipAddress == "" || port == "") {
|
||||
err_msg_conn(`Cannot connect to PLD. Empty fields IP or Port`);
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
}
|
||||
else {
|
||||
ok_msg_conn(`Connecting to ${ipAddress}:${port}...`);
|
||||
if (connect_pld(ipAddress, port)) {
|
||||
valid('ipAddress');
|
||||
valid('port');
|
||||
} else {
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function send() {
|
||||
if (!apiIsAlive) {
|
||||
err_msg_conn("Cannot work without API-Server. Check it health...");
|
||||
return;
|
||||
}
|
||||
const address = document.getElementById('address').value;
|
||||
const data = document.getElementById('data').value;
|
||||
const wrd = () => document.querySelector('input[type=radio]:checked')?.value === "wr";
|
||||
const inc = document.querySelector('#inc').checked;
|
||||
|
||||
if (isConnected) {
|
||||
valid('ipAddress');
|
||||
valid('port');
|
||||
if (address == "" || data == "") {
|
||||
err_msg_conn(`Cannot send data to PLD. Empty fields Data or Segment-address`);
|
||||
invalid('address');
|
||||
invalid('data');
|
||||
}
|
||||
else {
|
||||
ok_msg_conn(`Sending data to address ${address}`);
|
||||
valid('address');
|
||||
valid('data');
|
||||
if (!sendData(data, address, wrd(), inc)) {
|
||||
invalid('address');
|
||||
invalid('data');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
err_msg_conn(`Cannot send any data! Connect to PLD first`);
|
||||
}
|
||||
}
|
||||
function valid(id) {
|
||||
var obj = document.getElementById(id).classList;
|
||||
if (obj.contains('invalid-args')) {
|
||||
obj.remove('invalid-args');
|
||||
obj.add('valid-args');
|
||||
}
|
||||
}
|
||||
function invalid(id) {
|
||||
var obj = document.getElementById(id).classList;
|
||||
if (obj.contains("valid-args")) {
|
||||
obj.remove("valid-args");
|
||||
obj.add("invalid-args");
|
||||
}
|
||||
}
|
||||
function ok_msg_conn(data) {
|
||||
document.getElementById('log').innerHTML += String(`<p style="color:white"><span style="color:green"><b>[OK]</b></span> ${new Date().toLocaleString()} : ${data}</p><br>`)
|
||||
}
|
||||
function err_msg_conn(data) {
|
||||
document.getElementById('log').innerHTML += String(`<p style="color:white"><span style="color:red"><b>[ERROR]</b></span> ${new Date().toLocaleString()} : ${data}</p><br>`)
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,159 @@
|
|||
body {
|
||||
background-color: #2E2E2E;
|
||||
color: #E0E0E0;
|
||||
font-family: Arial, sans-serif;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
}
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 2vw;
|
||||
}
|
||||
.global-cont {
|
||||
position: absolute;
|
||||
top: 0%;
|
||||
height: 100%;
|
||||
width: 67%;
|
||||
left: 1%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.nc-fields{
|
||||
position: relative;
|
||||
width: 90%;
|
||||
left: 0%;
|
||||
top: 3%;
|
||||
background-color: #1E1E1E;
|
||||
padding: 3%;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.container {
|
||||
position: relative;
|
||||
width: 90%;
|
||||
left: 0%;
|
||||
top: 10%;
|
||||
background-color: #1E1E1E;
|
||||
padding: 3%;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.input-group {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
input[type="text"], input[type="number"] {
|
||||
background-color: #333;
|
||||
/* border: 1px solid #555; */
|
||||
color: #E0E0E0;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
flex: 1;
|
||||
/* width: 30%; */
|
||||
}
|
||||
button {
|
||||
background-color: #555;
|
||||
color: #E0E0E0;
|
||||
border: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
width: 30%;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #777;
|
||||
}
|
||||
.checkbox-group, .radio-group {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
align-items: center;
|
||||
}
|
||||
.addr-label {
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
width: 10vw;
|
||||
text-align: center;
|
||||
border: 1px solid red;
|
||||
}
|
||||
.data-label {
|
||||
position: relative;
|
||||
width: 80%;
|
||||
max-width: 30%;
|
||||
border: 1px solid red;
|
||||
}
|
||||
.log-desc {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
font-size: 2vw;
|
||||
font-weight: bold;
|
||||
color: #E0E0E0;
|
||||
}
|
||||
|
||||
/* .reg-data {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
.reg-addr {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
} */
|
||||
|
||||
.log {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 3%;
|
||||
background-color: #111;
|
||||
height: 90vh;
|
||||
max-height: 90vh;
|
||||
width: 30%;
|
||||
max-width: 30%;
|
||||
border-radius: 4px;
|
||||
padding: 15px;
|
||||
overflow-y: scroll;
|
||||
color: green;
|
||||
font-size: 1.4vw;
|
||||
padding: 2%;
|
||||
padding-top: 2%;
|
||||
box-shadow: 0px 0.5vw 1vw #1f1f1f;
|
||||
}
|
||||
.ipaddr {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
.port {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
}
|
||||
.btn-pldconn .btn-plddatawr {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
font-size: 1.4vw;
|
||||
text-align: center;
|
||||
}
|
||||
.reg-data {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
.reg-addr {
|
||||
width: 15%;
|
||||
max-width: 15%;
|
||||
}
|
||||
p{
|
||||
display: inline-block;
|
||||
}
|
||||
.invalid-args {
|
||||
border: 1px solid rgb(110, 0, 0);
|
||||
}
|
||||
.valid-args {
|
||||
border: 1px solid #555;
|
||||
}
|
||||
|
|
@ -0,0 +1,240 @@
|
|||
$(window).ready(function () {
|
||||
var isConnected = false;
|
||||
var apiIsAlive = false;
|
||||
// TODO: change to valid url
|
||||
var apiServer = "http://localhost:8080";
|
||||
|
||||
class Hello {
|
||||
constructor() {
|
||||
this.type = "hello";
|
||||
}
|
||||
}
|
||||
class Connect {
|
||||
constructor(ip, port) {
|
||||
this.type = "connect";
|
||||
// string
|
||||
this.ip = ip;
|
||||
// string
|
||||
this.port = port;
|
||||
}
|
||||
}
|
||||
class Send {
|
||||
constructor(operation, inc, register_address, data) {
|
||||
this.type = "send";
|
||||
// bool: true -> wr | false -> rd
|
||||
this.wrd = operation;
|
||||
// bool
|
||||
this.inc = inc;
|
||||
// string
|
||||
this.register_address = register_address;
|
||||
// string
|
||||
this.data = data;
|
||||
}
|
||||
}
|
||||
class Close {
|
||||
constructor() {
|
||||
this.type = "close";
|
||||
}
|
||||
}
|
||||
class PacketFabric {
|
||||
constructor() {}
|
||||
new_hello() {
|
||||
return new Hello();
|
||||
}
|
||||
new_connect(ip, port) {
|
||||
return new Connect(ip, port);
|
||||
}
|
||||
new_send(operation, inc, register_address, data) {
|
||||
return new Send(operation, inc, register_address, data);
|
||||
}
|
||||
new_close() {
|
||||
return new Close();
|
||||
}
|
||||
}
|
||||
|
||||
const fabric = new PacketFabric();
|
||||
let hello_check = fabric.new_hello();
|
||||
queryConstructor(hello_check);
|
||||
|
||||
function dataConstructor(packet){
|
||||
switch (packet.type) {
|
||||
case 'hello':
|
||||
return JSON.stringify({});
|
||||
case 'close':
|
||||
return JSON.stringify({});
|
||||
case 'connect':
|
||||
return JSON.stringify({
|
||||
"ip_address" : packet.ip,
|
||||
"port" : packet.port
|
||||
});
|
||||
case 'send':
|
||||
return JSON.stringify({
|
||||
"request_type": "0x01",
|
||||
"data_size" : String(1 + 4 + 4*packet.data.split(' ').length),
|
||||
"additional_header": {
|
||||
"wrd": packet.wrd,
|
||||
"auto_increment": packet.inc,
|
||||
"register_address": packet.register_address
|
||||
},
|
||||
"data" : packet.data,
|
||||
});
|
||||
default:
|
||||
return packet
|
||||
}
|
||||
}
|
||||
function reponseHandlerConstructor(packet, status, er) {
|
||||
switch (packet.type) {
|
||||
case 'hello':
|
||||
apiIsAlive = status;
|
||||
return status ?
|
||||
ok_msg_conn(`API-Server is running. Connection established`)
|
||||
: err_msg_conn(`API-Server unreachable. Error: ${er.statusText}. Status : ${er.status}`);
|
||||
case 'close':
|
||||
isConnected = status ? false : isConnected;
|
||||
if (status) {
|
||||
$('#ipAddress').prop("disabled", false);
|
||||
$('#port').prop("disabled", false);
|
||||
$('#ipAddress').val("");
|
||||
$('#port').val("");
|
||||
$('#connect-btn').text("Connect");
|
||||
}
|
||||
return status ?
|
||||
ok_msg_conn(`Connection closed`)
|
||||
: err_msg_conn(`Cannot close connection. Error: ${er.statusText}. Status : ${er.status}`);
|
||||
case 'connect':
|
||||
isConnected = status ? true : isConnected;
|
||||
if (status) {
|
||||
valid('ipAddress');
|
||||
valid('port');
|
||||
$('#ipAddress').prop("disabled", true);
|
||||
$('#port').prop("disabled", true);
|
||||
$('#connect-btn').text("Close");
|
||||
} else {
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
}
|
||||
return status ?
|
||||
ok_msg_conn(`Successfully connected to PLD ${packet.ip}:${packet.port}`)
|
||||
: err_msg_conn(`Cannot open web-socket with ${packet.ip}:${packet.port}. Error: ${er.statusText}. Status : ${er.status}`);
|
||||
case 'send':
|
||||
if (status) {
|
||||
valid('address');
|
||||
valid('data');
|
||||
valid('ipAddress');
|
||||
valid('port');
|
||||
} else {
|
||||
invalid('address');
|
||||
invalid('data');
|
||||
}
|
||||
return status ?
|
||||
ok_msg_conn(`Successfully sent data to ${packet.register_address}`)
|
||||
: err_msg_conn(`Cannot send data to ${packet.register_address}. Error: ${er.statusText}. Status : ${er.status}`);
|
||||
default:
|
||||
return packet
|
||||
}
|
||||
}
|
||||
function queryConstructor(packet) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: `${apiServer}/${packet.type}`,
|
||||
// change
|
||||
data: dataConstructor(packet),
|
||||
contentType: "application/json",
|
||||
// change
|
||||
success: function(data){
|
||||
return reponseHandlerConstructor(packet, true, "");
|
||||
},
|
||||
error: function(er){
|
||||
return reponseHandlerConstructor(packet, false, er);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$('#connect-btn').click(function() {
|
||||
if (!apiIsAlive) {
|
||||
if (!hello_api()) {
|
||||
err_msg_conn("Cannot work without API-Server. Check it health...");
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (isConnected) {
|
||||
let packet = fabric.new_close();
|
||||
queryConstructor(packet);
|
||||
} else {
|
||||
const ipAddress = $('#ipAddress').val();
|
||||
const port = $('#port').val();
|
||||
|
||||
if (ipAddress === "" || port === "") {
|
||||
err_msg_conn("Cannot connect to PLD. Empty fields IP or Port");
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
} else {
|
||||
let packet = fabric.new_connect(ipAddress, port);
|
||||
queryConstructor(packet);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#send-btn').click(() => {
|
||||
if (!apiIsAlive) {
|
||||
if (!hello_api()) {
|
||||
err_msg_conn("Cannot work without API-Server. Check it health...");
|
||||
return;
|
||||
}
|
||||
}
|
||||
const address = document.getElementById('address').value;
|
||||
const data = document.getElementById('data').value;
|
||||
// wr or rd
|
||||
const wrd = () => document.querySelector('input[type=radio]:checked')?.value === "wr"
|
||||
// true or false
|
||||
const inc = document.querySelector('#inc').checked;
|
||||
let packet = fabric.new_send(wrd(), inc, address, data);
|
||||
|
||||
if (isConnected) {
|
||||
valid('ipAddress');
|
||||
valid('port');
|
||||
if (address == "" || data == "") {
|
||||
err_msg_conn(`Cannot send data to PLD. Empty fields Data or Segment-address`);
|
||||
invalid('address');
|
||||
invalid('data');
|
||||
}
|
||||
else {
|
||||
queryConstructor(packet);
|
||||
}
|
||||
} else {
|
||||
invalid('ipAddress');
|
||||
invalid('port');
|
||||
err_msg_conn(`Cannot send any data! Connect to PLD first`);
|
||||
}
|
||||
});
|
||||
|
||||
function hello_api() {
|
||||
let packet = fabric.new_hello;
|
||||
return queryConstructor(packet);
|
||||
}
|
||||
|
||||
function valid(id) {
|
||||
var obj = document.getElementById(id).classList;
|
||||
if (obj.contains('invalid-args')) {
|
||||
obj.remove('invalid-args');
|
||||
obj.add('valid-args');
|
||||
}
|
||||
}
|
||||
function invalid(id) {
|
||||
var obj = document.getElementById(id).classList;
|
||||
if (obj.contains("valid-args")) {
|
||||
obj.remove("valid-args");
|
||||
obj.add("invalid-args");
|
||||
}
|
||||
}
|
||||
function ok_msg_conn(data) {
|
||||
document.getElementById('log').innerHTML += String(`<p style="color:white"><span style="color:green"><b>[OK]</b></span> ${new Date().toLocaleString()} : ${data}</p><br>`)
|
||||
return true;
|
||||
}
|
||||
function err_msg_conn(data) {
|
||||
document.getElementById('log').innerHTML += String(`<p style="color:white"><span style="color:red"><b>[ERROR]</b></span> ${new Date().toLocaleString()} : ${data}</p><br>`)
|
||||
return false;
|
||||
}
|
||||
|
||||
})
|
||||
Loading…
Reference in New Issue