Remoção do package @portugol-webstudio/graphics e migração dos seus a…

…rquivos para o @portugol-webstudio/runtime

package.json

@@ -31,7 +31,6 @@
     "build:parser": "lerna run build --scope=@portugol-webstudio/parser",
     "build:runner": "lerna run build --scope=@portugol-webstudio/runner",
     "build:runtime": "lerna run build --scope=@portugol-webstudio/runtime",
-    "build:graphics": "lerna run build --scope=@portugol-webstudio/graphics",
     "test:parser": "lerna run test --scope=@portugol-webstudio/parser",
     "release": "lerna run release",
     "postinstall": "patch-package"

packages/ide/package.json

@@ -49,7 +49,6 @@
     "@portugol-webstudio/resources": "*",
     "@portugol-webstudio/runner": "*",
     "@portugol-webstudio/runtime": "*",
-    "@portugol-webstudio/graphics": "*",
     "@sentry/angular": "^8.47.0",
     "angular-split": "^18.0.0",
     "angular-svg-icon": "^19.1.0",

packages/ide/src/app/tab-editor/tab-editor.component.ts

@@ -12,8 +12,8 @@ import {
 } from "@angular/core";
 import { MatSnackBar } from "@angular/material/snack-bar";
 import type { PortugolCodeError } from "@portugol-webstudio/antlr";
-import { GraphicsContext } from "@portugol-webstudio/graphics";
 import { PortugolExecutor, PortugolWebWorkersRunner } from "@portugol-webstudio/runner";
+import { PortugolGraphicsContext } from "@portugol-webstudio/runtime";
 import { captureException, setExtra } from "@sentry/angular";
 import { saveAs } from "file-saver";
 import { encode } from "iconv-lite";
@@ -64,7 +64,7 @@ export class TabEditorComponent implements OnInit, OnDestroy {
 
   transpiling = false;
   executor = new PortugolExecutor(PortugolWebWorkersRunner);
-  graphicsContext = new GraphicsContext(this.executor);
+  graphicsContext = new PortugolGraphicsContext();
 
   codeEditor?: monaco.editor.IStandaloneCodeEditor;
 
@@ -194,6 +194,16 @@ export class TabEditorComponent implements OnInit, OnDestroy {
         wordWrap: wordWrap ? "on" : "off",
       };
     });
+
+    this.graphicsContext.addEventListener("close", event => {
+      if (event instanceof CustomEvent && event.detail.userClose && this.executor.running) {
+        this.executor.stop();
+      }
+    });
+
+    this.graphicsContext.addEventListener("rendered", () => {
+      this.executor.postMessage({ type: "graphics-rendered" });
+    });
   }
 
   ngOnDestroy() {

packages/graphics/src/GraphicsContext.ts → packages/runtime/src/graphics/PortugolGraphicsContext.ts

@@ -1,13 +1,10 @@
-import { PortugolExecutor } from "@portugol-webstudio/runner";
+import { PortugolGraphicsDrawCall } from "./PortugolGraphicsDrawCall";
 
-type DrawCallFunction = () => void;
-
-export class GraphicsContext {
+export class PortugolGraphicsContext extends EventTarget {
   window: Window | null = null;
   canvas: HTMLCanvasElement | null = null;
   canvasContext: CanvasRenderingContext2D | null = null;
 
-  private _executor: PortugolExecutor;
   private _title = "";
 
   private _width = 800;
@@ -16,11 +13,7 @@ export class GraphicsContext {
   private _workingColor = 0;
   private _workingOpacity = 255;
 
-  private _drawCalls: DrawCallFunction[] = [];
-
-  constructor(executor: PortugolExecutor) {
-    this._executor = executor;
-  }
+  private _drawCalls: PortugolGraphicsDrawCall[] = [];
 
   /**
    * Inicializa o contexto gráfico.
@@ -37,8 +30,7 @@ export class GraphicsContext {
     this.window.document.body.style.overflow = "hidden";
 
     this.window.addEventListener("beforeunload", () => {
-      this.destroy();
-      this._executor?.stop();
+      this.destroy(true);
     });
 
     this.canvas = this.window.document.createElement("canvas");
@@ -47,6 +39,15 @@ export class GraphicsContext {
     this.window.document.body.append(this.canvas);
 
     this.canvasContext = this.canvas.getContext("2d");
+
+    this.onInit();
+  }
+
+  /**
+   * Função chamada quando o contexto gráfico é inicializado.
+   */
+  private onInit() {
+    this.dispatchEvent(new Event("init"));
   }
 
   /**
@@ -59,12 +60,21 @@ export class GraphicsContext {
   /**
    * Fecha a janela.
    */
-  closeWindow() {
+  closeWindow(userClose = false) {
     try {
       if (this.window) {
         this.window.close();
       }
     } catch {}
+
+    this.onWindowClose(userClose);
+  }
+
+  /**
+   * Função chamada quando a janela é fechada.
+   */
+  private onWindowClose(userClose = false) {
+    this.dispatchEvent(new CustomEvent("close", { detail: { userClose } }));
   }
 
   /**
@@ -86,8 +96,8 @@ export class GraphicsContext {
   /**
    * Destroi o contexto gráfico.
    */
-  destroy() {
-    this.closeWindow();
+  destroy(userClose = false) {
+    this.closeWindow(userClose);
     this.canvas = null;
     this.canvasContext = null;
     this.window = null;
@@ -270,7 +280,7 @@ export class GraphicsContext {
    * Função interna para adicionar um desenho na lista de chamadas.
    * @param drawFunc Função de desenho.
    */
-  private drawCall(drawFunc: DrawCallFunction) {
+  private drawCall(drawFunc: PortugolGraphicsDrawCall) {
     this._drawCalls.push(drawFunc);
   }
 
@@ -298,11 +308,17 @@ export class GraphicsContext {
         this._drawCalls = [];
       }
 
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-      this._executor.postMessage({ type: "graphics-rendered" });
+      this.onRendered();
     });
   }
 
+  /**
+   * Função chamada quando a tela é renderizada.
+   */
+  private onRendered() {
+    this.dispatchEvent(new Event("rendered"));
+  }
+
   /**
    * Limpa a tela.
    */

packages/runtime/src/graphics/PortugolGraphicsDrawCall.ts

@@ -0,0 +1,4 @@
+/**
+ * Representa uma chamada de desenho de gráficos.
+ */
+export type PortugolGraphicsDrawCall = () => void;

packages/runtime/src/graphics/index.ts

@@ -0,0 +1,2 @@
+export * from "./PortugolGraphicsContext.js";
+export * from "./PortugolGraphicsDrawCall.js";

packages/runtime/src/index.ts

@@ -1,2 +1,3 @@
+export * from "./graphics/index.js";
 export * from "./PortugolJs.js";
 export { runtime as PortugolJsRuntime } from "./runtime/index.js";