richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Updates to type image, and type fixed.

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

143
src/definitions/behaviors/visibility.js
View File

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

Write Preview
|||||||
100:0
Loading…
Cancel
Save