Merge pull request #1480 from mauguedes/customize-navigator-background-and-border-colors

Add CSS configuration options for the navigator minimap
This commit is contained in:
Ian Gilman 2018-06-15 13:16:16 -07:00 committed by GitHub
commit beecde11d9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 29 additions and 5 deletions

View File

@ -110,7 +110,11 @@ $.Navigator = function( options ){
animationTime: 0,
autoResize: options.autoResize,
// prevent resizing the navigator from adding unwanted space around the image
minZoomImageRatio: 1.0
minZoomImageRatio: 1.0,
background: options.background,
opacity: options.opacity,
borderColor: options.borderColor,
displayRegionColor: options.displayRegionColor
});
options.minPixelRatio = this.minPixelRatio = viewer.minPixelRatio;
@ -127,10 +131,10 @@ $.Navigator = function( options ){
if ( options.controlOptions.anchor != $.ControlAnchor.NONE ) {
(function( style, borderWidth ){
style.margin = '0px';
style.border = borderWidth + 'px solid #555';
style.border = borderWidth + 'px solid ' + options.borderColor;
style.padding = '0px';
style.background = '#000';
style.opacity = 0.8;
style.background = options.background;
style.opacity = options.opacity;
style.overflow = 'hidden';
}( this.element.style, this.borderWidth));
}
@ -145,7 +149,7 @@ $.Navigator = function( options ){
style.left = '0px';
style.fontSize = '0px';
style.overflow = 'hidden';
style.border = borderWidth + 'px solid #900';
style.border = borderWidth + 'px solid ' + options.displayRegionColor;
style.margin = '0px';
style.padding = '0px';
//TODO: IE doesnt like this property being set

View File

@ -419,6 +419,18 @@
* @property {Boolean} [navigatorRotate=true]
* If true, the navigator will be rotated together with the viewer.
*
* @property {String} [navigatorBackground='#000']
* Specifies the background color of the navigator minimap
*
* @property {Number} [navigatorOpacity=0.8]
* Specifies the opacity of the navigator minimap.
*
* @property {String} [navigatorBorderColor='#555']
* Specifies the border color of the navigator minimap
*
* @property {String} [navigatorDisplayRegionColor='#900']
* Specifies the border color of the display region rectangle of the navigator minimap
*
* @property {Number} [controlsFadeDelay=2000]
* The number of milliseconds to wait once the user has stopped interacting
* with the interface before begining to fade the controls. Assumes
@ -1151,6 +1163,10 @@ function OpenSeadragon( options ){
navigatorAutoResize: true,
navigatorAutoFade: true,
navigatorRotate: true,
navigatorBackground: '#000',
navigatorOpacity: 0.8,
navigatorBorderColor: '#555',
navigatorDisplayRegionColor: '#900',
// INITIAL ROTATION
degrees: 0,

View File

@ -429,6 +429,10 @@ $.Viewer = function( options ) {
prefixUrl: this.prefixUrl,
viewer: this,
navigatorRotate: this.navigatorRotate,
background: this.navigatorBackground,
opacity: this.navigatorOpacity,
borderColor: this.navigatorBorderColor,
displayRegionColor: this.navigatorDisplayRegionColor,
crossOriginPolicy: this.crossOriginPolicy
});
}