Allow base layer reassignment if not in sequence mode.

This commit is contained in:
Antoine Vandecreme 2014-01-21 19:24:47 -05:00
parent facccf7b45
commit 1c1cd0dc4d
3 changed files with 143 additions and 31 deletions

View File

@ -994,7 +994,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
/**
* Add a layer.
* options.tileSource can be anything that {@link OpenSeadragon.Viewer#open}
* supports.
* supports except arrays of images as layers cannot be sequences.
* @function
* @param {Object} options
* @param {String|Object|Function} [options.tileSource] The TileSource of the layer.
@ -1008,6 +1008,9 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
var _this = this,
tileSource = options.tileSource;
if ( !this.isOpen() ) {
throw new Error( "An image must be loaded before adding layers." );
}
if ( !tileSource ) {
throw new Error( "No tile source provided as new layer." );
}
@ -1034,7 +1037,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
if ( tileSource instanceof Array ) {
raiseAddLayerFailed({
message: "Collections can not be added as layers.",
message: "Sequences can not be added as layers.",
source: tileSource,
options: options
});
@ -1062,7 +1065,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
debugGridColor: _this.debugGridColor
});
_this.drawers.push( drawer );
if ( options.level ) {
if ( options.level !== undefined ) {
_this.setLayerLevel( drawer, options.level );
}
THIS[ _this.hash ].forceRedraw = true;
@ -1114,8 +1117,8 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
* Get the number of layers used.
* @returns {Number} The number of layers used.
*/
getNumberOfLayers: function() {
return this.drawers.length - 1;
getLayersCount: function() {
return this.drawers.length;
},
/**
@ -1128,22 +1131,33 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
*/
setLayerLevel: function( drawer, level ) {
var oldLevel = this.getLevelOfLayer( drawer );
if ( level === 0 || oldLevel === 0 ) {
throw new Error( "Cannot reassign base level." );
}
if ( level >= this.drawers.length ) {
throw new Error( "Level bigger than number of layers." );
}
if ( level === oldLevel || oldLevel === -1 ) {
return this;
}
if ( level === 0 || oldLevel === 0 ) {
if ( THIS[ this.hash ].sequenced ) {
throw new Error( "Cannot reassign base level when in sequence mode." );
}
// We need to re-assign the base drawer
this.drawer = level === 0 ? drawer : this.getLayerAtLevel( level );
}
this.drawers.splice( oldLevel, 1 );
this.drawers.splice( level, 0, drawer );
this.canvas.removeChild( drawer.canvas );
// Insert right after layer at level - 1
var prevLevelCanvas = this.drawers[level - 1].canvas;
prevLevelCanvas.parentNode.insertBefore( drawer.canvas,
prevLevelCanvas.nextSibling );
if ( level === 0 ) {
var nextLevelCanvas = this.drawers[ 1 ].canvas;
nextLevelCanvas.parentNode.insertBefore( drawer.canvas,
nextLevelCanvas );
} else {
// Insert right after layer at level - 1
var prevLevelCanvas = this.drawers[level - 1].canvas;
prevLevelCanvas.parentNode.insertBefore( drawer.canvas,
prevLevelCanvas.nextSibling );
}
/**
* Raised when the order of the layers has been changed.

View File

@ -28,7 +28,7 @@
<div>
<div id="availables">
Availables layers<br>
Available layers<br>
<select name="layers-availables" size="4" multiple="multiple">
<option>CCyan</option>
<option>DDandelion</option>

View File

@ -21,18 +21,16 @@
}
viewer = null;
$("#layersexample").remove();
$( "#layersexample" ).remove();
}
} );
// ----------
asyncTest( 'Layers operations', function() {
expect( 22 );
viewer.addHandler( "open", function() {
equal( 0, viewer.getNumberOfLayers(),
"No layer should be present after opening." );
viewer.addHandler( "open", function( ) {
equal( 1, viewer.getLayersCount( ),
"One layer should be present after opening." );
var options = {
tileSource: {
type: 'legacy-image-pyramid',
@ -47,9 +45,8 @@
viewer.addHandler( "add-layer", function addFirstLayerHandler( event ) {
viewer.removeHandler( "add-layer", addFirstLayerHandler );
var layer1 = event.drawer;
equal( viewer.getNumberOfLayers(), 1,
"1 layer should be present after adding a layer." );
equal( viewer.getLayersCount( ), 2,
"2 layers should be present after adding a layer." );
equal( options, event.options,
"The options should be transmitted via the event." );
equal( viewer.getLevelOfLayer( layer1 ), 1,
@ -61,9 +58,8 @@
viewer.addHandler( "add-layer", function addSecondLayerHandler( event ) {
viewer.removeHandler( "add-layer", addSecondLayerHandler );
var layer2 = event.drawer;
equal( viewer.getNumberOfLayers(), 2,
"2 layers should be present after adding a second layer." );
equal( viewer.getLayersCount( ), 3,
"3 layers should be present after adding a second layer." );
equal( viewer.getLevelOfLayer( layer2 ), 2,
"If not specified, a layer should be added with the highest level." );
equal( viewer.getLayerAtLevel( 2 ), layer2,
@ -95,9 +91,8 @@
viewer.addHandler( "add-layer", function addThirdLayerHandler( event ) {
viewer.removeHandler( "add-layer", addThirdLayerHandler );
var layer3 = event.drawer;
equal( viewer.getNumberOfLayers(), 3,
"3 layers should be present after adding a third layer." );
equal( viewer.getLayersCount( ), 4,
"4 layers should be present after adding a third layer." );
equal( viewer.getLevelOfLayer( layer3 ), 2,
"Layer 3 should be added with level 2." );
equal( viewer.getLevelOfLayer( layer2 ), 1,
@ -125,7 +120,7 @@
viewer.open( '/test/data/testpattern.dzi' );
});
asyncTest( 'Collections as layers', function() {
asyncTest( 'Sequences as layers', function() {
var options = {
tileSource: [{
@ -151,8 +146,7 @@
viewer.addHandler( "add-layer-failed",
function addLayerFailedHandler( event ) {
viewer.removeHandler( "add-layer-failed", addLayerFailedHandler );
equal( event.message, "Collections can not be added as layers." );
equal( event.message, "Sequences can not be added as layers." );
equal( event.options, options, "Layer failed event should give the options." );
start();
} );
@ -161,4 +155,108 @@
});
viewer.open( '/test/data/testpattern.dzi' );
});
asyncTest( 'Reassign base layer', function() {
var options = {
tileSource: {
type: 'legacy-image-pyramid',
levels: [ {
url: "data/A.png",
width: 1000,
height: 1000
} ]
},
level: 0
};
viewer.addHandler( "open", function openHandler( ) {
viewer.removeHandler( "open", openHandler );
var testPatternDrawer = viewer.drawer;
equal( viewer.drawer, testPatternDrawer, "Viewer.drawer should be set to testPatternDrawer." );
viewer.addHandler( "add-layer", function addLayerHandler( event ) {
viewer.removeHandler( "add-layer", addLayerHandler );
var aDrawer = event.drawer;
equal( viewer.drawer, aDrawer, "Viewer.drawer should be set to aDrawer." );
viewer.setLayerLevel( aDrawer, 1 );
equal( viewer.drawer, testPatternDrawer, "Viewer.drawer should be set back to testPatternDrawer." );
start( );
} );
viewer.addLayer( options );
} );
viewer.open( '/test/data/testpattern.dzi' );
} );
asyncTest( 'Layers and sequences', function() {
expect( 1 );
// TODO: Remove workaround when issue #321 is fixed.
// https://github.com/openseadragon/openseadragon/issues/321
// viewer.open( [{
// type: 'legacy-image-pyramid',
// levels: [ {
// url: "data/A.png",
// width: 1000,
// height: 1000
// }]
// },
// {
// type: 'legacy-image-pyramid',
// levels: [ {
// url: "data/BBlue.png",
// width: 1000,
// height: 1000
// }]}] );
viewer.close();
viewer = OpenSeadragon( {
id: 'layersexample',
prefixUrl: '/build/openseadragon/images/',
springStiffness: 100, // Faster animation = faster tests
tileSources: [ {
type: 'legacy-image-pyramid',
levels: [ {
url: "data/A.png",
width: 1000,
height: 1000
} ]
},
{
type: 'legacy-image-pyramid',
levels: [ {
url: "data/BBlue.png",
width: 1000,
height: 1000
} ] } ]
} );
// End workaround
var options = {
tileSource: {
type: 'legacy-image-pyramid',
levels: [ {
url: "data/CCyan.png",
width: 1000,
height: 1000
} ]
}
};
viewer.addHandler( "open", function openHandler() {
viewer.addHandler( "add-layer", function addLayerHandler( event ) {
viewer.removeHandler( "add-layer", addLayerHandler );
var layer = event.drawer;
try {
viewer.setLayerLevel( layer, 0 );
} catch (e) {
ok( true );
}
start();
} );
viewer.addLayer( options );
});
});
})();