refactoring...

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

ui/data.js

@@ -34,6 +34,13 @@ var LOAD_THRESHOLD = 1/4
 var DEFAULT_SCREEN_IMAGES = 4
 var MAX_SCREEN_IMAGES = 12
 
+// 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
+
+
 var CACHE_DIR = '.ImageGrid'
 var CACHE_DIR_VAR = '${CACHE_DIR}'
 
@@ -1900,8 +1907,22 @@ function loadRibbonsFromPath(path, cmp, reverse, dir_name){
 
 
 
-/*********************************************************************/
+/**********************************************************************
+* Setup...
+*/
 
+// Setup event handlers for data bindings...
+//
+// This does two jobs:
+// 	- maintain DATA state
+// 		- editor actions
+// 		- focus
+// 		- marking
+// 	- maintain view consistency
+// 		- centering/moving (roll)
+// 		- shifting (expand/contract)
+// 		- zooming (expand/contract)
+//
 function setupData(viewer){
 	console.log('Data: setup...')
 

ui/index.html

@@ -74,7 +74,6 @@ $(function(){
 	// defaults...
 	toggleTheme('gray')
 	toggleImageInfo('on')
-	setupIndicators()
 	autoHideCursor($('.viewer'))
 
 

ui/setup.js

@@ -3,76 +3,24 @@
 *
 **********************************************************************/
 
-// 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
-
-var CONTEXT_INDICATOR_UPDATERS = []
-
 // list of functions to setup different bindings
 //
 // each function must be of the form:
 // 	setupBinding(viewer) -> viewer
 //
+// NOTE: we are not using an event handler here as the DOM might not yet
+// 		be loaded...
+// XXX still need to think about this...
 var SETUP_BINDINGS = []
 
 
 
-/**********************************************************************
+/*********************************************************************/
-* Setup
-*/
 
-function setupIndicators(){
-	showGlobalIndicator(
-			'single-ribbon-mode', 
-			'Single ribbon mode (F3)')
-		.css('cursor', 'hand')
-		.click(function(){ toggleSingleRibbonMode() })
-}
-
-
-function makeContextIndicatorUpdater(image_class){
-	var _updater = function(image){
-		var indicator = $('.context-mode-indicators .current-image-'+image_class)
-		if(image.hasClass(image_class)){
-			indicator.addClass('shown')
-		} else {
-			indicator.removeClass('shown')
-		}
-	}
-	CONTEXT_INDICATOR_UPDATERS.push(_updater)
-	return _updater
-}
-
-
-function updateContextIndicators(image){
-	image = image == null ? getImage() : $(image)
-
-	// marked...
-	CONTEXT_INDICATOR_UPDATERS.map(function(update){
-		update(image)
-	})	
-}
-
-
-
-// Setup event handlers for data bindings...
-//
-// This does two jobs:
-// 	- maintain DATA state
-// 		- editor actions
-// 		- focus
-// 		- marking
-// 	- maintain view consistency
-// 		- centering/moving (roll)
-// 		- shifting (expand/contract)
-// 		- zooming (expand/contract)
-//
 function setupDataBindings(viewer){
 	viewer = viewer == null ? $('.viewer') : viewer
 
+	// see SETUP_BINDINGS definition for docs...
 	SETUP_BINDINGS.forEach(function(setup){
 		setup(viewer)
 	})

ui/ui.js

@@ -12,6 +12,8 @@ var CURSOR_HIDE_TIMEOUT = 1000
 var STATUS_QUEUE = []
 var STATUS_QUEUE_TIME = 200
 
+var CONTEXT_INDICATOR_UPDATERS = []
+
 
 
 
@@ -85,6 +87,39 @@ function showCursor(elem){
 }
 */
 
+
+function setupIndicators(){
+	showGlobalIndicator(
+			'single-ribbon-mode', 
+			'Single ribbon mode (F3)')
+		.css('cursor', 'hand')
+		.click(function(){ toggleSingleRibbonMode() })
+}
+
+
+function makeContextIndicatorUpdater(image_class){
+	var _updater = function(image){
+		var indicator = $('.context-mode-indicators .current-image-'+image_class)
+		if(image.hasClass(image_class)){
+			indicator.addClass('shown')
+		} else {
+			indicator.removeClass('shown')
+		}
+	}
+	CONTEXT_INDICATOR_UPDATERS.push(_updater)
+	return _updater
+}
+
+
+function updateContextIndicators(image){
+	image = image == null ? getImage() : $(image)
+
+	CONTEXT_INDICATOR_UPDATERS.map(function(update){
+		update(image)
+	})	
+}
+
+
 function showCurrentMarker(){
 	return $('<div/>')
 		.addClass('current-marker')
@@ -1266,6 +1301,8 @@ function showImageInfo(){
 function setupUI(viewer){
 	console.log('UI: setup...')
 
+	setupIndicators()
+
 	return viewer
 		.click(function(){
 			if($('.ribbon').length == 0){