mirror of
https://github.com/openseadragon/openseadragon.git
synced 2024-11-21 20:56:09 +03:00
Merge pull request #2582 from BeebBenjamin/2576-overlay-wrapping
Fixed: removeChild on Node
This commit is contained in:
Ian Gilman
GitHub
commit
53e56932bd
@ -128,9 +128,17 @@
|
||||
};
|
||||
}
|
||||
|
||||
this.elementWrapper = document.createElement('div');
|
||||
this.element = options.element;
|
||||
this.element.innerHTML = "<div>" + this.element.innerHTML + "</div>";
|
||||
this.style = options.element.style;
|
||||
this.elementWrapper.appendChild(this.element);
|
||||
|
||||
if (this.element.id) {
|
||||
this.elementWrapper.id = "overlay-wrapper-" + this.element.id;
|
||||
} else {
|
||||
this.elementWrapper.id = "overlay-wrapper";
|
||||
}
|
||||
|
||||
this.style = this.elementWrapper.style;
|
||||
this._init(options);
|
||||
};
|
||||
|
||||
@ -197,7 +205,7 @@
|
||||
* @function
|
||||
*/
|
||||
destroy: function() {
|
||||
var element = this.element;
|
||||
var element = this.elementWrapper;
|
||||
var style = this.style;
|
||||
|
||||
if (element.parentNode) {
|
||||
@ -242,7 +250,7 @@
|
||||
* @param {Element} container
|
||||
*/
|
||||
drawHTML: function(container, viewport) {
|
||||
var element = this.element;
|
||||
var element = this.elementWrapper;
|
||||
if (element.parentNode !== container) {
|
||||
//save the source parent for later if we need it
|
||||
element.prevElementParent = element.parentNode;
|
||||
@ -253,7 +261,7 @@
|
||||
this.style.position = "absolute";
|
||||
// this.size is used by overlays which don't get scaled in at
|
||||
// least one direction when this.checkResize is set to false.
|
||||
this.size = $.getElementSize(element);
|
||||
this.size = $.getElementSize(this.elementWrapper);
|
||||
}
|
||||
var positionAndSize = this._getOverlayPositionAndSize(viewport);
|
||||
var position = positionAndSize.position;
|
||||
@ -270,15 +278,15 @@
|
||||
this.onDraw(position, size, this.element);
|
||||
} else {
|
||||
var style = this.style;
|
||||
var innerElement = element.firstChild;
|
||||
var innerStyle = innerElement.style;
|
||||
var innerStyle = this.element.style;
|
||||
innerStyle.display = "block";
|
||||
style.left = position.x + "px";
|
||||
style.top = position.y + "px";
|
||||
if (this.width !== null) {
|
||||
style.width = size.x + "px";
|
||||
innerStyle.width = size.x + "px";
|
||||
}
|
||||
if (this.height !== null) {
|
||||
style.height = size.y + "px";
|
||||
innerStyle.height = size.y + "px";
|
||||
}
|
||||
var transformOriginProp = $.getCssPropertyWithVendorPrefix(
|
||||
'transformOrigin');
|
||||
@ -303,7 +311,7 @@
|
||||
style[transformProp] = "";
|
||||
}
|
||||
}
|
||||
style.display = 'block';
|
||||
style.display = 'flex';
|
||||
}
|
||||
},
|
||||
|
||||
@ -355,7 +363,7 @@
|
||||
}
|
||||
if (this.checkResize &&
|
||||
(this.width === null || this.height === null)) {
|
||||
var eltSize = this.size = $.getElementSize(this.element);
|
||||
var eltSize = this.size = $.getElementSize(this.elementWrapper);
|
||||
if (this.width === null) {
|
||||
width = eltSize.x;
|
||||
}
|
||||
|
||||
@ -254,10 +254,10 @@
|
||||
|
||||
var expPosition = viewport.imageToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(13, 120));
|
||||
var actPosition = $("#overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("overlay").position, true);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Y position mismatch " + contextMessage);
|
||||
|
||||
var zoom = viewport.viewportToImageZoom(viewport.getZoom(true));
|
||||
@ -271,10 +271,10 @@
|
||||
|
||||
expPosition = viewport.imageToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(400, 500));
|
||||
actPosition = $("#fixed-overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
actPosition = viewport.pixelFromPoint(viewer.getOverlayById("fixed-overlay").position, true);;
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"Fixed overlay X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Fixed overlay Y position mismatch " + contextMessage);
|
||||
|
||||
Util.assessNumericValue(assert, $("#fixed-overlay").width(), 70, epsilon,
|
||||
@ -326,10 +326,10 @@
|
||||
|
||||
var expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.2, 0.1));
|
||||
var actPosition = $("#overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("overlay").position, true);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Y position mismatch " + contextMessage);
|
||||
|
||||
var expectedSize = viewport.deltaPixelsFromPoints(
|
||||
@ -342,10 +342,10 @@
|
||||
|
||||
expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.5, 0.6));
|
||||
actPosition = $("#fixed-overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
actPosition = viewport.pixelFromPoint(viewer.getOverlayById("fixed-overlay").position, true);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"Fixed overlay X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Fixed overlay Y position mismatch " + contextMessage);
|
||||
|
||||
Util.assessNumericValue(assert, $("#fixed-overlay").width(), 70, epsilon,
|
||||
@ -402,10 +402,10 @@
|
||||
|
||||
var expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.2, 0.1));
|
||||
var actPosition = $("#overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("overlay").position, true);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Y position mismatch " + contextMessage);
|
||||
}
|
||||
|
||||
@ -415,10 +415,11 @@
|
||||
var expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.5, 0.6))
|
||||
.plus(expectedOffset);
|
||||
var actPosition = $("#fixed-overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("fixed-overlay").position, true).plus(expectedOffset);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"Fixed overlay X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Fixed overlay Y position mismatch " + contextMessage);
|
||||
}
|
||||
|
||||
@ -481,10 +482,10 @@
|
||||
var expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.5, 0.6))
|
||||
.plus(expectedOffset);
|
||||
var actPosition = $("#fixed-overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("fixed-overlay").position, true).plus(expectedOffset);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"Fixed overlay X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Fixed overlay Y position mismatch " + contextMessage);
|
||||
}
|
||||
|
||||
@ -536,10 +537,10 @@
|
||||
var expPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.5, 0.6))
|
||||
.plus(expectedOffset);
|
||||
var actPosition = $("#fixed-overlay").position();
|
||||
Util.assessNumericValue(assert, actPosition.left, expPosition.x, epsilon,
|
||||
var actPosition = viewport.pixelFromPoint(viewer.getOverlayById("fixed-overlay").position, true).plus(expectedOffset);
|
||||
Util.assessNumericValue(assert, actPosition.x, expPosition.x, epsilon,
|
||||
"Fixed overlay X position mismatch " + contextMessage);
|
||||
Util.assessNumericValue(assert, actPosition.top, expPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actPosition.y, expPosition.y, epsilon,
|
||||
"Fixed overlay Y position mismatch " + contextMessage);
|
||||
}
|
||||
|
||||
@ -789,10 +790,10 @@
|
||||
var expectedPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(1, 1))
|
||||
.minus(expectedSize);
|
||||
var actualPosition = $overlay.position();
|
||||
Util.assessNumericValue(assert, actualPosition.left, expectedPosition.x, epsilon,
|
||||
var actualPosition = viewport.pixelFromPoint(viewer.getOverlayById("fully-scaled-overlay").position, true).minus(expectedSize);
|
||||
Util.assessNumericValue(assert, actualPosition.x, expectedPosition.x, epsilon,
|
||||
"Scaled overlay position.x should adjust to rotation.");
|
||||
Util.assessNumericValue(assert, actualPosition.top, expectedPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actualPosition.y, expectedPosition.y, epsilon,
|
||||
"Scaled overlay position.y should adjust to rotation.");
|
||||
|
||||
var actualWidth = $overlay.width();
|
||||
@ -851,10 +852,10 @@
|
||||
var expectedPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0.5, 0.5))
|
||||
.minus(new OpenSeadragon.Point(expectedWidth / 2, notScaledHeight / 2));
|
||||
var actualPosition = $overlay.position();
|
||||
Util.assessNumericValue(assert, actualPosition.left, expectedPosition.x, epsilon,
|
||||
var actualPosition = viewport.pixelFromPoint(viewer.getOverlayById("horizontally-scaled-overlay").position, true).minus(new OpenSeadragon.Point(expectedWidth / 2, notScaledHeight / 2));
|
||||
Util.assessNumericValue(assert, actualPosition.x, expectedPosition.x, epsilon,
|
||||
"Horizontally scaled overlay position.x should adjust to rotation.");
|
||||
Util.assessNumericValue(assert, actualPosition.top, expectedPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actualPosition.y, expectedPosition.y, epsilon,
|
||||
"Horizontally scaled overlay position.y should adjust to rotation.");
|
||||
|
||||
var actualWidth = $overlay.width();
|
||||
@ -914,10 +915,10 @@
|
||||
var expectedPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(0, 0.5))
|
||||
.minus(new OpenSeadragon.Point(0, expectedHeight / 2));
|
||||
var actualPosition = $overlay.position();
|
||||
Util.assessNumericValue(assert, actualPosition.left, expectedPosition.x, epsilon,
|
||||
var actualPosition= viewport.pixelFromPoint(viewer.getOverlayById("vertically-scaled-overlay").position).minus(new OpenSeadragon.Point(0, expectedHeight / 2));
|
||||
Util.assessNumericValue(assert, actualPosition.x, expectedPosition.x, epsilon,
|
||||
"Vertically scaled overlay position.x should adjust to rotation.");
|
||||
Util.assessNumericValue(assert, actualPosition.top, expectedPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actualPosition.y, expectedPosition.y, epsilon,
|
||||
"Vertically scaled overlay position.y should adjust to rotation.");
|
||||
|
||||
var actualWidth = $overlay.width();
|
||||
@ -975,10 +976,10 @@
|
||||
var expectedPosition = viewport.viewportToViewerElementCoordinates(
|
||||
new OpenSeadragon.Point(1, 0))
|
||||
.minus(new OpenSeadragon.Point(notScaledWidth, 0));
|
||||
var actualPosition = $overlay.position();
|
||||
Util.assessNumericValue(assert, actualPosition.left, expectedPosition.x, epsilon,
|
||||
var actualPosition= viewport.pixelFromPoint(viewer.getOverlayById("not-scaled-overlay").position).minus(new OpenSeadragon.Point(notScaledWidth, 0));
|
||||
Util.assessNumericValue(assert, actualPosition.x, expectedPosition.x, epsilon,
|
||||
"Not scaled overlay position.x should adjust to rotation.");
|
||||
Util.assessNumericValue(assert, actualPosition.top, expectedPosition.y, epsilon,
|
||||
Util.assessNumericValue(assert, actualPosition.y, expectedPosition.y, epsilon,
|
||||
"Not scaled overlay position.y should adjust to rotation.");
|
||||
|
||||
var actualWidth = $overlay.width();
|
||||
@ -1060,6 +1061,28 @@
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// ----------
|
||||
QUnit.test('Remove Child from Overlay', function(assert){
|
||||
var done = assert.async();
|
||||
viewer = OpenSeadragon({
|
||||
id: 'example-overlays',
|
||||
prefixUrl: '/build/openseadragon/images/',
|
||||
tileSources: '/test/data/testpattern.dzi'
|
||||
});
|
||||
|
||||
viewer.addOnceHandler('open', function() {
|
||||
var $overlay = document.createElement("div");
|
||||
var something = document.createElement("p");
|
||||
$overlay.appendChild(something);
|
||||
viewer.addOverlay($overlay);
|
||||
$overlay.removeChild(something);
|
||||
something.innerHTML = '...';
|
||||
assert.equal(something.innerHTML, '...');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
// ----------
|
||||
QUnit.test('Fully scaled overlay rotation mode EXACT', function(assert) {
|
||||
var done = assert.async();
|
||||
@ -1082,7 +1105,6 @@
|
||||
|
||||
viewer.addOnceHandler('open', function() {
|
||||
var viewport = viewer.viewport;
|
||||
|
||||
var $overlay = $("#fully-scaled-overlay");
|
||||
var expectedSize = viewport.deltaPixelsFromPointsNoRotate(
|
||||
new OpenSeadragon.Point(1, 1));
|
||||
@ -1090,7 +1112,7 @@
|
||||
new OpenSeadragon.Point(1, 1))
|
||||
.minus(expectedSize);
|
||||
// We can't rely on jQuery.position with transforms.
|
||||
var actualStyle = $overlay.get(0).style;
|
||||
var actualStyle= viewer.getOverlayById("fully-scaled-overlay").style;
|
||||
var left = Number(actualStyle.left.replace("px", ""));
|
||||
var top = Number(actualStyle.top.replace("px", ""));
|
||||
Util.assessNumericValue(assert, left, expectedPosition.x, epsilon,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user