Merge branch 'develop' into frank-dev2
# Conflicts: # static/scripts/websocket.js
This commit is contained in:
commit
55c9ad4f76
@ -23,9 +23,13 @@ func (p *pipelineReplay) Stop() {
|
||||
logrus.Debugln("replay channel already closed")
|
||||
}
|
||||
}()
|
||||
logrus.Debugln("send stop signal")
|
||||
p.stopChan <- struct{}{}
|
||||
logrus.Debugln("stop signal sent")
|
||||
logrus.Debugln("send stop signal...")
|
||||
select {
|
||||
case p.stopChan <- struct{}{}:
|
||||
logrus.Debugln("stop signal sent")
|
||||
//default:
|
||||
// logrus.Debugln("stop signal skipped")
|
||||
}
|
||||
}
|
||||
|
||||
func NewReplayPipeline(p Publisher, t *Tracking) *pipelineReplay {
|
||||
@ -57,22 +61,23 @@ func (p *pipelineReplay) channelFromTracking(t *Tracking) chan interface{} {
|
||||
durationSinceLastEvent := t.Data[i].Servertime.UnixNano() - lastTs
|
||||
timeCounter := time.Now().UTC().UnixNano() - lastTsNow
|
||||
if timeCounter >= durationSinceLastEvent {
|
||||
select {
|
||||
case <-p.stopChan:
|
||||
logrus.Debugln("replay stopped")
|
||||
break br
|
||||
case ch <- &(t.Data[i]):
|
||||
}
|
||||
logrus.Traceln("replay tracking: ", t.Data[i])
|
||||
ch <- &(t.Data[i])
|
||||
lastTs = t.Data[i].Servertime.UnixNano()
|
||||
lastTsNow = time.Now().UTC().UnixNano()
|
||||
i++
|
||||
}
|
||||
select {
|
||||
case <-p.stopChan:
|
||||
logrus.Debugln("received stop signal: replay stopped")
|
||||
break br
|
||||
default:
|
||||
}
|
||||
}
|
||||
logrus.Infoln("replay: tracking replay finished")
|
||||
select {
|
||||
case <-p.stopChan:
|
||||
logrus.Debugln("replay pipeline closed")
|
||||
logrus.Debugln("received stop signal: replay pipeline closed")
|
||||
}
|
||||
close(p.replayChan)
|
||||
}()
|
||||
|
||||
@ -243,7 +243,11 @@ func (t *TrackingService) LoadTracking(trackingId uuid.UUID, replay bool) (*Trac
|
||||
}
|
||||
t.safelyReplaceTracking(*tracking)
|
||||
if t.replaypipe != nil {
|
||||
t.replaypipe.Stop()
|
||||
select {
|
||||
case <-t.replaypipe.stopChan:
|
||||
logrus.Warnln("blocking channel closed")
|
||||
default:
|
||||
}
|
||||
t.replaypipe = nil
|
||||
}
|
||||
t.replaypipe = NewReplayPipeline(t.publisher, t.tracking)
|
||||
|
||||
@ -55,17 +55,24 @@ scene.add(pointLight);
|
||||
cube.position.x = 0
|
||||
cube2.position.x = 0
|
||||
|
||||
let manCalibration = new THREE.Euler( 0, 0, 0, 'XYZ' )
|
||||
// calibration globals
|
||||
let manCalibration = new THREE.Euler( 0, 0, 0, 'YXZ' )
|
||||
let calibrationRot = new THREE.Quaternion()
|
||||
let calPitch = 0
|
||||
let calRoll = 0
|
||||
let calYaw = 0
|
||||
|
||||
let quaternionOffset = document.getElementById("quaternionOffset")
|
||||
|
||||
function renderTCP(x, y, z) {
|
||||
let calibration = new THREE.Quaternion().setFromEuler(manCalibration)
|
||||
// let calibration = new THREE.Quaternion().setFromEuler(new THREE.Euler( radFromAngle, 0, 0, 'YXZ' ))
|
||||
let eul = new THREE.Euler( x, z, y, 'YXZ' );
|
||||
let eul = new THREE.Euler( x, y, z, 'YXZ' );
|
||||
|
||||
// let eul = new THREE.Euler( x, z, y, 'ZXY' ); // XYZ XZY YZX YXZ ZXY ZYX
|
||||
cube2.quaternion.setFromEuler(eul).multiply(calibrationRot).multiply(calibration)
|
||||
|
||||
cube2.quaternion.setFromEuler(eul).multiply(calibrationRot)//.multiply(calibration)
|
||||
quaternionOffset.innerHTML = `Lage Abweichung: ${(cube2.quaternion.angleTo(cube.quaternion) * 180 / Math.PI).toFixed(2) }°`
|
||||
|
||||
renderer.render(scene, camera);
|
||||
}
|
||||
@ -73,9 +80,7 @@ function renderTCP(x, y, z) {
|
||||
function renderSerial(x, y, z) {
|
||||
// requestAnimationFrame(renderSerial);
|
||||
|
||||
// let eul = new THREE.Euler( x, y, z, 'YXZ' ); // XYZ XZY YZX YXZ ZXY ZYX
|
||||
// let eul = new THREE.Euler( x, z, y, 'ZXY' ); // XYZ XZY YZX YXZ ZXY ZYX
|
||||
let eul = new THREE.Euler( x, z, y, 'YXZ' );
|
||||
let eul = new THREE.Euler( x, y, z, 'YXZ' ); // XYZ XZY YZX YXZ ZXY ZYX
|
||||
|
||||
cube.quaternion.setFromEuler(eul)
|
||||
|
||||
@ -103,10 +108,12 @@ rollRange.oninput = () => {
|
||||
|
||||
function delCalibration(evt) {
|
||||
calibrationRot = new THREE.Quaternion()
|
||||
manCalibration = new THREE.Euler( 0, 0, 0, 'XYZ' )
|
||||
manCalibration = new THREE.Euler( 0, 0, 0, 'YXZ' )
|
||||
pitchRange.value = 0
|
||||
yawRange.value = 0
|
||||
rollRange.value = 0
|
||||
calRoll = 0
|
||||
calPitch = 0
|
||||
}
|
||||
|
||||
var calState = false;
|
||||
@ -114,11 +121,12 @@ function manualCalibration(evt) {
|
||||
let con = document.getElementById("manCalContainer")
|
||||
console.log("mancal", con.style.display)
|
||||
if (calState === false) {
|
||||
delCalibration()
|
||||
calState = !calState
|
||||
console.log("mancal ON")
|
||||
con.style.display = "block"
|
||||
delCalibration()
|
||||
} else {
|
||||
delCalibration()
|
||||
calState = !calState
|
||||
console.log("mancal OFF")
|
||||
con.style.display = "none"
|
||||
@ -133,8 +141,95 @@ function calibrate(evt) {
|
||||
let serOrientation = cube.quaternion.clone()
|
||||
let tcpOrientation = cube2.quaternion.clone().multiply(calibrationRot.clone().invert())
|
||||
let diff = tcpOrientation.invert().multiply(serOrientation)
|
||||
|
||||
let old = new THREE.Euler().setFromQuaternion( cube2.quaternion, 'YXZ' )
|
||||
let dif = new THREE.Euler().setFromQuaternion( diff )
|
||||
console.log("OLD:","pitch", old.x * 180/Math.PI, "yaw", old.y * 180/Math.PI, "roll", old.z * 180/Math.PI)
|
||||
console.log("DIFF:","pitch", dif.x * 180/Math.PI, "yaw", dif.y * 180/Math.PI, "roll", dif.z * 180/Math.PI)
|
||||
calPitch = dif.x // * 180/Math.PI
|
||||
calYaw = dif.y // * 180/Math.PI
|
||||
calRoll = dif.z // * 180/Math.PI
|
||||
calibrationRot = diff
|
||||
};
|
||||
document.getElementById("deleteCalibration").onclick = delCalibration
|
||||
document.getElementById("manualCalibration").onclick = manualCalibration
|
||||
document.getElementById("calibrate").onclick = calibrate
|
||||
|
||||
|
||||
// indicators //
|
||||
|
||||
var options = {
|
||||
size : 200, // Sets the size in pixels of the indicator (square)
|
||||
roll : 0, // Roll angle in degrees for an attitude indicator
|
||||
pitch : 0, // Pitch angle in degrees for an attitude indicator
|
||||
heading: 0, // Heading angle in degrees for an heading indicator
|
||||
vario: 0, // Variometer in 1000 feets/min for the variometer indicator
|
||||
airspeed: 0, // Air speed in knots for an air speed indicator
|
||||
altitude: 0, // Altitude in feets for an altimeter indicator
|
||||
pressure: 1000, // Pressure in hPa for an altimeter indicator
|
||||
showBox : true, // Sets if the outer squared box is visible or not (true or false)
|
||||
img_directory : 'static/indicators/img/' // The directory where the images are saved to
|
||||
}
|
||||
|
||||
var headingSer = $.flightIndicator('#headingSer', 'heading', options);
|
||||
var headingTcp = $.flightIndicator('#headingTcp', 'heading', options);
|
||||
var attitudeSer = $.flightIndicator('#attitudeSer', 'attitude', options);
|
||||
var attitudeTcp = $.flightIndicator('#attitudeTcp', 'attitude', options);
|
||||
// var variometer = $.flightIndicator('#variometer', 'variometer', options);
|
||||
var airspeed = $.flightIndicator('#airspeed', 'airspeed', options);
|
||||
var altimeter = $.flightIndicator('#altimeter', 'altimeter', options);
|
||||
|
||||
var airspeedLabel = document.getElementById("airspeedLabel")
|
||||
var altitudeLabel = document.getElementById("altitudeLabel")
|
||||
|
||||
function setIndicatorsTcp(sensordata) {
|
||||
// let q = new THREE.Euler().setFromQuaternion( quaternionRawTcp, 'YXZ' ) // XYZ XZY YZX YXZ ZXY ZYX
|
||||
let q = new THREE.Euler().setFromQuaternion( cube2.quaternion, 'YXZ' ) // XYZ XZY YZX YXZ ZXY ZYX
|
||||
|
||||
if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) {
|
||||
//attitudeTcp.setPitch(sensordata.Orientation[0])
|
||||
attitudeTcp.setPitch(q.x * 180 / Math.PI)
|
||||
//attitudeTcp.setRoll(sensordata.Orientation[1])
|
||||
attitudeTcp.setRoll(q.z * 180 / Math.PI)
|
||||
}
|
||||
|
||||
// Heading from quaternion
|
||||
// if (sensordata.Orientation[2] !== 0) {
|
||||
// // headingTcp.setHeading((-sensordata.Orientation[2]-90)%360)
|
||||
// let h = q.y * 180 / Math.PI * -1
|
||||
// headingTcp.setHeading(h)
|
||||
// }
|
||||
let heading = sensordata.HeadDevice
|
||||
if (heading !== 0) {
|
||||
headingTcp.setHeading(heading)
|
||||
}
|
||||
}
|
||||
|
||||
function setIndicatorsSer(sensordata) {
|
||||
let q = new THREE.Euler().setFromQuaternion( cube.quaternion, 'YXZ' )
|
||||
|
||||
if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) {
|
||||
attitudeSer.setPitch(sensordata.Orientation[0])
|
||||
attitudeSer.setRoll(sensordata.Orientation[1])
|
||||
}
|
||||
|
||||
// Heading from quaternion
|
||||
// if (sensordata.Orientation[2] !== 0) {
|
||||
// // headingTcp.setHeading((-sensordata.Orientation[2]-90)%360)
|
||||
// let h = q.y * 180 / Math.PI * -1
|
||||
// headingSer.setHeading(h)
|
||||
// }
|
||||
let heading = sensordata.HeadMotion
|
||||
if (heading !== 0) {
|
||||
headingSer.setHeading(heading)
|
||||
}
|
||||
if (sensordata.Speed !== 0) {
|
||||
airspeed.setAirSpeed(sensordata.Speed * 3.6)
|
||||
airspeedLabel.innerHTML = `Ref. Speed: ${(sensordata.Speed * 3.6).toFixed(1)} km/h`
|
||||
}
|
||||
if (sensordata.Position[2] !== 0) {
|
||||
altimeter.setAltitude((sensordata.Position[2] * 10).toFixed())
|
||||
altitudeLabel.innerHTML = `HMSL: ${(sensordata.Position[2]).toFixed(2)} m`
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -152,7 +152,7 @@ function addSpeedSerial(speedSERIAL){
|
||||
var speedSERIALkmh = (speedSERIAL * 3.6)
|
||||
var speedSERIALpercent = (speedSERIALkmh/250)*100
|
||||
mySpeedometer.data.datasets[1].data = [speedSERIALpercent, 100-speedSERIALpercent];
|
||||
document.getElementById("speedSERIAL").innerHTML = "Speed Ublox (km/h): " + speedSERIALkmh.toFixed(1)
|
||||
document.getElementById("speedSERIAL").innerHTML = `Ublox: ${speedSERIALkmh.toFixed(1)} km/h`
|
||||
mySpeedometer.update();
|
||||
}
|
||||
|
||||
@ -160,6 +160,6 @@ function addSpeedTcp(speedTCP){
|
||||
var speedTCPkmh = (speedTCP * 3.6)
|
||||
var speedTCPpercent = (speedTCPkmh/250)*100;
|
||||
mySpeedometer.data.datasets[0].data = [speedTCPpercent, 100-speedTCPpercent];
|
||||
document.getElementById("speedTCP").innerHTML = "Speed Smartphone (km/h): " + speedTCPkmh.toFixed(1)
|
||||
document.getElementById("speedTCP").innerHTML = `Phone: ${speedTCPkmh.toFixed(1)} km/h`
|
||||
mySpeedometer.update();
|
||||
}
|
||||
|
||||
@ -12,7 +12,7 @@ window.addEventListener("load", function(evt) {
|
||||
|
||||
const wsOnCloseF = function (evt) {
|
||||
ws = null;
|
||||
print2("CLOSE");
|
||||
print2("CLOSED");
|
||||
var intervalId;
|
||||
intervalId = setInterval(() => {
|
||||
console.log("reconnect websocket...")
|
||||
@ -31,21 +31,18 @@ window.addEventListener("load", function(evt) {
|
||||
}, 1000)
|
||||
}
|
||||
const wsOnMessageF = function (evt) {
|
||||
//print2("RESPONSE: " + evt.data);
|
||||
// let dat = JSON.parse(evt.data)["bmi26x gyroscope"]
|
||||
// let dat = JSON.parse(evt.data)["lsm6dsm gyroscope"]
|
||||
//let dat = JSON.parse(evt.data)["lsm6ds3c gyroscope"]
|
||||
let dat = JSON.parse(evt.data)
|
||||
// dataSmartphone.push(dat)
|
||||
//console.log(evt.data)
|
||||
// console.log("JSON geparsed onmessage", dat)
|
||||
// console.log(dat)
|
||||
if ('SOURCE_TCP' in dat) {
|
||||
setIndicatorsTcp(dat.SOURCE_TCP)
|
||||
}
|
||||
try{
|
||||
if(!(dat.SOURCE_TCP.Orientation[0] === 0) && !(dat.SOURCE_TCP.Orientation[1] === 0) && !(dat.SOURCE_TCP.Orientation[2] === 0)){
|
||||
// document.getElementById("gyroscopeTCP").style.transform = `rotateX(${(dat.SOURCE_TCP.Orientation[0])%360}deg) rotateY(${(dat.SOURCE_TCP.Orientation[1])%360}deg) rotateZ(0deg)`
|
||||
// document.getElementById("gyroscopeTCP").style.transform = `rotateY(0deg) rotateX(${(-dat.SOURCE_TCP.Orientation[0])}deg) rotateZ(${(dat.SOURCE_TCP.Orientation[1])}deg) `
|
||||
// document.getElementById("gyroscopeTCP").style.transform = `rotateX(${(dat.SOURCE_TCP.Orientation[0])%360}deg) rotateZ(${(dat.SOURCE_TCP.Orientation[1])%360}deg) rotateY(${(dat.SOURCE_TCP.Orientation[2])%360}deg)`
|
||||
// console.log(dat.SOURCE_TCP.Orientation)
|
||||
renderTCP(dat.SOURCE_TCP.Orientation[0]*Math.PI/180,-dat.SOURCE_TCP.Orientation[1]*Math.PI/180,dat.SOURCE_TCP.Orientation[2]*Math.PI/180)
|
||||
let heading = (dat.SOURCE_TCP.Orientation[2]+90)%360 // dat.SOURCE_TCP.Orientation[2] //
|
||||
// if (dat.SOURCE_TCP.HeadDevice !== 0) { heading = dat.SOURCE_TCP.HeadDevice; }
|
||||
// if (dat.SOURCE_TCP.HeadMotion !== 0) { heading = dat.SOURCE_TCP.HeadMotion; console.log("head motion") }
|
||||
|
||||
renderTCP((dat.SOURCE_TCP.Orientation[0]*Math.PI/180),heading*Math.PI/180,-(dat.SOURCE_TCP.Orientation[1]*Math.PI/180))
|
||||
}
|
||||
if(!(dat.SOURCE_TCP.Position[1] === 0) && !(dat.SOURCE_TCP.Position[0] === 0)){
|
||||
document.getElementById("TCPlong").innerHTML = "Smartphone long: " + dat.SOURCE_TCP.Position[1]
|
||||
@ -58,20 +55,25 @@ window.addEventListener("load", function(evt) {
|
||||
addSpeedTcp(dat.SOURCE_TCP.Speed);
|
||||
}
|
||||
if(!(dat.SOURCE_TCP.HeadDevice === 0)){
|
||||
document.getElementById("compassTCP").innerHTML = "Smartphone: <br>" + dat.SOURCE_TCP.HeadDevice.toFixed(0) + "°"
|
||||
document.getElementById("needleTCP").style.transform = `rotate(${dat.SOURCE_TCP.HeadDevice}deg)`
|
||||
document.getElementById("compassTCP").innerHTML = " Heading Device: " + dat.SOURCE_TCP.HeadDevice.toFixed(2) + "°"
|
||||
// document.getElementById("needleTCP").style.transform = `rotate(${dat.SOURCE_TCP.HeadDevice}deg)`
|
||||
}
|
||||
if(!(dat.SOURCE_TCP.HeadMotion === 0)) {
|
||||
document.getElementById("compassTCPMot").innerHTML = "Heading Motion: " + dat.SOURCE_TCP.HeadMotion.toFixed(2) + "°"
|
||||
}
|
||||
|
||||
}
|
||||
catch{
|
||||
// console.log("no TCP data")
|
||||
}
|
||||
|
||||
if ('SOURCE_SERIAL' in dat) {
|
||||
setIndicatorsSer(dat.SOURCE_SERIAL)
|
||||
}
|
||||
try{
|
||||
if(!(dat.SOURCE_SERIAL.Orientation[0] === 0) && /*!(dat.SOURCE_SERIAL.Orientation[1] === 0) &&*/ !(dat.SOURCE_SERIAL.Orientation[2] === 0)){
|
||||
// document.getElementById("gyroscopeSERIAL").style.transform = `rotateX(${dat.SOURCE_SERIAL.Orientation[0]}deg) rotateY(${dat.SOURCE_SERIAL.Orientation[1]}deg) rotateZ(0deg)`
|
||||
// document.getElementById("gyroscopeSERIAL").style.transform = `rotateX(${dat.SOURCE_SERIAL.Orientation[0]}deg) rotateY(${dat.SOURCE_SERIAL.Orientation[1]}deg) rotateZ(${dat.SOURCE_SERIAL.Orientation[2]}deg)`
|
||||
renderSerial(dat.SOURCE_SERIAL.Orientation[0]*Math.PI/180,dat.SOURCE_SERIAL.Orientation[1]*Math.PI/180,-dat.SOURCE_SERIAL.Orientation[2]*Math.PI/180)
|
||||
renderSerial(dat.SOURCE_SERIAL.Orientation[0]*Math.PI/180,-dat.SOURCE_SERIAL.Orientation[2]*Math.PI/180,dat.SOURCE_SERIAL.Orientation[1]*Math.PI/180)
|
||||
}
|
||||
if(!(dat.SOURCE_SERIAL.Position[1] === 0) && !(dat.SOURCE_SERIAL.Position[0] === 0)){
|
||||
document.getElementById("SERIALlong").innerHTML = "Ublox long: " + dat.SOURCE_SERIAL.Position[1]
|
||||
@ -122,25 +124,26 @@ window.addEventListener("load", function(evt) {
|
||||
addSpeedSerial(dat.SOURCE_SERIAL.Speed);
|
||||
}
|
||||
if(!(dat.SOURCE_SERIAL.HeadDevice === 0)){
|
||||
document.getElementById("compassSERIAL").innerHTML = "Ublox: " + dat.SOURCE_SERIAL.HeadDevice.toFixed(0) + "°"
|
||||
document.getElementById("needle").style.transform = `rotate(${dat.SOURCE_SERIAL.HeadDevice}deg)`
|
||||
document.getElementById("compassSERIAL").innerHTML = "Heading Device: " + dat.SOURCE_SERIAL.HeadDevice.toFixed(2) + "°"
|
||||
// document.getElementById("needle").style.transform = `rotate(${dat.SOURCE_SERIAL.HeadDevice}deg)`
|
||||
}
|
||||
if(!(dat.SOURCE_SERIAL.HeadMotion === 0)) {
|
||||
document.getElementById("compassSERIALMot").innerHTML = "Heading Motion: " + dat.SOURCE_SERIAL.HeadMotion.toFixed(2) + "°"
|
||||
}
|
||||
}catch{
|
||||
// console.log("no serial data")
|
||||
}
|
||||
|
||||
|
||||
|
||||
try{
|
||||
if(!(dat.SOURCE_SERIAL.HAcc === 0) && !(dat.SOURCE_SERIAL.VAcc === 0)){
|
||||
addSerialAccuracy(dat.SOURCE_SERIAL.HAcc)
|
||||
document.getElementById("serialHAcc").innerHTML = "Ublox HAcc: " + dat.SOURCE_SERIAL.HAcc.toFixed(3) + " m"
|
||||
//document.getElementById("serialVAcc").innerHTML = "Ublox VAcc: " + dat.SOURCE_SERIAL.VAcc.toFixed(2) + " m"
|
||||
console.log("acc: " + dat.SOURCE_SERIAL.HAcc, dat.SOURCE_SERIAL.VAcc)
|
||||
//console.log("acc: " + dat.SOURCE_SERIAL.HAcc, dat.SOURCE_SERIAL.VAcc)
|
||||
}
|
||||
}
|
||||
catch{
|
||||
console.log("no Serial acc")
|
||||
// console.log("no Serial acc")
|
||||
}
|
||||
|
||||
/*try{
|
||||
|
||||
@ -49,6 +49,7 @@ body{margin:0; padding:0; font-size:13px; font-family:Georgia, "Times New Roman"
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
width: 34%;
|
||||
max-width: 460px;
|
||||
}
|
||||
.left-col {
|
||||
display: flex;
|
||||
@ -469,3 +470,7 @@ label { margin-right: 10px; }
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
.compass-digital {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
@ -8,15 +8,15 @@
|
||||
<link href="https://api.mapbox.com/mapbox-gl-js/v1.12.0/mapbox-gl.css" rel="stylesheet"/>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r124/three.js"></script>
|
||||
<script src="static/scripts/websocket.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="static/indicators/css/flightindicators.css" />
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script src="static/indicators/js/jquery.flightindicators.js"></script>
|
||||
<link rel="stylesheet" href="static/style.css">
|
||||
<!-- <script src="http://www.x3dom.org/release/x3dom.js"></script>-->
|
||||
<!-- <link rel="stylesheet" href="http://www.x3dom.org/release/x3dom.css">-->
|
||||
</head>
|
||||
<body>
|
||||
<table style="font-size: small">
|
||||
<tr>
|
||||
<td valign="top" width="100%">
|
||||
<p>"Verbinden" klicken um eine Verbindung mit dem Server aufzubauen. {{.}}</p>
|
||||
<div class="controls">
|
||||
<label><input type="checkbox" id="checkbox1" value="smartphone"> TCP</label><br>
|
||||
<label><input type="checkbox" id="checkbox2" value="ublox"> SERIAL</label><br>
|
||||
@ -33,7 +33,7 @@
|
||||
</select>
|
||||
</label>
|
||||
<button id="replaystarten" style="margin-right: 16px;" disabled>Wiedergabe starten</button>
|
||||
<button id="fullReplay">Gesamte Wiedergabe</button>
|
||||
<button id="fullReplay">TRACKINGANALYSE</button>
|
||||
</div>
|
||||
<br>
|
||||
<label id="tracking state" style="font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif">Tracking
|
||||
@ -45,7 +45,7 @@
|
||||
<label id="SERIALlat" style="font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif">Ublox lat: </label>
|
||||
</td>
|
||||
<td valign="top">
|
||||
<div id="output"><p>.</p></div>
|
||||
<div id="output"><p>CLOSED</p></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
@ -124,51 +124,72 @@
|
||||
|
||||
<div class="float-child right-col">
|
||||
<div class="compass-container">
|
||||
<div id="compass">
|
||||
<!-- <div id="compass">-->
|
||||
<!-- <div id="bezel"></div>-->
|
||||
<!-- <div id="NWSE" class="quad"></div>-->
|
||||
<!-- <div id="NESW" class="quad"></div>-->
|
||||
<!-- <div id="NS" class="quad"></div>-->
|
||||
<!-- <div id="WE" class="quad"></div>-->
|
||||
<!-- <span id="N" class="dir">N</span>-->
|
||||
<!-- <span id="E" class="dir">O</span>-->
|
||||
<!-- <span id="S" class="dir">S</span>-->
|
||||
<!-- <span id="W" class="dir">W</span>-->
|
||||
<!-- <div id="needle"></div>-->
|
||||
<!-- <div id="axis"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div id="compass1">-->
|
||||
<!-- <div id="bezelTCP"></div>-->
|
||||
<!-- <div id="NWSETCP" class="quad"></div>-->
|
||||
<!-- <div id="NESWTCP" class="quad"></div>-->
|
||||
<!-- <div id="NSTCP" class="quad"></div>-->
|
||||
<!-- <div id="WETCP" class="quad"></div>-->
|
||||
<!-- <span id="NTCP" class="dir">N</span>-->
|
||||
<!-- <span id="ETCP" class="dir">O</span>-->
|
||||
<!-- <span id="STCP" class="dir">S</span>-->
|
||||
<!-- <span id="WTCP" class="dir">W</span>-->
|
||||
<!-- <div id="needleTCP"></div>-->
|
||||
<!-- <div id="axisTCP"></div>-->
|
||||
<!-- </div>-->
|
||||
<label id="airspeedLabel"
|
||||
style="display:inline-block; width: 200px; margin-right: 0; color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Ref. Speed:</label>
|
||||
<label id="altitudeLabel"
|
||||
style="color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Altitude: </label><br>
|
||||
<span id="airspeed"></span>
|
||||
<span id="altimeter"></span>
|
||||
<div class="compass-digital">
|
||||
<label id="compassSERIAL"
|
||||
style="color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Ublox </label>
|
||||
<div id="bezel"></div>
|
||||
<div id="NWSE" class="quad"></div>
|
||||
<div id="NESW" class="quad"></div>
|
||||
<div id="NS" class="quad"></div>
|
||||
<div id="WE" class="quad"></div>
|
||||
<span id="N" class="dir">N</span>
|
||||
<span id="E" class="dir">O</span>
|
||||
<span id="S" class="dir">S</span>
|
||||
<span id="W" class="dir">W</span>
|
||||
<div id="needle"></div>
|
||||
<div id="axis"></div>
|
||||
</div>
|
||||
<div id="compass1">
|
||||
style="display:inline-block; width: 200px; margin-right: 0; color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif"></label>
|
||||
<label id="compassTCP"
|
||||
style="color: rgba(30, 139, 195, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Smartphone </label><br>
|
||||
<div id="bezelTCP"></div>
|
||||
<div id="NWSETCP" class="quad"></div>
|
||||
<div id="NESWTCP" class="quad"></div>
|
||||
<div id="NSTCP" class="quad"></div>
|
||||
<div id="WETCP" class="quad"></div>
|
||||
<span id="NTCP" class="dir">N</span>
|
||||
<span id="ETCP" class="dir">O</span>
|
||||
<span id="STCP" class="dir">S</span>
|
||||
<span id="WTCP" class="dir">W</span>
|
||||
<div id="needleTCP"></div>
|
||||
<div id="axisTCP"></div>
|
||||
style="color: rgba(30, 139, 195, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif"></label><br>
|
||||
<label id="compassSERIALMot"
|
||||
style="display:inline-block; width: 200px; margin-right: 0; color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif"></label>
|
||||
<label id="compassTCPMot"
|
||||
style="color: rgba(30, 139, 195, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif"></label><br>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<span id="headingSer"></span>
|
||||
<span id="headingTcp"></span>
|
||||
<span id="attitudeSer"></span>
|
||||
<span id="attitudeTcp"></span>
|
||||
<!-- <span id="variometer"></span>-->
|
||||
|
||||
<div>
|
||||
<div id="viewport">
|
||||
</div>
|
||||
<label id="quaternionOffset"
|
||||
style="color: grey; font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Lage Abweichung: </label><br>
|
||||
<div class="slidecontainer">
|
||||
<button id="calibrate">Smartphone Ausrichtung kalibrieren</button>
|
||||
<button id="deleteCalibration">Kalibrierung zurücksetzen</button>
|
||||
<button id="manualCalibration">Manuelle Kalibrierung</button>
|
||||
<div id="manCalContainer">
|
||||
<p><br>Manuelle Kalibrierung</p>
|
||||
<label>Pitch<input type="range" min="-90" max="90" value="0" class="slider" id="pitchRange"
|
||||
<label>Pitch<input type="range" min="-180" max="180" value="0" class="slider" id="pitchRange"
|
||||
style="margin: 10px 0px"></label>
|
||||
<label>Yaw<input type="range" min="-90" max="90" value="0" class="slider" id="yawRange"
|
||||
<label>Yaw<input type="range" min="-180" max="180" value="0" class="slider" id="yawRange"
|
||||
style="margin: 10px 0px"></label>
|
||||
<label>Roll<input type="range" min="-90" max="90" value="0" class="slider" id="rollRange"
|
||||
<label>Roll<input type="range" min="-180" max="180" value="0" class="slider" id="rollRange"
|
||||
style="margin: 10px 0px"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -4,6 +4,7 @@ import (
|
||||
"errors"
|
||||
"git.timovolkmann.de/gyrogpsc/core"
|
||||
"github.com/gofiber/fiber/v2"
|
||||
"github.com/gofiber/fiber/v2/middleware/logger"
|
||||
"github.com/gofiber/template/html"
|
||||
"github.com/gofiber/websocket/v2"
|
||||
"github.com/google/uuid"
|
||||
@ -14,7 +15,8 @@ func CreateServer(s *core.TrackingService, sub core.Subscriber, c *core.Configur
|
||||
app := fiber.New(fiber.Config{
|
||||
Views: fiberTemplateEngine(c),
|
||||
})
|
||||
app.Static("/static", "static")
|
||||
app.Use(logger.New())
|
||||
app.Static("/static", "./static")
|
||||
|
||||
// Application Main Page
|
||||
app.Get("/", fiberHomeHandler)
|
||||
|
||||
Loading…
Reference in New Issue
Block a user