diff --git a/GUI-help.png b/GUI-help.png
index e01faba..4552a32 100644
Binary files a/GUI-help.png and b/GUI-help.png differ
diff --git a/public/css/rayremote.css b/public/css/rayremote.css
index 33adf2e..f032b0f 100644
--- a/public/css/rayremote.css
+++ b/public/css/rayremote.css
@@ -185,6 +185,11 @@ html {
left: 140px;
}
+#typeValIcon {
+ left: 48px;
+ width: 34px;
+}
+
#sendIcon {
left: 120px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAQAAAD8x0bcAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAyklEQVQoz8XOIU4DARCF4Y+iIO02IeAxCERFRRWFW+DgAAjugK8gNXCFUlQNWHQNBDD1yGZTgmw3g9jNssmGSphR8+bN/I8/rc2aMnDkaf3RQAhX6ywtUyFMtX6z7IFDB5WpBvp0Xk5nvurQxEwIC89eLIQwk1Qtu2i7lYmiV260i00BmuuBpr5LF/qaoGeeQxPvwsrYsUb5u+HEnUx4y6FbxgUk9eDa0KO0UEa2f1J1TSzLRCEsTXTz5UYl/o5THfsyH17dS/1PfQMplUPMhfqpHwAAAABJRU5ErkJggg==);
@@ -197,7 +202,7 @@ html {
}
#errorIcon {
- left: 80px;
+ left: 82px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAQAAAD8x0bcAAAAwElEQVR4AZXRtXUDMBQAwOvDjaEMwwBhWiE0RKiy9wiWYc4W3iSoGcKRS71n9qmU9FH7+izbtWVZr5pyHsR0PMiqMOjdp2MDYMCxT++GSfKCYILEhOBVHoAbf+YA+/YBc/5cA/T4dwagpATg1L8eYFU0XfPRlGgDKIi6az7qFhWAoqgTlTXRKSoC61I6gJRuPRV+XjPSWSqcK/9mVD6a8e+qcphjSMYEQZZkyJvKtTwbUiHvsdmCgV7Ldu1a1qtdZTafSCFQvo25AAAAAElFTkSuQmCC);
}
@@ -215,7 +220,7 @@ html {
}
#countDownCounter {
- left: 36px;
+ left: 34px;
text-align: center;
}
@@ -229,6 +234,7 @@ html {
text-align: center;
font-weight: bolder;
font-size: 30px;
+ cursor: pointer;
}
#pilotStatus {
@@ -242,6 +248,7 @@ html {
text-transform: uppercase;
font-weight: bolder;
font-size: 30px;
+ cursor: pointer;
}
.messageScreen {
diff --git a/public/index.html b/public/index.html
index 99747c7..f8ea974 100644
--- a/public/index.html
+++ b/public/index.html
@@ -31,7 +31,8 @@
Loading Ray Remote...
-
Mute alarm press:
diff --git a/public/js/rayremote.js b/public/js/rayremote.js
index e8dd018..3d155af 100644
--- a/public/js/rayremote.js
+++ b/public/js/rayremote.js
@@ -36,7 +36,6 @@ var touchEnd = function(event) {
var ws = null;
var handlePilotStatusTimeout = null;
-var handleHeadindValueTimeout = null;
var handleReceiveTimeout = null;
var handleSilenceScreenTimeout = null;
var handleConfirmActionTimeout = null;
@@ -44,7 +43,7 @@ var handleCountDownCounterTimeout = null;
var connected = false;
var reconnect = true;
const timeoutReconnect = 2000;
-const timeoutValue = 2000;
+const timeoutValue = 3000;
const timeoutBlink = 500;
const countDownDefault = 5;
const noDataMessage = '-- -- -- --';
@@ -52,6 +51,7 @@ var pilotStatusDiv = undefined;
var headingValueDiv = undefined;
var receiveIconDiv = undefined;
var sendIconDiv = undefined;
+var typeValIconDiv = undefined;
var errorIconDiv = undefined;
var countDownCounterDiv = undefined;
var powerOnIconDiv = undefined;
@@ -67,11 +67,46 @@ var actionToBeConfirmed = '';
var countDownValue = 0;
var pilotStatus = '';
+var displayByPathParams = {
+ 'navigation.headingMagnetic': {
+ handleTimeout: null,
+ typeVal: 'Mag',
+ usage: ['wind', 'route', 'auto', 'standby'],
+ value: ''
+ },
+ 'navigation.headingTrue': {
+ handleTimeout: null,
+ typeVal: 'True',
+ usage: ['wind', 'route', 'auto', 'standby'],
+ value: ''
+ },
+ 'environment.wind.angleApparent': {
+ handleTimeout: null,
+ typeVal: 'AWA',
+ usage: ['wind'],
+ value: ''
+ },
+ 'environment.wind.angleTrueWater': {
+ handleTimeout: null,
+ typeVal: 'TWA',
+ usage: ['wind'],
+ value: ''
+ }
+}
+
+var preferedDisplayMode = {
+ wind: 'environment.wind.angleApparent',
+ route: 'navigation.headingMagnetic',
+ auto: 'navigation.headingMagnetic',
+ standby: 'navigation.headingMagnetic'
+}
+
var startUpRayRemote = function() {
pilotStatusDiv = document.getElementById('pilotStatus');
headingValueDiv = document.getElementById('headingValue');
receiveIconDiv = document.getElementById('receiveIcon');
sendIconDiv = document.getElementById('sendIcon');
+ typeValIconDiv = document.getElementById('typeValIcon');
errorIconDiv = document.getElementById('errorIcon');
powerOnIconDiv = document.getElementById('powerOnIcon');
powerOffIconDiv = document.getElementById('powerOffIcon');
@@ -82,8 +117,20 @@ var startUpRayRemote = function() {
silenceScreenTextDiv = document.getElementById('silenceScreenText');
confirmScreenDiv = document.getElementById('confirmScreen');
countDownCounterDiv = document.getElementById('countDownCounter');
- setPilotStatus(noDataMessage);
- setHeadindValue(noDataMessage);
+ setPilotStatus('');
+ setHeadindValue('');
+ var savedPreferedDisplayModeJSON = localStorage.getItem('signalk-raymarine-autopilot');
+ var savedPreferedDisplayMode = savedPreferedDisplayModeJSON && JSON.parse(savedPreferedDisplayModeJSON);
+ if (savedPreferedDisplayMode === null) {savedPreferedDisplayMode = {};}
+ savedPreferedDisplayMode = (typeof savedPreferedDisplayMode.preferedDisplayMode !== 'undefined') ? savedPreferedDisplayMode.preferedDisplayMode : {};
+ Object.keys(preferedDisplayMode).map( pilotMode => {
+ var pathForPilotMode = savedPreferedDisplayMode[pilotMode];
+ if ((typeof pathForPilotMode !== 'undefined') &&
+ (typeof displayByPathParams[pathForPilotMode] !== 'undefined') &&
+ displayByPathParams[pathForPilotMode].usage.includes(pilotMode)) {
+ preferedDisplayMode[pilotMode] = pathForPilotMode;
+ }
+ })
// demo(); return;
setTimeout(() => {
receiveIconDiv.style.visibility = 'hidden';
@@ -92,13 +139,16 @@ var startUpRayRemote = function() {
bottomBarIconDiv.style.visibility = 'hidden';
notificationCounterDiv.style.visibility = 'hidden';
countDownCounterDiv.innerHTML = '';
+ typeValIconDiv.innerHTML = '';
wsConnect();
}, 1500);
}
var demo = function () {
- setHeadindValue(100);
- setPilotStatus('WIND');
+ var headingPath = 'environment.wind.angleTrueWater';
+ setPilotStatus('wind');
+ buildHeadindValue( headingPath, 1.74);
+ clearTimeout(displayByPathParams[headingPath].handleTimeout);
setNotificationMessage({"path":"notifications.autopilot.PilotWarningWindShift","value":{"state":"alarm","message":"Pilot Warning Wind Shift"}});
powerOffIconDiv.style.visibility = 'hidden';
powerOnIconDiv.style.visibility = 'visible';
@@ -234,6 +284,24 @@ var getNextNotification = function(skPath) {
return newSkPathToAck;
}
+var changePreferedDisplayMode = function() {
+ const currentPilotStatus = pilotStatus;
+ const currentPreferedDisplayMode = preferedDisplayMode[currentPilotStatus];
+ var pathForPilotStatus = [];
+ if (typeof currentPreferedDisplayMode === 'undefined') {return null}
+ for (let [key, value] of Object.entries(displayByPathParams)) {
+ if ((typeof value.usage === 'object') && value.usage.includes(currentPilotStatus)) {
+ pathForPilotStatus.push(key);
+ }
+ }
+ const currentIndex = pathForPilotStatus.indexOf(currentPreferedDisplayMode);
+ const nextIndex = (currentIndex + 1) % pathForPilotStatus.length;
+ preferedDisplayMode[currentPilotStatus] = pathForPilotStatus[nextIndex];
+ localStorage.setItem('signalk-raymarine-autopilot', JSON.stringify({preferedDisplayMode: preferedDisplayMode}));
+ setHeadindValue(displayByPathParams[preferedDisplayMode[currentPilotStatus]].value);
+ typeValIconDiv.innerHTML = displayByPathParams[preferedDisplayMode[currentPilotStatus]].typeVal;
+}
+
var confirmTack = function(cmd) {
var message = 'Repeat same key
to confirm
tack to ';
if (cmd === 'tackToPort') {
@@ -303,6 +371,21 @@ var wsConnect = function() {
"format": "delta",
"minPeriod": 900
},
+ {
+ "path": "navigation.headingTrue",
+ "format": "delta",
+ "minPeriod": 900
+ },
+ {
+ "path": "environment.wind.angleApparent",
+ "format": "delta",
+ "minPeriod": 900
+ },
+ {
+ "path": "environment.wind.angleTrueWater",
+ "format": "delta",
+ "minPeriod": 900
+ },
{
"path": "notifications.autopilot.*",
"format": "delta",
@@ -312,8 +395,6 @@ var wsConnect = function() {
};
var subscriptionMessage = JSON.stringify(subscriptionObject);
ws.send(subscriptionMessage);
- handlePilotStatusTimeout = setTimeout(() => {setPilotStatus(noDataMessage)}, timeoutValue);
- handleHeadindValueTimeout = setTimeout(() => {setHeadindValue(noDataMessage)}, timeoutValue);
}
ws.onclose = function() {
@@ -356,14 +437,15 @@ var dispatchMessages = function(jsonData) {
update.values.forEach((value) => {
if (value.path === "steering.autopilot.state") {
clearTimeout(handlePilotStatusTimeout);
- handlePilotStatusTimeout = setTimeout(() => {setPilotStatus(noDataMessage)}, timeoutValue);
+ handlePilotStatusTimeout = setTimeout(() => {
+ console.log('timeout:'+pilotStatus);
+ setPilotStatus('');
+ }, timeoutValue);
setPilotStatus(value.value);
- } else if (value.path === "navigation.headingMagnetic") {
- clearTimeout(handleHeadindValueTimeout);
- handleHeadindValueTimeout = setTimeout(() => {setHeadindValue(noDataMessage)}, timeoutValue);
- setHeadindValue(Math.round(value.value * (180/Math.PI)));
} else if (value.path.startsWith("notifications.autopilot")) {
setNotificationMessage(value);
+ } else {
+ buildHeadindValue(value.path, value.value);
}
});
}
@@ -371,19 +453,46 @@ var dispatchMessages = function(jsonData) {
}
}
-var setHeadindValue = function(value) {
- if (value !== '') {
- value = ((typeof value === 'undefined') || isNaN(value)) ? noDataMessage : 'Mag:' + value + '°';
+var buildHeadindValue = function(path, value) {
+ var displayByPathParam = displayByPathParams[path];
+
+ if (typeof displayByPathParam === 'undefined') {
+ console.log('unknown path:' + path);
+ return null;
}
- headingValueDiv.innerHTML = value;
+
+ value = Math.round(value * (180/Math.PI));
+ displayByPathParam.value = ((typeof value === 'undefined') || isNaN(value)) ? noDataMessage : ' ' + value + '°';
+ clearTimeout(displayByPathParam.handleTimeout);
+ displayByPathParam.handleTimeout = setTimeout(() => {
+ displayByPathParams[path].value = noDataMessage;
+ console.log('timeout:{'+pilotStatus+'}['+path+']'+displayByPathParams[path].value);
+ if (preferedDisplayMode[pilotStatus] == path) {
+ setHeadindValue(displayByPathParams[path].value);
+ }
+ }, timeoutValue, path);
+ if (preferedDisplayMode[pilotStatus] == path) {
+ if (typeValIconDiv.innerHTML !== displayByPathParam.typeVal) {
+ typeValIconDiv.innerHTML = displayByPathParam.typeVal;
+ }
+ setHeadindValue(displayByPathParams[path].value);
+ }
+}
+
+var setHeadindValue = function(value) {
+ if (pilotStatus === '') { value = ''}
+ headingValueDiv.innerHTML = ((typeof value === 'undefined') || (value === '')) ? noDataMessage : value;
}
var setPilotStatus = function(value) {
if (typeof value === 'undefined') {
- value = noDataMessage;
+ value = '';
}
- pilotStatusDiv.innerHTML = value;
pilotStatus = value;
+ if (value === '') {
+ setHeadindValue(noDataMessage);
+ pilotStatusDiv.innerHTML = noDataMessage;
+ } else { pilotStatusDiv.innerHTML = value;}
}
var setNotificationMessage = function(value) {
@@ -448,11 +557,15 @@ var cleanOnClosed = function() {
notificationCounterDiv.style.visibility = 'hidden';
silenceScreenDiv.style.visibility = 'hidden';
notificationCounterTextDiv.innerHTML = '';
+ typeValIconDiv.innerHTML = '';
notificationsArray = {};
skPathToAck = '';
actionToBeConfirmed = '';
pilotStatus = '';
- clearTimeout(handleHeadindValueTimeout);
+ Object.keys(displayByPathParams).map( path => {
+ clearTimeout(displayByPathParams[path].handleTimeout);
+ displayByPathParams[path].value = '';
+ });
clearTimeout(handlePilotStatusTimeout);
setPilotStatus('');
setHeadindValue('');
diff --git a/small-rayremote.png b/small-rayremote.png
index 5e52c8f..9f39a50 100644
Binary files a/small-rayremote.png and b/small-rayremote.png differ