diff --git a/ui/cache.js b/ui/cache.js
index e51d4600..b7cb2868 100755
--- a/ui/cache.js
+++ b/ui/cache.js
@@ -32,7 +32,7 @@ function preCacheRibbonImages(ribbon){
 		var size = getVisibleImageSize('max')
 		var screen_size = getScreenWidthInImages(getVisibleImageSize())
 		// XXX needs tuning...
-		var cache_frame_size = (screen_size * LOAD_SCREENS)
+		var cache_frame_size = (screen_size * CONFIG.load_screens)
 		var images = ribbon.find('.image')
 		var first = getImageGID(images.first())
 		var last = getImageGID(images.last())
diff --git a/ui/compatibility.js b/ui/compatibility.js
index c7c9f2c1..c1dd8863 100755
--- a/ui/compatibility.js
+++ b/ui/compatibility.js
@@ -210,6 +210,8 @@ if(window.CEF_dumpJSON != null){
 	window.makeImagePreviews = function(gid, sizes, mode, no_update_loaded){
 		mode = mode == null ? 'fast_f' : mode
 
+		var cache_dir = CONFIG.cache_dir
+
 		var img = IMAGES[gid]
 		var source = normalizePath(img.path)
 		var name = gid +' - '+ source.split(/[\\\/]/).pop()
@@ -225,7 +227,7 @@ if(window.CEF_dumpJSON != null){
 		}
 
 		// build usable local path (without 'file:///')...
-		var cache_path = normalizePath(CACHE_DIR)
+		var cache_path = normalizePath(cache_dir)
 		cache_path = osPath(cache_path)
 
 		// get cur image size...
@@ -249,7 +251,7 @@ if(window.CEF_dumpJSON != null){
 						if(img.preview == null || !((size+'px') in img.preview)){
 							var preview_path = [target_path, name].join('/')
 							// add the preview to the image object...
-							img.preview[size+'px'] = './' + CACHE_DIR +'/'+ preview_path.split(CACHE_DIR).pop()
+							img.preview[size+'px'] = './' + cache_dir +'/'+ preview_path.split(cache_dir).pop()
 							// mark image dirty...
 							imageUpdated(gid)
 						}
@@ -320,7 +322,7 @@ if(window.CEF_dumpJSON != null){
 								if(!('preview' in img)){
 									img.preview = {}
 								}
-								img.preview[size+'px'] = './' + CACHE_DIR +'/'+ preview_path.split(CACHE_DIR).pop()
+								img.preview[size+'px'] = './' + cache_dir +'/'+ preview_path.split(cache_dir).pop()
 								// mark image dirty...
 								imageUpdated(gid)
 								// we are done...
@@ -454,7 +456,7 @@ if(window.CEF_dumpJSON != null){
 		gui.Window.get().reload()
 	}
 	window.setWindowTitle = function(text){
-		var title = text +' - '+ APP_NAME
+		var title = text +' - '+ CONFIG.app_name
 		gui.Window.get().title = title
 		$('.title-bar .title').text(title)
 	}
diff --git a/ui/data.js b/ui/data.js
index 6dfebbe8..b79b4044 100755
--- a/ui/data.js
+++ b/ui/data.js
@@ -9,40 +9,74 @@
 *
 **********************************************************************/
 
-//var DEBUG = DEBUG != null ? DEBUG : true
 
-var APP_NAME = 'ImageGrid.Viewer'
+var CONFIG = {
+	app_name: 'ImageGrid.Viewer',
 
-var DATA_ATTR = 'DATA'
+	// Loader configuration...
+	//
+	//		load_screens	
+	// 	|<---------------------->|
+	// 	ooooooooooooXooooooooooooo
+	// 					 |<----->|<------------>|
+	// 						^	   roll_frame			  
+	// 		load_threshold -+
+	//
+	// number of screens to keep loaded...
+	//
+	// NOTE: a "screen" is the number of images that can fit one screen
+	// 		width, as returned by getScreenWidthInImages(..)
+	load_screens: 6,
+	// size of the frame to load relative to LOAD_SCREENS
+	roll_frame: 1/3,
+	// the threshold size relative to LOAD_SCREENS
+	load_threshold: 1/4,
+	// A threshold after which the image block ratio will be changed form 
+	// 1x1 to 'fit-viewer' in single image mode...
+	//
+	// NOTE: if null this feature will be disabled.
+	proportions_ratio_threshold: 1.5,
 
-// Loader configuration...
-//
-//		LOAD_SCREENS	
-// 	|<---------------------->|
-// 	ooooooooooooXooooooooooooo
-// 					 |<----->|<------------>|
-// 						^	   ROLL_FRAME			  
-// 		LOAD_THRESHOLD -+
-//
-// number of screens to keep loaded...
-var LOAD_SCREENS = 6
-// size of the frame to load relative to LOAD_SCREENS
-var ROLL_FRAME = 1/3
-// the threshold size relative to LOAD_SCREENS
-var LOAD_THRESHOLD = 1/4
+	// ribbon scale limits and defaults...
+	default_screen_images: 4,
+	max_screen_images: 12,
+	zoom_step_scale: 1.2,
 
-var DEFAULT_SCREEN_IMAGES = 4
-var MAX_SCREEN_IMAGES = 12
+	// localStorage prefix...
+	data_attr: 'DATA',
 
-// A threshold after which the image block ratio will be changed to 
-// 'fit-viewer' in single image mode...
-//
-// NOTE: if null this feature will be disabled.
-var PROPORTIONS_RATIO_THRESHOLD = 1.5
+	// file cache settings...
+	cache_dir: '.ImageGrid',
+	cache_dir_var: '${CACHE_DIR}',
 
 
-var CACHE_DIR = '.ImageGrid'
-var CACHE_DIR_VAR = '${CACHE_DIR}'
+	// if true updateImages(..) will sort the images before updating, so as
+	// to make the visible images update first...
+	//
+	// XXX appears to have little effect...
+	update_sort_enabled: false,
+
+	// if set then the actual updating will be done in parallel. this is to 
+	// make actions that lead to an update have less latency...
+	//
+	// XXX for some reason the sync version appears to work faster...
+	update_sync: false,
+	// if this is true image previews will be loaded synchronously by 
+	// default...
+	sync_img_loader: false,
+
+}
+
+// User interface state...
+// NOTE: these are named: <mode>-<feature>
+var UI_STATE = {
+	'global-theme': null,
+	'ribbon-mode-screen-images': null,
+	'single-image-mode-screen-images': null,
+	'single-image-mode-proportions': null,
+	'ribbon-mode-image-info': 'off',
+}
+
 
 // A stub image, also here for documentation...
 var STUB_IMAGE_DATA = {
@@ -130,43 +164,16 @@ var IMAGES = {}
 // list of image GIDs that have been updated...
 var IMAGES_UPDATED = []
 
+// Flag indicating a new image file was constructed...
+// XXX do we need this?
 var IMAGES_CREATED = false
 
-var MARKED = []
-
-// NOTE: these are named: <mode>-<feature>
-var SETTINGS = {
-	'global-theme': null,
-	'ribbon-mode-screen-images': null,
-	'single-image-mode-screen-images': null,
-	'single-image-mode-proportions': null,
-	'ribbon-mode-image-info': 'off',
-}
-
 var BASE_URL = '.'
 
-// XXX make these usable for both saving and loading...
-// XXX get these from config...
-var IMAGES_FILE_DEFAULT = 'images.json'
-var IMAGES_FILE_PATTERN = /^[0-9]*-images.json$/
-var IMAGES_DIFF_FILE_PATTERN = /^[0-9]*-images-diff.json$/
-
-var DATA_FILE_DEFAULT = 'data.json'
-var DATA_FILE_PATTERN = /^[0-9]*-data.json$/
-
-var IMAGE_PATTERN = /.*\.(jpg|jpeg|png|gif)$/i
-
-var UPDATE_SORT_ENABLED = false
-// XXX for some reason the sync version appears to work faster...
-var UPDATE_SYNC = false
-
-// if this is true image previews will be loaded synchronously by 
-// default...
-var SYNC_IMG_LOADER = false
-
-
 // list of function that update image state...
 //
+// these are called by updateImage(..) after the image is created.
+//
 // each function must be of the form:
 // 	updateImage(gid, image) -> image
 //
@@ -589,7 +596,7 @@ function getGIDsAfter(count, gid, ribbon, inclusive, data){
 	gid = gid == null ? getImageGID() : gid
 	data = data == null ? DATA : data
 	ribbon = ribbon == null ? getRibbonIndex() : ribbon
-	count = count == null ? Math.round(LOAD_SCREENS * getScreenWidthInImages()) : count
+	count = count == null ? Math.round(CONFIG.load_screens * getScreenWidthInImages()) : count
 	ribbon = ribbon == null ? getGIDRibbonIndex(gid, data) : ribbon
 
 	// get a local gid...
@@ -660,7 +667,7 @@ function getGIDsAround(count, gid, ribbon, data, force_count){
 	gid = gid == null ? getImageGID() : gid
 	ribbon = ribbon == null ? getRibbonIndex() : ribbon
 	// XXX is this out of context here???
-	count = count == null ? Math.round(LOAD_SCREENS * getScreenWidthInImages()) : count
+	count = count == null ? Math.round(CONFIG.load_screens * getScreenWidthInImages()) : count
 
 	var ribbon_data = data.ribbons[ribbon]
 	// get a gid that's in the current ribbon...
@@ -823,10 +830,10 @@ function normalizePath(url, base, mode, do_unescape){
 	}
 
 	// get the actual path...
-	res = res.replace('${CACHE_DIR}', CACHE_DIR)
+	res = res.replace(CONFIG.cache_dir_var, CONFIG.cache_dir)
 
 	// XXX legacy support...
-	res = res.replace('.ImageGridCache', CACHE_DIR)
+	res = res.replace('.ImageGridCache', CONFIG.cache_dir)
 
 	if(do_unescape){
 		return unescape(res)
@@ -1413,7 +1420,7 @@ function _loadImagePreviewURL(image, url){
 // XXX do a pre-caching framework...
 function updateImage(image, gid, size, sync){
 	image = image == null ? getImage() : $(image)
-	sync = sync == null ? SYNC_IMG_LOADER : sync
+	sync = sync == null ? CONFIG.sync_img_loader : sync
 	var oldgid = getImageGID(image)
 
 	if(oldgid == gid || gid == null){
@@ -1503,7 +1510,7 @@ function updateImages(size, cmp){
 		size = size == null ? getVisibleImageSize('max') : size
 
 		// sorted run...
-		if(UPDATE_SORT_ENABLED && cmp != false){
+		if(CONFIG.update_sort_enabled && cmp != false){
 			cmp = cmp == null ? 
 					makeGIDDistanceCmp(getImageGID(), getImageGID) 
 					// XXX this is more correct but is slow...
@@ -1526,7 +1533,7 @@ function updateImages(size, cmp){
 		}
 	}
 
-	if(UPDATE_SYNC){
+	if(CONFIG.update_sync){
 		_worker()
 	} else {
 		setTimeout(_worker, 0)
@@ -1554,7 +1561,7 @@ function loadImagesAround(count, gid, ribbon, data, force_count){
 	data = data == null ? DATA : data
 	ribbon = ribbon == null ? getRibbonIndex() : ribbon
 	ribbon = typeof(ribbon) != typeof(123) ? getRibbonIndex(ribbon) : ribbon
-	count = count == null ? Math.round(LOAD_SCREENS * getScreenWidthInImages()) : count
+	count = count == null ? Math.round(CONFIG.load_screens * getScreenWidthInImages()) : count
 	// get a gid that exists in the current ribbon...
 	gid = getGIDBefore(gid, ribbon, null, data)
 
@@ -1681,7 +1688,7 @@ function reloadViewer(images_per_screen){
 	var current = DATA.current
 	// 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
+	w = w > CONFIG.max_screen_images ? CONFIG.default_screen_images : w
 
 	// clear data...
 	$('.ribbon').remove()
@@ -1693,7 +1700,7 @@ function reloadViewer(images_per_screen){
 
 	// create images...
 	$('.ribbon').each(function(i, e){
-		loadImagesAround(Math.round(w * LOAD_SCREENS), current, i)
+		loadImagesAround(Math.round(w * CONFIG.load_screens), current, i)
 	})
 
 	focusImage(getImage(current))
@@ -1703,19 +1710,19 @@ function reloadViewer(images_per_screen){
 }
 
 
-// Apply the current SETTINGS to current viewer
+// Apply the current UI_STATE to current viewer
 function loadSettings(){
-	toggleTheme(SETTINGS['global-theme'])
+	toggleTheme(UI_STATE['global-theme'])
 
 	if(toggleSingleImageMode('?') == 'on'){
-		var w = SETTINGS['single-image-mode-screen-images']
-		if(window.PROPORTIONS_RATIO_THRESHOLD == null){
-			var p = SETTINGS['single-image-mode-proportions']
+		var w = UI_STATE['single-image-mode-screen-images']
+		if(CONFIG.proportions_ratio_threshold == null){
+			var p = UI_STATE['single-image-mode-proportions']
 			toggleImageProportions(p)
 		}
 	} else {
-		var w = SETTINGS['ribbon-mode-screen-images']
-		toggleImageInfo(SETTINGS['ribbon-mode-image-info'] == 'on' ? 'on' : 'off')
+		var w = UI_STATE['ribbon-mode-screen-images']
+		toggleImageInfo(UI_STATE['ribbon-mode-image-info'] == 'on' ? 'on' : 'off')
 	}
 	fitNImages(w)
 }
@@ -1900,12 +1907,12 @@ function setupData(viewer){
 
 			var screen_size = getScreenWidthInImages()
 			screen_size = screen_size < 1 ? 1 : screen_size
-			var load_frame_size = Math.round(screen_size * LOAD_SCREENS)
+			var load_frame_size = Math.round(screen_size * CONFIG.load_screens)
 
 			// target image is loaded...
 			if(gid_before == getImageGID(img_before)){
-				var roll_frame_size = Math.ceil(load_frame_size * ROLL_FRAME)
-				var threshold = Math.floor(load_frame_size * LOAD_THRESHOLD) 
+				var roll_frame_size = Math.ceil(load_frame_size * CONFIG.roll_frame)
+				var threshold = Math.floor(load_frame_size * CONFIG.load_threshold) 
 				threshold = threshold < 1 ? 1 : threshold
 
 				var head = img_before.prevAll('.image').length
@@ -1939,7 +1946,6 @@ function setupData(viewer){
 			}
 		})
 
-
 		.on('shiftedImage', function(evt, image, from, to){
 			from = getRibbonIndex(from)
 			//var ribbon = to
@@ -1960,7 +1966,6 @@ function setupData(viewer){
 			flashIndicator(from < to ? 'next' : 'prev')
 		})
 
-
 		.on('createdRibbon', function(evt, index){
 			index = getRibbonIndex(index)
 			DATA.ribbons.splice(index, 0, [])
@@ -1969,7 +1974,6 @@ function setupData(viewer){
 			DATA.ribbons.splice(index, 1)
 		})
 
-
 		.on('requestedFirstImage', function(evt, ribbon){
 			var r = getRibbonIndex(ribbon)
 			var gr = DATA.ribbons[r]
@@ -2006,20 +2010,20 @@ function setupData(viewer){
 					return
 				}
 				*/
-				loadImagesAround(Math.round(screen_size * LOAD_SCREENS), gid, r, null, true)
+				loadImagesAround(Math.round(screen_size * CONFIG.load_screens), gid, r, null, true)
 			})
 
 			centerView(null, 'css')
 
 			// update settings...
 			if(toggleSingleImageMode('?') == 'on'){
-				SETTINGS['single-image-mode-screen-images'] = n
+				UI_STATE['single-image-mode-screen-images'] = n
 			} else {
-				SETTINGS['ribbon-mode-screen-images'] = n
+				UI_STATE['ribbon-mode-screen-images'] = n
 			}
 
 			// update proportions...
-			if(window.PROPORTIONS_RATIO_THRESHOLD != null 
+			if(CONFIG.proportions_ratio_threshold != null 
 					&& toggleSingleImageMode('?') == 'on'){
 
 				var h = getVisibleImageSize('height')
@@ -2029,7 +2033,7 @@ function setupData(viewer){
 
 				var m = Math.min(W/w, H/h)
 
-				if(m < PROPORTIONS_RATIO_THRESHOLD){
+				if(m < CONFIG.proportions_ratio_threshold){
 					toggleImageProportions('fit-viewer')
 				} else {
 					toggleImageProportions('none')
@@ -2056,11 +2060,11 @@ function setupData(viewer){
 			updateImages()
 		})
 
-
 		.on('focusingImage', function(evt, image){
 			image = $(image)
 			DATA.current = getImageGID(image)
 
+			// XXX should this be here???
 			if(window.setWindowTitle != null){
 				// XXX do we need to hide the extension...
 				setWindowTitle(getImageFileName())
@@ -2068,7 +2072,6 @@ function setupData(viewer){
 			}
 		})
 
-
 		// basic image manipulation...
 		.on('rotatingLeft rotatingRight', function(evt, image){
 			$(image).each(function(i, e){
@@ -2104,7 +2107,6 @@ function setupData(viewer){
 			})
 		})
 
-
 		.on('baseURLChanged', function(evt, url){
 			saveLocalStorageBaseURL()
 			saveLocalStorageBaseURLHistory()
diff --git a/ui/files.js b/ui/files.js
index d5a5f0b1..23f8965c 100755
--- a/ui/files.js
+++ b/ui/files.js
@@ -6,6 +6,18 @@
 
 //var DEBUG = DEBUG != null ? DEBUG : true
 
+// XXX make these usable for both saving and loading...
+// XXX get these from config...
+var IMAGES_FILE_DEFAULT = 'images.json'
+var IMAGES_FILE_PATTERN = /^[0-9]*-images.json$/
+var IMAGES_DIFF_FILE_PATTERN = /^[0-9]*-images-diff.json$/
+
+var DATA_FILE_DEFAULT = 'data.json'
+var DATA_FILE_PATTERN = /^[0-9]*-data.json$/
+
+var IMAGE_PATTERN = /.*\.(jpg|jpeg|png|gif)$/i
+
+
 var FILE_LOADERS = []
 var FILE_SAVERS = []
 
@@ -191,7 +203,7 @@ function makeFileLoader(title, file_dfl, file_pattern, data_set, skip_reg){
 		var res = $.Deferred()
 		// default locations...
 		if(path == null){
-			var base = normalizePath(CACHE_DIR_VAR)
+			var base = normalizePath(CONFIG.cache_dir_var)
 			var loader = loadLatestFile(base, 
 					file_dfl, 
 					file_pattern,
@@ -199,12 +211,12 @@ function makeFileLoader(title, file_dfl, file_pattern, data_set, skip_reg){
 					[])
 		
 		// explicit path...
-		// XXX need to account for paths without a CACHE_DIR
+		// XXX need to account for paths without a CONFIG.cache_dir
 		} else {
 			path = normalizePath(path)
-			var base = path.split(CACHE_DIR)[0]
-			//base = normalizePath(path +'/'+ CACHE_DIR_VAR)
-			base = path +'/'+ CACHE_DIR
+			var base = path.split(CONFIG.cache_dir)[0]
+			//base = normalizePath(path +'/'+ CONFIG.cache_dir_var)
+			base = path +'/'+ CONFIG.cache_dir
 
 			// XXX is this correct???
 			var loader = loadLatestFile(base, 
@@ -228,7 +240,7 @@ function makeFileLoader(title, file_dfl, file_pattern, data_set, skip_reg){
 function makeFileSaver(file_dfl, data_get, skip_reg){
 	var _saver = function(name){
 		name = name == null 
-			? normalizePath(CACHE_DIR_VAR +'/'+ Date.timeStamp()) 
+			? normalizePath(CONFIG.cache_dir_var +'/'+ Date.timeStamp()) 
 			: name
 
 		dumpJSON(name + '-' + file_dfl, data_get())
@@ -327,7 +339,7 @@ function loadFileImages(path, no_load_diffs){
 
 	// default locations...
 	if(path == null){
-		var base = normalizePath(CACHE_DIR_VAR) 
+		var base = normalizePath(CONFIG.cache_dir_var) 
 		var loader = loadLatestFile(base, 
 				IMAGES_FILE_DEFAULT, 
 				IMAGES_FILE_PATTERN, 
@@ -335,7 +347,7 @@ function loadFileImages(path, no_load_diffs){
 	
 	// explicit base dir...
 	} else if(!/\.json$/i.test(path)) {
-		var base = normalizePath(path +'/'+ CACHE_DIR_VAR) 
+		var base = normalizePath(path +'/'+ CONFIG.cache_dir_var) 
 		var loader = loadLatestFile(base, 
 				IMAGES_FILE_DEFAULT, 
 				IMAGES_FILE_PATTERN, 
@@ -365,10 +377,10 @@ function loadFileImages(path, no_load_diffs){
 // (full) images.json file. Also removing the diff files.
 //
 // NOTE: if an explicit name is given then this will not remove anything.
-// NOTE: this will use CACHE_DIR as the location if no name is given.
+// NOTE: this will use CONFIG.cache_dir as the location if no name is given.
 function saveFileImages(name){
 	var remove_diffs = (name == null)
-	name = name == null ? normalizePath(CACHE_DIR_VAR +'/'+ Date.timeStamp()) : name
+	name = name == null ? normalizePath(CONFIG.cache_dir_var +'/'+ Date.timeStamp()) : name
 
 	if(window.dumpJSON == null){
 		showErrorStatus('Can\'t save to file.')
@@ -377,11 +389,11 @@ function saveFileImages(name){
 
 	// remove the diffs...
 	if(remove_diffs){
-		$.each($.map(listDir(normalizePath(CACHE_DIR_VAR)), function(e){ 
+		$.each($.map(listDir(normalizePath(CONFIG.cache_dir_var)), function(e){ 
 				return IMAGES_DIFF_FILE_PATTERN.test(e) ? e : null
 			}), function(i, e){
 				showStatusQ('removeing:', e)
-				removeFile(normalizePath(CACHE_DIR_VAR +'/'+ e))
+				removeFile(normalizePath(CONFIG.cache_dir_var +'/'+ e))
 			})
 		IMAGES_UPDATED = []
 	}
@@ -402,10 +414,10 @@ function loadFileState(path, prefix){
 	// XXX explicit data file path...
 	if(/\.json$/i.test(path)){
 		// XXX at this 
-		var base = path.split(CACHE_DIR)[0]
+		var base = path.split(CONFIG.cache_dir)[0]
 		base = base == path ? '.' : base
 	} else {
-		var base = path.split(CACHE_DIR)[0]
+		var base = path.split(CONFIG.cache_dir)[0]
 		base = base == path ? '.' : base
 	}
 
@@ -467,7 +479,7 @@ function saveFileState(name, no_normalize_path){
 	name = name == null ? Date.timeStamp() : name
 
 	if(!no_normalize_path){
-		name = normalizePath(CACHE_DIR_VAR +'/'+ name)
+		name = normalizePath(CONFIG.cache_dir_var +'/'+ name)
 
 	// write .image_file only if saving data to a non-cache dir...
 	// XXX check if this is correct...
@@ -608,8 +620,8 @@ function loadDir(path, no_preview_processing, prefix){
 	}
 
 	// see if there is a cache...
-	if(files.indexOf(CACHE_DIR) >= 0){
-		path = path +'/'+ CACHE_DIR
+	if(files.indexOf(CONFIG.cache_dir) >= 0){
+		path = path +'/'+ CONFIG.cache_dir
 	}
 
 	bubbleProgress(prefix, 
diff --git a/ui/index.html b/ui/index.html
index 6e98f076..a837c45a 100755
--- a/ui/index.html
+++ b/ui/index.html
@@ -156,13 +156,15 @@ $(function(){
 
 	// XXX do we need drag'n'drop here???
 
+	var data_attr = CONFIG.data_attr
+
 	// we have an image.json file...
-	if((DATA_ATTR + '_BASE_URL') in localStorage
-			&& !/^\.[\/\\]*/.test(localStorage[DATA_ATTR + '_BASE_URL'])){
+	if((data_attr + '_BASE_URL') in localStorage
+			&& !/^\.[\/\\]*/.test(localStorage[data_attr + '_BASE_URL'])){
 
-		loadLocalStorageBaseURLHistory(DATA_ATTR)
+		loadLocalStorageBaseURLHistory(data_attr)
 
-		BASE_URL = localStorage[DATA_ATTR + '_BASE_URL']
+		BASE_URL = localStorage[data_attr + '_BASE_URL']
 
 		var loading = statusNotify(loadDir(BASE_URL))
 
@@ -186,12 +188,12 @@ $(function(){
 	loading
 		.done(function(){
 			showStatus('Loading settings...')
-			DATA_ATTR + '_SETTINGS' in localStorage && loadLocalStorageSettings()
+			data_attr + '_SETTINGS' in localStorage && loadLocalStorageSettings()
 
 			/* XXX do we need this???
 			// XXX this will reload everything...
 			MARKED.length == 0 
-				&& DATA_ATTR + '_MARKED' in localStorage 
+				&& data_attr + '_MARKED' in localStorage 
 				&& loadLocalStorageMarks()
 			*/
 
diff --git a/ui/localstorage.js b/ui/localstorage.js
index a5f7c54d..16a53baf 100755
--- a/ui/localstorage.js
+++ b/ui/localstorage.js
@@ -14,28 +14,28 @@
 */
 
 function loadLocalStorageBaseURL(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	setBaseURL(localStorage[attr + '_BASE_URL'])
 }
 function saveLocalStorageBaseURL(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	localStorage[attr + '_BASE_URL'] = getBaseURL()
 }
 
 
 function loadLocalStorageBaseURLHistory(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	BASE_URL_HISTORY = JSON.parse(localStorage[attr + '_BASE_URL_HISTORY'])
 	return BASE_URL_HISTORY
 }
 function saveLocalStorageBaseURLHistory(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	localStorage[attr + '_BASE_URL_HISTORY'] = JSON.stringify(BASE_URL_HISTORY)
 }
 
 
 function loadLocalStorageData(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	var data = localStorage[attr]
 	if(data == null){
 		data = '{}'
@@ -48,7 +48,7 @@ function loadLocalStorageData(attr){
 	}
 }
 function saveLocalStorageData(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 
 	var data = getAllData()
 	data.current = DATA.current
@@ -59,7 +59,7 @@ function saveLocalStorageData(attr){
 
 
 function loadLocalStorageImages(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_IMAGES'
 	var images = localStorage[attr]
 	if(images == null){
@@ -68,14 +68,14 @@ function loadLocalStorageImages(attr){
 	return JSON.parse(images)
 }
 function saveLocalStorageImages(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_IMAGES'
 	localStorage[attr] = JSON.stringify(IMAGES)
 }
 
 
 function loadLocalStorageMarks(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_MARKED'
 	var marked = localStorage[attr]
 	if(marked == null){
@@ -85,29 +85,29 @@ function loadLocalStorageMarks(attr){
 	return reloadViewer()
 }
 function saveLocalStorageMarks(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_MARKED'
 	localStorage[attr] = JSON.stringify(MARKED)
 }
 
 
 function loadLocalStorageSettings(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_SETTINGS'
-	SETTINGS = JSON.parse(localStorage[attr])
+	UI_STATE = JSON.parse(localStorage[attr])
 
 	loadSettings()
 }
 function saveLocalStorageSettings(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	attr += '_SETTINGS'
-	localStorage[attr] = JSON.stringify(SETTINGS)
+	localStorage[attr] = JSON.stringify(UI_STATE)
 }
 
 
 // generic save/load...
 function loadLocalStorage(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	var d = loadLocalStorageData(attr)
 	loadLocalStorageBaseURLHistory(attr)
 	setBaseURL(d.base_url)
@@ -116,7 +116,7 @@ function loadLocalStorage(attr){
 	return reloadViewer()
 }
 function saveLocalStorage(attr){
-	attr = attr == null ? DATA_ATTR : attr
+	attr = attr == null ? CONFIG.data_attr : attr
 	saveLocalStorageData(attr)
 	saveLocalStorageImages(attr)
 	saveLocalStorageBaseURLHistory()
diff --git a/ui/marks.js b/ui/marks.js
index 8f736762..b23775dc 100755
--- a/ui/marks.js
+++ b/ui/marks.js
@@ -6,6 +6,8 @@
 
 //var DEBUG = DEBUG != null ? DEBUG : true
 
+var MARKED = []
+
 var MARKED_FILE_DEFAULT = 'marked.json'
 var MARKED_FILE_PATTERN = /^[0-9]*-marked.json$/
 
diff --git a/ui/modes.js b/ui/modes.js
index 6651e69c..6ef61352 100755
--- a/ui/modes.js
+++ b/ui/modes.js
@@ -133,13 +133,13 @@ var toggleSingleImageMode = createCSSClassToggler(
 				TRANSITION_MODE_DEFAULT = 'css'
 
 				// save things...
-				SETTINGS['ribbon-mode-screen-images'] = w
-				SETTINGS['ribbon-mode-image-info'] = toggleImageInfo('?')
+				UI_STATE['ribbon-mode-screen-images'] = w
+				UI_STATE['ribbon-mode-image-info'] = toggleImageInfo('?')
 
 				// load things...
-				w = SETTINGS['single-image-mode-screen-images']
+				w = UI_STATE['single-image-mode-screen-images']
 				w = w == null ? 1 : w
-				var p = SETTINGS['single-image-mode-proportions']
+				var p = UI_STATE['single-image-mode-proportions']
 				p = p == null ? 'square' : p
 
 				// set stuff...
@@ -152,18 +152,18 @@ var toggleSingleImageMode = createCSSClassToggler(
 				TRANSITION_MODE_DEFAULT = 'animate'
 
 				// save things...
-				SETTINGS['single-image-mode-screen-images'] = w
-				SETTINGS['single-image-mode-proportions'] = toggleImageProportions('?')
+				UI_STATE['single-image-mode-screen-images'] = w
+				UI_STATE['single-image-mode-proportions'] = toggleImageProportions('?')
 
 				// load things...
-				w = SETTINGS['ribbon-mode-screen-images']
-				w = w == null ? DEFAULT_SCREEN_IMAGES : w
+				w = UI_STATE['ribbon-mode-screen-images']
+				w = w == null ? CONFIG.default_screen_images : w
 
 				toggleImageProportions('none')
 				fitNImages(w)
-				var i = SETTINGS['ribbon-mode-image-info'] == 'on' ? 'on' : 'off'
+				var i = UI_STATE['ribbon-mode-image-info'] == 'on' ? 'on' : 'off'
 				toggleImageInfo(i)
-				SETTINGS['ribbon-mode-image-info'] = i
+				UI_STATE['ribbon-mode-image-info'] = i
 
 				centerRibbons()
 			}
@@ -296,7 +296,7 @@ var toggleTheme = createCSSClassToggler(
 		],
 		// XXX does this get called for default state (gray)???
 		function(action){
-			SETTINGS['global-theme'] = action
+			UI_STATE['global-theme'] = action
 		})
 
 
@@ -305,7 +305,7 @@ var toggleImageInfo = createCSSClassToggler(
 		'.image-info-visible',
 		function(action){
 			if(toggleSingleImageMode('?') == 'off'){
-				SETTINGS['ribbon-mode-image-info'] = action
+				UI_STATE['ribbon-mode-image-info'] = action
 			}
 		})
 
diff --git a/ui/ribbons.js b/ui/ribbons.js
index 893d48c2..69201825 100755
--- a/ui/ribbons.js
+++ b/ui/ribbons.js
@@ -20,14 +20,16 @@
 *
 **********************************************************************/
 
+var CONFIG = {
+	max_screen_images: 12,
+	zoom_step_scale: 1.2,
+}
+
 // can be:
 // 	- animate
 // 	- css
 var TRANSITION_MODE_DEFAULT = 'animate'
 
-var MAX_SCREEN_IMAGES = 12
-var ZOOM_SCALE = 1.2
-
 
 
 /**********************************************************************
@@ -1145,15 +1147,15 @@ function fitNImages(n, fixed_proportions, no_strict_fit){
 function zoomIn(){
 	var w = getScreenWidthInImages()
 	if(w > 1){
-		w = w / ZOOM_SCALE
+		w = w / CONFIG.zoom_step_scale
 		fitNImages(w >= 1 ? w : 1)
 	}
 }
 function zoomOut(){
 	var w = getScreenWidthInImages()
-	if(w <= MAX_SCREEN_IMAGES){
-		w = w * ZOOM_SCALE
-		fitNImages(w <= MAX_SCREEN_IMAGES ? w : MAX_SCREEN_IMAGES)
+	if(w <= CONFIG.max_screen_images){
+		w = w * CONFIG.zoom_step_scale
+		fitNImages(w <= CONFIG.max_screen_images ? w : CONFIG.max_screen_images)
 	}
 }