lots of fixes...

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

experiments/outline-editor/editor.css

@@ -44,11 +44,10 @@
 	display: block;
 	position: relative;
 
-	/* XXX do we need this???
+	/* hide the root editor code... */
-	.code {
+	&>.code {
 		display: none;
 	}
-	*/
 
 	/* header */
 	.header {

experiments/outline-editor/editor.js

@@ -288,7 +288,7 @@ var quoted = {
 	quote: function(_, code){
 		return `<code>${ this.encode(code) }</code>` },
 
-	pre_pattern: /(?<!\\)```(.*\s*\n)((\n|.)*?)\h*(?<!\\)```(?:[ \t]*$|[ \t]*\n)/g,
+	pre_pattern: /(?<!\\)```(.*\s*\n)((\n|.)*?)\h*(?<!\\)```[ \t]*(?:$|\n)/g,
 	preEncode: function(text){
 		return this.encode(text)
 			.replace(/`/, '\\`') },
@@ -935,6 +935,18 @@ var JSONOutline = {
 		// stage: post...
 		elem.text = run('post', text)
 
+
+		elem.text = 
+			// XXX POST_PRE_WHITESPACE adding a </pre> exception here feels hacky...
+			// 		...a space after pre will force a new line but not 
+			// 		adding it will hide a single empty line after...
+			(elem.text == '' 
+					|| elem.text.endsWith('</pre>')) ?
+				elem.text 
+				// NOTE: adding a space here is done to prevent the browser 
+				// 		from hiding the last newline...
+				: elem.text + ' '
+
 		return elem },
 
 	// output format...
@@ -1487,17 +1499,15 @@ var Outline = {
 		focused: 'cls',
 	},
 
+	/* XXX not used -- do we need this??
 	// XXX UPDATE_CODE_SIZE this is a no-op at this point -- do we need this???
 	_updateCodeSize: function(code, view){
-		// XXX UPDATE_CODE_SIZE
-		return this
 		code.style.height = 
 			getComputedStyle(
 					view 
 						?? code.nextSibling)
 				.height 
 		return this },
-	/* XXX not used...
 	_updateViewSize: function(view, code){
 		view.style.height = 
 			getComputedStyle(
@@ -1531,13 +1541,7 @@ var Outline = {
 			if(this.__code2html__){
 				// NOTE: we are ignoring the .collapsed attr here 
 				parsed = this.__code2html__(data.text, {...data})
-				html.innerHTML = 
+				html.innerHTML = parsed.text
-					//(parsed.text == '' || parsed.text.endsWith('</pre>')) ?
-					parsed.text == '' ?
-						parsed.text
-						// NOTE: adding a space here is done to prevent the browser 
-						// 		from hiding the last newline...
-						: parsed.text + ' '
 				// heading...
 				this.__styles != null
 					&& node.classList.remove(...this.__styles)
@@ -1545,17 +1549,11 @@ var Outline = {
 					&& node.classList.add(...parsed.style)
 				delete parsed.style
 			} else {
-				html.innerHTML = 
+				html.innerHTML = data.text }
-					//(data.text == '' || data.text.endsWith('</pre>')) ?
-					data.text == '' ?
-						data.text
-						// NOTE: adding a space here is done to prevent the browser 
-						// 		from hiding the last newline...
-						: data.text + ' ' }
 			code.value = data.text 
-			code.updateSize() 
+			code.updateSize() }
 			// NOTE: this will have no effect if the element is not attached...
-			this._updateCodeSize(code) }
+			//this._updateCodeSize(code) }
 			//this._syncTextSize(code, html) }
 
 		for(var [attr, value] of Object.entries({...data, ...parsed})){
@@ -1904,7 +1902,7 @@ var Outline = {
 				cur[place](block)
 			: undefined 
 
-			this._updateCodeSize(code)
+			//this._updateCodeSize(code)
 			//this._syncTextSize(code, view)
 
 			this.setUndo(this.path(cur), 'remove', [this.path(block)]) }
@@ -1956,18 +1954,18 @@ var Outline = {
 
 		this.outline.innerHTML = this.html(data)
 
-		// update sizes of all the textareas (transparent)...
+		//// update sizes of all the textareas (transparent)...
-		// NOTE: this is needed to make initial clicking into multi-line 
+		//// NOTE: this is needed to make initial clicking into multi-line 
-		// 		blocks place the cursor into the clicked location.
+		//// 		blocks place the cursor into the clicked location.
-		// 		...this is done by expanding the textarea to the element 
+		//// 		...this is done by expanding the textarea to the element 
-		// 		size and enabling it to intercept clicks correctly...
+		//// 		size and enabling it to intercept clicks correctly...
-		// XXX this is a hack -- need to style the thing in such away 
+		//// XXX this is a hack -- need to style the thing in such away 
-		// 		so as to not require this step...
+		//// 		so as to not require this step...
-		setTimeout(function(){
+		//setTimeout(function(){
-			var f = that._updateCodeSize.bind(that)
+		//	var f = that._updateCodeSize.bind(that)
-			//var f = that._syncTextSize.bind(that)
+		//	//var f = that._syncTextSize.bind(that)
-			for(var e of [...that.outline.querySelectorAll('textarea')]){
+		//	for(var e of [...that.outline.querySelectorAll('textarea')]){
-				f(e) } }, 0)
+		//		f(e) } }, 0)
 		return this },
 	//*/
 

experiments/outline-editor/index.html

@@ -48,28 +48,22 @@ var setup = function(){
   - 
 - ## Bugs:
   focused:: true
-  - BUG leading/trailing blank lines mishandled:
+  - BUG whitespace after trailing code block is not shown (see next bug for details)
+    - also see: `POST_PRE_WHITESPACE`
+  - DONE BUG horizontal whitespace after a block of code create an empty line after the `<pre>` tag...
+    collapsed:: true
+    - ```
+      code block -- resized on block edit (`keydown` in edit mode)
+      ```
+      - this is due to `.update(..)` adding a `' '` to the text...
+  - DONE BUG leading/trailing blank lines mishandled:
+    collapsed:: true
     - block sizing
       - issues:
         - 
           blank lines above and below -- the trailing blank is not initially shown
           
-          - _not sure about this yet..._
+        - the main reason for this is that we are not adding a `" "` after each generated block as we do on `.update(..)` -- move this functionality up...
-        - ```
-          code block -- resized on block edit (`keydown` in edit mode)
-          ```
-          - _this seems to be because of a stray `\n` after re-render + `white-space: ...` in the `.view` element..._
-            _...this is logical as we do not render code on load and to on after edit_
-          - narrowed the issue down to `.update(..)` and adding a ' ' to the text...
-    - ways to fix:
-      - semi-active (current):
-        - active mode currently disabled (see: `UPDATE_CODE_SIZE`)
-        - TEST
-      - passive (preferred):
-        - REJECT try `display:flex` on `.block` and position one elem over the other...
-        - REJECT another way to go is to wrap `.text` stuff in a div and style that...
-      - active:
-        - ...
     - blank line at end of block is initially not shown
       - this block contains two lines (empty below)
         
@@ -88,32 +82,6 @@ var setup = function(){
       - 
         this block contains three lines (empty above and below)
         
-    - DONE blank line at start of block is shown but removed on edit
-      collapsed:: true
-      - 
-        this block also contains two lines (empty above)
-        - `editor.data(editor.get()).text` -- no `\n` at start...
-        - `editor.get().querySelector('.code').value` -- no `\n` at start...
-        - ```
-          d = document.createElement('div')
-          d.innerHTML = editor.htmlBlock({text: '\nabc\n'}) // -> '\n' exists...
-          d.querySelector('.code').value // -> no '\n' at start...
-          ```
-          ...seems that the `\n` is lost on html parse...
-      - 
-        this block contains three lines (empty above and below)
-        
-    - _this seams to be a problem only on the initial render -- edit/exit fixes the issue..._
-    - _Q: are we using different code paths for initial render and element render???_
-  - DONE BUG: can't move down out of a code block (_directly connected to the above_)
-    collapsed:: true
-    - edit this line, then move down
-    - ```
-      code
-      ```
-    - this node can't be reached.
-    - _this appears to be due to how we are resizing the text..._ 
-    - BUG resizing seems to be broken -- edit triggers a bad resize
   - BUG: styling error...
     - this _seems `to` work_
     - `while` _this `does` not_
@@ -185,7 +153,7 @@ var setup = function(){
       ```
   -
 - ## ToDo:
-  - clicking left of the block can select one of parent blocks -- bug or a feature??
+  - clicking left of the block can select one of parent blocks -- bug or feature??
   - `.json(..)`, `.data(..)`, ... should be signature compatible with `.get(..)` (???)
     - _current state causes constant confusion..._
   - Time to think about a standalone client -- at least to edit own notes as a test...