Files
apt-nl-map/static/Magic4/Fleet/HMI_Fleet.html
2024-12-04 10:21:04 +08:00

118 lines
3.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script type="text/javascript" src="../roslib.min.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="../jquery.cookie.js"></script>
<script type="text/javascript">
var ros = new ROSLIB.Ros({
//url : 'ws://'+IP+':9190'
url : 'ws://localhost:9190'
});
ros.on('connection', function() {
console.log('Connected to websocket server.');
});
ros.on('error', function(error) {
console.log('Error connecting to websocket server: ', error);
});
ros.on('close', function() {
console.log('Connection to websocket server closed.');
});
function client(str){
var client_FleetString=new ROSLIB.Service({
ros:ros,
name:'/Service_FleetString',
serviceType:'lu_ps20l_msgs/Srv_FleetString'
});
var request = new ROSLIB.ServiceRequest({
Fleet_String_Input:str
});
client_FleetString.callService(request,function(result) {
//console.log(result);
document.getElementById('leftIframe').contentWindow.postMessage(
{
event_id: 'client_response',
data: {
v1: result.result,
v2: result.ROS_String_Output,
v3: result.Rec_Fleet_String_Input
}
},
"*" //or "www.parentpage.com"
);
});
}
function client_event_id(event_id,str){
var client_FleetString=new ROSLIB.Service({
ros:ros,
name:'/Service_FleetString',
serviceType:'lu_ps20l_msgs/Srv_FleetString'
});
var request = new ROSLIB.ServiceRequest({
Fleet_String_Input:str
});
client_FleetString.callService(request,function(result) {
//console.log(result);
document.getElementById('leftIframe').contentWindow.postMessage(
{
event_id: event_id,
data: {
v1: result.result,
v2: result.ROS_String_Output,
v3: result.Rec_Fleet_String_Input
}
},
"*" //or "www.parentpage.com"
);
});
}
function receiveMessage(event){
console.log(event.data);
switch(event.data.event_id) {
case 'client_request': {
var data = event.data.data;
//console.log(data);
client(data.v1);
}
break;
case 'client_request_fleet_left_getfleetinfo_main':{
var data = event.data.data;
client_event_id('client_response_fleet_left_getfleetinfo_main',data.v1);
}
break;
}
}
window.addEventListener("message", receiveMessage, false);
</script>
<body>
<div id="div1">
<table>
<tr>
<iframe id="topIframe" name="topIframe" width="1708" height="80" src="HMI_Fleet_Top.html" frameborder="2" scrolling="auto"></iframe>
</tr>
<tr>
<td>
<iframe id="leftIframe" name="leftIframe" width="800" height="470" src="HMI_Fleet_Left.html" frameborder="2" scrolling="auto"></iframe>
</td>
<td>
<iframe id="rightIframe" name="rightIframe" width="900" height="480" src="HMI_Fleet_Right.html" frameborder="2" scrolling="auto"></iframe>
</td>
</tr>
</table>
</div>
</body>
</html>