lazyload support to tabs and scrollable

Author: Tero Piirainen

release-notes/version-1.2.0.txt

@@ -12,7 +12,14 @@ Fundamental changes
 
 all tools
 	- support for lazyloading
-
+	
+tabs
+	- history as configuration option
+	- lazyload flag
+	- deprecated "ajax" effect in favor of lazyloading plugin
+	- deprecated "horizontal" effect. separate accordion plugin will be released later
+	
+	
 mask
 	- simple, straighforward, lightweight
 	- fit called when mask loaded

src/form/form.slider.js

@@ -93,8 +93,11 @@
 					with JavaScript we don't want the HTML5 range element 
 					NOTE: input.attr("type", "text") throws exception by the browser
 				*/
-				var tmp = $('<input/>').attr("type", "text").addClass(input.attr("className"))
-					.attr("name", input.attr("name"));					
+				var tmp = $('<input/>')
+					.attr("type", "text")
+					.addClass(input.attr("className"))
+					.attr("name", input.attr("name"))
+					.attr("disabled", input.attr("disabled"));					
 
 				input.replaceWith(tmp);
 				input = tmp;
@@ -262,12 +265,12 @@
 			self[name] = function(fn) {
 				return self.bind(name, fn);	
 			};
-		});
-		
+		}); 
 
 
 		// dragging		
-		handle.bind("dragstart", function(e) {				
+		handle.bind("dragstart", function(e) {	
+				
 			if (input.is(":disabled")) { return false; }
 
 			e.type = "onBeforeSlide";
@@ -276,8 +279,7 @@
 			init();	
 
 		}).bind("drag", function(e) {			
-			if (input.is(":disabled")) { return false; }
-			
+			if (input.is(":disabled")) { return false; } 
 
 			seek(conf.vertical ? origo - e.offsetY  : e.offsetX - origo, e);
 

src/form/form.styleable.js

@@ -102,6 +102,11 @@
 			a.addClass(conf.disabledClass);	
 		}
 
+		input.bind("style", function() {
+			a.toggleClass(cls, this.checked);
+			a.toggleClass(conf.disabledClass, this.disabled);
+		});
+		
 	}
 
 	$.fn.styleable = function(conf) {   

src/overlay/overlay.apple.js

@@ -101,7 +101,7 @@
 			// set close button and content over the image
 			overlay.css("zIndex", opts.zIndex + 1).fadeIn(opts.fadeInSpeed, function()  { 
 
-				if (self.isOpened() && !$(this).index(overlay)) {					 
+				if (self.isOpened() && !$(this).index(overlay)) {	
 					onLoad.call(); 
 				} else {
 					overlay.hide();	

src/overlay/overlay.js

@@ -70,22 +70,19 @@
 		var self = this, 
 			 $self = $(this),
 			 w = $(window), 
-			 closers,
+			 closers,            
 			 overlay,
 			 opened,
-			 mask = conf.mask && $.tools.mask.version;		
-			 
-		// @deprecated 
-		if (conf.expose &&  $.tools.mask.version) {
-			mask = conf.expose;	
-		}
+			 maskConf = $.tools.mask && (conf.mask || conf.expose),
+			 uid = Math.random().toString().substring(10);		
 
+			 
 		// mask configuration
-		if (mask) {			
-			if (typeof mask == 'string') { mask = {color: mask}; }
-			mask.closeOnClick = mask.closeOnEsc = false;
-		}			
-		
+		if (maskConf) {			
+			if (typeof maskConf == 'string') { maskConf = {color: maskConf}; }
+			maskConf.closeOnClick = maskConf.closeOnEsc = false;
+		}			 
+		 
 		// get overlay and triggerr
 		var jq = conf.target || trigger.attr("rel");
 		overlay = jq ? $(jq) : null || trigger;	
@@ -130,7 +127,7 @@
 				opened = true;
 
 				// possible mask effect
-				if (mask) { $.mask.load(overlay, mask); }				
+				if (maskConf) { $.mask.load(overlay, maskConf); }				
 
 				// calculate end position 
 				var top = conf.top;					
@@ -166,40 +163,33 @@
 						$self.trigger(e);
 					}
 				}); 				
-		
+
+				// mask.click closes overlay
+				if (maskConf) {
+					$.mask.getMask().one("click", self.close); 
+				}
+				
 				// when window is clicked outside overlay, we close
 				if (conf.closeOnClick) {
-					$(document).bind("click.overlay", function(e) { 
-							
-						if (!self.isOpened()) { $(this).unbind("click.overlay"); }
-						
-						// mask.click closes overlay
-						if (mask) { return $.mask.getMask().one("click", self.close); }
-						
-						// otherwize we must click outside the overlay
-						var et = $(e.target);
-						if (et.parents(overlay).length > 1) { return; }
-						
-						// close all instances
-						$.each(instances, function() {
-							this.close(e);
-						}); 
+					$(document).bind("click." + uid, function(e) { 
+						if (!$(e.target).parents(overlay).length) { 
+							self.close(e); 
+						}
 					});						
 				}						
-				
+			
 				// keyboard::escape
-				if (conf.closeOnEsc) {
-					
+				if (conf.closeOnEsc) { 
+
 					// one callback is enough if multiple instances are loaded simultaneously
-					$(document).bind("keydown.overlay", function(e) {
-						if (e.keyCode == 27) {
-							$.each(instances, function() {
-								this.close(e);								
-							});	 
+					$(document).bind("keydown." + uid, function(e) {
+						if (e.keyCode == 27) { 
+							self.close(e);	 
 						}
 					});			
 				}
 
+				
 				return self; 
 			}, 
 
@@ -220,17 +210,13 @@
 					$self.trigger(e); 
 				});
 
-				// if all instances are closed then we unbind the keyboard / clicking actions
-				var allClosed = true;
-				$.each(instances, function() {
-					if (this.isOpened()) { allClosed = false; }
-				});				
+				// unbind the keyboard / clicking actions
+				$(document).unbind("click." + uid).unbind("keydown." + uid);		  
 
-				if (allClosed) {
-					$(document).unbind("click.overlay").unbind("keydown.overlay");		
-					$.mask.close();
-				} 
-							
+				if (maskConf) {
+					$.mask.close();		
+				}
+				 
 				return self;
 			}, 
 

src/scrollable/scrollable.js

@@ -17,7 +17,6 @@
 	$.tools = $.tools || {};
 
 	$.tools.scrollable = {
-		version: '@VERSION',
 
 		conf: {
 
@@ -50,8 +49,8 @@
 
 			// 1.2
 			mousewheel: false,
-			wheelSpeed: 0
-			
+			wheelSpeed: 0,
+			lazyload: false
 
 			// CALLBACKS: onBeforeSeek, onSeek, onReload
 		} 
@@ -67,9 +66,8 @@
 			 horizontal = !conf.vertical,
 			 wrap = root.children(),
 			 index = 0,
-			 forward;  
-		
-		
+			 forward;
+				
 		if (!current) { current = self; }
 
 		// bind all callbacks from configuration
@@ -262,6 +260,10 @@
 				return self;
 			},
 
+			getLoader: function() {
+				return loader;	
+			},
+			
 			click: function(i) {
 
 				var item = self.getItems().eq(i), 
@@ -421,10 +423,32 @@
 				});			
 			}
 
-		});
-		
-		self.reload(); 
+		}); 
+
+		// lazyload support. all logic is here.
+		var lconf = $.tools.lazyload && conf.lazyload, loader, lazies;
+			 
+		if (lconf) {
+			lazies = lconf === true ? self.getItems() : root.find(lconf.select || lconf);
+			
+			if (typeof lconf != 'object') { lconf = {}; }
+			
+			$.extend(lconf, { growParent: root, api: true}, lconf); 
+			loader = lazies.lazyload(lconf);
+			
+			function load(ev, i) {
+				var els = self.getItems().slice(i, i + conf.size);
+				
+				els.each(function() {
+					els = els.add($(this).find(":unloaded"));
+				}); 
+				loader.load(els);						
+			} 
+			self.onBeforeSeek(load);  
+			load(null, 0);
+		}
 
+		self.reload();  
 	}