Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 95d1941545 | |||
| 086dfff19e | |||
| 0442df4287 | |||
| e3d167bd7f | |||
| da5ed78558 | |||
| 0c46c4e656 | |||
| 304818dc13 | |||
| 05ecd0b048 | |||
| 895ec55a46 | |||
| 67c6a6c95c | |||
| 107529f844 |
@@ -7,7 +7,8 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
const puppeteer = require('puppeteer');
|
const puppeteer = require('puppeteer');
|
||||||
const fs = require("fs")
|
const fs_bare = require("fs") // required for fs-extra
|
||||||
|
const fs = require("fs-extra")
|
||||||
const path = require("path")
|
const path = require("path")
|
||||||
const start_dir = process.cwd()
|
const start_dir = process.cwd()
|
||||||
const start_file = path.join(start_dir,"lib","index.html")
|
const start_file = path.join(start_dir,"lib","index.html")
|
||||||
@@ -39,18 +40,24 @@ async function makeScreenshot(href){
|
|||||||
page.once("load",logPageEvent)
|
page.once("load",logPageEvent)
|
||||||
|
|
||||||
await page.goto(href)
|
await page.goto(href)
|
||||||
|
href = href.replace("file:///","")
|
||||||
const fname = path.parse(href).name
|
const fname = path.parse(href).name
|
||||||
|
let fpath
|
||||||
if (fname != "index"){
|
if (fname != "index"){
|
||||||
image_url = href.replace(fname + ".html" ,"thumbnails/" + fname + ".png")
|
image_url = href.replace(fname + ".html" ,"thumbnails/" + fname + ".png")
|
||||||
|
fpath = href.replace(fname + ".html", "thumbnails")
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
image_url = href.replace(fname + ".html" ,"thumbnail.png")
|
image_url = href.replace(fname + ".html" ,"thumbnail.png")
|
||||||
|
fpath = href.replace(fname + ".html", "")
|
||||||
}
|
}
|
||||||
image_url = image_url.replace("file:///","")
|
// image_url = image_url.replace("file:///","")
|
||||||
|
// fpath = fpath.replace("file:///","")
|
||||||
|
|
||||||
page.removeAllListeners()
|
page.removeAllListeners()
|
||||||
|
|
||||||
|
fs.ensureDir(fpath)
|
||||||
|
|
||||||
await page.screenshot({path: image_url});
|
await page.screenshot({path: image_url});
|
||||||
await browser.close();
|
await browser.close();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2336,6 +2336,8 @@
|
|||||||
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')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -2529,6 +2531,8 @@
|
|||||||
}
|
}
|
||||||
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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -3232,7 +3236,9 @@
|
|||||||
|
|
||||||
keepOnStage(velocity, collision = 0.5) {
|
keepOnStage(velocity, collision = 0.5) {
|
||||||
let stagePolygon = this.containerPolygon;
|
let stagePolygon = this.containerPolygon;
|
||||||
if (!stagePolygon) return
|
// UO: since keepOnStage is called in nextVelocity we need to
|
||||||
|
// ensure a return value
|
||||||
|
if (!stagePolygon) return { x: 0, y: 0}
|
||||||
let polygon = this.polygon;
|
let polygon = this.polygon;
|
||||||
let bounced = this.bouncing();
|
let bounced = this.bouncing();
|
||||||
if (bounced) {
|
if (bounced) {
|
||||||
@@ -4200,7 +4206,10 @@
|
|||||||
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) {
|
||||||
|
|||||||
@@ -5500,6 +5500,8 @@
|
|||||||
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')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -5693,6 +5695,8 @@
|
|||||||
}
|
}
|
||||||
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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -6396,7 +6400,9 @@
|
|||||||
|
|
||||||
keepOnStage(velocity, collision = 0.5) {
|
keepOnStage(velocity, collision = 0.5) {
|
||||||
let stagePolygon = this.containerPolygon;
|
let stagePolygon = this.containerPolygon;
|
||||||
if (!stagePolygon) return
|
// UO: since keepOnStage is called in nextVelocity we need to
|
||||||
|
// ensure a return value
|
||||||
|
if (!stagePolygon) return { x: 0, y: 0}
|
||||||
let polygon = this.polygon;
|
let polygon = this.polygon;
|
||||||
let bounced = this.bouncing();
|
let bounced = this.bouncing();
|
||||||
if (bounced) {
|
if (bounced) {
|
||||||
@@ -7202,7 +7208,10 @@
|
|||||||
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) {
|
||||||
@@ -7794,8 +7803,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const deepZoomTileCache = new Map();
|
const registeredTiles = new Map();
|
||||||
|
const pendingTiles = new Map();
|
||||||
|
/** Implements a baseTexture cache. The last textures are kept for reuse */
|
||||||
|
const keepBaseTextures = 0;
|
||||||
|
const keptBaseTextures = [];
|
||||||
|
|
||||||
/** The current Tile implementation simply uses PIXI.Sprites.
|
/** The current Tile implementation simply uses PIXI.Sprites.
|
||||||
*
|
*
|
||||||
@@ -7809,6 +7821,74 @@
|
|||||||
this.register(url);
|
this.register(url);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Static method to enable keeping of base textures
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} value
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static enableKeepBaseTextures(value = 1000) {
|
||||||
|
keepBaseTextures = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Marks the given url as pending. Pending tiles should not be destroyed
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} url
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static schedule(url) {
|
||||||
|
let count = 0;
|
||||||
|
if (pendingTiles.has(url)) {
|
||||||
|
count = pendingTiles.get(url);
|
||||||
|
}
|
||||||
|
pendingTiles.set(url, count + 1);
|
||||||
|
// console.log("Tile.scheduled", url, pendingTiles.size)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns true iff the url is pending
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static isPending() {
|
||||||
|
return pendingTiles.has(url) && pendingTiles.get(url) > 0
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Removes the given url from pending urls.
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} url
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static unschedule(url) {
|
||||||
|
if (pendingTiles.has(url)) {
|
||||||
|
let count = pendingTiles.get(url);
|
||||||
|
if (count > 1) {
|
||||||
|
pendingTiles.set(url, count - 1);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
pendingTiles.clear(url);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// console.log("Tile.unscheduled", url, pendingTiles.size)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Loads a tile from image using the PIXI.Texture.fromImage method.
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} imageId
|
||||||
|
* @param {*} crossorigin
|
||||||
|
* @param {*} scaleMode
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
static fromImage(imageId, crossorigin, scaleMode) {
|
static fromImage(imageId, crossorigin, scaleMode) {
|
||||||
return new Tile(PIXI.Texture.fromImage(imageId, crossorigin, scaleMode), imageId)
|
return new Tile(PIXI.Texture.fromImage(imageId, crossorigin, scaleMode), imageId)
|
||||||
}
|
}
|
||||||
@@ -7821,13 +7901,14 @@
|
|||||||
* @memberof Tile
|
* @memberof Tile
|
||||||
*/
|
*/
|
||||||
register(url, debug = false) {
|
register(url, debug = false) {
|
||||||
if (deepZoomTileCache.has(url)) {
|
Tile.unschedule(url);
|
||||||
let tiles = deepZoomTileCache.get(url);
|
if (registeredTiles.has(url)) {
|
||||||
|
let tiles = registeredTiles.get(url);
|
||||||
tiles.add(this);
|
tiles.add(this);
|
||||||
if (debug) console.log("Tile.register", url, tiles.size);
|
if (debug) console.log("Tile.register", url, tiles.size);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
deepZoomTileCache.set(url, new Set([this]));
|
registeredTiles.set(url, new Set([this]));
|
||||||
if (debug) console.log("Tile.register", url, 1);
|
if (debug) console.log("Tile.register", url, 1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -7839,10 +7920,10 @@
|
|||||||
* @memberof Tile
|
* @memberof Tile
|
||||||
*/
|
*/
|
||||||
unregister() {
|
unregister() {
|
||||||
let tiles = deepZoomTileCache.get(this.url);
|
let tiles = registeredTiles.get(this.url);
|
||||||
tiles.delete(this);
|
tiles.delete(this);
|
||||||
if (tiles.size == 0) {
|
if (tiles.size == 0) {
|
||||||
deepZoomTileCache.delete(this.url);
|
registeredTiles.delete(this.url);
|
||||||
}
|
}
|
||||||
return tiles.size
|
return tiles.size
|
||||||
}
|
}
|
||||||
@@ -7853,19 +7934,75 @@
|
|||||||
* @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 = false) {
|
destroy(options, debug = true) {
|
||||||
if (this.parent != null) ;
|
|
||||||
let count = this.unregister();
|
let count = this.unregister();
|
||||||
if (count <= 0) {
|
|
||||||
|
if (keepBaseTextures > 0) {
|
||||||
|
keptBaseTextures.push({ url: this.url, texture: this.texture.baseTexture});
|
||||||
|
|
||||||
|
let opts = { children: true, texture: false, baseTexture: false };
|
||||||
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts);
|
||||||
|
super.destroy(opts);
|
||||||
|
|
||||||
|
while(keptBaseTextures.length > keepBaseTextures) {
|
||||||
|
let {url, texture} = keptBaseTextures.shift();
|
||||||
|
let tiles = registeredTiles.get(url);
|
||||||
|
if (tiles.size > 0 && !Tile.isPending(url)) {
|
||||||
|
texture.destroy();
|
||||||
|
if (debug) console.log("Destroying baseTexture", url);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// No longer registered and not pending
|
||||||
|
if (count <= 0 && !Tile.isPending(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", deepZoomTileCache.size, opts);
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
let opts = { children: true, texture: false, baseTexture: false };
|
let opts = { children: true, texture: false, baseTexture: false };
|
||||||
if (debug) console.log("Tile.destroy", deepZoomTileCache.size, opts);
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts);
|
||||||
super.destroy(opts);
|
super.destroy(opts);
|
||||||
}
|
}
|
||||||
|
if (this.parent != null) {
|
||||||
|
// UO: Emit warning and remove
|
||||||
|
console.warn("Destroying tile with parent. Hiding instead");
|
||||||
|
this.visible = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns an available texture that can be reused
|
||||||
|
*
|
||||||
|
* @param {*} url
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static textureAvailable(url) {
|
||||||
|
if (registeredTiles.has(url)) {
|
||||||
|
let tiles = registeredTiles.get(url);
|
||||||
|
for (let tile of tiles.values()) {
|
||||||
|
//console.log("Reusing cached texture", tile.parent)
|
||||||
|
return tile.texture
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
static printInfos() {
|
||||||
|
let references = new Map();
|
||||||
|
let multiples = 0;
|
||||||
|
for (let [url, tiles] of registeredTiles.entries()) {
|
||||||
|
let count = tiles.size;
|
||||||
|
references.set(url, count);
|
||||||
|
if (count > 1) {
|
||||||
|
multiples += 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log({ multiples, references });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -7897,6 +8034,8 @@
|
|||||||
schedule(url, col, row) {
|
schedule(url, col, row) {
|
||||||
if (this.loaded.has(url)) return false
|
if (this.loaded.has(url)) return false
|
||||||
if (this.loading.has(url)) return false
|
if (this.loading.has(url)) return false
|
||||||
|
|
||||||
|
Tile.schedule(url);
|
||||||
this.map.set(url, [col, row]);
|
this.map.set(url, [col, row]);
|
||||||
this.loading.add(url);
|
this.loading.add(url);
|
||||||
this.loadQueue.push(url);
|
this.loadQueue.push(url);
|
||||||
@@ -7906,6 +8045,7 @@
|
|||||||
unschedule(url) {
|
unschedule(url) {
|
||||||
if (this.loaded.has(url)) this.loaded.delete(url);
|
if (this.loaded.has(url)) this.loaded.delete(url);
|
||||||
if (this.loading.has(url)) this.loading.delete(url);
|
if (this.loading.has(url)) this.loading.delete(url);
|
||||||
|
Tile.unschedule(url);
|
||||||
this.loadQueue = this.loadQueue.filter(item => item != url);
|
this.loadQueue = this.loadQueue.filter(item => item != url);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -7931,9 +8071,14 @@
|
|||||||
console.warn("Tile already loaded");
|
console.warn("Tile already loaded");
|
||||||
tile.unregister();
|
tile.unregister();
|
||||||
}
|
}
|
||||||
|
try {
|
||||||
tile = new Tile(texture, url);
|
tile = new Tile(texture, url);
|
||||||
this.loaded.set(url, tile);
|
this.loaded.set(url, tile);
|
||||||
this.tiles.tileAvailable(tile, col, row, url);
|
this.tiles.tileAvailable(tile, col, row, url);
|
||||||
|
} catch (error) {
|
||||||
|
console.warn("Tile loading error", error);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -7960,16 +8105,13 @@
|
|||||||
if (this.loaded.has(url)) return false
|
if (this.loaded.has(url)) return false
|
||||||
if (this.loading.has(url)) return false
|
if (this.loading.has(url)) return false
|
||||||
|
|
||||||
if (deepZoomTileCache.has(url)) {
|
Tile.schedule(url);
|
||||||
let tiles = deepZoomTileCache.get(url);
|
let reusableTexture = Tile.textureAvailable(url);
|
||||||
for (let tile of tiles.values()) {
|
if (reusableTexture) {
|
||||||
//console.log("Reusing cached texture", tile.parent)
|
if (this.debug) console.log('Texture reusable', reusableTexture);
|
||||||
let texture = tile.texture;
|
this._textureAvailable(url, col, row, reusableTexture);
|
||||||
this._textureAvailable(url, col, row, texture);
|
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
let texture = PIXI.utils.TextureCache[url];
|
let texture = PIXI.utils.TextureCache[url];
|
||||||
if (texture) {
|
if (texture) {
|
||||||
if (this.debug) console.log('Texture already loaded', texture);
|
if (this.debug) console.log('Texture already loaded', texture);
|
||||||
@@ -8486,18 +8628,8 @@
|
|||||||
return n % 2 == 0
|
return n % 2 == 0
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function printTileCacheInfos() {
|
function printTileCacheInfos() {
|
||||||
let references = new Map();
|
Tile.printInfos();
|
||||||
let multiples = 0;
|
|
||||||
for (let [url, tiles] of deepZoomTileCache.entries()) {
|
|
||||||
let count = tiles.size;
|
|
||||||
references.set(url, count);
|
|
||||||
if (count > 1) {
|
|
||||||
multiples += 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
console.log({ multiples, references });
|
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* A utility class that holds information typically provided by DZI files, i.e.
|
* A utility class that holds information typically provided by DZI files, i.e.
|
||||||
@@ -8903,7 +9035,7 @@
|
|||||||
this.minimumLevel = deepZoomInfo.baseLevel;
|
this.minimumLevel = deepZoomInfo.baseLevel;
|
||||||
}
|
}
|
||||||
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel);
|
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel);
|
||||||
console.log("autoLoadTiles", this.autoLoadTiles);
|
//console.log("autoLoadTiles", this.autoLoadTiles)
|
||||||
if (this.autoLoadTiles) {
|
if (this.autoLoadTiles) {
|
||||||
this.setupTiles(center);
|
this.setupTiles(center);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1864,7 +1864,7 @@ export class DeepZoomImage extends PIXI.Container {
|
|||||||
this.minimumLevel = deepZoomInfo.baseLevel
|
this.minimumLevel = deepZoomInfo.baseLevel
|
||||||
}
|
}
|
||||||
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel)
|
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel)
|
||||||
console.log("autoLoadTiles", this.autoLoadTiles)
|
//console.log("autoLoadTiles", this.autoLoadTiles)
|
||||||
if (this.autoLoadTiles) {
|
if (this.autoLoadTiles) {
|
||||||
this.setupTiles(center)
|
this.setupTiles(center)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -101,7 +101,7 @@
|
|||||||
minScale: 0,
|
minScale: 0,
|
||||||
maxScale: 50,
|
maxScale: 50,
|
||||||
onTransform: event => {
|
onTransform: event => {
|
||||||
console.log('currentLevel', deepZoomImage1.currentLevel)
|
//console.log('currentLevel', deepZoomImage1.currentLevel)
|
||||||
deepZoomImage1.transformed(event)
|
deepZoomImage1.transformed(event)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,24 +1,14 @@
|
|||||||
import { Capabilities } from '../../capabilities.js'
|
import { Capabilities } from '../../capabilities.js'
|
||||||
import { Points } from '../../utils.js'
|
import { Points } from '../../utils.js'
|
||||||
import { deepZoomTileCache } from './tile.js'
|
import Tile from './tile.js'
|
||||||
import { Tiles } from './tiles.js'
|
import { Tiles } from './tiles.js'
|
||||||
|
|
||||||
function isEven(n) {
|
function isEven(n) {
|
||||||
return n % 2 == 0
|
return n % 2 == 0
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function printTileCacheInfos() {
|
function printTileCacheInfos() {
|
||||||
let references = new Map()
|
Tile.printInfos()
|
||||||
let multiples = 0
|
|
||||||
for (let [url, tiles] of deepZoomTileCache.entries()) {
|
|
||||||
let count = tiles.size
|
|
||||||
references.set(url, count)
|
|
||||||
if (count > 1) {
|
|
||||||
multiples += 1
|
|
||||||
}
|
|
||||||
}
|
|
||||||
console.log({ multiples, references })
|
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* A utility class that holds information typically provided by DZI files, i.e.
|
* A utility class that holds information typically provided by DZI files, i.e.
|
||||||
@@ -424,7 +414,7 @@ export class DeepZoomImage extends PIXI.Container {
|
|||||||
this.minimumLevel = deepZoomInfo.baseLevel
|
this.minimumLevel = deepZoomInfo.baseLevel
|
||||||
}
|
}
|
||||||
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel)
|
this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel)
|
||||||
console.log("autoLoadTiles", this.autoLoadTiles)
|
//console.log("autoLoadTiles", this.autoLoadTiles)
|
||||||
if (this.autoLoadTiles) {
|
if (this.autoLoadTiles) {
|
||||||
this.setupTiles(center)
|
this.setupTiles(center)
|
||||||
}
|
}
|
||||||
@@ -645,7 +635,7 @@ export class DeepZoomImage extends PIXI.Container {
|
|||||||
}
|
}
|
||||||
|
|
||||||
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) {
|
||||||
@@ -1086,15 +1076,12 @@ export class DeepZoomImage extends PIXI.Container {
|
|||||||
*/
|
*/
|
||||||
deactivate() {
|
deactivate() {
|
||||||
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,4 +1,4 @@
|
|||||||
import { deepZoomTileCache, Tile } from './tile.js'
|
import Tile from './tile.js'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* A Tile Loader component that can be plugged into a Tiles Layer.
|
* A Tile Loader component that can be plugged into a Tiles Layer.
|
||||||
@@ -28,6 +28,8 @@ export class TileLoader {
|
|||||||
schedule(url, col, row) {
|
schedule(url, col, row) {
|
||||||
if (this.loaded.has(url)) return false
|
if (this.loaded.has(url)) return false
|
||||||
if (this.loading.has(url)) return false
|
if (this.loading.has(url)) return false
|
||||||
|
|
||||||
|
Tile.schedule(url)
|
||||||
this.map.set(url, [col, row])
|
this.map.set(url, [col, row])
|
||||||
this.loading.add(url)
|
this.loading.add(url)
|
||||||
this.loadQueue.push(url)
|
this.loadQueue.push(url)
|
||||||
@@ -37,6 +39,7 @@ export class TileLoader {
|
|||||||
unschedule(url) {
|
unschedule(url) {
|
||||||
if (this.loaded.has(url)) this.loaded.delete(url)
|
if (this.loaded.has(url)) this.loaded.delete(url)
|
||||||
if (this.loading.has(url)) this.loading.delete(url)
|
if (this.loading.has(url)) this.loading.delete(url)
|
||||||
|
Tile.unschedule(url)
|
||||||
this.loadQueue = this.loadQueue.filter(item => item != url)
|
this.loadQueue = this.loadQueue.filter(item => item != url)
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -62,9 +65,14 @@ export class TileLoader {
|
|||||||
console.warn("Tile already loaded")
|
console.warn("Tile already loaded")
|
||||||
tile.unregister()
|
tile.unregister()
|
||||||
}
|
}
|
||||||
|
try {
|
||||||
tile = new Tile(texture, url)
|
tile = new Tile(texture, url)
|
||||||
this.loaded.set(url, tile)
|
this.loaded.set(url, tile)
|
||||||
this.tiles.tileAvailable(tile, col, row, url)
|
this.tiles.tileAvailable(tile, col, row, url)
|
||||||
|
} catch (error) {
|
||||||
|
console.warn("Tile loading error", error)
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -91,16 +99,13 @@ export class PIXITileLoader extends TileLoader {
|
|||||||
if (this.loaded.has(url)) return false
|
if (this.loaded.has(url)) return false
|
||||||
if (this.loading.has(url)) return false
|
if (this.loading.has(url)) return false
|
||||||
|
|
||||||
if (deepZoomTileCache.has(url)) {
|
Tile.schedule(url)
|
||||||
let tiles = deepZoomTileCache.get(url)
|
let reusableTexture = Tile.textureAvailable(url)
|
||||||
for (let tile of tiles.values()) {
|
if (reusableTexture) {
|
||||||
//console.log("Reusing cached texture", tile.parent)
|
if (this.debug) console.log('Texture reusable', reusableTexture)
|
||||||
let texture = tile.texture
|
this._textureAvailable(url, col, row, reusableTexture)
|
||||||
this._textureAvailable(url, col, row, texture)
|
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
let texture = PIXI.utils.TextureCache[url]
|
let texture = PIXI.utils.TextureCache[url]
|
||||||
if (texture) {
|
if (texture) {
|
||||||
if (this.debug) console.log('Texture already loaded', texture)
|
if (this.debug) console.log('Texture already loaded', texture)
|
||||||
@@ -155,8 +160,8 @@ export class PIXITileLoader extends TileLoader {
|
|||||||
_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
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,19 +1,98 @@
|
|||||||
|
|
||||||
export const deepZoomTileCache = new Map()
|
const registeredTiles = new Map()
|
||||||
|
const pendingTiles = new Map()
|
||||||
|
/** Implements a baseTexture cache. The last textures are kept for reuse */
|
||||||
|
let keepTextures = 0
|
||||||
|
const keptTextures = []
|
||||||
|
|
||||||
/** The current Tile implementation simply uses PIXI.Sprites.
|
/** The current Tile implementation simply uses PIXI.Sprites.
|
||||||
*
|
*
|
||||||
* BTW: PIXI.extras.TilingSprite is not appropriate. It should be used for
|
* BTW: PIXI.extras.TilingSprite is not appropriate. It should be used for
|
||||||
* repeating patterns.
|
* repeating patterns.
|
||||||
**/
|
**/
|
||||||
export class Tile extends PIXI.Sprite {
|
export default class Tile extends PIXI.Sprite {
|
||||||
constructor(texture, url) {
|
constructor(texture, url) {
|
||||||
super(texture)
|
super(texture)
|
||||||
this.url = url
|
this.url = url
|
||||||
this.register(url)
|
this.register(url)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Static method to enable keeping of base textures
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} value
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static enableKeepTextures(value = 1000) {
|
||||||
|
keepTextures = value
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Marks the given url as pending. Pending tiles should not be destroyed
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} url
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static schedule(url) {
|
||||||
|
let count = 0
|
||||||
|
if (pendingTiles.has(url)) {
|
||||||
|
count = pendingTiles.get(url)
|
||||||
|
}
|
||||||
|
pendingTiles.set(url, count + 1)
|
||||||
|
// console.log("Tile.scheduled", url, pendingTiles.size)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns true iff the url is pending
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} url
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static isPending(url) {
|
||||||
|
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.
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} url
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static unschedule(url) {
|
||||||
|
if (pendingTiles.has(url)) {
|
||||||
|
let count = pendingTiles.get(url)
|
||||||
|
if (count > 1) {
|
||||||
|
pendingTiles.set(url, count - 1)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
pendingTiles.clear(url)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// console.log("Tile.unscheduled", url, pendingTiles.size)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Loads a tile from image using the PIXI.Texture.fromImage method.
|
||||||
|
*
|
||||||
|
* @static
|
||||||
|
* @param {*} imageId
|
||||||
|
* @param {*} crossorigin
|
||||||
|
* @param {*} scaleMode
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
static fromImage(imageId, crossorigin, scaleMode) {
|
static fromImage(imageId, crossorigin, scaleMode) {
|
||||||
return new Tile(PIXI.Texture.fromImage(imageId, crossorigin, scaleMode), imageId)
|
return new Tile(PIXI.Texture.fromImage(imageId, crossorigin, scaleMode), imageId)
|
||||||
}
|
}
|
||||||
@@ -26,13 +105,14 @@ export class Tile extends PIXI.Sprite {
|
|||||||
* @memberof Tile
|
* @memberof Tile
|
||||||
*/
|
*/
|
||||||
register(url, debug = false) {
|
register(url, debug = false) {
|
||||||
if (deepZoomTileCache.has(url)) {
|
Tile.unschedule(url)
|
||||||
let tiles = deepZoomTileCache.get(url)
|
if (registeredTiles.has(url)) {
|
||||||
|
let tiles = registeredTiles.get(url)
|
||||||
tiles.add(this)
|
tiles.add(this)
|
||||||
if (debug) console.log("Tile.register", url, tiles.size)
|
if (debug) console.log("Tile.register", url, tiles.size)
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
deepZoomTileCache.set(url, new Set([this]))
|
registeredTiles.set(url, new Set([this]))
|
||||||
if (debug) console.log("Tile.register", url, 1)
|
if (debug) console.log("Tile.register", url, 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -44,10 +124,11 @@ export class Tile extends PIXI.Sprite {
|
|||||||
* @memberof Tile
|
* @memberof Tile
|
||||||
*/
|
*/
|
||||||
unregister() {
|
unregister() {
|
||||||
let tiles = deepZoomTileCache.get(this.url)
|
let tiles = registeredTiles.get(this.url)
|
||||||
tiles.delete(this)
|
tiles.delete(this)
|
||||||
if (tiles.size == 0) {
|
if (tiles.size == 0) {
|
||||||
deepZoomTileCache.delete(this.url)
|
registeredTiles.delete(this.url)
|
||||||
|
return 0
|
||||||
}
|
}
|
||||||
return tiles.size
|
return tiles.size
|
||||||
}
|
}
|
||||||
@@ -59,19 +140,81 @@ export class Tile extends PIXI.Sprite {
|
|||||||
* @memberof Tile
|
* @memberof Tile
|
||||||
*/
|
*/
|
||||||
destroy(options, debug = false) {
|
destroy(options, debug = false) {
|
||||||
if (this.parent != null) {
|
|
||||||
|
|
||||||
}
|
|
||||||
let count = this.unregister()
|
let count = this.unregister()
|
||||||
if (count <= 0) {
|
|
||||||
|
if (keepTextures > 0) {
|
||||||
|
keptTextures.push({ url: this.url, texture: this.texture })
|
||||||
|
|
||||||
|
let opts = { children: true, texture: false, baseTexture: false }
|
||||||
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts)
|
||||||
|
super.destroy(opts)
|
||||||
|
|
||||||
|
while (keptTextures.length > keepTextures) {
|
||||||
|
let { url, texture } = keptTextures.shift()
|
||||||
|
if (Tile.isObsolete(url)) {
|
||||||
|
texture.destroy(true) // Destroy base as well
|
||||||
|
if (debug) console.log("Destroying texture and baseTexture", url)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// No longer registered and not pending
|
||||||
|
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", deepZoomTileCache.size, opts)
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts)
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
let opts = { children: true, texture: false, baseTexture: false }
|
let opts = { children: true, texture: false, baseTexture: false }
|
||||||
if (debug) console.log("Tile.destroy", deepZoomTileCache.size, opts)
|
if (debug) console.log("Tile.destroy", registeredTiles.size, opts)
|
||||||
super.destroy(opts)
|
super.destroy(opts)
|
||||||
}
|
}
|
||||||
|
if (this.parent != null) {
|
||||||
|
// UO: Emit warning and remove
|
||||||
|
console.warn("Destroying tile with parent. Hiding instead")
|
||||||
|
this.visible = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns an available texture that can be reused
|
||||||
|
*
|
||||||
|
* @param {*} url
|
||||||
|
* @returns
|
||||||
|
* @memberof Tile
|
||||||
|
*/
|
||||||
|
static textureAvailable(url) {
|
||||||
|
if (registeredTiles.has(url)) {
|
||||||
|
let tiles = registeredTiles.get(url)
|
||||||
|
for (let tile of tiles.values()) {
|
||||||
|
//console.log("Reusing cached texture", tile.parent)
|
||||||
|
return tile.texture
|
||||||
|
}
|
||||||
|
}
|
||||||
|
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() {
|
||||||
|
let references = new Map()
|
||||||
|
let multiples = 0
|
||||||
|
for (let [url, tiles] of registeredTiles.entries()) {
|
||||||
|
let count = tiles.size
|
||||||
|
references.set(url, count)
|
||||||
|
if (count > 1) {
|
||||||
|
multiples += 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log({ multiples, references })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 112 KiB After Width: | Height: | Size: 112 KiB |
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 43 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
|
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 61 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 184 KiB After Width: | Height: | Size: 184 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
|
Before Width: | Height: | Size: 102 KiB After Width: | Height: | Size: 103 KiB |
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "iwmlib",
|
"name": "iwmlib",
|
||||||
"version": "1.0.8",
|
"version": "1.0.11",
|
||||||
"description": "An Open Source library for multi-touch, WebGL powered applications.",
|
"description": "An Open Source library for multi-touch, WebGL powered applications.",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"directories": {
|
"directories": {
|
||||||
@@ -28,6 +28,7 @@
|
|||||||
"gulp-uglify": "^3.0.2"
|
"gulp-uglify": "^3.0.2"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"fs-extra": "^8.0.1",
|
||||||
"gsap": "^2.1.3",
|
"gsap": "^2.1.3",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
"optimal-select": "^4.0.1",
|
"optimal-select": "^4.0.1",
|
||||||
|
|||||||