Initial commit
This commit is contained in:
commit
b7d90b9afe
16245 files changed
+3396666
No files matched your search
Executable
+73
@@ -0,0 +1,73 @@
|
||||
<!DOCTYPE HTML>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>MapView</title>
|
||||
<style>
|
||||
table {
|
||||
border-collapse: separate;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
text-align: left;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.headcol {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#mapDiv {
|
||||
position: relative;
|
||||
height: 760px;
|
||||
width: 72.5%;
|
||||
}
|
||||
|
||||
#infoDiv {
|
||||
position: absolute;
|
||||
top: 12%;
|
||||
left: 70%;
|
||||
}
|
||||
|
||||
#infoDiv input {
|
||||
border: none;
|
||||
box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
|
||||
}
|
||||
|
||||
input {
|
||||
position: relative;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css">
|
||||
<script src="https://js.arcgis.com/4.7/"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script src="3DVMModel.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div style="position:relative; text-align: center; font-size: 35px;">Verwundungsmodell</div>
|
||||
<hr style="position: relative;">
|
||||
<div style="position: absolute; left: 1400px; width: 500px">
|
||||
<div style="position: relative; left: 20px">Modell .xml-File:</div>
|
||||
<input type="file" name="myfile" id="fileUpload" />
|
||||
<hr style="width: 510px;">
|
||||
<div style="position: relative; left: 20px;" id="wallToggle">
|
||||
Walls
|
||||
</div>
|
||||
<hr style="width: 510px;">
|
||||
</div>
|
||||
<div style=" height:89%; border-left: 2px solid black; position:absolute; right: 520px;top: 63px; "></div>
|
||||
<div id="mapDiv">
|
||||
<div id="infoDiv ">
|
||||
<!-- <input class="esri-component esri-widget-button esri-widget esri-interactive " type="button " id="switch-btn
|
||||
" value="3D "> -->
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
Executable
+296
@@ -0,0 +1,296 @@
|
||||
class polyoli {
|
||||
constructor(name) {
|
||||
this.path = [];
|
||||
this.graphic = null;
|
||||
this.name = name;
|
||||
this.alternativGraphic = null;
|
||||
}
|
||||
closeRing() {
|
||||
this.path.push(this.path[0]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
var parser, xmlDoc, PolyArray;
|
||||
var XMLFile = null;
|
||||
var wallnumber = 0;
|
||||
var PolygonObj = [];
|
||||
var refPoint = {
|
||||
y: 493081,
|
||||
x: 5878329,
|
||||
};
|
||||
parser = new DOMParser();
|
||||
var graphicLayer = null;
|
||||
var PolyObjArray = [];
|
||||
var selected = null;
|
||||
var alternativeSymbol = {
|
||||
type: "simple-fill",
|
||||
color: [128, 0, 0, 0.5],
|
||||
outline: {
|
||||
color: [0, 0, 0],
|
||||
width: 1
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
window.onload = function () {
|
||||
document.getElementById('fileUpload').addEventListener('change', updateFile, false);
|
||||
generateMap();
|
||||
}
|
||||
|
||||
function generateMap() {
|
||||
require([
|
||||
"esri/Map",
|
||||
"esri/views/SceneView",
|
||||
"esri/layers/TileLayer",
|
||||
"esri/layers/SceneLayer",
|
||||
"esri/layers/GraphicsLayer",
|
||||
"dojo/domReady!",
|
||||
],
|
||||
function (
|
||||
Map,
|
||||
SceneView,
|
||||
TileLayer,
|
||||
SceneLayer,
|
||||
GraphicsLayer,
|
||||
) {
|
||||
map = new Map({
|
||||
// basemap: "topo"
|
||||
});
|
||||
view = new SceneView({
|
||||
container: "mapDiv",
|
||||
map: map,
|
||||
scale: 1000,
|
||||
camera: { // autocasts as new Camera()
|
||||
position: { // autocasts as new Point()
|
||||
x: 8.896638,
|
||||
y: 53.054441,
|
||||
z: 40
|
||||
}
|
||||
}
|
||||
});
|
||||
tile = new TileLayer({
|
||||
url: "http://excgeo21.sl.defence-elec.de/arcgis/rest/services/Bremen/Hemelingen_TIF_WebMerc/MapServer",
|
||||
})
|
||||
feature = new SceneLayer({
|
||||
url: "http://excgeo21.sl.defence-elec.de/arcgis/rest/services/Hosted/BT56_rev576/SceneServer",
|
||||
});
|
||||
map.add(feature);
|
||||
map.add(tile);
|
||||
graphicLayer = new GraphicsLayer();
|
||||
map.add(graphicLayer);
|
||||
view.on("click", eventHandler);
|
||||
function eventHandler(event) {
|
||||
view.hitTest(event).then(getGraphics);
|
||||
function getGraphics(response) {
|
||||
selected = response.results[0].graphic.__accessor__.store._values.attributes.name;
|
||||
}
|
||||
};
|
||||
view.popup.on("trigger-action", function (event) {
|
||||
if (event.action.id === "highlight") {
|
||||
PolyObjArray.forEach(polyObj => {
|
||||
if (polyObj.name == selected) {
|
||||
var newGraphic = polyObj.graphic.clone();
|
||||
newGraphic.symbol = alternativeSymbol;
|
||||
graphicLayer.remove(polyObj.graphic);
|
||||
polyObj.alternativGraphic = newGraphic;
|
||||
graphicLayer.add(polyObj.alternativGraphic);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function updateFile(event) {
|
||||
event.preventDefault();
|
||||
XMLFile = event.target.files[0];
|
||||
parseXML();
|
||||
}
|
||||
|
||||
function parseXML() {
|
||||
var file = XMLFile;
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (event) {
|
||||
readXML = event.target.result;
|
||||
xmlDoc = parser.parseFromString(readXML, "application/xml");
|
||||
}
|
||||
reader.readAsText(file);
|
||||
createModel();
|
||||
}
|
||||
|
||||
function createModel() {
|
||||
require([
|
||||
"esri/geometry/projection",
|
||||
],
|
||||
function (
|
||||
projection,
|
||||
) {
|
||||
projection.load().then(function () {
|
||||
tile.load().then(function () {
|
||||
PolyArray = Array.from(xmlDoc.getElementsByTagName("OuterWallAreaElement"));
|
||||
PolyArray.forEach(polygon => {
|
||||
var polyObj = new polyoli(wallnumber);
|
||||
var vertexes = Array.from(polygon.children);
|
||||
for (var x = 0; x < vertexes.length; x++) {
|
||||
var pp = createPathPoint(Array.from(vertexes[x].children));
|
||||
polyObj.path.push(pp);
|
||||
}
|
||||
wallnumber++;
|
||||
polyObj.closeRing();
|
||||
var graphic = createGraphic(polyObj);
|
||||
polyObj.graphic = graphic;
|
||||
PolyObjArray.push(polyObj);
|
||||
});
|
||||
placeAndCreateToggles();
|
||||
XMLFile = null;
|
||||
PolyArray = null;
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function placeAndCreateToggles() {
|
||||
var counter = 0;
|
||||
var wallDiv = document.getElementById("wallToggle");
|
||||
var checkboxes = null;
|
||||
checkboxes = "<table><tr>"
|
||||
PolyObjArray.forEach(wall => {
|
||||
graphicLayer.add(wall.graphic);
|
||||
if (counter % 4 == 0 && counter != 0) checkboxes += `</tr><tr>`;
|
||||
checkboxes += `<td><div style="width:20%; display:inline-block;">${wall.name}</div><input class="wallsCheck" type="checkbox" value="${wall.name}" name="WallRequests" style="float:right;" onchange="checkBoxTrigger()"></input></td><td></td>`;
|
||||
counter++;
|
||||
});
|
||||
checkboxes += "</table>"
|
||||
wallDiv.innerHTML += checkboxes;
|
||||
}
|
||||
function getWkid() {
|
||||
var wkid = view.spatialReference.__accessor__.store._values.wkid;
|
||||
return (wkid);
|
||||
}
|
||||
function getSpatialRefOut() {
|
||||
var spatialOut = view.spatialReference;
|
||||
return spatialOut;
|
||||
}
|
||||
function createEsriP(vertextChildren) {
|
||||
var ReturnEsriP = null;
|
||||
require([
|
||||
"esri/geometry/Point",
|
||||
],
|
||||
function (
|
||||
Point,
|
||||
) {
|
||||
var esriP = new Point({
|
||||
y: parseFloat(vertextChildren[0].innerHTML) + refPoint.x,
|
||||
x: parseFloat(vertextChildren[1].innerHTML) + refPoint.y,
|
||||
z: parseFloat(vertextChildren[2].innerHTML),
|
||||
spatialReference: { wkid: 32632 }
|
||||
})
|
||||
ReturnEsriP = esriP;
|
||||
})
|
||||
return (ReturnEsriP);
|
||||
}
|
||||
|
||||
function project(esriP) {
|
||||
var ReturnProjection = null;
|
||||
require([
|
||||
"esri/geometry/projection",
|
||||
],
|
||||
function (
|
||||
projection,
|
||||
) {
|
||||
var point = projection.project(esriP, getSpatialRefOut());
|
||||
ReturnProjection = [point.__accessor__.store._values.x, point.__accessor__.store._values.y, point.__accessor__.store._values.z];
|
||||
})
|
||||
return (ReturnProjection);
|
||||
}
|
||||
function createGraphic(polyObj) {
|
||||
var highlight = {
|
||||
title: "SetPosition",
|
||||
id: "highlight",
|
||||
image: "https://www.ninonline.org/forum/uploads/monthly_2018_03/Uchiha-Small.png.b1e089fc70c9c965ec35c23041868b3d.png"
|
||||
};
|
||||
var remove = {
|
||||
title: "SetPosition",
|
||||
id: "place-this",
|
||||
image: "https://www.ninonline.org/forum/uploads/monthly_2018_03/Uchiha-Small.png.b1e089fc70c9c965ec35c23041868b3d.png"
|
||||
};
|
||||
var graphic = null;
|
||||
require([
|
||||
"esri/Graphic",
|
||||
],
|
||||
function (
|
||||
Graphic,
|
||||
) {
|
||||
var polygon = {
|
||||
type: "polygon",
|
||||
rings: polyObj.path,
|
||||
spatialReference: { wkid: getWkid() }
|
||||
};
|
||||
var fillSymbol = {
|
||||
type: "simple-fill",
|
||||
color: [255, 255, 255, 0.5],
|
||||
outline: {
|
||||
color: [0, 0, 0],
|
||||
width: 1
|
||||
}
|
||||
};
|
||||
let wallAttribs = {
|
||||
name: polyObj.name,
|
||||
}
|
||||
polygraphic = new Graphic({
|
||||
geometry: polygon,
|
||||
symbol: fillSymbol,
|
||||
attributes: wallAttribs,
|
||||
popupTemplate: {
|
||||
title: "Wall",
|
||||
content: [{
|
||||
type: "fields",
|
||||
fieldInfos: [{
|
||||
fieldName: "name"
|
||||
}]
|
||||
}],
|
||||
actions: [highlight, remove]
|
||||
}
|
||||
});
|
||||
graphic = polygraphic;
|
||||
}
|
||||
)
|
||||
return (graphic);
|
||||
}
|
||||
|
||||
|
||||
function createPathPoint(point) {
|
||||
var tempEsriP = null;
|
||||
tempEsriP = createEsriP(point);
|
||||
pp = project(tempEsriP);
|
||||
return (pp);
|
||||
}
|
||||
|
||||
function checkBoxTrigger() {
|
||||
graphicLayer.removeAll();
|
||||
var selects = document.getElementsByName("WallRequests");
|
||||
selects.forEach(select => {
|
||||
if (select.checked) {
|
||||
PolyObjArray.forEach(polyObj => {
|
||||
if (select.value == polyObj.name) {
|
||||
var newGraphic = polyObj.graphic.clone();
|
||||
newGraphic.symbol = alternativeSymbol;
|
||||
graphicLayer.remove(polyObj.graphic);
|
||||
polyObj.alternativGraphic = newGraphic;
|
||||
graphicLayer.add(polyObj.alternativGraphic);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
PolyObjArray.forEach(polyObj => {
|
||||
if (select.value == polyObj.name) {
|
||||
graphicLayer.add(polyObj.graphic);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
+1795
File diff suppressed because it is too large.
Load diff
Executable
+123
@@ -0,0 +1,123 @@
|
||||
<!DOCTYPE HTML>
|
||||
<meta charset="utf-8" />
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>BSM-Hit</title>
|
||||
<style>
|
||||
th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
table {
|
||||
text-align: left;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="libs/jquery/jquery.mobile-1.4.5.min.css" />
|
||||
<script src="libs/jquery/jquery-1.11.1.min.js"></script>
|
||||
<script src="libs/jquery/jquery.mobile-1.4.5.min.js"></script>
|
||||
<script type="text/javascript" src="js/bsmHit.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<table style="width:40.5%" id="HeaderTable">
|
||||
<tr id="HeaderTableRow">
|
||||
<td>
|
||||
<form action="Javascript:connect()">
|
||||
<input id="ipadresse" placeholder="EXCTDS01:2080" value="EXCTDS01:2080">
|
||||
<input type="submit" id="create" value="Connect to Server" onclick="Javascript:connect()">
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<div id="Serverconnect">
|
||||
<font color="red">
|
||||
Server: not connected
|
||||
</font>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<font color="black">
|
||||
<H2> Port für
|
||||
<em>Connect to Server</em> finden:</H2>
|
||||
<H3>Bei vielen Gebäuden:</H3>
|
||||
<b>- in der Tabelle ism.is_main_structure_element die id zum Gebäude suchen</b>
|
||||
<br>
|
||||
<b>- die zugehörige PID suchen:</b>
|
||||
<BLOCKQUOTE>
|
||||
<em>ps ax|grep xxx</em> (xxx ist die id des Gebäudes)
|
||||
</BLOCKQUOTE>
|
||||
<b>- den zugehörigen Port suchen:</b>
|
||||
<BLOCKQUOTE>
|
||||
<em>ss -anp | grep xxx</em> (xxx ist die PID des Buildingprozesses)
|
||||
</BLOCKQUOTE>
|
||||
<H3>Bei einem Gebäude:</H3>
|
||||
<BLOCKQUOTE>
|
||||
<b>PID suchen: </b>
|
||||
<em>ps ax|grep BuildingControlUnit </em><br>
|
||||
<b>Port suchen: </b>
|
||||
<em>ss -anp | grep PID </em><br>
|
||||
Der Port ist im Eintrag von LISTEN... <br>
|
||||
Der Port muss bei Connect to Server genommen werden.<br>
|
||||
Beispiel: localhost:36501 oder EXCTDS06:36501<br>
|
||||
<b>sensorId suchen:</b> <BR>
|
||||
ggf. Sensormodul mounten: ToolOverview: Input and show Participant Positions (Justus-Tool)<br>
|
||||
Asset type: BuildingSensorModule
|
||||
cat /tmp/bldg_301_building_config.xml
|
||||
</BLOCKQUOTE>
|
||||
|
||||
<H3>Ein komplexes Kommando:</H3>
|
||||
<BLOCKQUOTE>
|
||||
<font color="red">
|
||||
<em>ss -anp | grep `ps -elf | grep BuildingControlUnit | grep <b>XXX</b> | awk -F ' ' '{print $4 }'` | grep LISTEN | awk -F ' ' '{print $5 }' | cut -d':' -f2</em>
|
||||
</font>
|
||||
</BLOCKQUOTE>
|
||||
<br>
|
||||
</font>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="sensorId" class="input">sensorId: (/tmp/bldg_xxx_building_config.xml)</label>
|
||||
</div>
|
||||
<div class="ui-block-b">
|
||||
<input type="sensorId" value="11005" id="sensorId" name="sensorId" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="originatorId" class="input">originatorId (Equipment-Number):</label>
|
||||
</div>
|
||||
<div class="ui-block-b">
|
||||
<input type="originatorId" value="1" id="originatorId" name="originatorId" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="tasCodeDirect" class="input">tasCodeDirect:</label>
|
||||
</div>
|
||||
<div class="ui-block-b">
|
||||
<input type="tasCodeDirect" value="1" id="tasCodeDirect" name="tasCodeDirect" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="deposition1" class="input">deposition1:</label>
|
||||
</div>
|
||||
<div class="ui-block-b">
|
||||
<input type="deposition1" value="0" id="deposition1" name="deposition1" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="deposition2" class="input">deposition2:</label>
|
||||
</div>
|
||||
<div class="ui-block-b">
|
||||
<input type="deposition2" value="0" id="deposition2" name="deposition2" />
|
||||
</div>
|
||||
</div>
|
||||
<div id="Send Hit">
|
||||
<input type="button" id="create" value="Send BSM Direct Hit" onclick="Javascript:sendBsmHit()">
|
||||
</div>
|
||||
|
||||
</body>
|
||||
Executable
+108
@@ -0,0 +1,108 @@
|
||||
var socket;
|
||||
var moutObjectId;
|
||||
var moutAreaId;
|
||||
var equipmentNumber;
|
||||
|
||||
$(function() {
|
||||
|
||||
$("#connectWs").click(function() {
|
||||
connect();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function connect(){
|
||||
var ipadresse=document.getElementById("ipadresse").value;
|
||||
console.log("ipadresse="+ipadresse);
|
||||
var host = "ws://"+ipadresse;
|
||||
console.log("connect "+ipadresse);
|
||||
try{
|
||||
socket = new WebSocket(host);
|
||||
console.log("connect state:" +socket.readyState);
|
||||
socket.onopen = function(){
|
||||
console.log("onopen: connect state:" +socket.readyState);
|
||||
document.getElementById("Serverconnect").innerHTML = "Server: connected";
|
||||
document.getElementById("Serverconnect").style.color = "green"
|
||||
}
|
||||
|
||||
socket.onmessage = function(msg){
|
||||
console.log('<p class="message">Received: '+msg.data);
|
||||
}
|
||||
|
||||
socket.onclose = function(){
|
||||
console.log('<p class="event">Socket Status: '+socket.readyState+' (Closed)');
|
||||
document.getElementById("Serverconnect").innerHTML = "Server: not connected";
|
||||
document.getElementById("Serverconnect").style.color = "red"
|
||||
}
|
||||
|
||||
} catch(exception){
|
||||
console.log('<p>Error'+exception);
|
||||
}
|
||||
}
|
||||
/*
|
||||
function sendRoom(moutObjectId, moutAreaId, moutRoomId, lat, lon, z){
|
||||
equipmentNumber = Number(document.getElementById("equipmentNumber").value);
|
||||
var type = "PositionReport";
|
||||
var timestamp = Date.now();
|
||||
console.log("sendRoom: moutRoomId="+moutRoomId);
|
||||
var latRad = lat*Math.PI/180;
|
||||
var lonRad = lon*Math.PI/180;
|
||||
var jsonMsg = JSON.stringify({ //make JSON-string from the data
|
||||
data:{
|
||||
equipmentNumber: equipmentNumber,
|
||||
lat: latRad,
|
||||
lon: lonRad,
|
||||
moutAreaId: moutAreaId,
|
||||
moutObjectId: moutObjectId,
|
||||
moutRoomId: moutRoomId,
|
||||
timestamp: timestamp,
|
||||
z: z
|
||||
},
|
||||
type: type
|
||||
});
|
||||
|
||||
socket.send("jsonMsg="+jsonMsg); //send the JSON telegram
|
||||
}
|
||||
*/
|
||||
|
||||
function sendBsmHit(){
|
||||
console.log(sendBsmHit);
|
||||
//equipmentNumber = Number(document.getElementById("equipmentNumber").value);
|
||||
var type = "DebugSimulateBSMHit";
|
||||
var timestamp = Date.now();
|
||||
var effectTime = 0;
|
||||
var sensorId = Number(document.getElementById("sensorId").value);
|
||||
var originatorId = Number(document.getElementById("originatorId").value);
|
||||
var tasCodeDirect = Number(document.getElementById("tasCodeDirect").value);
|
||||
var deposition1 = Number(document.getElementById("deposition1").value);
|
||||
var deposition2 = Number(document.getElementById("deposition2").value);
|
||||
console.log("DebugSimulateBSMHit: effectTime="+effectTime);
|
||||
var jsonMsg = JSON.stringify({ //make JSON-string from the data
|
||||
data:{
|
||||
effectTime: effectTime,
|
||||
sensorId: sensorId,
|
||||
originatorId: originatorId,
|
||||
chargeTypeId: tasCodeDirect,
|
||||
deposition1: deposition1,
|
||||
deposition2: deposition2
|
||||
},
|
||||
type: type
|
||||
});
|
||||
console.log (jsonMsg);
|
||||
socket.send(jsonMsg); //send the JSON telegram
|
||||
}
|
||||
|
||||
|
||||
function updateUnix(){ //update timestamp
|
||||
date = Date.now();
|
||||
document.getElementById("timestamp").value= date;
|
||||
}
|
||||
|
||||
function showHideFunction() {
|
||||
var x = document.getElementById('inputmenu');
|
||||
if (x.style.display === 'none') {
|
||||
x.style.display = 'block';
|
||||
} else {
|
||||
x.style.display = 'none';
|
||||
}
|
||||
}
|
||||
Executable
+79
@@ -0,0 +1,79 @@
|
||||
var socket;
|
||||
var moutObjectId;
|
||||
var moutAreaId;
|
||||
var equipmentNumber;
|
||||
|
||||
$(function() {
|
||||
|
||||
$("#connectWs").click(function() {
|
||||
connect();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function connect(){
|
||||
var ipadresse=document.getElementById("ipadresse").value;
|
||||
console.log("ipadresse="+ipadresse);
|
||||
var host = "ws://"+ipadresse;
|
||||
console.log("connect "+ipadresse);
|
||||
try{
|
||||
socket = new WebSocket(host);
|
||||
console.log("connect state:" +socket.readyState);
|
||||
socket.onopen = function(){
|
||||
console.log("onopen: connect state:" +socket.readyState);
|
||||
document.getElementById("Serverconnect").innerHTML = "Server: connected";
|
||||
document.getElementById("Serverconnect").style.color = "green"
|
||||
}
|
||||
|
||||
socket.onmessage = function(msg){
|
||||
console.log('<p class="message">Received: '+msg.data);
|
||||
}
|
||||
|
||||
socket.onclose = function(){
|
||||
console.log('<p class="event">Socket Status: '+socket.readyState+' (Closed)');
|
||||
document.getElementById("Serverconnect").innerHTML = "Server: not connected";
|
||||
document.getElementById("Serverconnect").style.color = "red"
|
||||
}
|
||||
|
||||
} catch(exception){
|
||||
console.log('<p>Error'+exception);
|
||||
}
|
||||
}
|
||||
|
||||
function sendSetDamageState(){
|
||||
console.log(sendSetDamageState);
|
||||
//equipmentNumber = Number(document.getElementById("equipmentNumber").value);
|
||||
var type = "SetDamageState";
|
||||
var uuid = "uuid";
|
||||
var originatorId = Number(document.getElementById("originatorId").value);
|
||||
var damageState = Number(document.getElementById("damageState").value);
|
||||
var roomId = Number(document.getElementById("roomId").value);
|
||||
var roomIds = [roomId];
|
||||
|
||||
var jsonMsg = JSON.stringify({ //make JSON-string from the data
|
||||
data:{
|
||||
originatorId: originatorId,
|
||||
damageState: damageState,
|
||||
rooms : roomIds
|
||||
},
|
||||
type: type,
|
||||
uuid: uuid
|
||||
});
|
||||
console.log (jsonMsg);
|
||||
socket.send(jsonMsg); //send the JSON telegram
|
||||
}
|
||||
|
||||
|
||||
function updateUnix(){ //update timestamp
|
||||
date = Date.now();
|
||||
document.getElementById("timestamp").value= date;
|
||||
}
|
||||
|
||||
function showHideFunction() {
|
||||
var x = document.getElementById('inputmenu');
|
||||
if (x.style.display === 'none') {
|
||||
x.style.display = 'block';
|
||||
} else {
|
||||
x.style.display = 'none';
|
||||
}
|
||||
}
|
||||
Executable
+77
@@ -0,0 +1,77 @@
|
||||
<!DOCTYPE HTML>
|
||||
<meta charset="utf-8"/>
|
||||
<html>
|
||||
<head>
|
||||
<title>SetDamageState</title>
|
||||
<style>
|
||||
th
|
||||
{
|
||||
text-align: left;
|
||||
}
|
||||
table
|
||||
{
|
||||
text-align: left;
|
||||
table-layout: fixed;
|
||||
width:100%;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="libs/jquery/jquery.mobile-1.4.5.min.css" />
|
||||
<script src="libs/jquery/jquery-1.11.1.min.js"></script>
|
||||
<script src="libs/jquery/jquery.mobile-1.4.5.min.js"></script>
|
||||
<script type="text/javascript" src="js/damageState.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<table style="width:40.5%" id="HeaderTable">
|
||||
<tr id="HeaderTableRow">
|
||||
<td>
|
||||
<div id="WebSocketStart">
|
||||
<input type="button" id="create" value="Connect to Server" onclick="Javascript:connect()">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<form>
|
||||
<input type="text" value="EXCTDS01:2080" id="ipadresse" />
|
||||
<!--<input type="text" value="192.168.133.138:1234" id="ipadresse" /> -->
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<div id="Serverconnect">
|
||||
<font color="red">
|
||||
Server: not connected
|
||||
<br>
|
||||
<font color="black">
|
||||
(netstat -anop | grep Build)
|
||||
</font>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="originatorId" class="input">originatorId:</label>
|
||||
</div>
|
||||
<div class ="ui-block-b">
|
||||
<input type="originatorId" value="1" id="originatorId" name="originatorId"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="damageState" class="input">damageState: [0 oder 8] </label>
|
||||
</div>
|
||||
<div class ="ui-block-b">
|
||||
<input type="damageState" value="8" id="damageState" name="damageState"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a">
|
||||
<label for="roomId" class="input">roomId:</label>
|
||||
</div>
|
||||
<div class ="ui-block-b">
|
||||
<input type="roomId" value="2105" id="roomId" name="roomId"/>
|
||||
</div>
|
||||
</div>
|
||||
<div id="Send Hit">
|
||||
<input type="button" id="create" value="Send SetDamageState" onclick="Javascript:sendSetDamageState()">
|
||||
</div>
|
||||
|
||||
</body>
|
||||
Executable
+20
@@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>WebSocket demo</title>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
var ws = new WebSocket("ws://127.0.0.1:52064/"),
|
||||
messages = document.createElement('ul');
|
||||
ws.onmessage = function (event) {
|
||||
var messages = document.getElementsByTagName('ul')[0],
|
||||
message = document.createElement('li'),
|
||||
content = document.createTextNode(event.data);
|
||||
message.appendChild(content);
|
||||
messages.appendChild(message);
|
||||
};
|
||||
document.body.appendChild(messages);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user