From 230127820b507da8ba1c39c066f38a2f4b3913e6 Mon Sep 17 00:00:00 2001 From: Danilo Gadelha Date: Sun, 5 Jan 2025 14:13:32 -0300 Subject: [PATCH] =?UTF-8?q?Remo=C3=A7=C3=A3o=20do=20package=20@portugol-we?= =?UTF-8?q?bstudio/graphics=20e=20migra=C3=A7=C3=A3o=20dos=20seus=20arquiv?= =?UTF-8?q?os=20para=20o=20@portugol-webstudio/runtime?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 16 ------ package.json | 1 - packages/graphics/.gitignore | 1 - packages/graphics/.npmignore | 4 -- packages/graphics/README.md | 3 -- packages/graphics/package.json | 44 ---------------- packages/graphics/src/index.ts | 1 - packages/graphics/tsconfig.json | 10 ---- packages/ide/package.json | 1 - .../app/tab-editor/tab-editor.component.ts | 14 ++++- .../src/graphics/PortugolGraphicsContext.ts} | 52 ++++++++++++------- .../src/graphics/PortugolGraphicsDrawCall.ts | 4 ++ packages/runtime/src/graphics/index.ts | 2 + packages/runtime/src/index.ts | 1 + 14 files changed, 53 insertions(+), 101 deletions(-) delete mode 100644 packages/graphics/.gitignore delete mode 100644 packages/graphics/.npmignore delete mode 100644 packages/graphics/README.md delete mode 100644 packages/graphics/package.json delete mode 100644 packages/graphics/src/index.ts delete mode 100644 packages/graphics/tsconfig.json rename packages/{graphics/src/GraphicsContext.ts => runtime/src/graphics/PortugolGraphicsContext.ts} (88%) create mode 100644 packages/runtime/src/graphics/PortugolGraphicsDrawCall.ts create mode 100644 packages/runtime/src/graphics/index.ts diff --git a/package-lock.json b/package-lock.json index cf9cc3b6..c5e172c6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7157,10 +7157,6 @@ "resolved": "packages/antlr", "link": true }, - "node_modules/@portugol-webstudio/graphics": { - "resolved": "packages/graphics", - "link": true - }, "node_modules/@portugol-webstudio/ide": { "resolved": "packages/ide", "link": true @@ -22185,17 +22181,6 @@ "typescript": "~5.6.3" } }, - "packages/graphics": { - "name": "@portugol-webstudio/graphics", - "version": "0.0.0", - "license": "GPL-3.0", - "dependencies": { - "rxjs": "~7.8.1" - }, - "devDependencies": { - "typescript": "~5.6.3" - } - }, "packages/ide": { "name": "@portugol-webstudio/ide", "version": "0.0.0", @@ -22217,7 +22202,6 @@ "@mdi/svg": "^7.4.47", "@ngxpert/hot-toast": "^4.1.1", "@portugol-webstudio/antlr": "*", - "@portugol-webstudio/graphics": "*", "@portugol-webstudio/parser": "*", "@portugol-webstudio/resources": "*", "@portugol-webstudio/runner": "*", diff --git a/package.json b/package.json index 58ec31de..d76a6bcf 100644 --- a/package.json +++ b/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" diff --git a/packages/graphics/.gitignore b/packages/graphics/.gitignore deleted file mode 100644 index c3af8579..00000000 --- a/packages/graphics/.gitignore +++ /dev/null @@ -1 +0,0 @@ -lib/ diff --git a/packages/graphics/.npmignore b/packages/graphics/.npmignore deleted file mode 100644 index 0e6f8957..00000000 --- a/packages/graphics/.npmignore +++ /dev/null @@ -1,4 +0,0 @@ -.gitignore -node_modules/ -src/ -tsconfig.json diff --git a/packages/graphics/README.md b/packages/graphics/README.md deleted file mode 100644 index 2b597fd3..00000000 --- a/packages/graphics/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# `@portugol-webstudio/graphics` - -Este pacote contém o cliente de gráficos do Portugol utilizado pelo Portugol Webstudio. diff --git a/packages/graphics/package.json b/packages/graphics/package.json deleted file mode 100644 index e4c6e397..00000000 --- a/packages/graphics/package.json +++ /dev/null @@ -1,44 +0,0 @@ -{ - "name": "@portugol-webstudio/graphics", - "version": "0.0.0", - "type": "module", - "repository": { - "type": "git", - "url": "git+https://github.com/dgadelha/Portugol-Webstudio.git" - }, - "keywords": [ - "portugol", - "webstudio" - ], - "author": "Douglas Gadêlha ", - "contributors": [ - "Danilo Gadêlha " - ], - "license": "GPL-3.0", - "bugs": { - "url": "https://github.com/dgadelha/Portugol-Webstudio/issues" - }, - "publishConfig": { - "access": "public" - }, - "homepage": "https://github.com/dgadelha/Portugol-Webstudio#readme", - "main": "lib/index.js", - "typings": "lib/index.d.ts", - "directories": { - "lib": "lib" - }, - "files": [ - "lib" - ], - "scripts": { - "build": "tsc", - "build:w": "tsc -w" - }, - "dependencies": { - "@portugol-webstudio/runner": "*", - "rxjs": "~7.8.1" - }, - "devDependencies": { - "typescript": "~5.6.3" - } -} diff --git a/packages/graphics/src/index.ts b/packages/graphics/src/index.ts deleted file mode 100644 index 0f644864..00000000 --- a/packages/graphics/src/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./GraphicsContext"; diff --git a/packages/graphics/tsconfig.json b/packages/graphics/tsconfig.json deleted file mode 100644 index 72259c46..00000000 --- a/packages/graphics/tsconfig.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "outDir": "./lib", - "declaration": true, - "sourceMap": false, - "inlineSourceMap": true - }, - "files": ["src/index.ts"] -} diff --git a/packages/ide/package.json b/packages/ide/package.json index 3b1fea89..7bdff777 100644 --- a/packages/ide/package.json +++ b/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", diff --git a/packages/ide/src/app/tab-editor/tab-editor.component.ts b/packages/ide/src/app/tab-editor/tab-editor.component.ts index 32fc7e55..0e0893a7 100644 --- a/packages/ide/src/app/tab-editor/tab-editor.component.ts +++ b/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() { diff --git a/packages/graphics/src/GraphicsContext.ts b/packages/runtime/src/graphics/PortugolGraphicsContext.ts similarity index 88% rename from packages/graphics/src/GraphicsContext.ts rename to packages/runtime/src/graphics/PortugolGraphicsContext.ts index 5f47ad2f..f61b3baa 100644 --- a/packages/graphics/src/GraphicsContext.ts +++ b/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. */ diff --git a/packages/runtime/src/graphics/PortugolGraphicsDrawCall.ts b/packages/runtime/src/graphics/PortugolGraphicsDrawCall.ts new file mode 100644 index 00000000..b0353609 --- /dev/null +++ b/packages/runtime/src/graphics/PortugolGraphicsDrawCall.ts @@ -0,0 +1,4 @@ +/** + * Representa uma chamada de desenho de gráficos. + */ +export type PortugolGraphicsDrawCall = () => void; diff --git a/packages/runtime/src/graphics/index.ts b/packages/runtime/src/graphics/index.ts new file mode 100644 index 00000000..88f1111c --- /dev/null +++ b/packages/runtime/src/graphics/index.ts @@ -0,0 +1,2 @@ +export * from "./PortugolGraphicsContext.js"; +export * from "./PortugolGraphicsDrawCall.js"; diff --git a/packages/runtime/src/index.ts b/packages/runtime/src/index.ts index 3a8eda6c..c8f4107e 100644 --- a/packages/runtime/src/index.ts +++ b/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";