Add HD OSD support

locales/en/messages.json

@@ -4760,6 +4760,10 @@
         "message": "NTSC",
         "description": "Option for the video format in the OSD"
     },
+    "osdSetupVideoFormatOptionHd": {
+        "message": "HD",
+        "description": "Option for the video format in the OSD"
+    },
     "osdSetupUnitsTitle": {
         "message": "Units"
     },
@@ -4990,6 +4994,83 @@
         "message": "Aux value",
         "description": "One of the elements of the OSD"
     },
+    "osdTextElementSysGoggleVoltage": {
+        "message": "Goggle voltage",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysGoggleVoltage": {
+        "message": "Goggle voltage rendered by the goggles"
+    },
+    "osdTextElementSysVtxVoltage": {
+        "message": "VTX voltage",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysVtxVoltage": {
+        "message": "VTX voltage rendered by the goggles"
+    },
+    "osdTextElementSysBitrate": {
+        "message": "VTX bitrate",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysBitrate": {
+        "message": "Video bitrate rendered by the goggles"
+    },
+    "osdTextElementSysDelay": {
+        "message": "VTX delay",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysDelay": {
+        "message": "Video delay rendered by the goggles"
+    },
+    "osdTextElementSysDistance": {
+        "message": "VTX distance",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysDistance": {
+        "message": "Video transmission distance rendered by the goggles"
+    },
+    "osdTextElementSysLQ": {
+        "message": "Goggle link quality",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysLQ": {
+        "message": "Video link quality rendered by the goggles"
+    },
+    "osdTextElementSysGoggleDVR": {
+        "message": "Goggle DVR status",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysGoggleDVR": {
+        "message": "Goggle DVR status rendered by the goggles"
+    },
+    "osdTextElementSysVtxDVR": {
+        "message": "VTX DVR status",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysVtxDVR": {
+        "message": "VTX DVR status rendered by the goggles"
+    },
+    "osdTextElementSysWarnings": {
+        "message": "Goggle system warnings",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysWarnings": {
+        "message": "Video system warnings rendered by the goggles"
+    },
+    "osdTextElementSysVtxTemp": {
+        "message": "VTX temperature",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysVtxTemp": {
+        "message": "VTX temperature rendered by the goggles"
+    },
+    "osdTextElementSysFanSpeed": {
+        "message": "Goggle fan speed",
+        "description": "One of the system elements of the OSD"
+    },
+    "osdDescElementSysFanSpeed": {
+        "message": "Goggle fan speed rendered by the goggles"
+    },
     "osdTextElementCraftName": {
         "message": "Craft name",
         "description": "One of the elements of the OSD"

src/css/dark-theme.less

@@ -512,10 +512,6 @@ progress[value] {
 	.preview {
 		background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../images/osd-bg-1.jpg);
 		background-size: cover;
-		&:active {
-			background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../../images/osd-bg-1-grid.png), url(../../images/osd-bg-1.jpg);
-			background-size: cover;
-		}
 	}
 	input[type='checkbox'] {
 		&:after {

src/css/tabs/osd.less

@@ -214,13 +214,20 @@
 			margin: 0;
 			flex: 1 1 auto;
 			flex-wrap: nowrap;
+			border: 1px solid transparent;
 			img {
 				flex: 1 1 auto;
 			}
 		}
 		.char[draggable="true"] {
 			cursor: move;
 		}
+
+		&:active {
+			.char {
+				border: 1px dashed rgba(55, 55, 55, 0.5) ;
+			}
+		}
 	}
 	.char.mouseover {
 		background: rgba(255,255,255,0.4);
@@ -307,24 +314,7 @@
 	select.osd-variant {
 		max-width: 100%;
 	}
-	.video-pal {
-		.preview {
-			&:active {
-				background: url(../../images/osd-bg-1-grid-pal.png), url(../../images/osd-bg-1.jpg);
-				background-size: 100% 100%, cover;
-				background-repeat: no-repeat;
-			}
-		}
-	}
-	.video-ntsc {
-		.preview {
-			&:active {
-				background: url(../../images/osd-bg-1-grid-ntsc.png), url(../../images/osd-bg-1.jpg);
-				background-size: 100% 100%, cover;
-				background-repeat: no-repeat;
-			}
-		}
-	}
+
 	.alarms {
 		label {
 			display: block;

src/js/msp/MSPCodes.js

@@ -138,6 +138,9 @@ const MSPCodes = {
     MSP_BEEPER_CONFIG:              184,
     MSP_SET_BEEPER_CONFIG:          185,
 
+    MSP_SET_OSD_CANVAS:             188,
+    MSP_OSD_CANVAS:                 189,
+
     MSP_SET_RAW_RC:                 200,
     MSP_SET_RAW_GPS:                201, // Not used
     MSP_SET_PID:                    202,

src/js/msp/MSPHelper.js

@@ -1693,6 +1693,12 @@ MspHelper.prototype.process_data = function(dataHandler) {
             case MSPCodes.MSP_SET_FAILSAFE_CONFIG:
                 console.log('Failsafe config saved');
                 break;
+            case MSPCodes.MSP_OSD_CANVAS:
+                OSD.data.VIDEO_COLS['HD'] = data.readU8();
+                OSD.data.VIDEO_ROWS['HD'] = data.readU8();
+                OSD.data.VIDEO_BUFFER_CHARS['HD'] = OSD.data.VIDEO_COLS['HD'] * OSD.data.VIDEO_ROWS['HD'];
+                console.log(`Canvas ${OSD.data.VIDEO_COLS['HD']} x ${OSD.data.VIDEO_ROWS['HD']}`);
+                break;
             case MSPCodes.MSP_OSD_CONFIG:
                 break;
             case MSPCodes.MSP_SET_OSD_CONFIG: