5 * Utility library for viewport-related functions
8 * - https://github.com/tuupola/jquery_lazyload
9 * - https://github.com/luis-almeida/unveil
17 * This is a private method pulled inside the module for testing purposes.
22 makeViewportFromWindow: function () {
23 var $window
= $( window
),
24 scrollTop
= $window
.scrollTop(),
25 scrollLeft
= $window
.scrollLeft();
30 right
: scrollLeft
+ $window
.width(),
31 bottom
: ( window
.innerHeight
? window
.innerHeight
: $window
.height() ) + scrollTop
36 * Check if any part of a given element is in a given viewport
39 * @param {HTMLElement} el Element that's being tested
40 * @param {Object} [rectangle] Viewport to test against; structured as such:
48 * Defaults to viewport made from `window`.
52 isElementInViewport: function ( el
, rectangle
) {
54 offset
= $el
.offset(),
61 viewport
= rectangle
|| this.makeViewportFromWindow();
64 // Top border must be above viewport's bottom
65 ( viewport
.bottom
>= rect
.top
) &&
66 // Left border must be before viewport's right border
67 ( viewport
.right
>= rect
.left
) &&
68 // Bottom border must be below viewport's top
69 ( viewport
.top
<= rect
.top
+ rect
.height
) &&
70 // Right border must be after viewport's left border
71 ( viewport
.left
<= rect
.left
+ rect
.width
)
76 * Check if an element is a given threshold away in any direction from a given viewport
79 * @param {HTMLElement} el Element that's being tested
80 * @param {number} [threshold] Pixel distance considered "close". Must be a positive number.
82 * @param {Object} [rectangle] Viewport to test against.
83 * Defaults to viewport made from `window`.
86 isElementCloseToViewport: function ( el
, threshold
, rectangle
) {
87 var viewport
= rectangle
? $.extend( {}, rectangle
) : this.makeViewportFromWindow();
88 threshold
= threshold
|| 50 ;
90 viewport
.top
-= threshold
;
91 viewport
.left
-= threshold
;
92 viewport
.right
+= threshold
;
93 viewport
.bottom
+= threshold
;
94 return this.isElementInViewport( el
, viewport
);
99 mw
.viewport
= viewport
;
100 }( mediaWiki
, jQuery
) );