b6c3de1afbac6bf569d10b99e2bf7a7ec2748478
2 * To create a "drag" interaction, you typically register a mousedown event
3 * handler on the element where the drag begins. In that handler, you register a
4 * mouseup handler on the window to determine when the mouse is released,
5 * wherever that release happens. This works well, except when the user releases
6 * the mouse over an off-domain iframe. In that case, the mouseup event is
7 * handled by the iframe and never bubbles up to the window handler.
9 * To deal with this issue, we cover iframes with high z-index divs to make sure
10 * they don't capture mouseup.
13 * element.addEventListener('mousedown', function() {
14 * var tarper = new IFrameTarp();
16 * var mouseUpHandler = function() {
18 * window.removeEventListener(mouseUpHandler);
21 * window.addEventListener('mouseup', mouseUpHandler);
26 function IFrameTarp() {
27 /** @type {Array.<!HTMLDivElement>} */
32 * Find all the iframes in the document and cover them with high z-index
35 IFrameTarp
.prototype.cover
= function() {
36 var iframes
= document
.getElementsByTagName("iframe");
37 for (var i
= 0; i
< iframes
.length
; i
++) {
38 var iframe
= iframes
[i
];
39 var pos
= utils
.findPos(iframe
),
42 width
= iframe
.offsetWidth
,
43 height
= iframe
.offsetHeight
;
45 var div
= document
.createElement("div");
46 div
.style
.position
= "absolute";
47 div
.style
.left
= x
+ 'px';
48 div
.style
.top
= y
+ 'px';
49 div
.style
.width
= width
+ 'px';
50 div
.style
.height
= height
+ 'px';
51 div
.style
.zIndex
= 999;
52 document
.body
.appendChild(div
);
58 * Remove all the iframe covers. You should call this in a mouseup handler.
60 IFrameTarp
.prototype.uncover
= function() {
61 for (var i
= 0; i
< this.tarps
.length
; i
++) {
62 this.tarps
[i
].parentNode
.removeChild(this.tarps
[i
]);
67 export default IFrameTarp
;