1 files changed, 101 insertions, 0 deletions
diff --git a/www/wiki/resources/src/mediawiki/mediawiki.viewport.js b/www/wiki/resources/src/mediawiki/mediawiki.viewport.js
new file mode 100644
index 00000000..b453ac8d
--- /dev/null
+++ b/www/wiki/resources/src/mediawiki/mediawiki.viewport.js
@@ -0,0 +1,101 @@
+( function ( mw, $ ) {
+	'use strict';
+
+	/**
+	 * Utility library for viewport-related functions
+	 *
+	 * Notable references:
+	 * - https://github.com/tuupola/jquery_lazyload
+	 * - https://github.com/luis-almeida/unveil
+	 *
+	 * @class mw.viewport
+	 * @singleton
+	 */
+	var viewport = {
+
+		/**
+		 * This is a private method pulled inside the module for testing purposes.
+		 *
+		 * @ignore
+		 * @private
+		 * @return {Object} Viewport positions
+		 */
+		makeViewportFromWindow: function () {
+			var $window = $( window ),
+				scrollTop = $window.scrollTop(),
+				scrollLeft = $window.scrollLeft();
+
+			return {
+				top: scrollTop,
+				left: scrollLeft,
+				right: scrollLeft + $window.width(),
+				bottom: ( window.innerHeight ? window.innerHeight : $window.height() ) + scrollTop
+			};
+		},
+
+		/**
+		 * Check if any part of a given element is in a given viewport
+		 *
+		 * @method
+		 * @param {HTMLElement} el Element that's being tested
+		 * @param {Object} [rectangle] Viewport to test against; structured as such:
+		 *
+		 *	var rectangle = {
+		 *		top: topEdge,
+		 *		left: leftEdge,
+		 *		right: rightEdge,
+		 *		bottom: bottomEdge
+		 *	}
+		 *	Defaults to viewport made from `window`.
+		 *
+		 * @return {boolean}
+		 */
+		isElementInViewport: function ( el, rectangle ) {
+			var $el = $( el ),
+				offset = $el.offset(),
+				rect = {
+					height: $el.height(),
+					width: $el.width(),
+					top: offset.top,
+					left: offset.left
+				},
+				viewport = rectangle || this.makeViewportFromWindow();
+
+			return (
+				// Top border must be above viewport's bottom
+				( viewport.bottom >= rect.top ) &&
+				// Left border must be before viewport's right border
+				( viewport.right >= rect.left ) &&
+				// Bottom border must be below viewport's top
+				( viewport.top <= rect.top + rect.height ) &&
+				// Right border must be after viewport's left border
+				( viewport.left <= rect.left + rect.width )
+			);
+		},
+
+		/**
+		 * Check if an element is a given threshold away in any direction from a given viewport
+		 *
+		 * @method
+		 * @param {HTMLElement} el Element that's being tested
+		 * @param {number} [threshold] Pixel distance considered "close". Must be a positive number.
+		 *  Defaults to 50.
+		 * @param {Object} [rectangle] Viewport to test against.
+		 *  Defaults to viewport made from `window`.
+		 * @return {boolean}
+		 */
+		isElementCloseToViewport: function ( el, threshold, rectangle ) {
+			var viewport = rectangle ? $.extend( {}, rectangle ) : this.makeViewportFromWindow();
+			threshold = threshold || 50;
+
+			viewport.top -= threshold;
+			viewport.left -= threshold;
+			viewport.right += threshold;
+			viewport.bottom += threshold;
+			return this.isElementInViewport( el, viewport );
+		}
+
+	};
+
+	mw.viewport = viewport;
+}( mediaWiki, jQuery ) );