Merge branch 'master' into canvas-fallback

This commit is contained in:
Tom 2024-02-21 16:13:36 -05:00
commit c6e3e06194
7 changed files with 63 additions and 30 deletions

View File

@ -5,7 +5,7 @@ OPENSEADRAGON CHANGELOG
* BREAKING CHANGE: Dropped support for IE11 (#2300, #2361 @AndrewADev)
* DEPRECATION: The OpenSeadragon.createCallback function is no longer recommended (#2367 @akansjain)
* The viewer now uses WebGL when available (#2310, #2462, #2466 @pearcetm, @Aiosa)
* The viewer now uses WebGL when available (#2310, #2462, #2466, #2468, #2469 @pearcetm, @Aiosa, @thec0keman)
* Added webp to supported image formats (#2455 @BeebBenjamin)
* Introduced maxTilesPerFrame option to allow loading more tiles simultaneously (#2387 @jetic83)
* Now when creating a viewer or navigator, we leave its position style alone if possible (#2393 @VIRAT9358)
@ -15,6 +15,8 @@ OPENSEADRAGON CHANGELOG
* Fixed: Strange behavior if IIIF sizes were not in ascending order (#2416 @lutzhelm)
* Fixed: Two-finger tap on a Mac trackpad would zoom you out (#2431 @cavenel)
* Fixed: dragToPan gesture could not be disabled when flickEnabled was activated (#2464 @jonasengelmann)
* Fixed: placeholderFillStyle didn't work properly when the image was rotated (#2469 @pearcetm)
* Fixed: Sometimes exponential springs wouldn't ever settle (#2469 @pearcetm)
4.1.0:

View File

@ -383,9 +383,9 @@ class CanvasDrawer extends OpenSeadragon.DrawerBase{
}
usedClip = true;
}
tiledImage._hasOpaqueTile = false;
if ( tiledImage.placeholderFillStyle && tiledImage._hasOpaqueTile === false ) {
var placeholderRect = this.viewportToDrawerRectangle(tiledImage.getBounds(true));
let placeholderRect = this.viewportToDrawerRectangle(tiledImage.getBoundsNoRotate(true));
if (sketchScale) {
placeholderRect = placeholderRect.times(sketchScale);
}
@ -393,7 +393,7 @@ class CanvasDrawer extends OpenSeadragon.DrawerBase{
placeholderRect = placeholderRect.translate(sketchTranslate);
}
var fillStyle = null;
let fillStyle = null;
if ( typeof tiledImage.placeholderFillStyle === "function" ) {
fillStyle = tiledImage.placeholderFillStyle(tiledImage, this.context);
}

View File

@ -212,7 +212,7 @@ $.Spring.prototype = {
update: function() {
this.current.time = $.now();
var startValue, targetValue;
let startValue, targetValue;
if (this._exponential) {
startValue = this.start._logValue;
targetValue = this.target._logValue;
@ -221,23 +221,25 @@ $.Spring.prototype = {
targetValue = this.target.value;
}
var currentValue = (this.current.time >= this.target.time) ?
targetValue :
startValue +
( targetValue - startValue ) *
transform(
this.springStiffness,
( this.current.time - this.start.time ) /
( this.target.time - this.start.time )
);
if (this._exponential) {
this.current.value = Math.exp(currentValue);
if(this.current.time >= this.target.time){
this.current.value = this.target.value;
} else {
this.current.value = currentValue;
let currentValue = startValue +
( targetValue - startValue ) *
transform(
this.springStiffness,
( this.current.time - this.start.time ) /
( this.target.time - this.start.time )
);
if (this._exponential) {
this.current.value = Math.exp(currentValue);
} else {
this.current.value = currentValue;
}
}
return currentValue !== targetValue;
return this.current.value !== this.target.value;
},
/**

View File

@ -1476,7 +1476,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
lowestLevel
);
_this._isBlending = _this._isBlending || tileIsBlending;
_this._needsDraw = _this._needsDraw || tileIsBlending || this._wasBlending;
_this._needsDraw = _this._needsDraw || tileIsBlending || _this._wasBlending;
}
}

View File

@ -287,6 +287,10 @@
} else {
let tilesToDraw = tiledImage.getTilesToDraw();
if ( tiledImage.placeholderFillStyle && tiledImage._hasOpaqueTile === false ) {
this._drawPlaceholder(tiledImage);
}
if(tilesToDraw.length === 0 || tiledImage.getOpacity() === 0){
return;
}
@ -1157,6 +1161,30 @@
context.restore();
}
_drawPlaceholder(tiledImage){
const bounds = tiledImage.getBounds(true);
const rect = this.viewportToDrawerRectangle(tiledImage.getBounds(true));
const context = this._outputContext;
let fillStyle;
if ( typeof tiledImage.placeholderFillStyle === "function" ) {
fillStyle = tiledImage.placeholderFillStyle(tiledImage, context);
}
else {
fillStyle = tiledImage.placeholderFillStyle;
}
this._offsetForRotation({degrees: this.viewer.viewport.getRotation(true)});
context.fillStyle = fillStyle;
context.translate(rect.x, rect.y);
context.rotate(Math.PI / 180 * bounds.degrees);
context.translate(-rect.x, -rect.y);
context.fillRect(rect.x, rect.y, rect.width, rect.height);
this._restoreRotationChanges();
}
// private
_restoreRotationChanges() {
var context = this._outputContext;

View File

@ -261,7 +261,7 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
draw: function() {
this.viewer.drawer.draw(this._items);
this._needsDraw = false;
this._items.forEach(function(item){
this._items.forEach((item) => {
this._needsDraw = item.setDrawn() || this._needsDraw;
});
},

View File

@ -32,17 +32,18 @@
type: 'legacy-image-pyramid',
levels: [
{
url: 'http://openseadragon.github.io/example-images/duomo/duomo_files/8/0_0.jpg',
url: 'https://openseadragon.github.io/example-images/duomo/duomo_files/8/0_0.jpg',
width: 218,
height: 160
}
]
],
degrees: 30,
};
var duomo = {
Image: {
xmlns: 'http://schemas.microsoft.com/deepzoom/2008',
Url: 'http://openseadragon.github.io/example-images/duomo/duomo_files/',
Url: 'https://openseadragon.github.io/example-images/duomo/duomo_files/',
Format: 'jpg',
Overlap: '2',
TileSize: '256',
@ -59,11 +60,14 @@
tileSources: duomoStandin,
minZoomImageRatio: 0.1,
defaultZoomLevel: 0.1,
zoomPerClick: 1
zoomPerClick: 1,
crossOriginPolicy: 'Anonymous'
});
let swapped = false;
viewer.addHandler('canvas-click', function(event) {
if (event.quick) {
if (event.quick && !swapped) {
swapped = true;
var standin = viewer.world.getItemAt(0);
var standinBounds = standin.getBounds();
viewer.viewport.fitBounds(standinBounds);
@ -76,13 +80,10 @@
index: 0, // Add the new image below the stand-in.
success: function(event) {
var fullImage = event.item;
// The changeover will look better if we wait for the first tile to be drawn.
// The changeover will look better if we wait for the first draw after the changeover.
var tileDrawnHandler = function(event) {
if (event.tiledImage === fullImage) {
viewer.removeHandler('update-viewport', tileDrawnHandler);
viewer.world.removeItem(standin);
}
};
viewer.addHandler('update-viewport', tileDrawnHandler);