several fixes and tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

ui/base.js

@@ -431,7 +431,7 @@ function extendRibbon(left, right, ribbon, no_compensate_shift){
 	l = isNaN(l) ? 0 : l
 	// compensate for left shift...
 	if(!no_compensate_shift && left != 0){
-		l -= left * images.outerWidth()
+		l -= left * images.outerWidth(true)
 
 		ribbon.css({
 			left: l,

ui/data.js

@@ -716,6 +716,7 @@ function convertDataGen1(data, cmp){
 // NOTE: care must be taken to reset ALL attributes an image can have,
 // 		a common bug if this is not done correctly, is that some settings
 // 		may leak to newly loaded images...
+// XXX do a pre-caching framework...
 function updateImage(image, gid, size){
 	image = $(image)
 	var oldgid = getImageGID(image)
@@ -750,14 +751,23 @@ function updateImage(image, gid, size){
 
 	// pre-cache and load image...
 	// NOTE: this will make images load without a blackout...
+	// XXX add a cache of the form:
+	// 			{
+	// 				[<gid>, <size>]: Image,
+	// 				...
+	// 			}
+	// 		- sort by use...
+	// 		- limit length...
+	//
+	// 		...might also be a good idea to split cache to sizes and have
+	// 		different  but as limits for different sizes, but as sizes 
+	// 		can differ between images this is not trivial...
 	var img = new Image()
 	img.onload = function(){
 		image.css({
 				'background-image': 'url("'+ image.data().loading +'")',
 			})
 	}
-	// NOTE: this better be after the .onload declaration as in some cases
-	// 		we can get a cached image load "too fast"...
 	img.src = p_url
 
 	// main attrs...

ui/setup.js

@@ -86,7 +86,9 @@ function setupDataBindings(viewer){
 					// also load if we run out of images in the current ribbon,
 					// likely due to shifting...
 					|| ( gr.length > l 
-						&& l < screen_size * LOAD_SCREENS)){
+						&& l < Math.round(screen_size * LOAD_SCREENS))){
+				// XXX in some cases this makes the current ribbon align 
+				// 		in a wrong way...
 				loadImages(gid, Math.round(screen_size * LOAD_SCREENS), ribbon)
 			}