Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
106 changes: 66 additions & 40 deletions examples/deepzoom/static/openseadragon.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
//! openseadragon 5.0.0
//! Built on 2024-08-14
//! Git commit: v5.0.0-0-f28b7fc1
//! openseadragon 5.0.1
//! Built on 2024-12-09
//! Git commit: v5.0.1-0-480de92d
//! http://openseadragon.github.io
//! License: http://openseadragon.github.io/license/

Expand Down Expand Up @@ -90,7 +90,7 @@

/**
* @namespace OpenSeadragon
* @version openseadragon 5.0.0
* @version openseadragon 5.0.1
* @classdesc The root namespace for OpenSeadragon. All utility methods
* and classes are defined on or below this namespace.
*
Expand Down Expand Up @@ -220,7 +220,7 @@
* For complete list of modes, please @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation/ globalCompositeOperation}
*
* @property {Boolean} [imageSmoothingEnabled=true]
* Image smoothing for canvas rendering (only if the canvas drawer is used). Note: Ignored
* Image smoothing for rendering (only if the canvas or webgl drawer is used). Note: Ignored
* by some (especially older) browsers which do not support this canvas property.
* This property can be changed in {@link Viewer.DrawerBase.setImageSmoothingEnabled}.
*
Expand Down Expand Up @@ -856,10 +856,10 @@ function OpenSeadragon( options ){
* @since 1.0.0
*/
$.version = {
versionStr: '5.0.0',
versionStr: '5.0.1',
major: parseInt('5', 10),
minor: parseInt('0', 10),
revision: parseInt('0', 10)
revision: parseInt('1', 10)
};


Expand Down Expand Up @@ -10407,17 +10407,15 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
},

/**
* Update pixel density ratio, clears all tiles and triggers updates for
* all items if the ratio has changed.
* Update pixel density ratio and forces a resize operation.
* @private
*/
_updatePixelDensityRatio: function() {
var previusPixelDensityRatio = $.pixelDensityRatio;
var currentPixelDensityRatio = $.getCurrentPixelDensityRatio();
if (previusPixelDensityRatio !== currentPixelDensityRatio) {
$.pixelDensityRatio = currentPixelDensityRatio;
this.world.resetItems();
this.forceRedraw();
this.forceResize();
}
},

Expand Down Expand Up @@ -12289,7 +12287,6 @@ $.extend( $.Navigator.prototype, $.EventSource.prototype, $.Viewer.prototype, /*
},

setDisplayTransform: function(rule) {
setElementTransform(this.displayRegion, rule);
setElementTransform(this.canvas, rule);
setElementTransform(this.element, rule);
},
Expand Down Expand Up @@ -19044,9 +19041,17 @@ $.Tile.prototype = {
};
}

this.elementWrapper = document.createElement('div');
this.element = options.element;
this.element.innerHTML = "<div>" + this.element.innerHTML + "</div>";
this.style = options.element.style;
this.elementWrapper.appendChild(this.element);

if (this.element.id) {
this.elementWrapper.id = "overlay-wrapper-" + this.element.id;
} else {
this.elementWrapper.id = "overlay-wrapper";
}

this.style = this.elementWrapper.style;
this._init(options);
};

Expand Down Expand Up @@ -19113,7 +19118,7 @@ $.Tile.prototype = {
* @function
*/
destroy: function() {
var element = this.element;
var element = this.elementWrapper;
var style = this.style;

if (element.parentNode) {
Expand Down Expand Up @@ -19158,7 +19163,7 @@ $.Tile.prototype = {
* @param {Element} container
*/
drawHTML: function(container, viewport) {
var element = this.element;
var element = this.elementWrapper;
if (element.parentNode !== container) {
//save the source parent for later if we need it
element.prevElementParent = element.parentNode;
Expand All @@ -19169,7 +19174,7 @@ $.Tile.prototype = {
this.style.position = "absolute";
// this.size is used by overlays which don't get scaled in at
// least one direction when this.checkResize is set to false.
this.size = $.getElementSize(element);
this.size = $.getElementSize(this.elementWrapper);
}
var positionAndSize = this._getOverlayPositionAndSize(viewport);
var position = positionAndSize.position;
Expand All @@ -19186,15 +19191,15 @@ $.Tile.prototype = {
this.onDraw(position, size, this.element);
} else {
var style = this.style;
var innerElement = element.firstChild;
var innerStyle = innerElement.style;
var innerStyle = this.element.style;
innerStyle.display = "block";
style.left = position.x + "px";
style.top = position.y + "px";
if (this.width !== null) {
style.width = size.x + "px";
innerStyle.width = size.x + "px";
}
if (this.height !== null) {
style.height = size.y + "px";
innerStyle.height = size.y + "px";
}
var transformOriginProp = $.getCssPropertyWithVendorPrefix(
'transformOrigin');
Expand All @@ -19219,7 +19224,7 @@ $.Tile.prototype = {
style[transformProp] = "";
}
}
style.display = 'block';
style.display = 'flex';
}
},

Expand Down Expand Up @@ -19271,7 +19276,7 @@ $.Tile.prototype = {
}
if (this.checkResize &&
(this.width === null || this.height === null)) {
var eltSize = this.size = $.getElementSize(this.element);
var eltSize = this.size = $.getElementSize(this.elementWrapper);
if (this.width === null) {
width = eltSize.x;
}
Expand Down Expand Up @@ -21155,6 +21160,8 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
this._renderingCanvas = null;
this._backupCanvasDrawer = null;

this._imageSmoothingEnabled = true; // will be updated by setImageSmoothingEnabled

// Add listeners for events that require modifying the scene or camera
this._boundToTileReady = ev => this._tileReadyHandler(ev);
this._boundToImageUnloaded = ev => this._imageUnloadedHandler(ev);
Expand Down Expand Up @@ -21198,10 +21205,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
gl.bindRenderbuffer(gl.RENDERBUFFER, null);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);

let canvases = Array.from(this._TextureMap.keys());
canvases.forEach(canvas => {
this._cleanupImageData(canvas); // deletes texture, removes from _TextureMap
});
this._unloadTextures();

// Delete all our created resources
gl.deleteBuffer(this._secondPass.bufferOutputPosition);
Expand All @@ -21223,6 +21227,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
// unbind our event listeners from the viewer
this.viewer.removeHandler("tile-ready", this._boundToTileReady);
this.viewer.removeHandler("image-unloaded", this._boundToImageUnloaded);
this.viewer.removeHandler("resize", this._resizeHandler);

// set our webgl context reference to null to enable garbage collection
this._gl = null;
Expand Down Expand Up @@ -21317,9 +21322,10 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
*/
draw(tiledImages){
let gl = this._gl;
const bounds = this.viewport.getBoundsNoRotateWithMargins(true);
let view = {
bounds: this.viewport.getBoundsNoRotate(true),
center: this.viewport.getCenter(true),
bounds: bounds,
center: new OpenSeadragon.Point(bounds.x + bounds.width / 2, bounds.y + bounds.height / 2),
rotation: this.viewport.getRotation(true) * Math.PI / 180
};

Expand Down Expand Up @@ -21511,7 +21517,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
gl.bindBuffer(gl.ARRAY_BUFFER, this._secondPass.bufferTexturePosition);
gl.vertexAttribPointer(this._secondPass.aTexturePosition, 2, gl.FLOAT, false, 0, 0);
gl.bindBuffer(gl.ARRAY_BUFFER, this._secondPass.bufferOutputPosition);
gl.vertexAttribPointer(this._firstPass.aOutputPosition, 2, gl.FLOAT, false, 0, 0);
gl.vertexAttribPointer(this._secondPass.aOutputPosition, 2, gl.FLOAT, false, 0, 0);

// Draw the quad (two triangles)
gl.drawArrays(gl.TRIANGLES, 0, 6);
Expand Down Expand Up @@ -21547,11 +21553,15 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {

// Public API required by all Drawer implementations
/**
* Required by DrawerBase, but has no effect on WebGLDrawer.
* @param {Boolean} enabled
* Sets whether image smoothing is enabled or disabled
* @param {Boolean} enabled If true, uses gl.LINEAR as the TEXTURE_MIN_FILTER and TEXTURE_MAX_FILTER, otherwise gl.NEAREST.
*/
setImageSmoothingEnabled(enabled){
// noop - this property does not impact WebGLDrawer
if( this._imageSmoothingEnabled !== enabled ){
this._imageSmoothingEnabled = enabled;
this._unloadTextures();
this.viewer.world.draw();
}
}

/**
Expand Down Expand Up @@ -21661,6 +21671,11 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {

}

// private
_textureFilter(){
return this._imageSmoothingEnabled ? this._gl.LINEAR : this._gl.NEAREST;
}

// private
_setupRenderer(){
let gl = this._gl;
Expand All @@ -21677,7 +21692,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, this._renderToTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this._renderingCanvas.width, this._renderingCanvas.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, this._textureFilter());
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

Expand Down Expand Up @@ -21876,7 +21891,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, this._renderToTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, w, h, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, this._textureFilter());
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

Expand All @@ -21902,8 +21917,7 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {

this._gl = this._renderingCanvas.getContext('webgl');

//make the additional canvas elements mirror size changes to the output canvas
this.viewer.addHandler("resize", function(){
this._resizeHandler = function(){

if(_this._outputCanvas !== _this.viewer.drawer.canvas){
_this._outputCanvas.style.width = _this.viewer.drawer.canvas.clientWidth + 'px';
Expand All @@ -21924,7 +21938,10 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {

// important - update the size of the rendering viewport!
_this._resizeRenderer();
});
};

//make the additional canvas elements mirror size changes to the output canvas
this.viewer.addHandler("resize", this._resizeHandler);
}

// private
Expand Down Expand Up @@ -22014,8 +22031,8 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
// Set the parameters so we can render any size image.
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, this._textureFilter());
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, this._textureFilter());

// Upload the image into the texture.
this._uploadImageData(tileContext);
Expand All @@ -22039,6 +22056,14 @@ function determineSubPixelRoundingRule(subPixelRoundingRules) {
};
}

// private
_unloadTextures(){
let canvases = Array.from(this._TextureMap.keys());
canvases.forEach(canvas => {
this._cleanupImageData(canvas); // deletes texture, removes from _TextureMap
});
}

// private
_uploadImageData(tileContext){

Expand Down Expand Up @@ -25101,6 +25126,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
this._clip = null;
}

this._needsUpdate = true;
this._needsDraw = true;
/**
* Raised when the TiledImage's clip is changed.
Expand Down
Loading