2012-03-09 20:04:28 +04:00
|
|
|
(function( $ ){
|
|
|
|
|
|
|
|
//id hash for private properties;
|
|
|
|
var THIS = {};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @class
|
|
|
|
*/
|
|
|
|
$.ControlDock = function( options ){
|
|
|
|
var layouts = [ 'topleft', 'topright', 'bottomright', 'bottomleft'],
|
|
|
|
layout,
|
|
|
|
i;
|
|
|
|
|
|
|
|
$.extend( true, this, {
|
|
|
|
id: 'controldock-'+(+new Date())+'-'+Math.floor(Math.random()*1000000),
|
2012-03-16 19:36:28 +04:00
|
|
|
container: $.makeNeutralElement('form'),
|
2012-03-09 20:04:28 +04:00
|
|
|
controls: []
|
|
|
|
}, options );
|
|
|
|
|
|
|
|
if( this.element ){
|
|
|
|
this.element = $.getElement( this.element );
|
|
|
|
this.element.appendChild( this.container );
|
|
|
|
this.element.style.position = 'relative';
|
|
|
|
this.container.style.width = '100%';
|
|
|
|
this.container.style.height = '100%';
|
|
|
|
}
|
|
|
|
|
|
|
|
for( i = 0; i < layouts.length; i++ ){
|
|
|
|
layout = layouts[ i ];
|
|
|
|
this.controls[ layout ] = $.makeNeutralElement( "div" );
|
|
|
|
this.controls[ layout ].style.position = 'absolute';
|
|
|
|
if ( layout.match( 'left' ) ){
|
|
|
|
this.controls[ layout ].style.left = '0px';
|
|
|
|
}
|
|
|
|
if ( layout.match( 'right' ) ){
|
|
|
|
this.controls[ layout ].style.right = '0px';
|
|
|
|
}
|
|
|
|
if ( layout.match( 'top' ) ){
|
|
|
|
this.controls[ layout ].style.top = '0px';
|
|
|
|
}
|
|
|
|
if ( layout.match( 'bottom' ) ){
|
|
|
|
this.controls[ layout ].style.bottom = '0px';
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
this.container.appendChild( this.controls.topleft );
|
|
|
|
this.container.appendChild( this.controls.topright );
|
|
|
|
this.container.appendChild( this.controls.bottomright );
|
|
|
|
this.container.appendChild( this.controls.bottomleft );
|
|
|
|
};
|
|
|
|
|
|
|
|
$.ControlDock.prototype = {
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
*/
|
|
|
|
addControl: function ( element, anchor ) {
|
|
|
|
var element = $.getElement( element ),
|
|
|
|
div = null;
|
|
|
|
|
|
|
|
if ( getControlIndex( this, element ) >= 0 ) {
|
|
|
|
return; // they're trying to add a duplicate control
|
|
|
|
}
|
|
|
|
|
|
|
|
switch ( anchor ) {
|
|
|
|
case $.ControlAnchor.TOP_RIGHT:
|
|
|
|
div = this.controls.topright;
|
|
|
|
element.style.position = "relative";
|
|
|
|
element.style.marginRight = "4px";
|
|
|
|
element.style.marginTop = "4px";
|
|
|
|
break;
|
|
|
|
case $.ControlAnchor.BOTTOM_RIGHT:
|
|
|
|
div = this.controls.bottomright;
|
|
|
|
element.style.position = "relative";
|
|
|
|
element.style.marginRight = "4px";
|
|
|
|
element.style.marginBottom = "4px";
|
|
|
|
break;
|
|
|
|
case $.ControlAnchor.BOTTOM_LEFT:
|
|
|
|
div = this.controls.bottomleft;
|
|
|
|
element.style.position = "relative";
|
|
|
|
element.style.marginLeft = "4px";
|
|
|
|
element.style.marginBottom = "4px";
|
|
|
|
break;
|
|
|
|
case $.ControlAnchor.TOP_LEFT:
|
|
|
|
div = this.controls.topleft;
|
|
|
|
element.style.position = "relative";
|
|
|
|
element.style.marginLeft = "4px";
|
|
|
|
element.style.marginTop = "4px";
|
|
|
|
break;
|
|
|
|
case $.ControlAnchor.NONE:
|
|
|
|
default:
|
|
|
|
div = this.container;
|
|
|
|
element.style.margin = "0px";
|
|
|
|
element.style.padding = "0px";
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.controls.push(
|
|
|
|
new $.Control( element, anchor, div )
|
|
|
|
);
|
|
|
|
element.style.display = "inline-block";
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @function
|
2012-04-11 01:02:24 +04:00
|
|
|
* @return {OpenSeadragon.ControlDock} Chainable.
|
2012-03-09 20:04:28 +04:00
|
|
|
*/
|
|
|
|
removeControl: function ( element ) {
|
|
|
|
var element = $.getElement( element ),
|
|
|
|
i = getControlIndex( this, element );
|
|
|
|
|
|
|
|
if ( i >= 0 ) {
|
|
|
|
this.controls[ i ].destroy();
|
|
|
|
this.controls.splice( i, 1 );
|
|
|
|
}
|
|
|
|
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @function
|
2012-04-11 01:02:24 +04:00
|
|
|
* @return {OpenSeadragon.ControlDock} Chainable.
|
2012-03-09 20:04:28 +04:00
|
|
|
*/
|
|
|
|
clearControls: function () {
|
|
|
|
while ( this.controls.length > 0 ) {
|
|
|
|
this.controls.pop().destroy();
|
|
|
|
}
|
|
|
|
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
* @return {Boolean}
|
|
|
|
*/
|
|
|
|
areControlsEnabled: function () {
|
|
|
|
var i;
|
|
|
|
|
|
|
|
for ( i = this.controls.length - 1; i >= 0; i-- ) {
|
|
|
|
if ( this.controls[ i ].isVisible() ) {
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @function
|
2012-04-11 01:02:24 +04:00
|
|
|
* @return {OpenSeadragon.ControlDock} Chainable.
|
2012-03-09 20:04:28 +04:00
|
|
|
*/
|
|
|
|
setControlsEnabled: function( enabled ) {
|
|
|
|
var i;
|
|
|
|
|
|
|
|
for ( i = this.controls.length - 1; i >= 0; i-- ) {
|
|
|
|
this.controls[ i ].setVisible( enabled );
|
|
|
|
}
|
|
|
|
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
///////////////////////////////////////////////////////////////////////////////
|
|
|
|
// Utility methods
|
|
|
|
///////////////////////////////////////////////////////////////////////////////
|
|
|
|
function getControlIndex( dock, element ) {
|
|
|
|
var controls = dock.controls,
|
|
|
|
i;
|
|
|
|
|
|
|
|
for ( i = controls.length - 1; i >= 0; i-- ) {
|
|
|
|
if ( controls[ i ].element == element ) {
|
|
|
|
return i;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return -1;
|
|
|
|
};
|
|
|
|
|
|
|
|
}( OpenSeadragon ));
|