[
  {
    "path": ".gitignore",
    "content": ".idea"
  },
  {
    "path": "LICENSE",
    "content": "Copyright (c) 2009 Remy Sharp\nLater modifications (c) 2016 by their respective authors.\n\n\nPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "# Element 'in view' Event Plugin\n\n*Author:* Remy Sharp\n\n*Pulled from:* http://remysharp.com/2009/01/26/element-in-view-event-plugin/\n\n*NOTE: \"I\" here refers to the original author, Remy Sharp.*\n\nI've been preparing a few articles for [jQuery for Designers][] and for\n[.net magazine][] and in doing so I've had to write a plugin that could prove\nto be useful to share.\n\nI've created an event that will trigger when the element is scrolled in to the\nviewport.\n\n\n## Preamble\n\nFirst of all, this isn't *really* a plugin. It's a utility of sorts. It's not\nreally a plugin, because you don't call it. It binds on to the scroll event and\ndoes the work for you.\n\nAlso, I'm aware that there is the [lazyload plugin][]. I've not had real time to\nplay with it, but I suspect there's some similarities, though my inview plugin\nis extremely stripped down (because I wrote it for a particular purpose). Also\nnote that my code only works for vertical scroll, and not horizontal.\n\nI should also add that this utility/plugin was inspired by [Dustin Diaz's][]\n[detect when an element scrolls in to view code][].\n\n\n##Demo\n\nThe example is mostly *lorem* text, but in the middle of the page is an element\nwhose text reads: \"You can't see me\". When the element is scrolled in to view\nit will change to \"You found me\".\n\nTo confirm this, open firebug while the element is out of view, and watch the\nelement in question as you scroll it in to view.\n\nhttp://jsbin.com/ugupa: (to edit: http://jsbin.com/ugupa/edit)\n\n\n## Download\n\n[Download jQuery inview event plugin][]\n\nOr from github at: http://github.com/zuk/jquery.inview\n\n\n## Usage\n\nThe script makes use of the new [$.support][] properties - so it will only work\nwith jQuery 1.3 upwards. If you need to use it with older versions of jQuery,\ndrop a comment, and I'll post an alternative.\n\nThe event will only fire when the element comes in to view of the viewport, and\nout of view. It won't keep firing if the user scrolls and the element remains in\nview.\n\nBear in mind if you think the element may already be in view, you may need to\nkick the scroll event using `$(window).trigger('checkInView')`. If you include\nthis plugin last (i.e., *after* you've hooked in to the event) then the script\nwill automatically trigger the kick for you; thus, sending the event to your\nbound element.\n\nThe variable after the event argument indicates the visible state in the\nviewport. The third variable (topOrBottomOrBoth) detects which part of viewport\nis visible to the user.\n\n```js\n$('div').bind('inview', function (event, visible, topOrBottomOrBoth) {\n  if (visible == true) {\n    // element is now visible in the viewport\n    if (topOrBottomOrBoth == 'top') {\n      // top part of element is visible\n    } else if (topOrBottomOrBoth == 'bottom') {\n      // bottom part of element is visible\n    } else {\n      // whole part of element is visible\n    }\n  } else {\n    // element has gone out of viewport\n  }\n});\n```\n\nTo stop listening for the event - simply unbind:\n\n```js\n$('div').unbind('inview');\n```\n\nRemember you can also bind once:\n\n```js\n$('div').one('inview', fn);\n```\n\n\n## More complex example\n\nThis way we can attach inView to some DIV in our code to, for example, detect\nwhen it FULLY readed by user (user sees it's bottom and top) and only after 1\nseconds of view, so after we call some out stats function or whatever:\n\n```js\n$(someMyOneDiv).bind('inview', function(e, v, t) {\n  var o = $(this);\n\n  if(o.data('inviewtimer')) {\n    clearTimeout(o.data('inviewtimer'));\n    o.removeData('inviewtimer');\n  }\n\n  if(v) {\n    o.data('inviewtimer', setTimeout(function() {\n      if(t == 'top') {\n        o.data('seenTop', true);\n      } else if(t == 'bottom') {\n        o.data('seenBottom', true);\n      } else {\n        o.data('seenTop', true);\n        o.data('seenBottom', true);\n      }\n\n      if(o.data('seenTop') && o.data('seenBottom')) {\n        o.unbind('inview');\n        // here we will do WHAT WHE NEED (for ex. Call Ajax stats collector)\n        // ...\n      }\n    }, 1000));\n  }\n});\n```\n\nMaybe there's a way to do this more elegant. And someone needed to test this on\nIE6-7-8 (they're nasty).\n\n\n## How it works\n\nWhen the window is scrolled, the event checks the position of the elements\nagainst the viewport height and the scrollTop position.\n\nHowever, I wanted to create a utility that would only check the elements that\nwere registered under the 'inview' event, i.e. I didn't want to keep checking\nthe element list if we unbind from the event.\n\nThis is achieved by dipping in to the $.cache store within jQuery, and looping\nthrough, looking for the elements tied to the 'inview' event.\n\nThis way the user can treat it like a native event on the page.\n\n\n## Offset Feature\n\nIf you decide to use this code for lazy loading images, you might be interested\nin preloading the image when it's getting close to entering the viewport. To\ndo this, you can now add a `data-offset` attribute to your target element.\nFor example:\n\n```html\n<img data-offset=\"300\">\n```\n\nor in JavaScript:\n\n```js\n$('img').attr('data-offset', 300);\n```\n\nThis allows the image to preload as it approaches the viewport so there's a\nbetter chance it will complete before the user even sees it.\n\n\n[jQuery for Designers]: http://jqueryfordesigners.com/\n[.net magazine]: http://www.netmag.co.uk/\n[lazyload plugin]: http://www.appelsiini.net/projects/lazyload\n[Dustin Diaz's]: http://www.dustindiaz.com/\n[detect when an element scrolls in to view code]: http://www.dustindiaz.com/element-scroll-into-view/\n[Download jQuery inview event plugin]: http://remysharp.com/downloads/jquery.inview.js\n[$.support]: http://api.jquery.com/?support\n"
  },
  {
    "path": "bower.json",
    "content": "{\n    \"name\": \"jquery.inview\",\n    \"version\": \"1.0.0\",\n    \"description\" : \"\",\n    \"main\": [\n        \"jquery.inview.js\",\n        \"jquery.inview.min.js\"\n    ],\n    \"homepage\": \"https://github.com/zuk/jquery.inview\",\n    \"authors\": [\n        \"Remy Sharp <remy@leftlogic.com>\"\n    ],\n    \"keywords\": [\n        \"jquery\",\n        \"event\",\n        \"view\",\n        \"viewport\"\n    ],\n    \"license\": \"MIT\",\n    \"ignore\": [\n        \"**/.*\",\n        \"node_modules\",\n        \"bower_components\",\n        \"test\",\n        \"tests\"\n    ]\n}\n"
  },
  {
    "path": "jquery.inview.js",
    "content": "/**\n * author Remy Sharp\n * url http://remysharp.com/2009/01/26/element-in-view-event-plugin/\n * fork https://github.com/zuk/jquery.inview\n */\n(function($) {\n    'use strict';\n\n    function getScrollTop() {\n        return window.pageYOffset ||\n            document.documentElement.scrollTop ||\n            document.body.scrollTop;\n    }\n\n    function getViewportHeight() {\n        var height = window.innerHeight; // Safari, Opera\n        // if this is correct then return it. iPad has compat Mode, so will\n        // go into check clientHeight (which has the wrong value).\n        if (height) {\n            return height;\n        }\n        var mode = document.compatMode;\n\n        if ((mode || !$.support.boxModel)) { // IE, Gecko\n            height = (mode === 'CSS1Compat') ?\n                document.documentElement.clientHeight : // Standards\n                document.body.clientHeight; // Quirks\n        }\n\n        return height;\n    }\n\n    function offsetTop(debug) {\n        // Manually calculate offset rather than using jQuery's offset\n        // This works-around iOS < 4 on iPad giving incorrect value\n        // cf http://bugs.jquery.com/ticket/6446#comment:9\n        var curtop = 0;\n        for (var obj = debug; obj; obj = obj.offsetParent) {\n            curtop += obj.offsetTop;\n        }\n        return curtop;\n    }\n\n    function checkInView() {\n        var viewportTop = getScrollTop(),\n            viewportBottom = viewportTop + getViewportHeight();\n\n\n\n\n        $('.inview').each(function() {\n            var $el = $(this),\n                elTop = offsetTop(this),\n                elHeight = $el.height(),\n                elBottom = elTop + elHeight,\n                wasInView = $el.data('inview') || false,\n                offset = $el.data('offset') || 0,\n                inView = elTop >= viewportTop && elBottom <= viewportBottom,\n                isBottomVisible = elBottom + offset >= viewportTop && elTop <= viewportTop,\n                isTopVisible = elTop - offset <= viewportBottom && elBottom >= viewportBottom,\n                inViewWithOffset = inView || isBottomVisible || isTopVisible ||\n                    (elTop <= viewportTop && elBottom >= viewportBottom);\n\n\n            if (inViewWithOffset) {\n                var visPart = (isTopVisible) ? 'top' : (isBottomVisible) ? 'bottom' : 'both';\n                if (!wasInView || wasInView !== visPart) {\n                    $el.data('inview', visPart);\n                    $el.trigger('inview', [true, visPart]);\n\n                }\n            } else if (!inView && wasInView) {\n                $el.data('inview', false);\n                $el.trigger('inview', [false]);\n\n            }\n        });\n    }\n\n    function createFunctionLimitedToOneExecutionPerDelay(fn, delay) {\n        var shouldRun = false;\n        var timer = null;\n\n        function runOncePerDelay() {\n            if (timer !== null) {\n                shouldRun = true;\n                return;\n            }\n            shouldRun = false;\n            fn();\n            timer = setTimeout(function() {\n                timer = null;\n                if (shouldRun) {\n                    runOncePerDelay();\n                }\n            }, delay);\n        }\n\n        return runOncePerDelay;\n    }\n\n    // ready.inview kicks the event to pick up any elements already in view.\n    // note however, this only works if the plugin is included after the elements are bound to 'inview'\n    var runner = createFunctionLimitedToOneExecutionPerDelay(checkInView, 100);\n    $(window).on('checkInView.inview click.inview ready.inview scroll.inview resize.inview', runner);\n\n})(jQuery);"
  }
]