add type property to drawers. only add extra padding to tiles for drawers that need it.

This commit is contained in:
Tom 2023-06-30 16:38:07 -04:00
parent 048b43e196
commit 0a3aa6172d
5 changed files with 54 additions and 10 deletions

View File

@ -85,6 +85,10 @@ class CanvasDrawer extends $.DrawerBase{
return $.supportsCanvas;
}
get type(){
return 'canvas';
}
/**
* create the HTML element (e.g. canvas, div) that the image will be drawn into
* @returns {Element} the canvas to draw into
@ -129,6 +133,14 @@ class CanvasDrawer extends $.DrawerBase{
this.sketchContext = null;
}
/**
* @returns {Boolean} Whether this drawer requires enforcing minimum tile overlap to avoid showing seams.
*/
minimumOverlapRequired() {
return true;
}
/**
* Turns image smoothing on or off for this viewer. Note: Ignored in some (especially older) browsers that do not support this property.
*

View File

@ -122,6 +122,13 @@ $.DrawerBase = class DrawerBase{
return this.container;
}
/**
* @property {String|undefined} type What type of drawer this is. Implementations should override this property.
*/
get type(){
return undefined;
}
/**
* @returns {Boolean} whether the drawer implementation is supported by the browser
*/
@ -139,9 +146,9 @@ $.DrawerBase = class DrawerBase{
}
/**
* @param tiledImage the TiledImage that is ready to be drawn
* @param {Array} tiledImages - An array of TiledImages that are ready to be drawn
*/
draw(tiledImage) {
draw(tiledImages) {
$.console.error('Drawer.draw must be implemented by child class');
}
@ -159,6 +166,14 @@ $.DrawerBase = class DrawerBase{
$.console.error('Drawer.destroy must be implemented by child class');
}
/**
* @returns {Boolean} Whether this drawer requires enforcing minimum tile overlap to avoid showing seams.
*/
minimumOverlapRequired() {
return false;
}
/**
* Turns image smoothing on or off for this viewer. Note: Ignored in some (especially older) browsers that do not support this property.
*

View File

@ -65,6 +65,17 @@ class HTMLDrawer extends $.DrawerBase{
return true;
}
get type(){
return 'html';
}
/**
* @returns {Boolean} Whether this drawer requires enforcing minimum tile overlap to avoid showing seams.
*/
minimumOverlapRequired() {
return true;
}
/**
* create the HTML element (e.g. canvas, div) that the image will be drawn into
* @returns {Element} the div to draw into

View File

@ -1657,16 +1657,18 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
tileCenter = positionT.plus( sizeT.divide( 2 ) ),
tileSquaredDistance = viewportCenter.squaredDistanceTo( tileCenter );
if ( !overlap ) {
sizeC = sizeC.plus( new $.Point( 1, 1 ) );
}
if(this.viewer.drawer.minimumOverlapRequired()){
if ( !overlap ) {
sizeC = sizeC.plus( new $.Point(1, 1));
}
if (tile.isRightMost && this.wrapHorizontal) {
sizeC.x += 0.75; // Otherwise Firefox and Safari show seams
}
if (tile.isRightMost && this.wrapHorizontal) {
sizeC.x += 0.75; // Otherwise Firefox and Safari show seams
}
if (tile.isBottomMost && this.wrapVertical) {
sizeC.y += 0.75; // Otherwise Firefox and Safari show seams
if (tile.isBottomMost && this.wrapVertical) {
sizeC.y += 0.75; // Otherwise Firefox and Safari show seams
}
}
tile.position = positionC;

View File

@ -248,6 +248,10 @@
return !!( webglContext );
}
get type(){
return 'webgl';
}
/**
* create the HTML element (canvas in this case) that the image will be drawn into
* @returns {Element} the canvas to draw into