mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-31 11:20:09 +00:00 
			
		
		
		
	working experiment, getting happy about the code...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									aa422c076e
								
							
						
					
					
						commit
						4f43673549
					
				| @ -117,21 +117,7 @@ function makeImage(id){ | ||||
| 	return $('<div class="image"/>') | ||||
| 			.attr({id: id}) | ||||
| 			.click(selectImage) | ||||
| } | ||||
| 
 | ||||
| function updateImage(image, cur, r, index){ | ||||
| 	console.log(cur, r, index) | ||||
| 	var id = image.attr('id') | ||||
| 	if(id == cur){ | ||||
| 		image.addClass('current') | ||||
| 	} | ||||
| 	var cur_i = index.indexOf(cur) | ||||
| 	if(cur_i < 0 || Math.abs(index.indexOf(id)-cur_i) > r){ | ||||
| 		image.addClass('unloaded') | ||||
| 	} else { | ||||
| 		image.removeClass('unloaded') | ||||
| 	} | ||||
| 	return image | ||||
| 			.addClass('unloaded') | ||||
| } | ||||
| 
 | ||||
| function loadJSON(json){ | ||||
| @ -145,18 +131,35 @@ function loadJSON(json){ | ||||
| 	for(var i=0; i<ribbons.length; i++){ | ||||
| 		var images = ribbons[i] | ||||
| 		var index = enumerate(images) | ||||
| 		if(view_ribbons[i] == null){ | ||||
| 		var ribbon = $('<div class="ribbon"/>').appendTo(field) | ||||
| 		for(var j in images){ | ||||
| 				updateImage(makeImage(j), cur_id, r, index).appendTo(ribbon) | ||||
| 			} | ||||
| 		} else { | ||||
| 			var ribbon = $(view_ribbons[i]) | ||||
| 			for(var j in images){ | ||||
| 				updateImage(ribbon.children('#'+j), cur_id, r, index) | ||||
| 			makeImage(j).appendTo(ribbon) | ||||
| 		} | ||||
| 	} | ||||
| 	$('#'+cur_id).click() | ||||
| } | ||||
| 
 | ||||
| function updateRibbon(img){ | ||||
| 	var images = img.parents('.ribbon').children('.image') | ||||
| 	var r = Math.floor(LOAD/2) | ||||
| 
 | ||||
| 	var cur_i = images.index(img) | ||||
| 
 | ||||
| 	// load... | ||||
| 	var loading = $([]) | ||||
| 	for(var i=Math.max(0, cur_i-r); i<=Math.min(images.length, cur_i+r); i++){ | ||||
| 		loading.push(images[i]) | ||||
| 		images[i] = {} | ||||
| 	} | ||||
| 	loading | ||||
| 		.addClass('loaded') | ||||
| 		.removeClass('unloaded') | ||||
| 
 | ||||
| 	// unload... | ||||
| 	images.filter('.loaded').removeClass('loaded').addClass('unloaded') | ||||
| 	//$('.image.loaded').not('._cur').removeClass('loaded').addClass('unloaded') | ||||
| 	//images.filter('._cur').removeClass('_cur') | ||||
| 	$('.image._cur').removeClass('_cur') | ||||
| } | ||||
| 
 | ||||
| function selectImage(){ | ||||
| @ -166,7 +169,8 @@ function selectImage(){ | ||||
| 	// update json... | ||||
| 	json.position = $(this).attr('id') | ||||
| 	// update visible images... | ||||
| 	loadJSON(json) | ||||
| 	//loadJSON(json) | ||||
| 	updateRibbon($('.current.image')) | ||||
| } | ||||
| 
 | ||||
| loadJSON(json) | ||||
|  | ||||
| @ -1161,7 +1161,7 @@ function makeImage(url, order, set_order){ | ||||
| 		set_order = setImageOrder | ||||
| 	} | ||||
| 	return (setupImageEventHandlers( | ||||
| 				set_order($('<div class="image"></div>') | ||||
| 				set_order($('<div class="image"/>') | ||||
| 					.css({ 'background-image': 'url('+url+')' }), order))) | ||||
| } | ||||
| 
 | ||||
| @ -1270,9 +1270,9 @@ function loadJSON(data, position, set_order){ | ||||
| 		var ribbon = $('<div class="ribbon"></div>') | ||||
| 			.appendTo(field) | ||||
| 		for(var j in images){ | ||||
| 			var image = $(images[j]) | ||||
| 			var image = images[j] | ||||
| 			// create image...
 | ||||
| 			makeImage(image.attr('url'), j, set_order) | ||||
| 			makeImage(image['url'], j, set_order) | ||||
| 				.appendTo(ribbon) | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user