6 Commits

20 changed files with 167 additions and 135 deletions
+10 -12
View File
@@ -2336,8 +2336,6 @@
onMouseWheel(event) { onMouseWheel(event) {
if (this.capture(event) && this.target.onMouseWheel) { if (this.capture(event) && this.target.onMouseWheel) {
this.target.onMouseWheel(event); this.target.onMouseWheel(event);
} else {
//console.warn('Target has no onMouseWheel callback')
} }
} }
@@ -2531,8 +2529,6 @@
} }
if (this.target.onMouseWheel) { if (this.target.onMouseWheel) {
this.target.onMouseWheel(event); this.target.onMouseWheel(event);
} else {
//console.warn('Target has no onMouseWheel callback', this.target)
} }
} }
} }
@@ -2999,11 +2995,16 @@
} }
} }
_throwDeltaTime() {
let t = performance.now();
let dt = t - this.lastframe;
this.lastframe = t;
return dt
}
animateThrow(time) { animateThrow(time) {
if (this.velocity != null) { if (this.velocity != null) {
let t = performance.now(); let dt = this._throwDeltaTime();
let dt = t - this.lastframe;
this.lastframe = t;
// console.log("animateThrow", dt) // console.log("animateThrow", dt)
let next = this.nextVelocity(this.velocity); let next = this.nextVelocity(this.velocity);
let prevLength = Points.length(this.velocity); let prevLength = Points.length(this.velocity);
@@ -4206,10 +4207,7 @@
let event = new ResizeEvent(this, { width: w, height: h }); let event = new ResizeEvent(this, { width: w, height: h });
this.onResize(event); this.onResize(event);
} }
if (this.resizeButton != null) { if (this.resizeButton != null) ;
// this.resizeButton.style.width = 50/this.scale+"px"
// this.resizeButton.style.height = 50/this.scale+"px"
}
} }
startResize(e) { startResize(e) {
@@ -4260,7 +4258,7 @@
let resizeW = r * Math.cos(Angle.degree2radian(phiCorrected)); let resizeW = r * Math.cos(Angle.degree2radian(phiCorrected));
let resizeH = -r * Math.sin(Angle.degree2radian(phiCorrected)); let resizeH = -r * Math.sin(Angle.degree2radian(phiCorrected));
if (this.element.offsetWidth + resizeW / this.scale > this.width * 0.3 && this.element.offsetHeight + resizeH / this.scale > this.height * 0.3) TweenLite.to(this.element, 0, { width: this.element.offsetWidth + resizeW / this.scale, height: this.element.offsetHeight + resizeH / this.scale }); if ((this.element.offsetWidth + resizeW) / this.scale > this.width * 0.5 / this.scale && (this.element.offsetHeight + resizeH) / this.scale > this.height * 0.3 / this.scale) TweenLite.to(this.element, 0, { width: this.element.offsetWidth + resizeW / this.scale, height: this.element.offsetHeight + resizeH / this.scale });
this.oldX = e.clientX; this.oldX = e.clientX;
this.oldY = e.clientY; this.oldY = e.clientY;
+55 -34
View File
@@ -5500,8 +5500,6 @@
onMouseWheel(event) { onMouseWheel(event) {
if (this.capture(event) && this.target.onMouseWheel) { if (this.capture(event) && this.target.onMouseWheel) {
this.target.onMouseWheel(event); this.target.onMouseWheel(event);
} else {
//console.warn('Target has no onMouseWheel callback')
} }
} }
@@ -5695,8 +5693,6 @@
} }
if (this.target.onMouseWheel) { if (this.target.onMouseWheel) {
this.target.onMouseWheel(event); this.target.onMouseWheel(event);
} else {
//console.warn('Target has no onMouseWheel callback', this.target)
} }
} }
} }
@@ -6163,11 +6159,16 @@
} }
} }
_throwDeltaTime() {
let t = performance.now();
let dt = t - this.lastframe;
this.lastframe = t;
return dt
}
animateThrow(time) { animateThrow(time) {
if (this.velocity != null) { if (this.velocity != null) {
let t = performance.now(); let dt = this._throwDeltaTime();
let dt = t - this.lastframe;
this.lastframe = t;
// console.log("animateThrow", dt) // console.log("animateThrow", dt)
let next = this.nextVelocity(this.velocity); let next = this.nextVelocity(this.velocity);
let prevLength = Points.length(this.velocity); let prevLength = Points.length(this.velocity);
@@ -7208,10 +7209,7 @@
let event = new ResizeEvent(this, { width: w, height: h }); let event = new ResizeEvent(this, { width: w, height: h });
this.onResize(event); this.onResize(event);
} }
if (this.resizeButton != null) { if (this.resizeButton != null) ;
// this.resizeButton.style.width = 50/this.scale+"px"
// this.resizeButton.style.height = 50/this.scale+"px"
}
} }
startResize(e) { startResize(e) {
@@ -7803,11 +7801,14 @@
} }
} }
/* ES Lint */
/* globals PIXI, console*/
const registeredTiles = new Map(); const registeredTiles = new Map();
const pendingTiles = new Map(); const pendingTiles = new Map();
/** Implements a baseTexture cache. The last textures are kept for reuse */ /** Implements a baseTexture cache. The last textures are kept for reuse */
const keepBaseTextures = 0; let keepTextures = 0;
const keptBaseTextures = []; const keptTextures = [];
/** The current Tile implementation simply uses PIXI.Sprites. /** The current Tile implementation simply uses PIXI.Sprites.
* *
@@ -7828,8 +7829,8 @@
* @param {*} value * @param {*} value
* @memberof Tile * @memberof Tile
*/ */
static enableKeepBaseTextures(value = 1000) { static enableKeepTextures(value = 1000) {
keepBaseTextures = value; keepTextures = value;
} }
/** /**
@@ -7852,13 +7853,21 @@
* Returns true iff the url is pending * Returns true iff the url is pending
* *
* @static * @static
* @param {*} url
* @returns * @returns
* @memberof Tile * @memberof Tile
*/ */
static isPending() { static isPending(url) {
return pendingTiles.has(url) && pendingTiles.get(url) > 0 return pendingTiles.has(url) && pendingTiles.get(url) > 0
} }
static isObsolete(url) {
if (registeredTiles.has(url) && registeredTiles.get(url) > 0) {
return false
}
return true
}
/** /**
* Removes the given url from pending urls. * Removes the given url from pending urls.
* *
@@ -7924,6 +7933,7 @@
tiles.delete(this); tiles.delete(this);
if (tiles.size == 0) { if (tiles.size == 0) {
registeredTiles.delete(this.url); registeredTiles.delete(this.url);
return 0
} }
return tiles.size return tiles.size
} }
@@ -7934,28 +7944,27 @@
* @param {*} options Part of the PIXI API, but ignored in the implementation * @param {*} options Part of the PIXI API, but ignored in the implementation
* @memberof Tile * @memberof Tile
*/ */
destroy(options, debug = true) { destroy(options, debug = false) {
let count = this.unregister(); let count = this.unregister();
if (keepBaseTextures > 0) { if (keepTextures > 0) {
keptBaseTextures.push({ url: this.url, texture: this.texture.baseTexture}); keptTextures.push({ url: this.url, texture: this.texture });
let opts = { children: true, texture: false, baseTexture: false }; let opts = { children: true, texture: false, baseTexture: false };
if (debug) console.log("Tile.destroy", registeredTiles.size, opts); if (debug) console.log("Tile.destroy", registeredTiles.size, opts);
super.destroy(opts); super.destroy(opts);
while(keptBaseTextures.length > keepBaseTextures) { while (keptTextures.length > keepTextures) {
let {url, texture} = keptBaseTextures.shift(); let { url, texture } = keptTextures.shift();
let tiles = registeredTiles.get(url); if (Tile.isObsolete(url)) {
if (tiles.size > 0 && !Tile.isPending(url)) { texture.destroy(true); // Destroy base as well
texture.destroy(); if (debug) console.log("Destroying texture and baseTexture", url);
if (debug) console.log("Destroying baseTexture", url);
} }
} }
} }
else { else {
// No longer registered and not pending // No longer registered and not pending
if (count <= 0 && !Tile.isPending(url)) { if (count <= 0 && !Tile.isPending(this.url)) {
let opts = { children: true, texture: true, baseTexture: true }; let opts = { children: true, texture: true, baseTexture: true };
super.destroy(opts); super.destroy(opts);
if (debug) console.log("Tile.destroy", registeredTiles.size, opts); if (debug) console.log("Tile.destroy", registeredTiles.size, opts);
@@ -7971,7 +7980,6 @@
this.visible = false; this.visible = false;
} }
} }
} }
/** /**
@@ -7992,6 +8000,16 @@
return null return null
} }
/**
* Texture received too late. We do not need it.
* @param {*} url
* @param {*} texture
*/
static lateTexture(url, texture) {
let destroyBase = !registeredTiles.has(url);
texture.destroy(destroyBase);
}
static printInfos() { static printInfos() {
let references = new Map(); let references = new Map();
let multiples = 0; let multiples = 0;
@@ -8166,8 +8184,8 @@
_onLoaded(loader, resource) { _onLoaded(loader, resource) {
if (this.destroyed) { if (this.destroyed) {
let texture = resource.texture; let texture = resource.texture;
let destroyBase = !deepZoomTileCache.has(resource.url); let url = resource.url;
texture.destroy(destroyBase); Tile.lateTexture(url, texture);
console.warn("Received resource after destroy", texture); console.warn("Received resource after destroy", texture);
return return
} }
@@ -8985,6 +9003,7 @@
: 1; : 1;
this.alpha = alpha; this.alpha = alpha;
this.fastLoads = 0; this.fastLoads = 0;
this.active = true;
this.autoLoadTiles = autoLoadTiles; this.autoLoadTiles = autoLoadTiles;
this.minimumLevel = minimumLevel; this.minimumLevel = minimumLevel;
this.quadTrees = new Map(); // url as keys, TileQuadNodes as values this.quadTrees = new Map(); // url as keys, TileQuadNodes as values
@@ -9256,7 +9275,7 @@
} }
worldBounds() { worldBounds() {
let viewBounds = this.app.scene.getBounds(); let viewBounds = this.app.scene.bounds; // UO: Never use getBounds()
// Using getBounds extends visible scope after loading tiles and leads // Using getBounds extends visible scope after loading tiles and leads
// to excessive loading // to excessive loading
if (this.world != null) { if (this.world != null) {
@@ -9638,6 +9657,9 @@
* @param {boolean} debug - log debug infos * @param {boolean} debug - log debug infos
*/ */
transformed(event) { transformed(event) {
if (!this.active) {
return
}
let key = this.currentLevel.toString(); let key = this.currentLevel.toString();
let currentTiles = this.tileLayers[key]; let currentTiles = this.tileLayers[key];
if (typeof currentTiles == 'undefined') { if (typeof currentTiles == 'undefined') {
@@ -9685,6 +9707,7 @@
* @memberof DeepZoomImage * @memberof DeepZoomImage
*/ */
activate() { activate() {
this.active = true;
this.destroyTilesAboveLevel(this.currentLevel); this.destroyTilesAboveLevel(this.currentLevel);
this.ensureTiles(this.currentLevel, null); this.ensureTiles(this.currentLevel, null);
//console.log("Activate Textures!", this.currentLevel) //console.log("Activate Textures!", this.currentLevel)
@@ -9696,16 +9719,14 @@
* @memberof DeepZoomImage * @memberof DeepZoomImage
*/ */
deactivate() { deactivate() {
this.active = false;
this.destroyAllTiles(); this.destroyAllTiles();
Object.keys(this.tileLayers).forEach(key => {
this.destroyTiles(key);
});
this.tileContainer.destroy({ children: true }); this.tileContainer.destroy({ children: true });
printTileCacheInfos(); printTileCacheInfos();
} }
throwFinished() { throwFinished() {
console.log("throwFinished"); //console.log("throwFinished")
let key = this.currentLevel.toString(); let key = this.currentLevel.toString();
let currentTiles = this.tileLayers[key]; let currentTiles = this.tileLayers[key];
if (typeof currentTiles == 'undefined') { if (typeof currentTiles == 'undefined') {
+1 -1
View File
@@ -23,7 +23,7 @@ a single delegate pattern.
<p>The main differences are that <code>PointerEvent</code> are fired for each <p>The main differences are that <code>PointerEvent</code> are fired for each
touch point, whereas the <code>TouchEvent</code> collects multiple touch point, whereas the <code>TouchEvent</code> collects multiple
<code>TouchPoints</code> into a single event. The basic PointMap and Interaction <code>TouchPoints</code> into a single event. The basic PointMap and Interaction
classes unify this behavior by collection all contact points regardless classes unify this behavior by collecting all contact points regardless
of their original mouse, touch, or pointer events.</p> of their original mouse, touch, or pointer events.</p>
<h2> <h2>
Point Maps Point Maps
+6
View File
@@ -364,6 +364,7 @@ export class DeepZoomImage extends PIXI.Container {
: 1 : 1
this.alpha = alpha this.alpha = alpha
this.fastLoads = 0 this.fastLoads = 0
this.active = true
this.autoLoadTiles = autoLoadTiles this.autoLoadTiles = autoLoadTiles
this.minimumLevel = minimumLevel this.minimumLevel = minimumLevel
this.quadTrees = new Map() // url as keys, TileQuadNodes as values this.quadTrees = new Map() // url as keys, TileQuadNodes as values
@@ -1017,6 +1018,9 @@ export class DeepZoomImage extends PIXI.Container {
* @param {boolean} debug - log debug infos * @param {boolean} debug - log debug infos
*/ */
transformed(event) { transformed(event) {
if (!this.active) {
return
}
let key = this.currentLevel.toString() let key = this.currentLevel.toString()
let currentTiles = this.tileLayers[key] let currentTiles = this.tileLayers[key]
if (typeof currentTiles == 'undefined') { if (typeof currentTiles == 'undefined') {
@@ -1064,6 +1068,7 @@ export class DeepZoomImage extends PIXI.Container {
* @memberof DeepZoomImage * @memberof DeepZoomImage
*/ */
activate() { activate() {
this.active = true
this.destroyTilesAboveLevel(this.currentLevel) this.destroyTilesAboveLevel(this.currentLevel)
this.ensureTiles(this.currentLevel, null) this.ensureTiles(this.currentLevel, null)
//console.log("Activate Textures!", this.currentLevel) //console.log("Activate Textures!", this.currentLevel)
@@ -1075,6 +1080,7 @@ export class DeepZoomImage extends PIXI.Container {
* @memberof DeepZoomImage * @memberof DeepZoomImage
*/ */
deactivate() { deactivate() {
this.active = false
this.destroyAllTiles() this.destroyAllTiles()
this.tileContainer.destroy({ children: true }) this.tileContainer.destroy({ children: true })
printTileCacheInfos() printTileCacheInfos()
+2
View File
@@ -1,3 +1,5 @@
/* ES Lint */
/* globals PIXI, console*/
const registeredTiles = new Map() const registeredTiles = new Map()
const pendingTiles = new Map() const pendingTiles = new Map()
Binary file not shown.

Before

Width:  |  Height:  |  Size: 112 KiB

After

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 61 KiB

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 27 KiB

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 25 KiB

+9 -4
View File
@@ -173,11 +173,16 @@ class Throwable {
} }
} }
_throwDeltaTime() {
let t = performance.now()
let dt = t - this.lastframe
this.lastframe = t
return dt
}
animateThrow(time) { animateThrow(time) {
if (this.velocity != null) { if (this.velocity != null) {
let t = performance.now() let dt = this._throwDeltaTime()
let dt = t - this.lastframe
this.lastframe = t
// console.log("animateThrow", dt) // console.log("animateThrow", dt)
let next = this.nextVelocity(this.velocity) let next = this.nextVelocity(this.velocity)
let prevLength = Points.length(this.velocity) let prevLength = Points.length(this.velocity)
@@ -1434,7 +1439,7 @@ export class DOMScatter extends AbstractScatter {
let resizeW = r * Math.cos(Angle.degree2radian(phiCorrected)) let resizeW = r * Math.cos(Angle.degree2radian(phiCorrected))
let resizeH = -r * Math.sin(Angle.degree2radian(phiCorrected)) let resizeH = -r * Math.sin(Angle.degree2radian(phiCorrected))
if (this.element.offsetWidth + resizeW / this.scale > this.width * 0.3 && this.element.offsetHeight + resizeH / this.scale > this.height * 0.3) TweenLite.to(this.element, 0, { width: this.element.offsetWidth + resizeW / this.scale, height: this.element.offsetHeight + resizeH / this.scale }); if ((this.element.offsetWidth + resizeW) / this.scale > this.width * 0.5 / this.scale && (this.element.offsetHeight + resizeH) / this.scale > this.height * 0.3 / this.scale) TweenLite.to(this.element, 0, { width: this.element.offsetWidth + resizeW / this.scale, height: this.element.offsetHeight + resizeH / this.scale });
this.oldX = e.clientX this.oldX = e.clientX
this.oldY = e.clientY this.oldY = e.clientY
BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 184 KiB

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 103 KiB

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 44 KiB