diff --git a/experiments/outline-editor/editor.css b/experiments/outline-editor/editor.css
index dea33dc..c357529 100755
--- a/experiments/outline-editor/editor.css
+++ b/experiments/outline-editor/editor.css
@@ -44,11 +44,10 @@
display: block;
position: relative;
- /* XXX do we need this???
- .code {
+ /* hide the root editor code... */
+ &>.code {
display: none;
}
- */
/* header */
.header {
diff --git a/experiments/outline-editor/editor.js b/experiments/outline-editor/editor.js
index 17204d8..d25c42a 100755
--- a/experiments/outline-editor/editor.js
+++ b/experiments/outline-editor/editor.js
@@ -288,7 +288,7 @@ var quoted = {
quote: function(_, code){
return `${ this.encode(code) }` },
- pre_pattern: /(? 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('')) ?
+ elem.text
+ // NOTE: adding a space here is done to prevent the browser
+ // from hiding the last newline...
+ : elem.text + ' '
return elem },
@@ -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 =
- //(parsed.text == '' || parsed.text.endsWith('')) ?
- parsed.text == '' ?
- parsed.text
- // NOTE: adding a space here is done to prevent the browser
- // from hiding the last newline...
- : parsed.text + ' '
+ html.innerHTML = 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 =
- //(data.text == '' || data.text.endsWith('')) ?
- data.text == '' ?
- data.text
- // NOTE: adding a space here is done to prevent the browser
- // from hiding the last newline...
- : data.text + ' ' }
+ html.innerHTML = 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)...
- // NOTE: this is needed to make initial clicking into multi-line
- // blocks place the cursor into the clicked location.
- // ...this is done by expanding the textarea to the element
- // size and enabling it to intercept clicks correctly...
- // XXX this is a hack -- need to style the thing in such away
- // so as to not require this step...
- setTimeout(function(){
- var f = that._updateCodeSize.bind(that)
- //var f = that._syncTextSize.bind(that)
- for(var e of [...that.outline.querySelectorAll('textarea')]){
- f(e) } }, 0)
+ //// update sizes of all the textareas (transparent)...
+ //// NOTE: this is needed to make initial clicking into multi-line
+ //// blocks place the cursor into the clicked location.
+ //// ...this is done by expanding the textarea to the element
+ //// size and enabling it to intercept clicks correctly...
+ //// XXX this is a hack -- need to style the thing in such away
+ //// so as to not require this step...
+ //setTimeout(function(){
+ // var f = that._updateCodeSize.bind(that)
+ // //var f = that._syncTextSize.bind(that)
+ // for(var e of [...that.outline.querySelectorAll('textarea')]){
+ // f(e) } }, 0)
return this },
//*/
diff --git a/experiments/outline-editor/index.html b/experiments/outline-editor/index.html
index c6c039a..96006cd 100755
--- a/experiments/outline-editor/index.html
+++ b/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 `` 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..._
- - ```
- 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:
- - ...
+ - 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...
- 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...