123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201 |
- "use strict";
- Object.defineProperty(exports, "__esModule", { value: true });
- exports.SGraphView = void 0;
- const lib_1 = require("@persagy-web/base/lib");
- const lib_2 = require("@persagy-web/draw/lib");
- const uuid_1 = require("uuid");
- const draw_1 = require("@persagy-web/draw");
- class SGraphView extends lib_2.SCanvasView {
- constructor(id) {
- super(id);
- this._scene = null;
- this.backgroundColor = draw_1.SColor.Transparent;
- this.rotate = 0;
- }
- get scene() {
- return this._scene;
- }
- set scene(v) {
- if (this._scene != null) {
- this._scene.view = null;
- }
- this._scene = v;
- if (this._scene != null) {
- this._scene.view = this;
- }
- this.update();
- }
- saveSceneSvg(name, width, height) {
- let url = URL.createObjectURL(new Blob([this.sceneSvgData(width, height)], {
- type: "text/xml,charset=UTF-8"
- }));
- lib_1.SNetUtil.downLoad(name, url);
- }
- sceneSvgData(width, height) {
- if (null == this.scene) {
- return "";
- }
- let engine = new lib_2.SSvgPaintEngine(width, height);
- let painter = new lib_2.SPainter(engine);
- let s0 = this.scale;
- let x0 = this.origin.x;
- let y0 = this.origin.y;
- let rect = this.scene.allItemRect();
- this.fitRectToSize(width, height, rect);
- this.onDraw(painter);
- this.scale = s0;
- this.origin.x = x0;
- this.origin.y = y0;
- return engine.toSvg();
- }
- fitSceneToView() {
- if (null == this.scene) {
- return;
- }
- let rect = this.scene.allItemRect();
- this.fitRectToSize(this.width, this.height, rect);
- }
- fitSelectedToView() {
- if (null == this.scene) {
- return;
- }
- let rect = this.scene.selectedItemRect();
- this.fitRectToSize(this.width, this.height, rect);
- }
- fitItemToView(itemList) {
- if (null == this.scene) {
- return;
- }
- let rect = null;
- for (let item of itemList) {
- if (rect == null) {
- rect = item.boundingRect().translated(item.pos.x, item.pos.y);
- }
- else {
- rect.union(item.boundingRect().translated(item.pos.x, item.pos.y));
- }
- }
- this.fitRectToSize(this.width, this.height, rect);
- }
- mapFromScene(x, y) {
- if (x instanceof lib_2.SPoint) {
- return new lib_2.SPoint(x.x * this.scale + this.origin.x, x.y * this.scale + this.origin.y);
- }
- return new lib_2.SPoint(x * this.scale + this.origin.x, (y == undefined ? 0 : y) * this.scale + this.origin.y);
- }
- mapToScene(x, y) {
- if (x instanceof lib_2.SPoint) {
- return new lib_2.SPoint((x.x - this.origin.x) / this.scale, (x.y - this.origin.y) / this.scale);
- }
- return new lib_2.SPoint((x - this.origin.x) / this.scale, ((y == undefined ? 0 : y) - this.origin.y) / this.scale);
- }
- saveImageSize(name, type, width, height) {
- const can = document.createElement("CANVAS");
- can.width = width;
- can.height = height;
- can.id = uuid_1.v1();
- const body = document.getElementsByTagName("body")[0];
- body.appendChild(can);
- let engine = new lib_2.SCanvasPaintEngine(can.getContext("2d"));
- let painter = new lib_2.SPainter(engine);
- let vi = new SGraphView(can.id);
- vi.scene = this.scene;
- vi.fitSceneToView();
- vi.backgroundColor = new draw_1.SColor("#FFFFFF");
- vi.onDraw(painter);
- vi.saveImage(name, type);
- this.scene.view = this;
- can.remove();
- vi = null;
- }
- onDraw(painter) {
- painter.save();
- painter.clearRect(0, 0, this.width, this.height);
- painter.restore();
- if (this.scene == null) {
- return;
- }
- painter.save();
- this.drawBackground(painter);
- painter.restore();
- painter.save();
- painter.translate(this.origin.x, this.origin.y);
- painter.scale(this.scale, this.scale);
- painter.rotate(this.rotate);
- this.scene.drawScene(painter, new lib_2.SRect());
- painter.restore();
- painter.save();
- this.drawForeground(painter);
- painter.restore();
- }
- drawBackground(painter) {
- painter.brush.color = this.backgroundColor;
- painter.pen.color = draw_1.SColor.Transparent;
- painter.drawRect(0, 0, this.width, this.height);
- }
- drawForeground(painter) {
- }
- onDoubleClick(event) {
- if (this.scene != null) {
- let ce = this.toSceneMotionEvent(event);
- this.scene.onDoubleClick(ce);
- }
- }
- onMouseDown(event) {
- super.onMouseDown(event);
- if (this.scene != null) {
- let ce = this.toSceneMotionEvent(event);
- this.scene.onMouseDown(ce);
- }
- }
- onMouseMove(event) {
- super.onMouseMove(event);
- if (this.scene != null) {
- let ce = this.toSceneMotionEvent(event);
- this.scene.onMouseMove(ce);
- }
- }
- onMouseUp(event) {
- super.onMouseUp(event);
- if (this.scene != null) {
- let ce = this.toSceneMotionEvent(event);
- this.scene.onMouseUp(ce);
- }
- }
- onContextMenu(event) {
- if (this.scene != null) {
- let ce = this.toSceneMotionEvent(event);
- this.scene.onContextMenu(ce);
- }
- }
- onKeyDown(event) {
- if (this.scene != null) {
- this.scene.onKeyDown(event);
- }
- }
- onKeyUp(event) {
- if (this.scene != null) {
- this.scene.onKeyUp(event);
- }
- }
- fitRectToSize(width, height, rect) {
- if (null == rect || !rect.isValid()) {
- return;
- }
- this.scale = Math.min(width / rect.width, height / rect.height) * 0.8;
- let center = rect.center();
- this.origin.x = width / 2.0 - center.x * this.scale;
- this.origin.y = height / 2.0 - center.y * this.scale;
- }
- toSceneMotionEvent(event) {
- let se = new lib_1.SMouseEvent(event);
- se.matrix.translate(this.origin.x, this.origin.y);
- se.matrix.scale(this.scale, this.scale);
- se.matrix.rotate(this.rotate);
- const mp = new lib_2.SPoint(event.offsetX, event.offsetY).matrixTransform(se.matrix.inversed());
- se.x = mp.x;
- se.y = mp.y;
- return se;
- }
- }
- exports.SGraphView = SGraphView;
|