refactored progress bars out...

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

ui/ui.js

@@ -14,6 +14,10 @@ var STATUS_QUEUE_TIME = 200
 
 var CONTEXT_INDICATOR_UPDATERS = []
 
+// this can be:
+// 	- 'floating'
+// 	- 'panel'
+var PROGRESS_WIDGET_CONTAINER = 'floating'
 
 
 
@@ -428,6 +432,139 @@ function showContextIndicator(cls, text){
 
 
 
+/**********************************************************************
+* Progress bar...
+*/
+
+// Make or get progress bar container...
+// mode can be:
+// 	- null			- default
+// 	- 'floating'
+// 	- 'panel'
+function getProgressContainer(mode, parent){
+	parent = parent == null ? $('.viewer') : parent
+	mode = mode == null ? PROGRESS_WIDGET_CONTAINER : mode
+
+	if(mode == 'floating'){
+		// widget container...
+		var container = parent.find('.progress-container')
+		if(container.length == 0){
+			container = $('<div class="progress-container"/>')
+				.appendTo(parent)
+		}
+	} else {
+		var container = getPanel('Progress')
+		if(container.length == 0){
+			container = makeSubPanel('Progress')
+				.addClass('.progress-container')
+		}
+
+		container = container.find('.content')
+	}
+
+	return container
+}
+
+
+// Make or get progress bar by name...
+//
+function progressBar(name, container){
+	container = container == null 
+		? getProgressContainer() 
+		: container
+
+	var widget = getProgressBar(name)
+
+	// a progress bar already exists, reset it and return...
+	// XXX should we re-bind the event handlers here???
+	if(widget.length > 0){
+		return widget.trigger('progressReset')
+	}
+
+	// fields we'll need to update...
+	var state = $('<span class="progress-details"/>')
+	var bar = $('<progress/>')
+
+	// the progress bar widget...
+	var widget = $('<div class="progress-bar" name="'+name+'">'+name+'</div>')
+		// progress state...
+		.append(state)
+		// the close button...
+		.append($('<span class="close">&times;</span>')
+			.click(function(){
+				$(this).trigger('progressClose')
+			}))
+		.append(bar)
+		.appendTo(container)
+		.on('progressUpdate', function(evt, done, total){
+			done = done == null ? bar.attr('value') : done
+			total = total == null ? bar.attr('max') : total
+			bar.attr({
+				value: done,
+				max: total
+			})
+			state.text(' ('+done+' of '+total+')')
+		})
+		.on('progressDone', function(evt, done){
+			done = done == null ? bar.attr('value') : done
+			bar.attr('value', done)
+			state.text(' (done)')
+			widget.find('.close').hide()
+
+			setTimeout(function(){
+				widget.hide()
+			}, 1500)
+		})
+		.on('progressReset', function(){
+			widget
+				.css('display', '')
+				.find('.close')
+					.css('display', '')
+			state.text('')
+			bar.attr({
+				value: '',
+				max: '',
+			})
+		})
+
+	bar = $(bar[0])
+	state = $(state[0])
+	widget = $(widget[0])
+
+	return widget
+}
+
+
+function getProgressBar(name){
+	return $('.progress-bar[name="'+name+'"]')
+}
+
+
+function resetProgressBar(name){
+	var widget = typeof(name) == typeof('str') 
+		? getProgressBar(name) 
+		: name
+	return widget.trigger('progressReset')
+}
+
+
+function updateProgressBar(name, done, total){
+	var widget = typeof(name) == typeof('str') 
+		? getProgressBar(name) 
+		: name
+	return widget.trigger('progressUpdate', [done, total])
+}
+
+
+function closeProgressBar(name){
+	var widget = typeof(name) == typeof('str') 
+		? getProgressBar(name) 
+		: name
+	return widget.trigger('progressClose')
+}
+
+
+
 /**********************************************************************
 * Modal dialogs...
 */

ui/workers.js

@@ -10,40 +10,10 @@
 // object to register all the worker queues...
 var WORKERS = {}
 
-var PROGRESS_WIDGET_CONTAINER = 'floating'
-
 
 
 /**************************************************** Progress bar ***/
 
-// mode can be:
-// 	- null			- default
-// 	- 'floating'
-// 	- 'panel'
-function getWorkerProgressFloatingContainer(mode, parent){
-	parent = parent == null ? $('.viewer') : parent
-	mode = mode == null ? PROGRESS_WIDGET_CONTAINER : mode
-
-	if(mode == 'floating'){
-		// widget container...
-		var container = parent.find('.progress-container')
-		if(container.length == 0){
-			container = $('<div class="progress-container"/>')
-				.appendTo(parent)
-		}
-	} else {
-		var container = getPanel('Progress')
-		if(container.length == 0){
-			container = makeSubPanel('Progress')
-				.addClass('.progress-container')
-		}
-
-		container = container.find('.content')
-	}
-
-	return container
-}
-
 // NOTE: if the progress widget gets removed without removing the worker
 // 		this will result in dangling handlers for the previous widget...
 // 		i.e. handlers that still reverence the original widget...
@@ -53,65 +23,28 @@ function getWorkerProgressFloatingContainer(mode, parent){
 // XXX make this understand deferred workers...
 function getWorkerProgressBar(name, worker, container){
 	container = container == null 
-		? getWorkerProgressFloatingContainer() 
+		? getProgressContainer() 
 		: container
 
-	var widget = $('.progress-bar[name="'+name+'"]')
+	var widget = getProgressBar(name)
 
-	// a progress bar already exists, reset it and return...
+	if(widget.length == 0){
-	// XXX should we re-bind the event handlers here???
+		widget = progressBar(name, container)
-	if(widget.length > 0){
+			.on('progressClose', function(){
-		widget
+				WORKERS[name].dropQueue()
-			.css('display', '')
-			.find('.close')
-				.css('display', '')
-		widget.find('progress')
-			.attr({
-				value: '',
-				max: '',
 			})
-		return worker
+
+		worker
+			.progress(function(done, total){
+				widget.trigger('progressUpdate', [done, total])
+			})
+			.depleted(function(done){
+				widget.trigger('progressDone', [done])
+			})
+	} else {
+		resetProgressBar(widget)
 	}
 
-	// fields we'll need to update...
-	var state = $('<span class="state"/>')
-	var bar = $('<progress/>')
-
-	// the progress bar widget...
-	var widget = $('<div class="progress-bar" name="'+name+'">'+name+'</div>')
-		// progress state...
-		.append(state)
-		// the close button...
-		.append($('<span class="close">&times;</span>')
-			.click(function(){
-				$(this).hide()
-				WORKERS[name]
-					.dropQueue()
-			}))
-		.append(bar)
-		.appendTo(container)
-
-	// re get the fields...
-	bar = $(bar[0])
-	state = $(state[0])
-
-	worker
-		.progress(function(done, total){
-			bar.attr({
-				value: done,
-				max: total
-			})
-			state.text(' ('+done+' of '+total+')')
-		})
-		.depleted(function(done){
-			bar.attr('value', done)
-			state.text(' (done)')
-
-			setTimeout(function(){
-				widget.hide()
-			}, 1500)
-		})
-
 	return worker
 }