add opencv image support

Author: brianignacio5

package.json

@@ -533,6 +533,11 @@
           "command": "espIdf.viewAsLVGLImage",
           "when": "inDebugMode && debugType == 'gdbtarget' && debugState == stopped",
           "group": "navigation"
+        },
+        {
+          "command": "espIdf.viewAsOpenCVImage",
+          "when": "inDebugMode && debugType == 'gdbtarget' && debugState == stopped",
+          "group": "navigation"
         }
       ]
     },
@@ -1780,6 +1785,11 @@
         "title": "%espIdf.viewAsLVGLImage.title%",
         "category": "ESP-IDF"
       },
+      {
+        "command": "espIdf.viewAsOpenCVImage",
+        "title": "%espIdf.viewAsOpenCVImage.title%",
+        "category": "ESP-IDF"
+      },
       {
         "command": "espIdf.openImageViewer",
         "title": "%espIdf.openImageViewer.title%",

package.nls.es.json

@@ -98,6 +98,7 @@
 	"espIdf.welcome.title": "Bienvenido",
 	"espIdf.viewAsHex.title": "Ver como Hexadecimal",
 	"espIdf.viewAsLVGLImage.title": "Ver como Imagen LVGL",
+	"espIdf.viewAsOpenCVImage.title": "Ver como Imagen OpenCV",
 	"espIdf.openImageViewer.title": "Abrir Visor de Imágenes",
 	"espIdf.hexView.copyValue.title": "Copiar valor al portapapeles",
   "espIdf.hexView.deleteElement.title": "Eliminar valor hexadecimal de la lista",

package.nls.json

@@ -96,6 +96,7 @@
   "espIdf.unitTest.installPyTest.title": "Unit Test: Install ESP-IDF PyTest Requirements",
   "espIdf.viewAsHex.title": "View as Hex",
   "espIdf.viewAsLVGLImage.title": "View as LVGL Image",
+  "espIdf.viewAsOpenCVImage.title": "View as OpenCV Image",
   "espIdf.openImageViewer.title": "Open Image Viewer",
   "espIdf.hexView.copyValue.title": "Copy value to clipboard",
   "espIdf.hexView.deleteElement.title": "Delete hex value from list",

package.nls.pt.json

@@ -98,6 +98,7 @@
 	"espIdf.welcome.title": "Bem-vindo",
 	"espIdf.viewAsHex.title": "Ver como Hexadecimal",
 	"espIdf.viewAsLVGLImage.title": "Ver como Imagem LVGL",
+	"espIdf.viewAsOpenCVImage.title": "Ver como Imagem OpenCV",
 	"espIdf.openImageViewer.title": "Abrir Visor de Imagens",
 	"espIdf.hexView.copyValue.title": "Copiar valor para a área de transferência",
   "espIdf.hexView.deleteElement.title": "Excluir valor hexadecimal da lista",

package.nls.ru.json

@@ -96,6 +96,7 @@
 	"espIdf.unitTest.installPyTest.title": "Unit Test: Установка требований ESP-IDF PyTest.",
 	"espIdf.viewAsHex.title": "Просмотреть как шестнадцатеричное",
 	"espIdf.viewAsLVGLImage.title": "Просмотреть как изображение LVGL",
+	"espIdf.viewAsOpenCVImage.title": "Просмотреть как изображение OpenCV",
 	"espIdf.openImageViewer.title": "Открыть просмотрщик изображений",
 	"espIdf.hexView.copyValue.title": "Скопировать значение в буфер обмена",
   "espIdf.hexView.deleteElement.title": "Удалить шестнадцатеричное значение из списка",

package.nls.zh-CN.json

@@ -96,6 +96,7 @@
 	"espIdf.unitTest.installPyTest.title": "单元测试：安装 ESP-IDF PyTest 依赖项",
 	"espIdf.viewAsHex.title": "以十六进制查看",
 	"espIdf.viewAsLVGLImage.title": "以 LVGL 图像查看",
+	"espIdf.viewAsOpenCVImage.title": "以 OpenCV 图像查看",
 	"espIdf.openImageViewer.title": "打开图像查看器",
 	"espIdf.hexView.copyValue.title": "复制值到剪贴板",
 	"espIdf.hexView.deleteElement.title": "从列表中删除十六进制值",

src/cdtDebugAdapter/imageViewPanel.ts

@@ -89,6 +89,29 @@ export class ImageViewPanel {
     }
   }
 
+  public static handleOpenCVVariableFromContext(debugContext: {
+    container: {
+      expensive: boolean;
+      name: string;
+      variablesReference: number;
+    };
+    sessionId: string;
+    variable: {
+      evaluateName: string;
+      memoryReference: string;
+      name: string;
+      value: string;
+      variablesReference: number;
+      type: string;
+    };
+  }) {
+    if (ImageViewPanel.instance) {
+      ImageViewPanel.instance.handleExtractOpenCVImageProperties(
+        debugContext.variable
+      );
+    }
+  }
+
   private constructor(panel: vscode.WebviewPanel, extensionPath: string) {
     this.panel = panel;
     this.extensionPath = extensionPath;
@@ -506,6 +529,142 @@ export class ImageViewPanel {
     }
   }
 
+  private async handleExtractOpenCVImageProperties(variableName: {
+    evaluateName: string;
+    memoryReference: string;
+    name: string;
+    value: string;
+    variablesReference: number;
+    type: string;
+  }) {
+    try {
+      const session = vscode.debug.activeDebugSession;
+      if (!session) {
+        this.panel.webview.postMessage({
+          command: "showError",
+          error: "No active debug session found",
+        });
+        return;
+      }
+
+      // Check if the variable is of type cv::Mat
+      if (variableName.type.indexOf("cv::Mat") === -1 && variableName.type.indexOf("Mat") === -1) {
+        this.panel.webview.postMessage({
+          command: "showError",
+          error: `Variable ${variableName.name} is not of type cv::Mat`,
+        });
+        return;
+      }
+
+      // Get the Mat object's children
+      const matChildren = await session.customRequest("variables", {
+        variablesReference: variableName.variablesReference,
+      });
+
+      if (!matChildren || !matChildren.variables) {
+        this.panel.webview.postMessage({
+          command: "showError",
+          error: `No children found for variable ${variableName.name}`,
+        });
+        return;
+      }
+
+      // Extract OpenCV Mat properties
+      const imageProperties: ImageWithDimensionsElement = {
+        name: variableName.name,
+        data: new Uint8Array(),
+        width: 0,
+        height: 0,
+        format: 0,
+      };
+
+      // Extract rows, cols, and data from the Mat structure
+      matChildren.variables.forEach((child: any) => {
+        if (child.name === "rows") {
+          imageProperties.height = parseInt(child.value, 10);
+        } else if (child.name === "cols") {
+          imageProperties.width = parseInt(child.value, 10);
+        } else if (child.name === "data") {
+          const match = child.value.match(/0x[0-9a-fA-F]+/);
+          if (match) {
+            imageProperties.dataAddress = match[0];
+          }
+        } else if (child.name === "step") {
+          // step[0] contains bytes per row
+          // We'll need to get the step array children
+        }
+      });
+
+      // Get step array to determine bytes per row
+      const stepObj = matChildren.variables.find(
+        (child: any) => child.name === "step"
+      );
+
+      let bytesPerRow = 0;
+      if (stepObj) {
+        const stepChildren = await session.customRequest("variables", {
+          variablesReference: stepObj.variablesReference,
+        });
+
+        if (stepChildren && stepChildren.variables) {
+          // step[0] is bytes per row
+          const step0 = stepChildren.variables.find((child: any) => child.name === "[0]");
+          if (step0) {
+            bytesPerRow = parseInt(step0.value, 10);
+          }
+        }
+      }
+
+      // Calculate data size: rows * bytes_per_row
+      if (imageProperties.height > 0 && bytesPerRow > 0) {
+        imageProperties.dataSize = imageProperties.height * bytesPerRow;
+      } else {
+        // Fallback: estimate based on common OpenCV formats
+        // Assume 3 channels (BGR) if we can't determine
+        imageProperties.dataSize = imageProperties.width * imageProperties.height * 3;
+      }
+
+      // Validate that we have the required data
+      if (!imageProperties.dataAddress || !imageProperties.dataSize || 
+          imageProperties.width <= 0 || imageProperties.height <= 0) {
+        this.panel.webview.postMessage({
+          command: "showError",
+          error: `Could not extract complete OpenCV Mat properties from variable ${variableName.name}. Width: ${imageProperties.width}, Height: ${imageProperties.height}, DataSize: ${imageProperties.dataSize}`,
+        });
+        return;
+      }
+
+      // Read memory data
+      const readResponse = await session.customRequest("readMemory", {
+        memoryReference: imageProperties.dataAddress,
+        count: imageProperties.dataSize,
+      });
+
+      if (readResponse && readResponse.data) {
+        const binaryData = Buffer.from(readResponse.data, "base64");
+        imageProperties.data = new Uint8Array(binaryData);
+
+        // OpenCV Mat typically uses BGR888 format (3 bytes per pixel)
+        // Map this to our bgr888 format
+        imageProperties.format = 0x0E; // Map to BGR888 equivalent
+
+        // Update the panel title and send the data
+        this.panel.title = `Image Viewer: ${variableName.name} (OpenCV Mat)`;
+        this.sendImageWithDimensionsData(imageProperties);
+      } else {
+        this.panel.webview.postMessage({
+          command: "showError",
+          error: `Could not read memory data for variable ${variableName.name}`,
+        });
+      }
+    } catch (error) {
+      this.panel.webview.postMessage({
+        command: "showError",
+        error: `Error extracting OpenCV Mat image properties: ${error}`,
+      });
+    }
+  }
+
   private getHtmlContent(webview: vscode.Webview): string {
     const scriptPath = webview.asWebviewUri(
       vscode.Uri.file(

src/extension.ts

@@ -1526,6 +1526,50 @@ export async function activate(context: vscode.ExtensionContext) {
     }
   );
 
+  registerIDFCommand(
+    "espIdf.viewAsOpenCVImage",
+    (debugContext: {
+      container: {
+        expensive: boolean;
+        name: string;
+        variablesReference: number;
+      };
+      sessionId: string;
+      variable: {
+        evaluateName: string;
+        memoryReference: string;
+        name: string;
+        value: string;
+        variablesReference: number;
+        type: string;
+      };
+    }) => {
+      return PreCheck.perform([openFolderCheck], async () => {
+        if (
+          !debugContext ||
+          !debugContext.variable ||
+          !debugContext.variable.evaluateName
+        ) {
+          return;
+        }
+        if (!vscode.debug.activeDebugSession) {
+          return;
+        }
+
+        try {
+          // Show the ImageViewPanel and pass the variable information
+          ImageViewPanel.show(context.extensionPath);
+
+          // Send the variable information to the ImageViewPanel
+          ImageViewPanel.handleOpenCVVariableFromContext(debugContext);
+        } catch (e) {
+          const msg = e && e.message ? e.message : e;
+          Logger.errorNotify(msg, e, "extension espIdf.viewAsOpenCVImage");
+        }
+      });
+    }
+  );
+
   registerIDFCommand("espIdf.openImageViewer", () => {
     return PreCheck.perform([openFolderCheck], () => {
       // Show the ImageViewPanel without an image