diff --git a/ui (gen4)/data.js b/ui (gen4)/data.js
index 70e7fce3..4a786b91 100755
--- a/ui (gen4)/data.js	
+++ b/ui (gen4)/data.js	
@@ -96,18 +96,32 @@ module.DATA_VERSION = '3.0'
 //
 /*********************************************************************/
 
+// decide to use a hashing function...
+if(typeof(sha1) != 'undefined'){
+	var hash = sha1.hash.bind(sha1)
+} else {
+	var hash = function(g){ return g }
+}
+
+
+/*********************************************************************/
+
 // Data class methods and API...
 //
 var DataClassPrototype =
 module.DataClassPrototype = {
 	// NOTE: we consider the input list sorted...
-	fromList: function(list){
+	fromArray: function(list){
 		var res = new Data()
 		// XXX make a real ribbon gid...
 		var gid = res.newGid()
 		res.order = list
 		res.ribbon_order.push(gid)
 		res.ribbons[gid] = list.slice()
+
+		res.focusImage(list[0])
+		res.setBase(gid)
+
 		return res
 	},
 	// XXX is this the right way to construct data???
@@ -251,12 +265,6 @@ module.DataPrototype = {
 		if(typeof(process) != 'undefined'){
 			p += process.pid + '-'
 		}
-		// decide to use a hashing function...
-		if(typeof(sha1) != 'undefined'){
-			var hash = sha1.hash.bind(sha1)
-		} else {
-			var hash = function(g){ return g }
-		}
 
 		// return string as-is...
 		if(nohash){
diff --git a/ui (gen4)/file.js b/ui (gen4)/file.js
index 8a77530d..46724b56 100755
--- a/ui (gen4)/file.js	
+++ b/ui (gen4)/file.js	
@@ -4,27 +4,29 @@
 *
 **********************************************************************/
 
+var glob = require('glob')
+var path = require('path')
+
+
 define(function(require){ var module = {}
 console.log('>>> file')
 
 //var DEBUG = DEBUG != null ? DEBUG : true
 
-
-/*********************************************************************/
-
-function listDir(path){
-}
-
-function openFile(path){
-}
-
-function loadJSONFile(path){
-}
+var tasks = require('lib/tasks')
 
 
 
 /*********************************************************************/
 
+var INDEX_DIR = '.ImageGrid'
+
+
+/*********************************************************************/
+
+function listIndexes(base){
+	return glob(base +'/**/'+ INDEX_DIR)
+}
 
 
 /**********************************************************************
diff --git a/ui (gen4)/images.js b/ui (gen4)/images.js
index ac1bc787..1f1ffbe5 100755
--- a/ui (gen4)/images.js	
+++ b/ui (gen4)/images.js	
@@ -9,6 +9,17 @@ console.log('>>> images')
 
 //var DEBUG = DEBUG != null ? DEBUG : true
 
+var sha1 = require('./ext-lib/sha1')
+
+
+/*********************************************************************/
+
+// decide to use a hashing function...
+if(typeof(sha1) != 'undefined'){
+	var hash = sha1.hash.bind(sha1)
+} else {
+	var hash = function(g){ return g }
+}
 
 
 /*********************************************************************/
@@ -224,6 +235,20 @@ module.makeImageSeqOrNameCmp = function(data, get, seq){
 
 var ImagesClassPrototype =
 module.ImagesClassPrototype = {
+	fromArray: function(data){
+		var images = new this()
+		// XXX stub...
+		var i = 0
+		data.forEach(function(path){
+			var gid = hash('I'+i)
+			images[gid] = {
+				id: gid,
+				path: path,
+			}
+			i += 1
+		})
+		return images
+	},
 	fromJSON: function(data){
 		return new this().loadJSON(data)
 	},
@@ -324,6 +349,7 @@ module.ImagesPrototype = {
 		var url = img_data.path
 		var preview_size = 'Original'
 		var p = Infinity
+		var previews = img_data.preview || {}
 
 		for(var k in img_data.preview){
 			s = parseInt(k)
diff --git a/ui (gen4)/nw.js b/ui (gen4)/nw.js
index d07d03c3..a658ee78 100755
--- a/ui (gen4)/nw.js	
+++ b/ui (gen4)/nw.js	
@@ -20,7 +20,7 @@ var browser = require('browser')
 //var data = require('data')
 
 window.toggleFullscreenMode = 
-module.toggleFullscreenMode = makeCSSClassToggler(
+module.toggleFullscreenMode = CSSClassToggler(
 		document.body, 
 		'.full-screen-mode',
 		function(action){
diff --git a/ui (gen4)/package.json b/ui (gen4)/package.json
index 5a42ef8d..5ba19a16 100755
--- a/ui (gen4)/package.json	
+++ b/ui (gen4)/package.json	
@@ -1,26 +1,23 @@
-{
-	"name": "ImageGrid.Viewer",
-	"main": "index.html",
-	"version": "0.0.1",
-
-	"window": {
-		"title": "ImageGrid.Viewer",
-		"position": "center",
-		"width": 900,
-		"height": 700,
-		"min_width": 400,
-		"min_height": 400,
-		"frame": false,
-		"toolbar": false
-	},
-
-	"webkit": {
-		"page-cache": true
-	},
-
-	"dependencies": {
-		"requirejs": "*",
-		"fs.extra": "*"
-	}
-	
-}
+{
+  "name": "ImageGrid.Viewer",
+  "main": "index.html",
+  "version": "0.0.1",
+  "window": {
+    "title": "ImageGrid.Viewer",
+    "position": "center",
+    "width": 900,
+    "height": 700,
+    "min_width": 400,
+    "min_height": 400,
+    "frame": false,
+    "toolbar": false
+  },
+  "webkit": {
+    "page-cache": true
+  },
+  "dependencies": {
+    "fs.extra": "*",
+    "glob": "^4.0.6",
+    "requirejs": "*"
+  }
+}
diff --git a/ui (gen4)/viewer.js b/ui (gen4)/viewer.js
index 8973f8c3..a6e42ca3 100755
--- a/ui (gen4)/viewer.js	
+++ b/ui (gen4)/viewer.js	
@@ -197,8 +197,8 @@ actions.Actions({
 	//
 	load: [
 		function(d){
-			this.data = data.Data(d.data)
 			this.images = images.Images(d.images)
+			this.data = data.Data(d.data)
 		}],
 	clear: [
 		function(){
@@ -206,6 +206,13 @@ actions.Actions({
 			delete this.Images
 		}],
 
+	// XXX should this be here???
+	loadURLs: ['Load a URL list',
+		function(lst){
+			this.images = images.Images.fromArray(lst)
+			this.data = data.Data.fromArray(Object.keys(this.images))
+		}],
+
 
 	// basic navigation...
 	//
@@ -523,21 +530,16 @@ actions.Actions(Client, {
 
 	load: [
 		function(data){
-			// recycle the viewer if one is not given specifically...
-			var viewer = data.viewer
-			viewer = viewer == null && this.ribbons != null 
-				? this.ribbons.viewer 
-				: viewer
-			// XXX do we need to recycle the images???
-
-			// XXX is keeping ribbons here correct???
-			if(this.ribbons == null){
-				this.ribbons = ribbons.Ribbons(viewer, data.images)
-			}
-
 			return function(){
-				// XXX do a partial load...
-				// XXX
+				// recycle the viewer if one is not given specifically...
+				var viewer = data.viewer
+				viewer = viewer == null && this.ribbons != null 
+					? this.ribbons.viewer 
+					: viewer
+
+				if(this.ribbons == null){
+					this.ribbons = ribbons.Ribbons(viewer, data.images)
+				}
 
 				this.reload()
 			}
@@ -567,12 +569,28 @@ actions.Actions(Client, {
 			}
 		}],
 	clear: [
-		// XXX do we need to delete the ribbons???
+		function(){ this.ribbons.clear() }],
+
+	loadURLs: [
 		function(){
-			this.ribbons.clear()
-			delete this.ribbons
+			return function(){
+				// recycle the viewer if one is not given specifically...
+				var viewer = this.ribbons != null 
+					? this.ribbons.viewer 
+					: viewer
+
+				if(this.ribbons == null){
+					this.ribbons = ribbons.Ribbons(viewer, data.images)
+
+				} else {
+					this.ribbons.clear()
+				}
+
+				this.reload()
+			}
 		}],
 
+
 	// XXX move this to a viewer window action set
 	close: ['Cloase viewer',
 		function(){