From 252ee909d3d9b7e1b42e554bf8e5a0bfb67e7296 Mon Sep 17 00:00:00 2001
From: Andrea Gottsponer <ago@attr.ch>
Date: Wed, 11 Dec 2019 16:04:23 +0100
Subject: [PATCH] - fix viewpoint errors and visible elements
---
.../elements/collections/LegendCollection.ts | 2 +-
src/lib/elements/images/MedsurfSprite.ts | 37 ++++++-------------
.../interactions/ImageNavigatorElement.ts | 19 +++++++---
3 files changed, 26 insertions(+), 32 deletions(-)
diff --git a/src/lib/elements/collections/LegendCollection.ts b/src/lib/elements/collections/LegendCollection.ts
index 7f117b61..38cf050a 100644
--- a/src/lib/elements/collections/LegendCollection.ts
+++ b/src/lib/elements/collections/LegendCollection.ts
@@ -939,7 +939,7 @@ export class LegendCollection extends BaseContainer {
}
public getRectangle(): PIXI.Rectangle {
- return this._rectangle;
+ return new PIXI.Rectangle(this.position.x, this.position.y, this._rectangle.width, this._rectangle.height);
}
public showItem(): void {
diff --git a/src/lib/elements/images/MedsurfSprite.ts b/src/lib/elements/images/MedsurfSprite.ts
index d231e029..2a71314b 100644
--- a/src/lib/elements/images/MedsurfSprite.ts
+++ b/src/lib/elements/images/MedsurfSprite.ts
@@ -45,7 +45,7 @@ export class MedsurfSprite extends BaseSprite {
* Methods
*/
protected _wheelMethod: EventListener;
- protected _pointerOutMethod: EventListener;
+ protected _pointerOutMethod: EventListener; // TODO fix or remove
/**
* Generators
@@ -68,6 +68,11 @@ export class MedsurfSprite extends BaseSprite {
protected _polygonButton: ButtonElement;
protected _fillButton: ButtonElement;
+ /**
+ * Design
+ */
+ protected readonly _visiblePad: number = 10;
+
/**
* Constructor
* @param renderer
@@ -248,6 +253,7 @@ export class MedsurfSprite extends BaseSprite {
protected _fitToScreen(width: number, height: number): void {
const height1 = this.height * width / this.width;
const width2 = this.width * height / this.height;
+
if (height1 > height) {
this.width = width2;
this.height = height;
@@ -255,6 +261,8 @@ export class MedsurfSprite extends BaseSprite {
this.width = width;
this.height = height1;
}
+
+ this.position.set(this._canvas.width / 2 - this.width / 2, this._canvas.height / 2 - this.height / 2);
}
/**
@@ -266,8 +274,7 @@ export class MedsurfSprite extends BaseSprite {
}
protected _onLoaded(): void {
- // TODO this not working
- // this._fitToScreen(this._canvas.width, this._canvas.height);
+ this._fitToScreen(this._canvas.width, this._canvas.height);
}
protected setVisibleElements(): void {
@@ -277,34 +284,12 @@ export class MedsurfSprite extends BaseSprite {
let width = this._canvas.width / this.scale.x;
let height = this._canvas.height / this.scale.y;
- if (x < 0) {
- width += x;
- x = 0;
- } else if (x + width > this._canvas.width) {
- width = this._canvas.width - x;
- }
-
- if (y < 0) {
- height += y;
- y = 0;
- } else if (y + height > this._canvas.height) {
- height = this._canvas.height - y;
- }
-
- if (width > this._canvas.width) {
- width = this._canvas.width;
- }
- if (height > this._canvas.height) {
- height = this._canvas.height;
- }
-
// Set visible elements
- // TODO this.children from function -> so we can use this function in medsurfTileSprite
this.children.forEach((element: ImageObject) => {
const rectangle = element.getRectangle();
rectangle.x += element.position.x;
rectangle.y += element.position.y;
- rectangle.pad(10, 10);
+ rectangle.pad(this._visiblePad, this._visiblePad);
element.renderable = !!(x + width > rectangle.x && x < rectangle.x + rectangle.width && y + height > rectangle.y && y < rectangle.y + rectangle.height);
});
diff --git a/src/lib/elements/interactions/ImageNavigatorElement.ts b/src/lib/elements/interactions/ImageNavigatorElement.ts
index 938089c0..52c09349 100644
--- a/src/lib/elements/interactions/ImageNavigatorElement.ts
+++ b/src/lib/elements/interactions/ImageNavigatorElement.ts
@@ -6,6 +6,7 @@ import {ZoomInteraction} from "../../interactions/ZoomInteraction";
import {MedsurfSprite} from "../images/MedsurfSprite";
import {ButtonElement} from "../inputs/ButtonElement";
import Rectangle = PIXI.Rectangle;
+import {MedsurfTileSprite} from "../..";
/**
* Image navigator element
@@ -337,11 +338,19 @@ export class ImageNavigatorElement extends BaseContainer {
* @private
*/
protected _onImage(): void {
- this._rectangle.x = -1 * this._spriteElement.width / this._canvas.width * this._image.position.x / this._image.scale.x;
- this._rectangle.y = -1 * this._spriteElement.height / this._canvas.height * this._image.position.y / this._image.scale.y;
-
- this._rectangle.width = this._spriteElement.width / this._image.scale.x;
- this._rectangle.height = this._spriteElement.height / this._image.scale.y;
+ if (this._image instanceof MedsurfTileSprite) {
+ this._rectangle.x = -1 * this._spriteElement.width / this._canvas.width * this._image.position.x / this._image.scale.x;
+ this._rectangle.y = -1 * this._spriteElement.height / this._canvas.height * this._image.position.y / this._image.scale.y;
+
+ this._rectangle.width = this._spriteElement.width / this._image.scale.x;
+ this._rectangle.height = this._spriteElement.height / this._image.scale.y;
+ } else {
+ this._rectangle.x = -1 * this._spriteElement.width / this._image.width * this._image.position.x;
+ this._rectangle.y = -1 * this._spriteElement.height / this._image.height * this._image.position.y;
+
+ this._rectangle.width = this._spriteElement.width * (this._canvas.width / this._image.width);
+ this._rectangle.height = this._spriteElement.height * (this._canvas.height / this._image.height);
+ }
if (this._rectangle.x < 0) {
this._rectangle.width += this._rectangle.x;
--
GitLab