made a better not-available url handling strategy + added html, br and hr elements to formDialog(..)...

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

ui/TODO.otl

@@ -108,33 +108,13 @@ Roadmap
 	
 
 
-[_] 30% Gen 3 current todo
+[_] 29% Gen 3 current todo
-	[_] 60% High priority
+	[_] 59% High priority
-		[_] BUG: editor also affects the image background and border...
+		[_] BUG: basic editor causes images to blur up 
-		| to view just set invert to 1
+		| ...if at least one filter is applied, appears to only affect 
-		| 	- background turns white...
+		| scaled images.
-		| 	- red border turns blue...
-		|
-		| need to either compensate or figure out a way to work around 
-		| this without adding ne tags...
 		[_] BUG: OSX: unable to load absolute paths...
 		[_] OSX: add alternatives to function buttons...
-		[_] Feature: basic editor...
-		| use CSS3 filters to edit and save edit values for:
-		| 	- brightness
-		| 	- contrast
-		| 	- saturation
-		| 	- hue
-		| 	- grayscale
-		| 	- sepia
-		| 	- invert
-		| 	- blur
-		|
-		| save settings and load them on a per preview basis...
-		|
-		| see: http://html5-demos.appspot.com/static/css/filters/index.html
-		|
-		| For UI use a left/right pane to "hold" the sliders...
 		[_] UI: Panes...
 		|
 		| 	+-----+---------------+-----+
@@ -450,6 +430,35 @@ Roadmap
 		[_] side-by side view...
 		[_] Simplify tool-tip structure in dialogs...
 		| might also bee good to unify tool-tips across the app...
+		[X] devise a better strategy to pruneBaseURLHistory(..)...
+		| currently it will remove anything that does not exist.
+		|
+		| consider:
+		|	- push non-existing to back
+		|	- mark non-existing and show as disabled 
+		[X] Feature: basic editor...
+		| use CSS3 filters to edit and save edit values for:
+		| 	- brightness
+		| 	- contrast
+		| 	- saturation
+		| 	- hue
+		| 	- grayscale
+		| 	- sepia
+		| 	- invert
+		| 	- blur
+		|
+		| save settings and load them on a per preview basis...
+		|
+		| see: http://html5-demos.appspot.com/static/css/filters/index.html
+		|
+		| For UI use a left/right pane to "hold" the sliders...
+		[X] BUG: editor also affects the image background and border...
+		| to view just set invert to 1
+		| 	- background turns white...
+		| 	- red border turns blue...
+		|
+		| need to either compensate or figure out a way to work around 
+		| this without adding ne tags...
 		[X] URL history...
 		[X] BUG: ribbons above and below are still sometimes loaded incorrectly
 		| likely due to trying to align 

ui/layout.css

@@ -1214,16 +1214,11 @@ button:hover {
 }
 /* XXX this is experimental... */
 .viewer.overlay .ribbon-set {
-	/* XXX blur makes things slow with transparency... */
+  /* XXX blur makes things slow with transparency... */
 
-	/*
+  -webkit-filter: /*blur(2px)*/ grayscale(0.5);
-	-webkit-filter: blur(2px);
+  filter: /*blur(2px)*/ grayscale(0.5);
-	filter: blur(2px);
+  /*
-	*/
-	-webkit-filter: grayscale(0.5);
-	filter: grayscale(0.5);
-
-	/*
 	-webkit-animation-name: testAnim;
 	-webkit-animation-duration: .2s;
 	-webkit-animation-iteration-count: 1;
@@ -1330,6 +1325,9 @@ button:hover {
   color: white;
   background: silver;
 }
+.field .disabled-text {
+  opacity: 0.5;
+}
 /************************************************************ Help ***/
 /* XXX make this more generic, and not just for the keyboard... */
 /* this is for sliding stuff */

ui/layout.less

@@ -1386,6 +1386,11 @@ button:hover {
 }
 
 
+.field .disabled-text {
+	opacity: 0.5;
+}
+
+
 
 
 /************************************************************ Help ***/

ui/ui.js

@@ -491,6 +491,55 @@ function isOverlayVisible(root){
 
 
 var FIELD_TYPES = {
+	// a simple hr...
+	//
+	// format:
+	// 		'---'
+	// 		Three or more '-'s
+	hr: {
+		type: 'hr',
+		text: null,
+		default: false,
+		html: '<hr>',
+		test: function(val){
+			return /\-\-\-+/.test(val)
+		},
+	},
+	// a simple br...
+	//
+	// format:
+	// 		'   '
+	// 		Three or more spaces
+	br: {
+		type: 'br',
+		text: null,
+		default: false,
+		html: '<br>',
+		test: function(val){
+			return /\s\s\s+/.test(val)
+		},
+	},
+	// format:
+	// 	{
+	// 		html: <html-block>
+	// 	}
+	html: {
+		type: 'html',
+		text: null,
+		default: false,
+		html: '<div class="html-block"/>',
+		test: function(val){
+			return val.html != null
+		},
+		set: function(field, value){
+			if(typeof(value.html) == typeof('str')){
+				field.html(value.html)
+			} else {
+				field.append(value.html)
+			}
+		},
+	},
+
 	// format: 
 	// 		string
 	// XXX add datalist option...
@@ -625,7 +674,7 @@ var FIELD_TYPES = {
 	// 		['a', 'b', 'c', ...]
 	//
 	// an item can be of the folowing format:
-	// 		<text> ['|' 'default' ] [ '|' <tool-tip> ]
+	// 		<text> ['|' 'default' | 'disabled' ] [ '|' <tool-tip> ]
 	//
 	// NOTE: only one 'default' item should be present.
 	// NOTE: if no defaults are set, then the first item is checked.
@@ -664,6 +713,16 @@ var FIELD_TYPES = {
 					val.prop('checked', false)
 				}
 
+				// set disabled state...
+				if(opts.slice(1).indexOf('disabled') >= 0){
+					val.prop('disabled', true)
+					opts.splice(opts.indexOf('disabled'), 1)
+					item.addClass('disabled')
+				} else {
+					val.prop('disabled', false)
+					item.removeClass('disabled')
+				}
+
 				setTextWithTooltip(opts, item.find('.item-text'))
 
 				item.appendTo(field)
@@ -763,6 +822,7 @@ var FIELD_TYPES = {
 			return $(field).attr('state')
 		},
 	},
+
 }
 
 // Show a complex form dialog
@@ -821,15 +881,20 @@ function formDialog(root, message, config, btn, cls){
 
 				// setup text and data...
 				setTextWithTooltip(t, html.find('.text'), html)
-				field.set(html, config[t])
 
-				// NOTE: this is here to isolate t and field.get values...
+				if(field.set != null){
-				// 		...is there a better way???
+					field.set(html, config[t])
-				var _ = (function(title, getter){
+				}
-					html.on('resolve', function(evt, e){
+
-						data[title] = getter(e)
+				if(field.get != null){
-					})
+					// NOTE: this is here to isolate t and field.get values...
-				})(t, field.get)
+					// 		...is there a better way???
+					var _ = (function(title, getter){
+						html.on('resolve', function(evt, e){
+							data[title] = getter(e)
+						})
+					})(t, field.get)
+				}
 
 				form.append(html)
 
@@ -934,6 +999,17 @@ function confirm(){
 */
 
 
+function detailedAlert(text, description, button){
+	return formDialog(null, '', {'': {
+		html: $('<details/>')
+			.append($('<summary/>')
+				.html(text))
+			.append($('<span/>')
+				.html(description))
+	}}, button == null ? false : button, 'detailed-alert')
+}
+
+
 // NOTE: this will not work without node-webkit...
 function getDir(message, dfl, btn){
 	btn = btn == null ? 'OK' : btn

ui/urlhistory.js

@@ -30,6 +30,16 @@ function pruneBaseURLHistory(){
 }
 
 
+function getNonExistingBaseURLs(){
+	if(window.fs == null){
+		return BASE_URL_HISTORY
+	}
+	return BASE_URL_HISTORY.filter(function(e){
+		return !fs.existsSync(osPath(e))
+	})
+}
+
+
 // Setup history event handlers...
 //
 // NOTE: this will save history state to localStorage...
@@ -38,7 +48,7 @@ function setupBaseURLHistory(){
 		.on('baseURLChanged', function(evt, old_url, new_url){
 			var updated = false
 
-			pruneBaseURLHistory()
+			//pruneBaseURLHistory()
 
 			// store the old and new urls in history unless they already
 			// exist...
@@ -97,11 +107,23 @@ function getURLHistoryPosition(){
 // Get next/prev relative position in history...
 //
 function getURLHistoryNext(){
-	var res = BASE_URL_HISTORY[ getURLHistoryPosition() - 1]
+	var non_existing = getNonExistingBaseURLs()
+	var i = getURLHistoryPosition() + 1 
+	var res = BASE_URL_HISTORY[i]
+	while(non_existing.indexOf(res) >= 0){
+		i += 1
+		var res = BASE_URL_HISTORY[i]
+	}
 	return res == null ? BASE_URL : res
 }
 function getURLHistoryPrev(){
-	var res = BASE_URL_HISTORY[ getURLHistoryPosition() + 1 ]
+	var non_existing = getNonExistingBaseURLs()
+	var i = getURLHistoryPosition() - 1 
+	var res = BASE_URL_HISTORY[i]
+	while(non_existing.indexOf(res) >= 0){
+		i -= 1
+		var res = BASE_URL_HISTORY[i]
+	}
 	return res == null ? BASE_URL : res
 }
 
@@ -116,7 +138,6 @@ function getURLHistoryPrev(){
 // NOTE: this will not affect history url order...
 function makeURLHistoryLoader(get, end_msg){
 	return function(){
-		pruneBaseURLHistory()
 		var url = get()
 		if(url != BASE_URL){
 			statusNotify(loadDir(url))
@@ -132,8 +153,9 @@ var loadURLHistoryPrev = makeURLHistoryLoader(getURLHistoryPrev, 'at first URL')
 
 // NOTE: this can accept either path or history index...
 // NOTE: this will not reload an already loaded url...
+//
+// XXX need to somehow skip unavailable urls...
 function loadURLHistoryAt(a){
-	pruneBaseURLHistory()
 	a = a < 0 ? BASE_URL_HISTORY.length + a : a
 	var url = typeof(a) == typeof(123) ? Math.min(a < 0 ? 0 : a, BASE_URL_HISTORY.length-1) : a
 	if(url != BASE_URL){
@@ -157,22 +179,46 @@ function recentlyOpenedDialog(){
 		'Shortcuts ctrl-shift-Left and ctrl-shift-Right can be used\n'+
 		'to move through this list from ribbon view.'
 
+	var not_available = getNonExistingBaseURLs()
+
 	var cfg = {}
 	cfg[title] = BASE_URL_HISTORY.map(function(e){
 		// cleanup the urls...
 		var ee = e.replace('file:///', '')
 
+		// mark disabled...
+		if(not_available.indexOf(e) >= 0){
+			ee = '<span class="disabled-text">'+ee+'</span>'
+			dict[ee] = e
+			return ee + ' | disabled | Not available.'
+		}
+
 		// mark the current path...
 		if(e == BASE_URL){
 			ee = ee.italics()
 			dict[ee] = e
 			return ee + ' | default | Currently loaded data.'
 		}
+
 		dict[ee] = e
 		return ee
 	})
 
-	formDialog(null, '', 
+	if(not_available.length > 0){
+		cfg['spacer'] = '---'
+		cfg[''] = {
+			text: 'Clear unavailable paths',
+			button: function(){
+				pruneBaseURLHistory()
+				saveLocalStorageBaseURLHistory()
+				$('.recentlyOpenedDialog')
+					.find('.item.disabled')
+						.remove()
+			},
+		}
+	}
+
+	var dialog = formDialog(null, '', 
 			cfg,
 			'OK', 
 			'recentlyOpenedDialog')