diff --git a/ui/ImageGrid.js b/ui/ImageGrid.js
index 8c631c42..bed0fcb5 100755
--- a/ui/ImageGrid.js
+++ b/ui/ImageGrid.js
@@ -635,13 +635,18 @@ function loadImagesAround(ref_gid, count, ribbon){
 }
 
 
+var LOAD_SCREENS = 2
+var LOAD_THRESHOLD = 1
+var DEFAULT_SCREEN_IMAGES = 5
 
-function loadData(data){
+function loadData(data, images_per_screen){
 	var ribbons_set = $('.ribbon-set')
 	var current = data.current
-	// XXX will this work without any images loaded?
-	var w = getScreenWidthInImages()
+	// if no width is given, use the current or default...
+	var w = images_per_screen == null ? getScreenWidthInImages() : images_per_screen
+	w = w > MAX_SCREEN_IMAGES ? DEFAULT_SCREEN_IMAGES : w
 
+	// clear data...
 	$('.ribbon').remove()
 
 	// create ribbons...
@@ -656,6 +661,7 @@ function loadData(data){
 
 	focusImage($('.image').filter('[gid='+JSON.stringify(current)+']'))
 
+	fitNImages(w)
 	centerRibbons('css')
 }
 
@@ -774,6 +780,7 @@ function toggleImageProportions(mode){
 
 function focusImage(image){
 	image.closest('.viewer').find('.current.image').removeClass('current')
+	$('.viewer').trigger('focusingImage', [image])
 	return image.addClass('current')
 }
 
diff --git a/ui/index.html b/ui/index.html
index 4db93ee9..12ecb906 100755
--- a/ui/index.html
+++ b/ui/index.html
@@ -231,21 +231,8 @@
 // setup...
 $(function(){
 
-	// populate the viewer...
-	var r = createRibbon()
-	var images = []
-	for(var i=0; i < 40; i++){
-		images.push(createImage().text(i)[0]) 
-	}
-	r.append($(images))
-	//var rr = r.clone()
-	//var rrr = r.clone()
+	loadData(DATA)
 
-	// XXX use something like loadImages()...
-	$('.ribbon-set')
-		.append(r)
-		//.append(rr)
-		//.append(rrr)
 
 	// NOTE: this is global so as to not to add any extra complexity to 
 	//		the internal workings...
@@ -264,10 +251,6 @@ $(function(){
 
 	if(DYNAMIC_LOADING){
 		// XXX move to a setup function in the lib...
-		// XXX update this depending on zoom and navigation speed...
-		LOAD_SCREENS = 2
-		// XXX update this depending on zoom and navigation speed...
-		LOAD_THRESHOLD = 1
 		$('.viewer')
 			// XXX still some times does not load the needed ribbon section
 			//		on the first try...
@@ -322,6 +305,7 @@ $(function(){
 				*/
 			})
 			/*
+			// XXX BUGGY...
 			.on('centeringRibbon', function(evt, ribbon, image){
 				// check if we are in the right range...
 				var gid = getImageGID(image)
@@ -402,6 +386,10 @@ $(function(){
 			.on('fittingImages', function(evt, n){
 				updateImages()
 			})
+
+			.on('focusingImage', function(evt, image){
+				DATA.current = getImageGID($(image))
+			})
 	}