From 3b7beab501d829b030a32d1a8bd5ddec0bfb3f73 Mon Sep 17 00:00:00 2001
From: "Alex A. Naanou" <alex.nanou@gmail.com>
Date: Sat, 16 Sep 2017 18:11:07 +0300
Subject: [PATCH] made browse.Items.EditableList(..) more uniform (changes the
 input on exit only) + added state merge handling + some fixes...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
---
 ui (gen4)/features/alias.js      | 14 ++++++++------
 ui (gen4)/features/ui-widgets.js | 17 ++++++++++++++++-
 ui (gen4)/lib/widget/browse.js   | 29 ++++++++++++++++++++++++-----
 3 files changed, 48 insertions(+), 12 deletions(-)

diff --git a/ui (gen4)/features/alias.js b/ui (gen4)/features/alias.js
index 988ba1d8..37806244 100755
--- a/ui (gen4)/features/alias.js	
+++ b/ui (gen4)/features/alias.js	
@@ -136,10 +136,11 @@ var UIAliasActions = actions.Actions({
 								new_item: false,
 								to_remove: to_remove,
 
-								itemopen: function(name){
+								update_merge: 'drop_changes',
+
+								itemopen: function(_, name){
 									that.editAlias(name) 
 										.on('close', function(){ dialog.update() })
-									dialog.close()
 								},
 
 								each: function(name, elem){
@@ -148,17 +149,18 @@ var UIAliasActions = actions.Actions({
 											keys: getKeys(name),
 											action: name,
 										})
-								}
+								},
 							})
 						: make.Empty()
 
 					make('---')
 
-					make('New...')
-						.on('open', function(){ 
+					make('New...', { events: {
+						open: function(){ 
 							that.editAlias() 
 								.on('close', function(){ dialog.update() })
-						})
+						},
+					} })
 				}, {
 					cls: 'table-view show-keys',
 				})
diff --git a/ui (gen4)/features/ui-widgets.js b/ui (gen4)/features/ui-widgets.js
index 35e06e37..389ff8be 100755
--- a/ui (gen4)/features/ui-widgets.js	
+++ b/ui (gen4)/features/ui-widgets.js	
@@ -506,7 +506,7 @@ var makeDrawer = function(direction){
 // XXX should these replace the makeConfigListEditor/makeNestedConfigListEditor???
 var makeListEditorDialog =
 module.makeListEditorDialog =
-function makeConfigListEditorDialog(list, options){
+function makeListEditorDialog(list, options){
 	options = options || {}
 
 	return makeUIDialog(function(){
@@ -724,6 +724,21 @@ var DialogsActions = actions.Actions({
 		`,
 		makeUIDialog(function(list, options){
 			return browse.makeList(null, list, options) })],
+	// XXX do we need to split the options???
+	showEditableList: ['- Interface/', 
+		core.doc`Show editable list dialog...
+
+			.showEditableList(<list>, <options>)
+				-> dialog
+
+		See browse.Items.EditableList(..) for more info.
+		`,
+		makeUIDialog(function(list, options){
+			return browse.makeLister(null, 
+				function(path, make){
+					make.EditableList(list, options)
+				}, 
+				options) })],
 	showActionList: ['- Interface/', 
 		core.doc`Show list of actions dialog...
 
diff --git a/ui (gen4)/lib/widget/browse.js b/ui (gen4)/lib/widget/browse.js
index 52fa6736..35c7549d 100755
--- a/ui (gen4)/lib/widget/browse.js	
+++ b/ui (gen4)/lib/widget/browse.js	
@@ -611,6 +611,15 @@ function(data, options){
 // 		// internally
 // 		to_remove: null | <list>,
 //
+// 		// Merge list state and external list mode on update...
+// 		//
+// 		// This can be:
+// 		//	null			- keep dialog state, ignore external state (default)
+// 		//	'drop_changes'	- load external state
+// 		//	<function>		- merge the changes
+//		//
+// 		update_merge: null | 'drop_changes' | <function>,
+//
 //		// Special buttons...
 //		//
 //		// NOTE: these can be used only if .sort if not set.
@@ -680,6 +689,8 @@ function(data, options){
 // 		overwrite the .__list[id] cache, with the input list, this may
 // 		result in losing the edited state if the lists were not synced
 // 		properly...
+// XXX the problem with this is that it adds elements live while removing
+// 		elements on close, either both should be live or both on close...
 Items.EditableList =
 function(list, options){
 	var make = this
@@ -722,8 +733,16 @@ function(list, options){
 	}
 	options = opts
 
-	var lst = list instanceof Function ? 
-		list() 
+	var lst = 
+		// load dialog state...
+		(options.update_merge != 'drop_changes' && dialog.__list[id]) ? 
+			dialog.__list[id]
+		// merge states...
+		: (options.update_merge instanceof Function && dialog.__list[id]) ? 
+			options.update_merge(dialog.__list[id])
+		// initial state...
+		: list instanceof Function ? 
+			list() 
 		: list
 	var editable = dialog.__editable[id] = lst instanceof Array
 	// NOTE: we .slice() here to make the changes a bit better packaged
@@ -982,9 +1001,9 @@ function(list, options){
 							: undefined)
 				}
 
-				lst = dialog.__list[id] = write(list, lst)
-
-
+				// XXX should this be done here???
+				//lst = dialog.__list[id] = write(list, lst)
+				
 				// update list and select new value...
 				dialog.update()
 					.done(function(){