Browse Source

Updates to type image, and type fixed.

pull/2069/head
jlukic 9 years ago
parent
commit
7b9ad9d2da
1 changed files with 57 additions and 86 deletions
  1. 143
      src/definitions/behaviors/visibility.js

143
src/definitions/behaviors/visibility.js

@ -11,6 +11,8 @@
;(function ( $, window, document, undefined ) {
"use strict";
$.fn.visibility = function(parameters) {
var
$allModules = $(this),
@ -120,11 +122,8 @@ $.fn.visibility = function(parameters) {
$window
.on('resize' + eventNamespace, module.event.refresh)
;
// rudimentary pub/sub
$context
.off('scroll' + eventNamespace, module.event.publish)
.on('scroll' + eventNamespace, module.event.publish)
.on('scrollchange' + eventNamespace, module.event.subscribe)
.on('scroll' + eventNamespace, module.event.scroll)
;
},
@ -132,24 +131,21 @@ $.fn.visibility = function(parameters) {
refresh: function() {
requestAnimationFrame(module.refresh);
},
publish: function() {
// one event and one animation frame for all visibility checks
scroll: function() {
module.verbose('Scroll position changed');
if(settings.throttle) {
clearTimeout(module.timer);
module.timer = setTimeout(function() {
$context.trigger('scrollchange', $context.scrollTop() + settings.offset);
settings.onScroll.call(element);
module.checkVisibility();
}, settings.throttle);
}
else {
requestAnimationFrame(function() {
scroll = $context.scrollTop() + settings.offset
$context.trigger('scrollchange', $context.scrollTop() + settings.offset);
settings.onScroll.call(element);
module.checkVisibility();
});
}
},
subscribe: function(event, scroll) {
module.verbose('Scroll position changed', scroll);
module.checkVisibility(scroll);
}
},
@ -181,16 +177,14 @@ $.fn.visibility = function(parameters) {
},
should: {
trackChanges: function() {
if(methodInvoked && queryArguments.length > 0) {
module.debug('One time query, no need to bind events');
return false;
}
module.debug('Query is attaching callbacks, watching for changes with scroll');
module.debug('Callbacks being attached');
return true;
}
},
setup: {
@ -205,51 +199,44 @@ $.fn.visibility = function(parameters) {
var
src = $module.data('src')
;
if(!src) {
module.error(error.noSRC);
return;
}
module.verbose('Lazy loading image', src);
settings.observeChanges = false;
settings.once = true;
settings.onTopVisible = function() {
module.debug('Image top visible', element);
module.precache(src, function() {
module.set.image(src);
if(src) {
module.verbose('Lazy loading image', src);
settings.observeChanges = false;
// show when top visible
module.topVisible(function() {
module.debug('Image top visible', element);
module.precache(src, function() {
module.set.image(src);
settings.onTopVisible = false;
});
});
};
}
},
fixed: function() {
module.verbose('Setting up fixed on element pass');
$module
.visibility({
once: false,
continuous: false,
onTopPassed: function() {
$module
.addClass(className.fixed)
.css({
position: 'fixed',
top: settings.offset + 'px'
})
;
if(settings.transition) {
if($.fn.transition !== undefined) {
$module.transition(settings.transition, settings.duration);
}
}
},
onTopPassedReverse: function() {
$module
.removeClass(className.fixed)
.css({
position: '',
top: ''
})
;
settings.once = false;
settings.onTopPassed = function() {
$module
.addClass(className.fixed)
.css({
top: settings.offset + 'px'
})
;
if(settings.transition) {
if($.fn.transition !== undefined) {
$module.transition(settings.transition, settings.duration);
}
})
;
}
};
settings.onTopPassedReverse = function() {
$module
.removeClass(className.fixed)
.css({
position: '',
top: ''
})
;
};
}
},
@ -284,7 +271,7 @@ $.fn.visibility = function(parameters) {
is: {
visible: function() {
if(module.cache && module.cache.element) {
return (module.cache.element.height > 0 && module.cache.element.width > 0);
return (module.cache.element.width > 0);
}
return false;
}
@ -306,13 +293,9 @@ $.fn.visibility = function(parameters) {
}
},
checkVisibility: function(scroll) {
checkVisibility: function() {
module.verbose('Checking visibility of element', module.cache.element);
module.save.calculations(scroll);
module.checkCallbacks();
},
checkCallbacks: function() {
module.save.calculations();
if( module.is.visible() ) {
// percentage
module.passed();
@ -613,9 +596,9 @@ $.fn.visibility = function(parameters) {
},
save: {
calculations: function(scroll) {
calculations: function() {
module.verbose('Saving all calculations necessary to determine positioning');
module.save.scroll(scroll);
module.save.scroll();
module.save.direction();
module.save.screenCalculations();
module.save.elementCalculations();
@ -628,14 +611,8 @@ $.fn.visibility = function(parameters) {
}
}
},
scroll: function(scroll) {
if(scroll === undefined) {
//debugger;
}
module.cache.scroll = (scroll !== undefined)
? scroll
: $context.scrollTop() + settings.offset
;
scroll: function() {
module.cache.scroll = $context.scrollTop() + settings.offset;
},
direction: function() {
var
@ -662,9 +639,6 @@ $.fn.visibility = function(parameters) {
;
module.verbose('Saving element position');
// (quicker than $.extend)
element.margin = {};
element.margin.top = parseInt($module.css('margin-top'), 10);
element.margin.bottom = parseInt($module.css('margin-bottom'), 10);
element.fits = (element.height < screen.height);
element.offset = $module.offset();
element.width = $module.outerWidth();
@ -680,6 +654,9 @@ $.fn.visibility = function(parameters) {
;
// offset
if(settings.includeMargin) {
element.margin = {};
element.margin.top = parseInt($module.css('margin-top'), 10);
element.margin.bottom = parseInt($module.css('margin-bottom'), 10);
element.top = element.offset.top - element.margin.top;
element.bottom = element.offset.top + element.height + element.margin.bottom;
}
@ -712,16 +689,11 @@ $.fn.visibility = function(parameters) {
},
screenCalculations: function() {
var
scroll = $context.scrollTop() + settings.offset
scroll = module.get.scroll()
;
if(module.cache.scroll === undefined) {
module.cache.scroll = $context.scrollTop() + settings.offset;
}
module.save.direction();
$.extend(module.cache.screen, {
top : scroll,
bottom : scroll + module.cache.screen.height
});
module.cache.screen.top = scroll;
module.cache.screen.bottom = scroll + module.cache.screen.height;
return module.cache.screen;
},
screenSize: function() {
@ -982,7 +954,7 @@ $.fn.visibility.settings = {
fixed: 'fixed'
},
observeChanges : false,
observeChanges : true,
debug : false,
verbose : false,
@ -1031,7 +1003,6 @@ $.fn.visibility.settings = {
onScroll : function(){},
error : {
noSRC : 'Image preloading requires a data-src value',
method : 'The method you called is not defined.'
}

Loading…
Cancel
Save