Browse files

version 1.5.0 favors speed and simplicity. See the changelog and the …

…updated readme.
  • Loading branch information...
1 parent 64cfcda commit 508f6b9f50e9172fb00435c06147099dd2699e6d @ryanve committed Sep 14, 2012
Showing with 492 additions and 609 deletions.
  1. +5 −0 CHANGELOG.md
  2. +14 −126 README.md
  3. +2 −0 ender.js
  4. +306 −274 test.html
  5. +161 −204 verge.js
  6. +4 −5 verge.min.js
View
5 CHANGELOG.md
@@ -0,0 +1,5 @@
+# CHANGELOG | [current](https://github.com/ryanve/verge/blob/master/verge.js)
+
+## 1.5.0
+
+Major simplifications were made. All `.fn` methods were removed. ([See here.](https://github.com/ryanve/verge/issues/1)) This also allowed for the top-level `.bindVerger` and `.bridge` methods to be removed, as integration is now much more simple. See [the readme](https://github.com/ryanve/verge/blob/master/README.md). The `.noConflict` method was also removed, as this seemed rarely necessary. What we're left with is a very lightweight [static api](https://github.com/ryanve/verge/blob/master/README.md). Basically devs can decide how and if they want to implement effins, while [verge](https://github.com/ryanve/verge) simply provides the functional tools to do so.
View
140 README.md
@@ -1,74 +1,29 @@
[verge](http://github.com/ryanve/verge)
=======
-[verge](http://github.com/ryanve/verge) provides viewport utils and area filters that work as a standalone lib or as a jQuery plugin.
+[verge](http://github.com/ryanve/verge) is a compact (<1k gzipped) set of cross-browser viewport utilities—inluding the ability to detect if an element is in the current viewport. [verge](http://github.com/ryanve/verge) works as a standalone module or as a plugin.
-# Methods
+## installation
-To simplify the docs below, let `$` represent `verge` or the host lib.
-
-## chainable
-
-The effin versions of `inX` / `inY` / `inViewport` are **filters** designed for jQuery (or compatible hosts). All three use the same signature: `$(elems).inY(verge, invert)` where both params are optional:
-
-```
-@param {number=} verge is an optional cushion amount in pixels to surround the
- element in question. (default: 0)
-@param {boolean=} invert when set to true, will invert the filter. (default: false)
-```
-
-### $.fn.inViewport()
-
-Filter a matched set so that it contains only elements that are in the current viewport. An element is considered in the viewport if at least one pixel of it is in the viewport. Returns the filtered set (e.g. jQuery object).
+#### [jQuery](http://jquery.com)
```js
-$('div').inViewport() // contains div's in the viewport (exact)
-$('div').inViewport(100) // contains div's in the viewport or within 100px of it
-$('div').inViewport(-100) // contains div's in the viewport and not w/in 99px of the edge
-$('div').inViewport(0, true) // contains div's that are *not* in the viewport (exact)
+jQuery.extend(verge); // augment jQuery with methods from verge
```
-Using the standalone `verge` object, it is also possible to filter an element array (or array-like object) into a new **array** like so:
+#### [NPM](https://npmjs.org/package/verge)
-```js
-// Get array that only contains elems in the current viewport:
-verge.inViewport.call(elementArray [, verge, invert])
```
-
-### $.fn.inX()
-
-Filter a matched set so that it contains only elements that are in the current viewport. Returns the filtered set (e.g. jQuery object).
-
-```js
-$('div').inX() // contains div's in the same x-axis section as the viewport
-$('div').inX(100) // contains div's in the same x-axis section as the viewport or w/in 100px of it
-$('div').inX(0, true) // contains div's outside the y-axis section that the viewport in in (exact)
-verge.inX.call($('div')) // get *array* that contains div's in the same x-axis section as the viewport
-```
-
-### $.fn.inY()
-
-Filter a matched set so that it contains only elements that are in the current viewport. Returns the filtered set (e.g. jQuery object).
-
-```js
-$('div').inY() // contains div's in the same y-axis section as the viewport
-$('div').inY(100) // contains div's in the same y-axis section as the viewport or w/in 100px of it
-$('div').inY(0, true) // contains div's outside the y-axis section that the viewport in in (exact)
-verge.inY.call($('div')) // get *array* that contains div's in the same y-axis section as the viewport
+$ npm install verge
```
-### $.fn.rectangle()
+## API [(1.5.0)](https://github.com/ryanve/verge/blob/master/$.js#files)
-Get an element's (or the first element in a set's) rectangle **object** containing the properties `top`, `bottom`, `left`, `right`, `width`, and `height` with respect to the top-left corner of the current viewport, and with an optional verge amount.
+### notes
-```js
-$(elem).rectangle() // returns object
-$(elem, verge).rectangle() // returns object adjusted by verge
-```
-
-See full details in the docs for the top-level `$.rectangle()` method. (This is the chainable form of that.)
+In standalone usage, methods are available on the **verge** namespace: `verge.scrollY()`, ...
-## top-level
+The docs below use `$` to denote `verge` or a host lib (like jQuery).
### $.viewportW()
@@ -92,7 +47,7 @@ $.inViewport(elem, 100) // true if elem is in the current viewport or within 10
$.inViewport(elem, -100) // true if elem is in the current viewport and not within 99px of the edge
```
-If you're dealing with a page that only ever scrolls in one direction, it is slightly faster to substitute `inViewport` with `inY` or `inX`. (On pages that **never** scroll horizontally, `inX` always returns `true`. On pages that **never** scroll vertically, `inY` always returns `true`.)
+**Tip:** If you're dealing with a page that only ever scrolls in one direction, it is faster to substitute `inViewport` with `inY` or `inX`. On pages that **never** scroll horizontally, `inX` always returns `true`. On pages that **never** scroll vertically, `inY` always returns `true`. In other words, use `inY` on sites that scroll **only** vertically, and `inX` on sites that scroll **only** horizontally. If the viewport width is greater than or equal to the `document` width, then `inX` will always return `true`.
```js
$.inViewport(elem) === $.inX(elem) && $.inY(elem) // always true
@@ -129,79 +84,12 @@ $.rectangle(elem) // get elem's rectangle object
$.rectangle(elem, 100) // get elem's rectangle object adjusted by 100 pixels
```
-Most browsers round the rectangle's values to the nearest pixel. Firefox returns them as floats accurate to several decimals. I opted not to normalize this minor difference in favor of better [performance](http://jsperf.com/rectangle). Use [.toFixed()](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number/toFixed) if you need to round them.
-
-### $.bindVerger()
-
-Convert a function into a filter for the specified wrapper. It binds a filter function to a wrapper and returns the bound function. The resulting method will be [faster](http://jsperf.com/bind-verger) than manually filtering via `$.fn.filter()` or `$.fn.not()`
-
-```
-@param {function(elem [, option])} fn the function to convert
-@param {Object|function|null} wrapper the object or function to bind to (e.g. jQuery).
- (Default: `this`) If the wrapper is a function
- like the jQuery function, then the return of the
- new function would be an instanceof the wrapper.
- Otherwise the new function will return an array.
-```
-
-**Contrived example**: create a method that filters out non-square elements:
-
-```js
-$.fn.isSquare = $.bindVerger(function(elem) {
- // To pass, width must be non-zero and match height:
- var dims = $.rectangle(elem);
- return !!dims.width && dims.width === dims.height;
-});
-```
-
-Then `$.fn.isSquare` could be used like so:
-
-```js
-$('div').isSquare() // contains only divs that are square
-```
-
-The `bindVerger` method is used internally to convert the top-level boolean forms of `inX` / `inY` / `inViewport` into their corresponding effin filters. For them, the `option` parameter is utilized for the specifying the verge amount. Custom functions can utilize the `option` parameter as they see fit. The signature of the new function is like that of `$.fn.inViewport()` described above—including the abilty to invert via the second parameter. See the source for more info.
-
-
-### verge.bridge()
-
-The bridge handles the integration of methods into a host. It augments the host with the above-detailed methods. If a host is detected at runtime, the bridge will run once automatically. Existing methods on the host are **not** overwritten unless the 2nd param is set to `true`.
-
-```js
-verge.bridge(host) // integrate verge into host (existing methods are not overwritten)
-verge.bridge(host, true) // integrate verge into host (overwriting existing methods, if any)
-```
-
-```js
-verge.bridge(jQuery) // integrate verge's methods into jQuery
-verge.bridge(ender) // integrate verge's methods into ender
-```
-
-### verge.noConflict()
-
-Destroy the global `verge` and return `verge`. Optionally call a function that gets `verge` supplied as the first arg.
-
-```js
-verge.noConflict(); // simply destroys the global
-```
-
-```js
-verge.noConflict(function(verge){
- /* use verge in here */
-});
-```
+## libs that use verge
-# [AMD](https://github.com/amdjs/amdjs-api/wiki/AMD) usage
+[Response JS](https://github.com/ryanve/response.js)
-```js
-define('verge', verge.noConflict); // define the module and simultaneously destroy the global
-```
-
-```js
-define('verge', function(){ return verge; }); // define the module and keep the global too
-```
-# License
+## license
### [verge](http://github.com/ryanve/verge) is available under the [MIT license](http://en.wikipedia.org/wiki/MIT_License)
View
2 ender.js
@@ -0,0 +1,2 @@
+// bridge (integration) file for ender.no.de
+( ender.ender( require('verge') ) );
View
580 test.html
@@ -2,295 +2,327 @@
<!--[if lte IE 8]> <html class="oldie solarized" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="solarized" lang=en> <!--<![endif]-->
<head>
- <meta charset=utf-8>
- <title>Verge Test Suite</title>
- <meta name=viewport content="width=device-width,initial-scale=1.0">
- <link rel=stylesheet href="http://cdn.airve.com/css/packed/normalize_responsive_solarized.20120408.css">
- <meta name=author content="Ryan Van Etten">
- <meta name=description content="JavaScript library test suite">
- <style>
- body{margin:1em auto;max-width:100%;width:94%;padding:0 3%}
- a{text-decoration:none;cursor:pointer}
- a:not(:hover){color:#d33682}
- code .number {color:#b58900}
- html:not(.dark) ::-moz-selection{background:#ed0;color:#002b36}
- html:not(.dark) ::selection{background:#ed0;color:#002b36}
- pre,td,th{padding:1em;text-align:left;border-left:1px solid #eed}
- td{font-weight:bold;color:#2aa198}
- td:first-child{font-weight:normal;color:#586e75}
- td:last-child{color:#dc322f}
- pre{padding:1em;background:#859900;color:#fdf6e3}
- th{font-size:140%}
- #footer{margin:2em 0;border-bottom:1em solid #ffe}
- nav ul li{display:block;float:left;margin:0 0 1em}
- nav ul li a{padding:.5em;background:#cb4b16;color:#fdf6e3!important;margin:0 1px 1em 0}
- nav ul li a:hover{color:#ffe;background:#b58900}
- [accesskey=z]{visibility:hidden;width:0;height:0}
- </style>
- <!--code.google.com/p/html5shiv/ -->
- <!--[if lt IE 9]>
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
- <![endif]-->
+ <meta charset=utf-8>
+ <link rel=dns-prefetch href=//airve.github.com>
+ <title>verge // test suite</title>
+ <meta name=viewport content="width=device-width,initial-scale=1.0">
+ <link rel=stylesheet href="http://airve.github.com/css/packs/normalize_responsive_solarized.min.css">
+ <meta name=author content="Ryan Van Etten">
+ <meta name=description content="JavaScript module test page">
+ <style>
+ body{margin:1em auto;max-width:100%;width:94%;padding:0 3%}
+ a{text-decoration:none;cursor:pointer}
+ a:not(:hover){color:#d33682}
+ code .number {color:#b58900}
+ html:not(.dark) ::-moz-selection{background:#ed0;color:#002b36}
+ html:not(.dark) ::selection{background:#ed0;color:#002b36}
+ pre,td,th{padding:1em;text-align:left;border-left:1px solid #eed}
+ td{font-weight:bold;color:#2aa198}
+ td:first-child{font-weight:normal;color:#586e75}
+ td:last-child{color:#dc322f}
+ pre{padding:1em;background:#859900;color:#fdf6e3}
+ th{font-size:140%}
+ #footer{margin:2em 0;border-bottom:1em solid #ffe}
+ nav ul li{display:block;float:left;margin:0 0 1em}
+ nav ul li a{padding:.5em;background:#cb4b16;color:#fdf6e3!important;margin:0 1px 1em 0}
+ nav ul li a:hover{color:#ffe;background:#b58900}
+ [accesskey=z]{visibility:hidden;width:0;height:0}
+ .offset{display:none}
+ .update-toggle{background:#eee8d5}
+ </style>
+ <!--code.google.com/p/html5shiv/ -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
</head>
<body>
- <header id="header">
- <h1><a href="http://github.com/ryanve/verge">Verge</a> Test Suite</h1>
- </header>
-
- <pre id=ua></pre>
+ <header id="header">
+ <h1><a href="http://github.com/ryanve/verge">Verge</a> Test Suite</h1>
+ </header>
+
+ <pre id=ua></pre>
- <!--[if IE]>
- <strong>[ ! ] Tests in <abbr class=red>IE</abbr> may not work locally.</strong>
- <![endif]-->
+ <div id="a"><pre>div#a</pre></div>
+
+ <table id=tests>
+ <tr>
+ <th scope="col"><a href=#tests accesskey=s>test<br>code</a></th>
+ <th scope="col"><a href=#tests>expected<br>type</a></th>
+ <th scope="col"><a href=#tests>live<br>output</a></th>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(a, <span class=number>-100</span>)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-a-neg></code></td>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(a)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-a></code></td>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(a, <span class=number>100</span>)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-a-pos></code></td>
+ </tr>
+ <tr>
+ <td><code>$.viewportW()</code></td>
+ <td><code>number</code></td>
+ <td><code id=viewport-w></code></td>
+ </tr>
+ <tr>
+ <td><code>$.viewportH()</code></td>
+ <td><code>number</code></td>
+ <td><code id=viewport-h></code></td>
+ </tr>
+ <tr>
+ <td><code>$.scrollX()</code></td>
+ <td><code>number</code></td>
+ <td><code id=scroll-x></code></td>
+ </tr>
+ <tr>
+ <td><code>$.scrollY()</code></td>
+ <td><code>number</code></td>
+ <td><code id=scroll-y></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).top</code></td>
+ <td><code>number</code></td>
+ <td><code id=top></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).bottom</code></td>
+ <td><code>number</code></td>
+ <td><code id=bottom></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).left</code></td>
+ <td><code>number</code></td>
+ <td><code id=left></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).right</code></td>
+ <td><code>number</code></td>
+ <td><code id=right></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).width</code></td>
+ <td><code>number</code></td>
+ <td><code id=width></code></td>
+ </tr>
+ <tr>
+ <td><code>$.rectangle(a).height</code></td>
+ <td><code>number</code></td>
+ <td><code id=height></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).top</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-top></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).bottom</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-bottom></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).left</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-left></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).right</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-right></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).width</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-width></code></td>
+ </tr>
+ <tr class="offset">
+ <td><code>$.offset(a).height</code></td>
+ <td><code>number</code></td>
+ <td><code id=offset-height></code></td>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(b, <span class=number>100</span>)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-b-pos></code></td>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(b)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-b></code></td>
+ </tr>
+ <tr>
+ <td><code>$.inViewport(b, <span class=number>-100</span>)</code></td>
+ <td><code>boolean</code></td>
+ <td><code id=in-viewport-b-neg></code></td>
+ </tr>
+ </table>
+
+ <div id="b"><pre>div#b</pre></div>
+ <div id="c"><pre>div#c</pre></div>
- <div id="a"><pre>div#a</pre></div>
-
- <table id=tests>
- <tr>
- <th scope="col"><a href=#tests accesskey=s>test<br>code</a></th>
- <th scope="col"><a href=#tests>expected<br>type</a></th>
- <th scope="col"><a href=#tests>live<br>output</a></th>
- </tr>
- <tr>
- <td><code>$.inViewport(a, <span class=number>-100</span>)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-a-neg></code></td>
- </tr>
- <tr>
- <td><code>$.inViewport(a)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-a></code></td>
- </tr>
- <tr>
- <td><code>$.inViewport(a, <span class=number>100</span>)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-a-pos></code></td>
- </tr>
- <tr>
- <td><code>$.viewportW()</code></td>
- <td><code>number</code></td>
- <td><code id=viewport-w></code></td>
- </tr>
- <tr>
- <td><code>$.viewportH()</code></td>
- <td><code>number</code></td>
- <td><code id=viewport-h></code></td>
- </tr>
- <tr>
- <td><code>$.scrollX()</code></td>
- <td><code>number</code></td>
- <td><code id=scroll-x></code></td>
- </tr>
- <tr>
- <td><code>$.scrollY()</code></td>
- <td><code>number</code></td>
- <td><code id=scroll-y></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).top</code></td>
- <td><code>number</code></td>
- <td><code id=top></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).bottom</code></td>
- <td><code>number</code></td>
- <td><code id=bottom></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).left</code></td>
- <td><code>number</code></td>
- <td><code id=left></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).right</code></td>
- <td><code>number</code></td>
- <td><code id=right></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).width</code></td>
- <td><code>number</code></td>
- <td><code id=width></code></td>
- </tr>
- <tr>
- <td><code>$.rectangle(a).height</code></td>
- <td><code>number</code></td>
- <td><code id=height></code></td>
- </tr>
- <tr>
- <td><code>$a.rectangle().top === $.rectangle(a).top</code></td>
- <td><code>boolean</code></td>
- <td><code id=rectangle-compare></code></td>
- </tr>
- <tr>
- <td><code>$abc.inX().length</code></td>
- <td><code>number</code></td>
- <td><code id=in-x-filter></code></td>
- </tr>
- <tr>
- <td><code>$abc.inY().length</code></td>
- <td><code>number</code></td>
- <td><code id=in-y-filter></code></td>
- </tr>
- <tr>
- <td><code>$abc.inViewport().length</code></td>
- <td><code>number</code></td>
- <td><code id=in-viewport-filter></code></td>
- </tr>
- <tr>
- <td><code>$.fn.inViewport.call($abc).length</code></td>
- <td><code>number</code></td>
- <td><code id=in-viewport-call></code></td>
- </tr>
- <tr>
- <td><code>$.inViewport(b, <span class=number>100</span>)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-b-pos></code></td>
- </tr>
- <tr>
- <td><code>$.inViewport(b)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-b></code></td>
- </tr>
- <tr>
- <td><code>$.inViewport(b, <span class=number>-100</span>)</code></td>
- <td><code>boolean</code></td>
- <td><code id=in-viewport-b-neg></code></td>
- </tr>
- </table>
-
- <div id="b"><pre>div#b</pre></div>
- <div id="c"><pre>div#c</pre></div>
+ <footer id="footer">
+ <nav>
+ <ul>
+ <li><a href="#header" title="up" accesskey=a><span class=shape>&#9650;</span></a>
+ <li><a href="https://github.com/ryanve/verge" title="view repo" accesskey=1>Github</a>
+ <li><a href="https://github.com/ryanve/verge/issues" title="report an issue" accesskey=9>Issue?</a>
+ <li><a href="#footer" title="down" accesskey=z>&#9660;</a>
+ </ul>
+ </nav>
- <footer id="footer">
- <nav>
- <ul>
- <li><a href="#header" title="up" accesskey=a><span class=shape>&#9650;</span></a>
- <li><a href="https://github.com/ryanve/verge" title="view repo" accesskey=1>Github</a>
- <li><a href="https://github.com/ryanve/verge/issues" title="report an issue" accesskey=9>Issue?</a>
- <li><a href="#footer" title="down" accesskey=z>&#9660;</a>
- </ul>
- </nav>
+ </footer>
- </footer>
+ <!-- accesskeys:
+ 1: homepage
+ a: jump to top
+ z: jump to bottom
+ s: skip to main content
+ -->
+
+ <!--<a id="toggle" title="Toggle styles" accesskey="2">&#0926;</a>-->
- <!-- accesskeys:
- 1: homepage
- a: jump to top
- z: jump to bottom
- s: skip to main content
- -->
+ <!-- Other libraries to test integration with:
+ http://airve.github.com/js/jeesh/jeesh.min.js
+ http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
+ -->
+ <script src="http://airve.github.com/js/elo/elo.min.js"></script>
+ <script src="http://airve.github.com/js/dj/dj.min.js"></script>
+ <script src="verge.js"></script><!-- github.com/ryanve/verge -->
- <!-- Use library for events and to test integration.
- Use one of these - Ender Jeesh or jQuery: -->
- <script src="http://airve.github.com/js/jeesh/jeesh.min.js"></script>
- <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>-->
+ <script>
+ (function (window, document, console, dj, verge, elo, vibe) {
- <!-- github.com/ryanve/verge -->
- <script src="verge.js"></script>
+ var docElem = document.documentElement
+ , $ = window.$ || elo
+ , toString = {}.toString
+ , hasConsole = !!(console && console.log)
+ , log = hasConsole ? function (s) {
+ console.log(s);
+ } : function (s, force) {
+ force && alert(s);
+ }
+ , id = function (id) {
+ return document.getElementById(id);
+ }
+ , html = function (el, html) {
+ el && 1 === el.nodeType && (el.innerHTML = html || '');
+ };
- <script>
- (function(window, document) {
+ var readyTests = {} // tests that need to happen on *ready*
+ , resizeTests = {} // tests that need to happen on *resize*
+ , scrollTests = {} // tests that need to happen on *scroll*
+ , dynamicTests = {} // tests that need to happen on *resize* AND *scroll*
+ , a, b, c, d, $a, $b, $c, $d; // elements (native and wrapped)
- var $ = window.$
- , verge = window.verge
- , console = window.console
- , hasConsole = !!console && typeof console.log === 'function'
- , readyTests = {} // tests that need to happen on *ready*
- , resizeTests = {} // tests that need to happen on *resize*
- , scrollTests = {} // tests that need to happen on *scroll*
- , dynamicTests = {} // tests that need to happen on *resize* AND *scroll*
- , a, b, c, d, $a, $b, $c, $d; // elements (native and wrapped)
+ if ( verge.bridge ) {
+ verge.bridge($, true);
+ } else {
+ $.inX = verge.inX;
+ $.inY = verge.inY;
+ $.inViewport = verge.inViewport;
+ $.scrollX = verge.scrollX;
+ $.scrollY = verge.scrollY;
+ $.viewportW = verge.viewportW;
+ $.viewportH = verge.viewportH;
+ $.rectangle = verge.rectangle;
+ }
+
- function update(tests) {
- var n, output, el;
- for (n in tests) {
- if (tests.hasOwnProperty(n) && (el = document.getElementById(n))) {
- output = tests[n];
- if (typeof output === 'function') { output = output(); }
- el.innerHTML = String(output);
- }
- }
- }
+ function update(tests) {
+ var n, output, el;
+ for ( n in tests ) {
+ if ( el = id(n) ) {
+ output = tests[n];
+ output = typeof output == 'function' ? output() : output;
+ html( el, '' + output );
+ }
+ }
+ }
+
+ function aug ( receiver, supplier, force ) {
+ for ( var n in supplier ) {
+ if ( force || (null == receiver[n] && null != supplier[n]) ) {
+ receiver[n] = supplier[n];
+ }
+ }
+ return receiver;
+ }
- function aug(receiver, supplier, force) {
- for (var n in supplier) {
- if (supplier.hasOwnProperty(n) && typeof supplier[n] !== 'undefined') {
- if (force || typeof receiver[n] === 'undefined') {
- receiver[n] = supplier[n];
- }
- }
- }
- return receiver;
- }
-
- // Make sure the $ methods tested are the verge methods:
- verge.bridge($, true);
+ // print the ua
+ readyTests['ua'] = navigator.userAgent || '';
+
+ // TESTS:
- // Print the ua (not a test, but should print on ready)
- readyTests['ua'] = navigator.userAgent || '';
-
- // TESTS:
+ resizeTests['viewport-w'] = $.viewportW;
+ resizeTests['viewport-h'] = $.viewportH;
+ scrollTests['scroll-x'] = $.scrollX;
+ scrollTests['scroll-y'] = $.scrollY;
+
+ if ( $.rectangle ) {
+ dynamicTests['top'] = function() { return $.rectangle(a).top; };
+ dynamicTests['bottom'] = function() { return $.rectangle(a).bottom; };
+ dynamicTests['left'] = function() { return $.rectangle(a).left; };
+ dynamicTests['right'] = function() { return $.rectangle(a).right; };
+ dynamicTests['width'] = function() { return $.rectangle(a).width; };
+ dynamicTests['height'] = function() { return $.rectangle(a).height; };
+ }
+
+ if ( $.offset ) {
+ dynamicTests['offset-top'] = function() { return $.offset(a).top; };
+ dynamicTests['offset-bottom'] = function() { return $.offset(a).bottom; };
+ dynamicTests['offset-left'] = function() { return $.offset(a).left; };
+ dynamicTests['offset-right'] = function() { return $.offset(a).right; };
+ dynamicTests['offset-width'] = function() { return $.offset(a).width; };
+ dynamicTests['offset-height'] = function() { return $.offset(a).height; };
+ }
+
+ dynamicTests['in-viewport-a'] = function() { return $.inViewport(a); };
+ dynamicTests['in-viewport-a-pos'] = function() { return $.inViewport(a, 100); };
+ dynamicTests['in-viewport-a-neg'] = function() { return $.inViewport(a, -100); };
+ dynamicTests['in-viewport-b'] = function() { return $.inViewport(b); };
+ dynamicTests['in-viewport-b-pos'] = function() { return $.inViewport(b, 100); };
+ dynamicTests['in-viewport-b-neg'] = function() { return $.inViewport(b, -100); };
+
+ // Merge tests by event:
+ aug(resizeTests, dynamicTests);
+ aug(scrollTests, dynamicTests);
+ aug(readyTests, scrollTests);
+ aug(readyTests, resizeTests);
+
+ // Print test outputs:
+ elo.domReady(function (elo) {
+ $a = $('#a');
+ $b = $('#b');
+ $c = $('#c');
+ a = $a[0];
+ b = $b[0];
+ c = $c[0];
+ $abc = $([a,b,c]);
+ update(readyTests);
+ log( $.viewportW() );
+ log( verge );
+ $a.rectangle && log( $a.rectangle() );
+ log( $.rectangle(a) );
+ log( dj.resample(elo) );
+ });
+
+ elo(window).on('resize', function () {
+ update(resizeTests);
+ }).on('scroll', function () {
+ update(scrollTests);
+ });
+
+ //vibe && elo('#toggle').on('click', function () {
+ // vibe.toggleClass(docElem, 'dark');
+ //});
- resizeTests['viewport-w'] = $.viewportW;
- resizeTests['viewport-h'] = $.viewportH;
- scrollTests['scroll-x'] = $.scrollX;
- scrollTests['scroll-y'] = $.scrollY;
-
- dynamicTests['top'] = function() { return $.rectangle(a).top; };
- dynamicTests['bottom'] = function() { return $.rectangle(a).bottom; };
- dynamicTests['left'] = function() { return $.rectangle(a).left; };
- dynamicTests['right'] = function() { return $.rectangle(a).right; };
- dynamicTests['width'] = function() { return $.rectangle(a).width; };
- dynamicTests['height'] = function() { return $.rectangle(a).height; };
-
- dynamicTests['rectangle-compare'] = function() { return $a.rectangle().top === $.rectangle(a).top; };
- dynamicTests['in-x-filter'] = function() { return $abc.inX().length; };
- dynamicTests['in-y-filter'] = function() { return $abc.inY().length; };
- dynamicTests['in-viewport-filter'] = function() { return $abc.inViewport().length; };
- dynamicTests['in-viewport-call'] = function() { return $.fn.inViewport.call($abc).length; };
-
- dynamicTests['in-viewport-a'] = function() { return $.inViewport(a); };
- dynamicTests['in-viewport-a-pos'] = function() { return $.inViewport(a, 100); };
- dynamicTests['in-viewport-a-neg'] = function() { return $.inViewport(a, -100); };
- dynamicTests['in-viewport-b'] = function() { return $.inViewport(b); };
- dynamicTests['in-viewport-b-pos'] = function() { return $.inViewport(b, 100); };
- dynamicTests['in-viewport-b-neg'] = function() { return $.inViewport(b, -100); };
-
- // Merge tests by event:
- resizeTests = aug(resizeTests, dynamicTests);
- scrollTests = aug(scrollTests, dynamicTests);
- readyTests = aug(aug(readyTests, scrollTests), resizeTests); // all of em
-
- // Print test outputs:
- $(document).ready(function(){
- $a = $('#a');
- $b = $('#b');
- $c = $('#c');
- a = $a[0];
- b = $b[0];
- c = $c[0];
- $abc = $([a,b,c]);
- update(readyTests);
- if (hasConsole) {
- console.log(verge);
- console.log($a.rectangle());
- console.log($.rectangle(a));
- verge.noConflict(function(v){
- // both of these should be true:
- console.log( v === verge );
- console.log( !window.hasOwnProperty('verge'));
- });
- }
- });
-
- $(window).resize(function(){
- update(resizeTests);
- }).scroll(function(){
- update(scrollTests);
- });
-
- }(this, this.document));
- </script>
+ }(this, this.document, this.console, this.dj, this.verge, this.elo, this.vibe));
+ </script>
</body>
</html>
View
365 verge.js
@@ -5,257 +5,214 @@
* @author Ryan Van Etten (c) 2012
* @link github.com/ryanve/verge
* @license MIT
- * @version 1.0.0
+ * @version 1.5.0
*/
/*jslint browser: true, devel: true, node: true, passfail: false, bitwise: true
, continue: true, debug: true, eqeq: true, es5: true, forin: true, newcap: true
, nomen: true, plusplus: true, regexp: true, undef: true, sloppy: true, stupid: true
-, sub: true, white: true, indent: 4, maxerr: 50 */
+, sub: true, white: true, indent: 4, maxerr: 180 */
-(function(context, win) {
+(function (root, factory) {
+ if ( typeof module != 'undefined' && module.exports ) { module.exports = factory(); } // node
+ else { root['verge'] = factory(); } // browser
+}(this, function () {
+
+ var win = window
+ , docElem = document.documentElement
+ , xports = {}
+ , effins = {};
- var name = 'verge'
- , old = context[name]
- , api = {} // holds all exports
- , effins = {} // holds chainable fns
- , viewportW, viewportH, scrollX, scrollY, bindVerger
- , inX, inY, inViewport, rectangle
- , docElem = win.document.documentElement
- ;
-
/**
- * viewportW() cross-browser viewport width
- *
- * @return {integer}
- * @link responsejs.com/labs/dimensions/#viewport
+ * $.viewportW() Get the viewport width. (layout viewport)
+ * @since 1.0.0
+ * @link responsejs.com/labs/dimensions/#viewport
+ * @link quirksmode.org/mobile/viewports2.html
+ * @return {number}
*/
-
- api['viewportW'] = viewportW = function() {
+ function viewportW() {
return docElem.clientWidth;
- };
+ }
+ xports['viewportW'] = viewportW;
/**
- * viewportH() cross-browser viewport height
- *
- * @return {integer}
- * @link responsejs.com/labs/dimensions/#viewport
+ * $.viewportH() Get the viewport height. (layout viewport)
+ * @since 1.0.0
+ * @link responsejs.com/labs/dimensions/#viewport
+ * @link quirksmode.org/mobile/viewports2.html
+ * @return {number}
*/
-
- api['viewportH'] = viewportH = function() {
+ function viewportH() {
return docElem.clientHeight;
- };
+ }
+ xports['viewportH'] = viewportH;
/**
- * scrollX() Cross-browser version of window.scrollX
- * @return {integer}
+ * $.scrollX() Cross-browser version of window.scrollX
+ * @since 1.0.0
+ * @return {number}
*/
-
- api['scrollX'] = scrollX = function scrollX() {
+ function scrollX() {
return win.pageXOffset || docElem.scrollLeft;
- };
+ }
+ xports['scrollX'] = scrollX;
/**
- * scrollY() Cross-browser version of window.scrollY
- * @return {integer}
+ * $.scrollY() Cross-browser version of window.scrollY
+ * @since 1.0.0
+ * @return {number}
*/
-
- api['scrollY'] = scrollY = function scrollY() {
+ function scrollY() {
return win.pageYOffset || docElem.scrollTop;
- };
-
+ }
+ xports['scrollY'] = scrollY;
+
+ // The #verge is the amount of pixels to act as a cushion around the viewport. It can
+ // be any number. If verge is zero, then the inX/inY/inViewport methods are exact. If
+ // verge is set to 100, then those methods return true when for elements that are are
+ // in the viewport *or* near it, with *near* being defined as within 100 pixels outside
+ // the viewport edge. Elements immediately outside the viewport are 'on the verge' of
+ // being scrolled to.
+
/**
- * rectangle() getBoundingClientRect w/ optional verge parameter.
- *
- * @param {Object|Array} el native element or node list or matched set
- * @param {number=} verge (described below)
- * @return {Object} (if el is invalid, it returns undefined)
+ * $.rectangle() cross-browser element.getBoundingClientRect with an
+ * optional verge parameter. (see #verge) The coords
+ * provided by the rectangle are relative to the top-left
+ * corner of the viewport.
+ * @since 1.0.0
+ * @param {Object|Array} el native element or matched set (defaults to first elem)
+ * @param {number=} verge see #verge
+ * @param {(Object|*)=} voidO if `voidO` is truthy, `verge` defaults back to 0. The
+ * purpose of this is so that you can use $.rectangle more
+ * easily with iterators that use the v/i/o signature.
+ *
+ * @return {Object|undefined} object containing coords (`undefined` if `el` is invalid)
*/
-
- api['rectangle'] = rectangle = function(el, verge) {
+ function rectangle (el, verge, voidO) {
var r, o;
el = el && (el.nodeType ? el : el[0]); // isolate node
- if (el && el.nodeType === 1) { // elements only
- if (verge !== +verge) { verge = 0; } // non-nums become 0
- r = el.getBoundingClientRect(); // read only
- o = {
- top: r.top - verge
- , left: r.left - verge
- , bottom: r.bottom + verge
- , right: r.right + verge
- };
- o.width = o.right - o.left; // includes verge * 2
- o.height = o.bottom - o.top; // includes verge * 2
+ if ( el && 1 === el.nodeType ) {
+ verge = typeof verge == 'number' && verge && !voidO ? verge : 0;
+ r = el.getBoundingClientRect(); // read-only
+ o = {};
+ o['top'] = r['top'] - verge;
+ o['left'] = r['left'] - verge;
+ o['bottom'] = r['bottom'] + verge;
+ o['right'] = r['right'] + verge;
+ o['width'] = o['right'] - o['left']; // includes verge * 2
+ o['height'] = o['bottom'] - o['top']; // includes verge * 2
}
return o;
- };
+ }
+ xports['rectangle'] = rectangle;
- // The verge is the amount of pixels to act as a cushion around the viewport. It can be any
- // integer. If verge is zero, then the inX/inY/inViewport methods are exact. If verge is set to 100,
- // then those methods return true when for elements that are are in the viewport *or* near it,
- // with *near* being defined as within 100 pixels outside the viewport edge. Elements immediately
- // outside the viewport are 'on the verge' of being scrolled to.
+ /**
+ * $.offset same effect as the getter form of jQuery.fn.offset
+ * @since 1.1.0
+ * @param {Object} el
+ * @return {Object|undefined}
+ */
+ function offset (el) {
+ var x, y, o = rectangle(el);
+ if ( o ) {
+ x = scrollX() - (docElem.clientLeft || 0);
+ y = scrollY() - (docElem.clientTop || 0);
+ o['top'] += y;
+ o['left'] += x;
+ o['bottom'] += y;
+ o['right'] += x;
+ }
+ return o;
+ }
+ // xports['offset'] = offset;
- api['inX'] = inX = function(elem, verge) {
- var r = rectangle(elem, verge);
+ /**
+ * $.inX() Determine if an element is in the same section
+ * of the x-axis as the current viewport is.
+ * @since 1.0.0
+ * @param {Object} el
+ * @param {number=} verge
+ * @return {boolean}
+ */
+ function inX (el, verge) {
+ var r = rectangle(el, verge);
return !!r && r.right >= 0 && r.left <= viewportW();
- };
-
- api['inY'] = inY = function(elem, verge) {
- var r = rectangle(elem, verge);
- return !!r && r.bottom >= 0 && r.top <= viewportH();
- };
+ }
+ xports['inX'] = inX;
- api['inViewport'] = inViewport = function(elem, verge) {
- // equiv to: inX(elem, verge) && inY(elem, verge)
- // But just manually do both to avoid calling rectangle() twice, and
- // so that it'll fail faster. It gzips just as small this way too:
- var r = rectangle(elem, verge);
- return !!r && r.bottom >= 0 && r.right >= 0 && r.top <= viewportH() && r.left <= viewportW();
- };
-
/**
- * noConflict() Destroy the global and return the api. Optionally call
- * a function that gets the api supplied as the first arg.
- * @param {function(*)=} callback
- * @example var localVerge = verge.noConflict();
- * @example verge.noConflict(function(verge){ });
+ * $.inY() Determine if an element is in the same section
+ * of the y-axis as the current viewport is.
+ * @since 1.0.0
+ * @param {Object} el
+ * @param {number=} verge
+ * @return {boolean}
*/
- api['noConflict'] = function(callback) {
- if (typeof old === 'undefined') {
- delete context[name];
- }
- else {
- context[name] = old;
- }
- if (typeof callback === 'function') {
- callback(api);
- }
- return api;
- };
+ function inY (el, verge) {
+ var r = rectangle(el, verge);
+ return !!r && r.bottom >= 0 && r.top <= viewportH();
+ }
+ xports['inY'] = inY;
/**
- * bindVerger() Convert a function into a filter for
- * the specified wrapper.
- *
- * @param {function(*)} method the function to convert
- * @param {function(*)=} wrapper e.g. jQuery
+ * $.inViewport() Determine if an element is in the current viewport.
+ * @since 1.0.0
+ * @param {Object} el
+ * @param {number=} verge
+ * @return {boolean}
*/
- api['bindVerger'] = bindVerger = function(method, wrapper) {
- var rewrap = 0;
- if (typeof method !== 'function') {
- throw 'invalid type';
- }
- if (typeof wrapper === 'undefined') {
- wrapper = this;
- }
- if (typeof wrapper === 'function') {
- try {
- if (wrapper('')) {
- rewrap = 1;
- }
- }
- catch (e) {
- throw 'invalid wrapper';
- }
- }
- return function(option, invert) {
- // In here `this` refers to the current instance of the wrapper (e.g. jQuery). We
- // could push passing els to a fresh array, and then call the wrapper on that array.
- // Instead we start with a fresh instance of the wrapper and push directly onto that.
- // Doing it this way saves steps and prevents having to arrayify again in the wrapper.
- var i, v, j = 0
- , l = this.length
- , fresh = rewrap ? wrapper('') : [];
-
- invert = invert === true; // boolean
-
- for (i = 0; i < l; i++) {
- v = this[i]; // in case method mutates value
- // use === ! to make bool-to-bool comparison:
- if (invert === !method.call(v, v, option)) {
- fresh[j++] = this[i];
- }
- }
- fresh.length = j; // in case fresh is not array
- return fresh;
- };
- };
+ function inViewport (el, verge) {
+ // Equiv to `inX(el, verge) && inY(el, verge)` but just manually do both
+ // to avoid calling rectangle() twice. It gzips just as small like this.
+ var r = rectangle(el, verge);
+ return !!r && r.bottom >= 0 && r.right >= 0 && r.top <= viewportH() && r.left <= viewportW();
+ }
+ xports['inViewport'] = inViewport;
- // Create area filters that are bound to api:
- effins['inX'] = bindVerger(inX, api);
- effins['inY'] = bindVerger(inY, api);
- effins['inViewport'] = bindVerger(inViewport, api);
- // Create fn.rectangle:
- effins['rectangle'] = function(verge) {
+ // Create fn.rectangle and fn.offset
+ effins['rectangle'] = function (verge) {
return rectangle(this, verge);
};
-
- // Expose effins:
- api['fn'] = effins;
-
- // Server vs browser:
- if (typeof exports !== 'undefined' && typeof module !== 'undefined') {
- module.exports = api; // nodejs.org / ender.no.de
- }
- else {// browser
- context[name] = api; // expose to global context
- }
-
+
+ // effins['offset'] = function() {
+ // return offset(this);
+ // };
+
/**
- * bridge() Handler for integrating (mixing out) methods into a host. It
- * augments the host with only the listed methods. If the host is
- * jQuery-compatible, then it'll also get the effins. Existing methods
- * on the host are not overwritten unless the force param is set to true.
- *
- * @param {Object|function(*)} host the receiver
- * @param {boolean=} force indicates whether existing methods on the host
- * should be overwritten (default: false)
+ * verge.bridge() Integrate applicable methods|objects into a host.
+ * Other types (number|string|undefined|boolean|null)
+ * are not bridged. `this` augments the receiver `r`
+ * @this {Object|Function} supplier
+ * @param {Object|Function} r receiver
+ * @param {boolean=} force whether to overwrite existing props (default: false)
*/
- api['bridge'] = function (host, force) {
- var j, a, m;
+ function bridge ( r, force ) {
- if (host) {
+ var k, relay, s = this; // s is the supplier
+ if ( r == null || s == null || s == win ) { return; }
+ force = true === force; // require explicit true to force
- a = [ 'inX'
- , 'inY'
- , 'inViewport'
- , 'rectangle'
- , 'bindVerger'
- , 'viewportW'
- , 'viewportH'
- , 'scrollX'
- , 'scrollY'
- ];
-
- j = 9; // a.length
-
- // top-level (all 9)
- while (j--) {
- m = a[j]; // method name
- if (force || typeof host[m] === 'undefined') {
- host[m] = api[m];
- }
- }
-
- // effins (first 4)
- if (typeof host === 'function' && host['fn']) {
- j = 4;
- while (j--) {
- m = a[j]; // method name
- if (force || typeof host['fn'][m] === 'undefined') {
- // The first 3 are filters so build them w/ bindVerger:
- host['fn'][m] = j < 3 ? bindVerger(api[m], host) : effins[m];
- }
+ for ( k in s ) {
+ if ( typeof s[k] == 'function' && s[k]['relay'] !== false ) {
+ if ( force || r[k] == null ) {
+ r[k] = s[k];
}
}
}
+
+ r['fn'] && bridge.call(effins, r['fn'], force);
+
+ return r; // receiver
- return api;
- };
+ }// bridge
- // Run the bridge once and return the api:
- return api['bridge'](context['$']);
-
-}(this, window));
+ bridge['relay'] = false;
+ // xports['bridge'] = bridge;
+
+ // expose effins:
+ // xports['fn'] = effins;
+
+ return xports;
+
+}));
View
9 verge.min.js
@@ -1,5 +1,4 @@
-/* verge 1.0.0 | github.com/ryanve/verge | MIT */
-(function(d,j){var n=d.verge,a={},f={},l,m,h,o,p,q,i,k=j.document.documentElement;a.viewportW=l=function(){return k.clientWidth};a.viewportH=m=function(){return k.clientHeight};a.scrollX=function(){return j.pageXOffset||k.scrollLeft};a.scrollY=function(){return j.pageYOffset||k.scrollTop};a.rectangle=i=function(c,a){var b;if((c=c&&(c.nodeType?c:c[0]))&&1===c.nodeType)a!==+a&&(a=0),b=c.getBoundingClientRect(),b={top:b.top-a,left:b.left-a,bottom:b.bottom+a,right:b.right+a},b.width=b.right-b.left,b.height=
-b.bottom-b.top;return b};a.inX=o=function(a,e){var b=i(a,e);return!!b&&0<=b.right&&b.left<=l()};a.inY=p=function(a,e){var b=i(a,e);return!!b&&0<=b.bottom&&b.top<=m()};a.inViewport=q=function(a,e){var b=i(a,e);return!!b&&0<=b.bottom&&0<=b.right&&b.top<=m()&&b.left<=l()};a.noConflict=function(c){"undefined"===typeof n?delete d.verge:d.verge=n;"function"===typeof c&&c(a);return a};a.bindVerger=h=function(a,e){var b=0;if("function"!==typeof a)throw"invalid type";"undefined"===typeof e&&(e=this);if("function"===
-typeof e)try{e("")&&(b=1)}catch(f){throw"invalid wrapper";}return function(g,f){var d,h,i=0,k=this.length,j=b?e(""):[],f=!0===f;for(d=0;d<k;d++)h=this[d],f===!a.call(h,h,g)&&(j[i++]=this[d]);j.length=i;return j}};f.inX=h(o,a);f.inY=h(p,a);f.inViewport=h(q,a);f.rectangle=function(a){return i(this,a)};a.fn=f;"undefined"!==typeof exports&&"undefined"!==typeof module?module.a=a:d.verge=a;a.bridge=function(c,e){var b,d,g;if(c){d="inX inY inViewport rectangle bindVerger viewportW viewportH scrollX scrollY".split(" ");
-for(b=9;b--;)if(g=d[b],e||"undefined"===typeof c[g])c[g]=a[g];if("function"===typeof c&&c.fn)for(b=4;b--;)if(g=d[b],e||"undefined"===typeof c.fn[g])c.fn[g]=3>b?h(a[g],c):f[g]}return a};return a.bridge(d.$)})(this,window);
+/*! verge 1.5.0 | viewport utils by @ryanve | github.com/ryanve/verge | @license MIT */
+(function(g,f){"undefined"!=typeof module&&module.exports?module.exports=f():g.verge=f()})(this,function(){function g(){return i.clientWidth}function f(){return i.clientHeight}function h(a,c,b){var d;if((a=a&&(a.nodeType?a:a[0]))&&1===a.nodeType)c="number"==typeof c&&c&&!b?c:0,a=a.getBoundingClientRect(),d={},d.top=a.top-c,d.left=a.left-c,d.bottom=a.bottom+c,d.right=a.right+c,d.width=d.right-d.left,d.height=d.bottom-d.top;return d}function k(a,c){var b;if(!(null==a||null==this||this==j)){c=!0===c;
+for(b in this)if("function"==typeof this[b]&&!1!==this[b].relay&&(c||null==a[b]))a[b]=this[b];a.fn&&k.call(l,a.fn,c);return a}}var j=window,i=document.documentElement,e={},l={};e.viewportW=g;e.viewportH=f;e.scrollX=function(){return j.pageXOffset||i.scrollLeft};e.scrollY=function(){return j.pageYOffset||i.scrollTop};e.rectangle=h;e.inX=function(a,c){var b=h(a,c);return!!b&&0<=b.right&&b.left<=g()};e.inY=function(a,c){var b=h(a,c);return!!b&&0<=b.bottom&&b.top<=f()};e.inViewport=function(a,c){var b=
+h(a,c);return!!b&&0<=b.bottom&&0<=b.right&&b.top<=f()&&b.left<=g()};l.rectangle=function(a){return h(this,a)};k.relay=!1;return e});

0 comments on commit 508f6b9

Please sign in to comment.