experiments/outline-editor/editor.js

@@ -203,14 +203,15 @@ var plugin = {
 var attributes = {
 	__proto__: plugin,
 
-	// XXX should attr settings be set here or in the Outline???
-	// 		...this includes .__block_attrs__ and .__system_attrs__
-
 	//
 	//	Parse attrs...
 	//	.parseBlockAttrs(<text>[, <elem>])
 	//		-> [<elem>, <attrs>, <sys-attrs>]
 	//
+	// XXX where should we get .__block_attrs__???
+	// 		...editor (current), plugin, ...???
+	// XXX might be a good idea to split out the actual code handler to 
+	// 		be overloadable by other plugins... 
 	parseBlockAttrs: function(editor, text, elem={}){
 		var system = editor.__block_attrs__
 		var attrs = ''
@@ -228,29 +229,18 @@ var attributes = {
 						.split(/(?:[\t ]*::[\t ]*|[\t ]*\n[\t ]*)/g)
 					while(match.length > 0){
 						var [name, val] = match.splice(0, 2)
-						// ignore non-settable attrs...
-						if(editor.__system_attrs__.includes(name)){
-							continue }
 						elem[name] = 
 							val == 'true' ?
 				   				true
 							: val == 'false' ?
 								false
-							: val }
+							: val 
+						// keep non-system attrs...
+						if(!(name in system)){
+							attrs += `\n${name}::${val}`
+						} else {
+							sysattrs += `\n${name}::${val}` } }
 					return ws })
-		// build the attr strings...
-		// NOTE: we are not doing this in the loop above to include all 
-		// 		the attributes that are in the elem but not explicitly 
-		// 		given in code...
-		for(var name in elem){
-			// ignore non-settable attrs...
-			if(editor.__system_attrs__.includes(name)){
-				continue }
-			var val = elem[name]
-			if(!(name in system)){
-				attrs += `\n${name}::${val}`
-			} else {
-				sysattrs += `\n${name}::${val}` } }
 		return [
 			elem, 
 			attrs, 
@@ -258,46 +248,26 @@ var attributes = {
 		] },
 
 	// generate code...
-	// 
-	// this is controlled by the value of editor.__code_attrs__:
-	// 	false / undefined	- strip attrs
-	// 	true				- add attrs to code if available
-	// 	'all'				- add attrs, including system attrs to 
-	// 						  code if available,
 	__parse_code__: function(code, editor, elem){
 		var [elem, attrs, system] = this.parseBlockAttrs(editor, code, elem)
 		return !editor.__code_attrs__ ?
 				elem.text
 			: editor.__code_attrs__ == 'all' ?
-				elem.text 
-					+ (attrs.length > 0 ? 
-						'\n'+ attrs
-						: '')
-					+ (system.length > 0 ?
-						'\n'+ system
-						: '')
-			: attrs.length > 0 ?
-				elem.text +'\n'+ attrs 
-			: elem.text },
-
+				elem.text +'\n'+ attrs +'\n'+ system
+			: elem.text +'\n'+ attrs },
 	// generate view...
-	//
-	// this is controlled by the value of editor.__view_attrs__:
-	// 	false / undefined	- strip attrs
-	// 	true				- call the handler XXX
 	__pre_parse__: function(text, editor, elem){
-		// NOTE: we are intentionally neglecting system attrs here...
 		var [elem, attrs, system] = this.parseBlockAttrs(editor, text, elem)
-		if(editor.__view_attrs__ 
-				&& attrs.length > 0){
-			attrs = editor.threadPlugins('__parse_attrs__', attrs, editor, elem)
-			if(attrs && attrs.length > 0){
-				return text +'\n'+ attrs } }
-		return elem.text },
+		// XXX use filter handler here...
+		return !editor.__view_attrs__ ?
+			elem.text 
+			: elem.text +'\n'+ attrs
+	},
 
 	// XXX
-	//__parse_attrs__: function(attrs, editor, elem){
-	//	return attrs }
+	__parse_attrs__: function(){
+		// XXX
+	}
 }
 
 
@@ -933,17 +903,12 @@ var JSONOutline = {
 
 	__code_attrs__: false,
 	__view_attrs__: false,
-	__system_attrs__: [
-		'text',
-		'children',
-	],
 	__block_attrs__: {
 		id: 'attr',
 		collapsed: 'attr',
 		focused: 'cls',
 	},
 
-
 	// Plugins...
 	//
 	// The order of plugins can be significant in the following cases:
@@ -1210,7 +1175,6 @@ var JSONOutline = {
 	// XXX add plugin hooks...
 	// XXX add option to customize indent size...
 	text: function(node, indent, level){
-		var that = this
 		// .text(<indent>, <level>)
 		if(typeof(node) == 'string'){
 			;[node, indent='  ', level=''] = [undefined, ...arguments] }
@@ -1226,7 +1190,8 @@ var JSONOutline = {
 					// attrs... 
 					+ (Object.keys(elem)
 						.reduce(function(res, attr){
-							return that.__system_attrs__.includes(attr) ?
+							return (attr == 'text' 
+									|| attr == 'children') ?
 								res
 								: res 
 									+ (elem[attr] ?
@@ -1252,7 +1217,7 @@ var JSONOutline = {
 		var attrs = []
 
 		for(var [attr, value] of Object.entries({...data, ...parsed})){
-			if(this.__system_attrs__.includes(attr)){
+			if(attr == 'children' || attr == 'text'){
 				continue }
 			var i
 			var type = this.__block_attrs__[attr]
@@ -1675,13 +1640,9 @@ var Outline = {
 			//this._syncTextSize(code, html) }
 
 		for(var [attr, value] of Object.entries({...data, ...parsed})){
-			if(this.__system_attrs__.includes(attr)){
+			if(attr == 'children' || attr == 'text'){
 				continue }
 
-			// quoted value...
-			if(value && /^\s*([`'"])([^\1]*)\1\s*$/.test(value)){
-				value = value.replace(/^\s*([`'"])([^\1]*)\1\s*$/, '$2') }
-
 			var type = this.__block_attrs__[attr]
 			if(type == 'cls'){
 				value ?
@@ -1697,7 +1658,6 @@ var Outline = {
 					: node.removeAttribute(attr) 
 			// dataset...
 			} else {
-				// remove attr...
 				if(value == null
 						|| value == 'null'
 						|| value == 'undefined'){

experiments/outline-editor/index.html

@@ -143,14 +143,27 @@ var setup = function(){
   -
 - ## ToDo:
   - ASAP: expand sub-tree on follow link...
-  - ASAP TEST: attributes: finalize base mechanics...
+  - ASAP: attributes: finalize base mechanics:
+    - code filtering
+      ```
+      .__code_attrs__(attrs, code, elem)
+          -> true
+          -> false
+      ```
+      _system attrs are always hidden, the client can control whether the code is shown or not_
+	- view filtering
+      ```
+      .__view_attrs__(attrs, code, elem)
+          -> str
+          -> undefined
+      ```
+    - might be a good idea to change `.parseBlockAttrs(..)` to return an array of text and attrs (str) and handle the above `.__code_attrs__(..)` and `.__view_attrs__(..)` in the respective handlers...
   - attributes: need to show/hide the attributes -- option?
     attr::value
-    - DONE `.__parse_code__(..)`: add data attributes to code if missing...
-    - DONE do we need `.__code_attrs__` / `.__view_attrs__`??? -- YES
-    - DONE delete attr from code -- by setting it to `"null"` or `"undefined"`...
-    - delete attr from code -- by removing it from attr list (when shown)...
-    - DONE BUG? can't set `''` as attr value -- parser??
+    - `.__parse_code__(..)`: add data attributes to code if missing...
+    - do we need `.__code_attrs__` / `.__view_attrs__`??? 
+    - handle attr delete correctly -- i.e. if shown attr removed from code -> delete attr...
+    - BUG? can't set `''` as attr value -- parser??
   - TOC: tweaking: add args like depth, ... -- as attributes...
   - TOC: should it be persistently generated as code and be serializable?
   - simple use strategies:
@@ -276,7 +289,6 @@ var setup = function(){
       - `<editable/>` -- field marker
       - each child node will copy the template and allow editing of only fields
       - not clear how to handle template changes...
-  - DONE attributes: might be a good idea to prevent setting `.text` and `.children` attrs...
   - DONE TOC: Q: should we have both manual and auto headings???
     collapsed:: true
     - IMHO: no...