mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2024-11-28 08:06:08 +03:00
Code Issues Projects Releases Wiki Activity

Merge pull request #2469 from pearcetm/placeholder-for-webgl

Browse Source 
Support placeholderFillStyle in WebGLDrawer, and other fixes
This commit is contained in:
Ian Gilman 2024-02-12 09:29:20 -08:00 committed by GitHub
commit 1c60e45a7f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 58 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/canvasdrawer.js
View File

@ -382,9 +382,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);
}
@ -392,7 +392,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);
}

32
src/spring.js
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;
},
/**

28
src/webgldrawer.js
View File

@ -239,6 +239,10 @@
let tilesToDraw = tiledImage.getTilesToDraw();
if ( tiledImage.placeholderFillStyle && tiledImage._hasOpaqueTile === false ) {
this._drawPlaceholder(tiledImage);
}
if(tilesToDraw.length === 0 || tiledImage.getOpacity() === 0){
return;
}
@ -1077,6 +1081,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;

19
test/demo/tilesource-swap.html
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);