From 6c9ace01626e34c0ed26d2f3bd8af4a71b78b87a Mon Sep 17 00:00:00 2001 From: John Bintz Date: Fri, 25 Nov 2011 10:26:37 -0500 Subject: [PATCH] wrong viewport library --- README.md | 2 +- Rakefile | 2 +- vendor/assets/javascripts/jquery.viewport.js | 268 ++++--------------- 3 files changed, 55 insertions(+), 217 deletions(-) diff --git a/README.md b/README.md index 61a66ec..ae52e99 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ Every other project is owned by the original owner, I'm just aggregating for my * [jquery.cookies.js](http://code.google.com/p/cookies) * [jquery.elastic.js](http://unwrongest.com/projects/elastic/) -* [jquery.viewport.js](https://github.com/borbit/jquery.viewport) +* [jquery.viewport.js](http://www.appelsiini.net/projects/viewport) * [Better-Autocomplete](https://github.com/betamos/Better-Autocomplete) * [Moment.js](https://github.com/timrwood/moment) * [Ajax File Upload](http://phpletter.com/Our-Projects/AjaxFileUpload/) diff --git a/Rakefile b/Rakefile index dfcb2f7..f434a2f 100644 --- a/Rakefile +++ b/Rakefile @@ -23,7 +23,7 @@ sources = { end }, 'jquery-viewport' => [ - 'https://raw.github.com/borbit/jquery.viewport/master/jquery.viewport.js' + 'http://www.appelsiini.net/download/jquery.viewport.js' ], 'better-autocomplete' => [ 'https://raw.github.com/betamos/Better-Autocomplete/develop/src/jquery.better-autocomplete.js', diff --git a/vendor/assets/javascripts/jquery.viewport.js b/vendor/assets/javascripts/jquery.viewport.js index f429d1f..7826000 100644 --- a/vendor/assets/javascripts/jquery.viewport.js +++ b/vendor/assets/javascripts/jquery.viewport.js @@ -1,220 +1,58 @@ +/* + * Viewport - jQuery selectors for finding elements in viewport + * + * Copyright (c) 2008-2009 Mika Tuupola + * + * Licensed under the MIT license: + * http://www.opensource.org/licenses/mit-license.php + * + * Project home: + * http://www.appelsiini.net/projects/viewport + * + */ (function($) { + + $.belowthefold = function(element, settings) { + var fold = $(window).height() + $(window).scrollTop(); + return fold <= $(element).offset().top - settings.threshold; + }; -$.widget('ui.viewport', { - options:{ - binderClass: 'viewportBinder', - contentClass: 'viewportContent', - position: 'center', - content: false, - height: false, - width: false - }, - - _create: function() { - var content = this.options.content; - var isObject = typeof(content) == 'object'; - - if (isObject && content.tagName != null) { - this.options.content = $(content); - } else if (isObject && $.isArray(content)) { - this.options.content = $(content); + $.abovethetop = function(element, settings) { + var top = $(window).scrollTop(); + return top >= $(element).offset().top + $(element).height() - settings.threshold; + }; + + $.rightofscreen = function(element, settings) { + var fold = $(window).width() + $(window).scrollLeft(); + return fold <= $(element).offset().left - settings.threshold; + }; + + $.leftofscreen = function(element, settings) { + var left = $(window).scrollLeft(); + return left >= $(element).offset().left + $(element).width() - settings.threshold; + }; + + $.inviewport = function(element, settings) { + return !$.rightofscreen(element, settings) && !$.leftofscreen(element, settings) && !$.belowthefold(element, settings) && !$.abovethetop(element, settings); + }; + + $.extend($.expr[':'], { + "below-the-fold": function(a, i, m) { + return $.belowthefold(a, {threshold : 0}); + }, + "above-the-top": function(a, i, m) { + return $.abovethetop(a, {threshold : 0}); + }, + "left-of-screen": function(a, i, m) { + return $.leftofscreen(a, {threshold : 0}); + }, + "right-of-screen": function(a, i, m) { + return $.rightofscreen(a, {threshold : 0}); + }, + "in-viewport": function(a, i, m) { + return $.inviewport(a, {threshold : 0}); } - - this.viewport = createViewport(this.element, this.options); - this.viewport.init(); - this.viewport.adjust(); - }, - - content: function() { return this.viewport.content; }, - binder: function() { return this.viewport.binder; }, - adjust: function() { this.viewport.adjust(); }, - - update: function() { - this.viewport.updateContentSize(); - this.viewport.adjust(); - }, - - size: function(height, width) { - if (height == null || width == null) { - return this.viewport.getContentSize(); - } - this.viewport.setContentHeight(height); - this.viewport.setContentWidth(width); - }, - - height: function(height) { - if (height == null) { - return this.viewport.getContentSize().height; - } - this.viewport.setContentHeight(height); - }, - - width: function(width) { - if (width == null) { - return this.viewport.getContentSize().width; - } - this.viewport.setContentWidth(width); - } -}); - -function createViewport(element, options) { - var binder = $('
'); - var content = $('
'); - - binder.css({position: 'absolute', overflow: 'hidden'}); - element.css({position: 'relative', overflow: 'hidden'}); - content.css({position: 'absolute'}); - - var contents = false; - if (options.content == false && element.contents().length) { - contents = element.contents().detach(); - } else if (options.content != false) { - contents = options.content.detach(); - } - - content.append(contents); - binder.append(content); - element.append(binder); - - var centerHorizontal = true, - centerVertical = true, - heightDiff = 0, - widthDiff = 0; - - var contentPosition = {top: 0, left: 0}; - var contentSize = {height: 0, width: 0}; - var viewportSize = {height: 0, width: 0}; - - element.bind('dragstop', function(event, ui) { - if(contentPosition.top != ui.position.top) { - centerHorizontal = false; - } - if(contentPosition.left != ui.position.left) { - centerVertical = false; - } - contentPosition.left = ui.position.left; - contentPosition.top = ui.position.top; }); - function init() { - updateContentSize(); - updateContentPosition(); - } - - function updateContentPosition() { - var position = options.position.split(' '); - - if (position.indexOf('bottom') != -1) { - centerVertical = false; - contentPosition.top = viewportSize.height - contentSize.height; - } else if (position.indexOf('top') != -1) { - centerVertical = false; - contentPosition.top = 0; - } - - if (position.indexOf('right') != -1) { - centerHorizontal = false; - contentPosition.left = viewportSize.width - contentSize.width; - } else if (position.indexOf('left') != -1) { - centerHorizontal = false; - contentPosition.left = 0; - } - } - - function updateContentSize() { - if (options.width != false && options.height != false) { - content.height(options.height); - content.width(options.width); - } else if (contents != false) { - content.height(contents.height()); - content.width(contents.width()); - } - - contentSize = { - height: content.height(), - width: content.width() - }; - } - - function adjust() { - viewportSize.height = element.height(); - viewportSize.width = element.width(); - - var diff; - - if (viewportSize.height > contentSize.height) { - content.css('top', 0); - binder.height(contentSize.height); - binder.css('top', Math.floor(viewportSize.height / 2) - - Math.floor(contentSize.height / 2)) - } else { - diff = contentSize.height - viewportSize.height; - binder.height(viewportSize.height + diff * 2); - binder.css('top', -diff); - - if (centerVertical) { - contentPosition.top = Math.floor(diff / 2); - content.css('top', contentPosition.top); - } else { - var newTop = contentPosition.top + (diff - heightDiff); - newTop = newTop >= 0 ? newTop : 0; - contentPosition.top = newTop; - content.css('top', newTop); - } - heightDiff = diff; - } - - if (viewportSize.width > contentSize.width) { - content.css('left', 0); - binder.width(contentSize.width); - binder.css('left', Math.floor(viewportSize.width / 2) - - Math.floor(contentSize.width / 2)); - } else { - diff = contentSize.width - viewportSize.width; - binder.width(viewportSize.width + diff * 2); - binder.css('left', -diff); - - if (centerHorizontal) { - contentPosition.left = Math.floor(diff / 2); - content.css('left', contentPosition.left); - } else { - var newLeft = contentPosition.left + (diff - widthDiff); - newLeft = newLeft >= 0 ? newLeft : 0; - contentPosition.left = newLeft; - content.css('left', newLeft); - } - widthDiff = diff; - } - } - - function setContentHeight(height) { - if (height != null) { - contentSize.height = height; - content.height(height); - } - } - - function setContentWidth(width) { - if (width != null) { - contentSize.width = width; - content.width(width); - } - } - - function getContentSize() { - return contentSize; - } - - return { - init: init, - adjust: adjust, - updateContentSize: updateContentSize, - setContentHeight: setContentHeight, - setContentWidth: setContentWidth, - getContentSize: getContentSize, - content: content, - binder: binder - }; -} - -})(jQuery); \ No newline at end of file + +})(jQuery);