different colors for different tiled images in debug mode.

If there are multiple tiled images as overlay, it might be important to
see how they are loaded. Different colors in the debug mode for the
different tiledImages visualize that. DebugGridColors have to be given
as a sting array with a color for each tiledImage. However, shorter
arrays will be recycled without error. Also, single strings are treated
as single entry arrays, for backwards compatibility.
This commit is contained in:
Peter 2017-07-26 10:57:17 -04:00
parent d8f761f509
commit 175463a0f6
2 changed files with 10 additions and 9 deletions

View File

@ -1,4 +1,4 @@
/* /*
* OpenSeadragon - Drawer * OpenSeadragon - Drawer
* *
* Copyright (C) 2009 CodePlex Foundation * Copyright (C) 2009 CodePlex Foundation
@ -69,7 +69,7 @@ $.Drawer = function( options ) {
this.viewer = options.viewer; this.viewer = options.viewer;
this.viewport = options.viewport; this.viewport = options.viewport;
this.debugGridColor = options.debugGridColor || $.DEFAULT_SETTINGS.debugGridColor; this.debugGridColor = typeof options.debugGridColor === 'string' ? [options.debugGridColor] : options.debugGridColor || $.DEFAULT_SETTINGS.debugGridColor;
if (options.opacity) { if (options.opacity) {
$.console.error( "[Drawer] options.opacity is no longer accepted; set the opacity on the TiledImage instead" ); $.console.error( "[Drawer] options.opacity is no longer accepted; set the opacity on the TiledImage instead" );
} }
@ -490,12 +490,13 @@ $.Drawer.prototype = {
return; return;
} }
var indexOfImage = this.viewer.world.getIndexOfItem(tiledImage) % this.debugGridColor.length;
var context = this.context; var context = this.context;
context.save(); context.save();
context.lineWidth = 2 * $.pixelDensityRatio; context.lineWidth = 2 * $.pixelDensityRatio;
context.font = 'small-caps bold ' + (13 * $.pixelDensityRatio) + 'px arial'; context.font = 'small-caps bold ' + (13 * $.pixelDensityRatio) + 'px arial';
context.strokeStyle = this.debugGridColor; context.strokeStyle = this.debugGridColor[indexOfImage];
context.fillStyle = this.debugGridColor; context.fillStyle = this.debugGridColor[indexOfImage];
if ( this.viewport.degrees !== 0 ) { if ( this.viewport.degrees !== 0 ) {
this._offsetForRotation({degrees: this.viewport.degrees}); this._offsetForRotation({degrees: this.viewport.degrees});
@ -581,8 +582,8 @@ $.Drawer.prototype = {
var context = this.context; var context = this.context;
context.save(); context.save();
context.lineWidth = 2 * $.pixelDensityRatio; context.lineWidth = 2 * $.pixelDensityRatio;
context.strokeStyle = this.debugGridColor; context.strokeStyle = this.debugGridColor[0];
context.fillStyle = this.debugGridColor; context.fillStyle = this.debugGridColor[0];
context.strokeRect( context.strokeRect(
rect.x * $.pixelDensityRatio, rect.x * $.pixelDensityRatio,

View File

@ -1,4 +1,4 @@
/* /*
* OpenSeadragon * OpenSeadragon
* *
* Copyright (C) 2009 CodePlex Foundation * Copyright (C) 2009 CodePlex Foundation
@ -159,7 +159,7 @@
* @property {Boolean} [debugMode=false] * @property {Boolean} [debugMode=false]
* TODO: provide an in-screen panel providing event detail feedback. * TODO: provide an in-screen panel providing event detail feedback.
* *
* @property {String} [debugGridColor='#437AB2'] * @property {String} [debugGridColor=['#437AB2']]
* *
* @property {Number} [blendTime=0] * @property {Number} [blendTime=0]
* Specifies the duration of animation as higher or lower level tiles are * Specifies the duration of animation as higher or lower level tiles are
@ -1207,7 +1207,7 @@ function OpenSeadragon( options ){
//DEVELOPER SETTINGS //DEVELOPER SETTINGS
debugMode: false, debugMode: false,
debugGridColor: '#437AB2' debugGridColor: ['#437AB2']
}, },