2013-05-01 08:46:16 +04:00
|
|
|
/*
|
2013-05-14 08:00:24 +04:00
|
|
|
* OpenSeadragon - Overlay
|
2013-05-01 08:46:16 +04:00
|
|
|
*
|
|
|
|
* Copyright (C) 2009 CodePlex Foundation
|
2013-05-14 07:32:09 +04:00
|
|
|
* Copyright (C) 2010-2013 OpenSeadragon contributors
|
2013-05-01 08:46:16 +04:00
|
|
|
*
|
|
|
|
* Redistribution and use in source and binary forms, with or without
|
|
|
|
* modification, are permitted provided that the following conditions are
|
|
|
|
* met:
|
|
|
|
*
|
|
|
|
* - Redistributions of source code must retain the above copyright notice,
|
|
|
|
* this list of conditions and the following disclaimer.
|
|
|
|
*
|
|
|
|
* - Redistributions in binary form must reproduce the above copyright
|
|
|
|
* notice, this list of conditions and the following disclaimer in the
|
|
|
|
* documentation and/or other materials provided with the distribution.
|
|
|
|
*
|
|
|
|
* - Neither the name of CodePlex Foundation nor the names of its
|
|
|
|
* contributors may be used to endorse or promote products derived from
|
|
|
|
* this software without specific prior written permission.
|
|
|
|
*
|
|
|
|
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
|
|
|
* "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
|
|
|
* LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
|
|
|
* A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
|
|
|
* OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
|
|
|
* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
|
|
|
|
* TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
|
|
|
|
* PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
|
|
|
|
* LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
|
|
|
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
|
|
|
|
* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
|
|
|
*/
|
|
|
|
|
2011-12-06 07:50:25 +04:00
|
|
|
(function( $ ){
|
|
|
|
|
2012-01-25 23:14:02 +04:00
|
|
|
/**
|
|
|
|
* An enumeration of positions that an overlay may be assigned relative
|
|
|
|
* to the viewport including CENTER, TOP_LEFT (default), TOP, TOP_RIGHT,
|
|
|
|
* RIGHT, BOTTOM_RIGHT, BOTTOM, BOTTOM_LEFT, and LEFT.
|
|
|
|
* @static
|
|
|
|
*/
|
2011-12-14 02:38:36 +04:00
|
|
|
$.OverlayPlacement = {
|
2012-01-24 07:48:45 +04:00
|
|
|
CENTER: 0,
|
|
|
|
TOP_LEFT: 1,
|
|
|
|
TOP: 2,
|
|
|
|
TOP_RIGHT: 3,
|
|
|
|
RIGHT: 4,
|
2011-12-14 02:38:36 +04:00
|
|
|
BOTTOM_RIGHT: 5,
|
2012-01-24 07:48:45 +04:00
|
|
|
BOTTOM: 6,
|
|
|
|
BOTTOM_LEFT: 7,
|
|
|
|
LEFT: 8
|
2011-12-14 02:38:36 +04:00
|
|
|
};
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2012-01-25 23:14:02 +04:00
|
|
|
/**
|
2013-06-19 21:33:25 +04:00
|
|
|
* An Overlay provides a
|
2012-01-25 23:14:02 +04:00
|
|
|
* @class
|
|
|
|
*/
|
2012-02-02 01:56:04 +04:00
|
|
|
$.Overlay = function( element, location, placement ) {
|
2012-03-16 19:36:28 +04:00
|
|
|
this.element = element;
|
2011-12-30 02:14:42 +04:00
|
|
|
this.scales = location instanceof $.Rect;
|
|
|
|
this.bounds = new $.Rect(
|
2013-06-19 21:33:25 +04:00
|
|
|
location.x,
|
2011-12-30 02:14:42 +04:00
|
|
|
location.y,
|
2013-06-19 21:33:25 +04:00
|
|
|
location.width,
|
2012-01-24 07:48:45 +04:00
|
|
|
location.height
|
|
|
|
);
|
2011-12-30 02:14:42 +04:00
|
|
|
this.position = new $.Point(
|
2013-06-19 21:33:25 +04:00
|
|
|
location.x,
|
2011-12-30 02:14:42 +04:00
|
|
|
location.y
|
|
|
|
);
|
|
|
|
this.size = new $.Point(
|
2013-06-19 21:33:25 +04:00
|
|
|
location.width,
|
2011-12-30 02:14:42 +04:00
|
|
|
location.height
|
|
|
|
);
|
2012-02-02 01:56:04 +04:00
|
|
|
this.style = element.style;
|
2011-12-14 02:38:36 +04:00
|
|
|
// rects are always top-left
|
2013-06-19 21:33:25 +04:00
|
|
|
this.placement = location instanceof $.Point ?
|
|
|
|
placement :
|
|
|
|
$.OverlayPlacement.TOP_LEFT;
|
2011-12-14 02:38:36 +04:00
|
|
|
};
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2011-12-14 02:38:36 +04:00
|
|
|
$.Overlay.prototype = {
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2012-02-15 23:50:27 +04:00
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
* @param {OpenSeadragon.OverlayPlacement} position
|
|
|
|
* @param {OpenSeadragon.Point} size
|
|
|
|
*/
|
2012-01-24 07:48:45 +04:00
|
|
|
adjust: function( position, size ) {
|
|
|
|
switch ( this.placement ) {
|
2011-12-14 02:38:36 +04:00
|
|
|
case $.OverlayPlacement.TOP_LEFT:
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.TOP:
|
|
|
|
position.x -= size.x / 2;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.TOP_RIGHT:
|
|
|
|
position.x -= size.x;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.RIGHT:
|
|
|
|
position.x -= size.x;
|
|
|
|
position.y -= size.y / 2;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.BOTTOM_RIGHT:
|
|
|
|
position.x -= size.x;
|
|
|
|
position.y -= size.y;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.BOTTOM:
|
|
|
|
position.x -= size.x / 2;
|
|
|
|
position.y -= size.y;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.BOTTOM_LEFT:
|
|
|
|
position.y -= size.y;
|
|
|
|
break;
|
|
|
|
case $.OverlayPlacement.LEFT:
|
|
|
|
position.y -= size.y / 2;
|
|
|
|
break;
|
|
|
|
default:
|
2013-01-29 21:32:58 +04:00
|
|
|
case $.OverlayPlacement.CENTER:
|
2011-12-14 02:38:36 +04:00
|
|
|
position.x -= size.x / 2;
|
|
|
|
position.y -= size.y / 2;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
},
|
2012-01-24 07:48:45 +04:00
|
|
|
|
2012-02-15 23:50:27 +04:00
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
*/
|
2011-12-14 02:38:36 +04:00
|
|
|
destroy: function() {
|
2012-02-02 01:56:04 +04:00
|
|
|
var element = this.element,
|
2012-01-24 07:48:45 +04:00
|
|
|
style = this.style;
|
2011-12-14 02:38:36 +04:00
|
|
|
|
2012-01-24 07:48:45 +04:00
|
|
|
if ( element.parentNode ) {
|
|
|
|
element.parentNode.removeChild( element );
|
2013-02-11 07:53:51 +04:00
|
|
|
//this should allow us to preserve overlays when required between
|
|
|
|
//pages
|
|
|
|
if( element.prevElementParent ){
|
|
|
|
style.display = 'none';
|
2013-06-19 21:33:25 +04:00
|
|
|
//element.prevElementParent.insertBefore(
|
2013-02-11 07:53:51 +04:00
|
|
|
// element,
|
|
|
|
// element.prevNextSibling
|
|
|
|
//);
|
|
|
|
document.body.appendChild( element );
|
|
|
|
}
|
2011-12-14 02:38:36 +04:00
|
|
|
}
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2011-12-14 02:38:36 +04:00
|
|
|
style.top = "";
|
|
|
|
style.left = "";
|
|
|
|
style.position = "";
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2012-01-24 07:48:45 +04:00
|
|
|
if ( this.scales ) {
|
2011-12-14 02:38:36 +04:00
|
|
|
style.width = "";
|
|
|
|
style.height = "";
|
|
|
|
}
|
|
|
|
},
|
2012-01-24 07:48:45 +04:00
|
|
|
|
2012-02-15 23:50:27 +04:00
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
* @param {Element} container
|
|
|
|
*/
|
2011-12-30 02:14:42 +04:00
|
|
|
drawHTML: function( container ) {
|
2012-02-02 01:56:04 +04:00
|
|
|
var element = this.element,
|
2011-12-30 02:14:42 +04:00
|
|
|
style = this.style,
|
|
|
|
scales = this.scales,
|
|
|
|
position,
|
|
|
|
size;
|
|
|
|
|
2012-01-24 07:48:45 +04:00
|
|
|
if ( element.parentNode != container ) {
|
2013-02-11 07:53:51 +04:00
|
|
|
//save the source parent for later if we need it
|
|
|
|
element.prevElementParent = element.parentNode;
|
|
|
|
element.prevNextSibling = element.nextSibling;
|
2012-01-24 07:48:45 +04:00
|
|
|
container.appendChild( element );
|
2011-12-14 02:38:36 +04:00
|
|
|
}
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
if ( !scales ) {
|
2012-01-24 07:48:45 +04:00
|
|
|
this.size = $.getElementSize( element );
|
2011-12-14 02:38:36 +04:00
|
|
|
}
|
2011-12-06 07:50:25 +04:00
|
|
|
|
2013-07-12 10:51:56 +04:00
|
|
|
if (this.zoomHandler) {
|
|
|
|
this.zoomHandler(this.position, this.size, element);
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
position = this.position;
|
|
|
|
size = this.size;
|
2011-12-14 02:38:36 +04:00
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
this.adjust( position, size );
|
2011-12-14 02:38:36 +04:00
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
position = position.apply( Math.floor );
|
|
|
|
size = size.apply( Math.ceil );
|
2011-12-14 02:38:36 +04:00
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
style.left = position.x + "px";
|
|
|
|
style.top = position.y + "px";
|
2011-12-14 02:38:36 +04:00
|
|
|
style.position = "absolute";
|
2013-02-11 07:53:51 +04:00
|
|
|
style.display = 'block';
|
2011-12-14 02:38:36 +04:00
|
|
|
|
2011-12-30 02:14:42 +04:00
|
|
|
if ( scales ) {
|
|
|
|
style.width = size.x + "px";
|
2011-12-14 02:38:36 +04:00
|
|
|
style.height = size.y + "px";
|
|
|
|
}
|
|
|
|
},
|
2012-01-24 07:48:45 +04:00
|
|
|
|
2012-02-15 23:50:27 +04:00
|
|
|
/**
|
|
|
|
* @function
|
|
|
|
* @param {OpenSeadragon.Point|OpenSeadragon.Rect} location
|
|
|
|
* @param {OpenSeadragon.OverlayPlacement} position
|
|
|
|
*/
|
2012-01-24 07:48:45 +04:00
|
|
|
update: function( location, placement ) {
|
|
|
|
this.scales = location instanceof $.Rect;
|
2013-06-19 21:33:25 +04:00
|
|
|
this.bounds = new $.Rect(
|
|
|
|
location.x,
|
|
|
|
location.y,
|
|
|
|
location.width,
|
2012-01-24 07:48:45 +04:00
|
|
|
location.height
|
|
|
|
);
|
2011-12-30 02:14:42 +04:00
|
|
|
// rects are always top-left
|
2012-01-24 07:48:45 +04:00
|
|
|
this.placement = location instanceof $.Point ?
|
2013-06-19 21:33:25 +04:00
|
|
|
placement :
|
|
|
|
$.OverlayPlacement.TOP_LEFT;
|
2011-12-06 07:50:25 +04:00
|
|
|
}
|
2011-12-14 02:38:36 +04:00
|
|
|
|
|
|
|
};
|
2011-12-06 07:50:25 +04:00
|
|
|
|
|
|
|
}( OpenSeadragon ));
|