mirror of
https://github.com/flynx/pWiki.git
synced 2025-12-25 20:31:58 +00:00
Compare commits
No commits in common. "042c42f86b5189322d14c12db766e1c80ad7e407" and "7fbc5e863eb2c65f1982457f52a3a607692c2bb5" have entirely different histories.
042c42f86b
...
7fbc5e863e
@ -44,37 +44,11 @@
|
|||||||
display: block;
|
display: block;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
/* XXX do we need this???
|
||||||
/* loading indicator */
|
.code {
|
||||||
&.loading {
|
|
||||||
.outline {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
.outline>.block {
|
|
||||||
opacity: 0.2;
|
|
||||||
}
|
|
||||||
/* XXX STUB... */
|
|
||||||
.outline:before {
|
|
||||||
content: "Loading...";
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 1em;
|
|
||||||
}
|
|
||||||
.outline:empty:before {
|
|
||||||
position: relative;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
/* override empty indicator */
|
|
||||||
.outline:after {
|
|
||||||
content: "" !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* editor code */
|
|
||||||
&>.code {
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
/* header */
|
/* header */
|
||||||
.header {
|
.header {
|
||||||
|
|||||||
@ -288,7 +288,7 @@ var quoted = {
|
|||||||
quote: function(_, code){
|
quote: function(_, code){
|
||||||
return `<code>${ this.encode(code) }</code>` },
|
return `<code>${ this.encode(code) }</code>` },
|
||||||
|
|
||||||
pre_pattern: /(?<!\\)```(.*\s*\n)((\n|.)*?)\h*(?<!\\)```[ \t]*(?:$|\n)/gm,
|
pre_pattern: /(?<!\\)```(.*\s*\n)((\n|.)*?)\h*(?<!\\)```(?:[ \t]*$|[ \t]*\n)/g,
|
||||||
preEncode: function(text){
|
preEncode: function(text){
|
||||||
return this.encode(text)
|
return this.encode(text)
|
||||||
.replace(/`/, '\\`') },
|
.replace(/`/, '\\`') },
|
||||||
@ -886,7 +886,6 @@ var JSONOutline = {
|
|||||||
__styles: undefined,
|
__styles: undefined,
|
||||||
|
|
||||||
// block render...
|
// block render...
|
||||||
// XXX PRE_POST_NEWLINE can we avoid explicitly patching for empty lines after pre???
|
|
||||||
__code2html__: function(code, elem={}){
|
__code2html__: function(code, elem={}){
|
||||||
var that = this
|
var that = this
|
||||||
|
|
||||||
@ -913,7 +912,7 @@ var JSONOutline = {
|
|||||||
code.replace(/\x00/g, ''))
|
code.replace(/\x00/g, ''))
|
||||||
// split text into parsable and non-parsable sections...
|
// split text into parsable and non-parsable sections...
|
||||||
var sections = text
|
var sections = text
|
||||||
// split format:
|
// split fomat:
|
||||||
// [ text <match> <type> <body>, ... ]
|
// [ text <match> <type> <body>, ... ]
|
||||||
.split(/(<(pre|code)(?:|\s[^>]*)>((?:\n|.)*)<\/\2>)/g)
|
.split(/(<(pre|code)(?:|\s[^>]*)>((?:\n|.)*)<\/\2>)/g)
|
||||||
// sort out the sections...
|
// sort out the sections...
|
||||||
@ -935,18 +934,6 @@ var JSONOutline = {
|
|||||||
.join('')
|
.join('')
|
||||||
// stage: post...
|
// stage: post...
|
||||||
elem.text = run('post', text)
|
elem.text = run('post', text)
|
||||||
// patch for showing trailing empty lines in dom...
|
|
||||||
elem.text =
|
|
||||||
(elem.text == ''
|
|
||||||
// XXX PRE_POST_NEWLINE can we avoid this??
|
|
||||||
// ...simply .replace(/\n$/, '\n ') does not solve
|
|
||||||
// this -- doubles the single trailing empty line after pre...
|
|
||||||
// ...this will require a test for all block elements eventually (???)
|
|
||||||
|| elem.text.trim().endsWith('</pre>')) ?
|
|
||||||
elem.text
|
|
||||||
// NOTE: adding a space here is done to prevent the browser
|
|
||||||
// from hiding the last newline...
|
|
||||||
: elem.text + ' '
|
|
||||||
|
|
||||||
return elem },
|
return elem },
|
||||||
|
|
||||||
@ -1500,15 +1487,17 @@ var Outline = {
|
|||||||
focused: 'cls',
|
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???
|
// XXX UPDATE_CODE_SIZE this is a no-op at this point -- do we need this???
|
||||||
_updateCodeSize: function(code, view){
|
_updateCodeSize: function(code, view){
|
||||||
|
// XXX UPDATE_CODE_SIZE
|
||||||
|
return this
|
||||||
code.style.height =
|
code.style.height =
|
||||||
getComputedStyle(
|
getComputedStyle(
|
||||||
view
|
view
|
||||||
?? code.nextSibling)
|
?? code.nextSibling)
|
||||||
.height
|
.height
|
||||||
return this },
|
return this },
|
||||||
|
/* XXX not used...
|
||||||
_updateViewSize: function(view, code){
|
_updateViewSize: function(view, code){
|
||||||
view.style.height =
|
view.style.height =
|
||||||
getComputedStyle(
|
getComputedStyle(
|
||||||
@ -1542,7 +1531,12 @@ var Outline = {
|
|||||||
if(this.__code2html__){
|
if(this.__code2html__){
|
||||||
// NOTE: we are ignoring the .collapsed attr here
|
// NOTE: we are ignoring the .collapsed attr here
|
||||||
parsed = this.__code2html__(data.text, {...data})
|
parsed = this.__code2html__(data.text, {...data})
|
||||||
html.innerHTML = parsed.text
|
html.innerHTML =
|
||||||
|
parsed.text == '' ?
|
||||||
|
parsed.text
|
||||||
|
// NOTE: adding a space here is done to prevent the browser
|
||||||
|
// from hiding the last newline...
|
||||||
|
: parsed.text + ' '
|
||||||
// heading...
|
// heading...
|
||||||
this.__styles != null
|
this.__styles != null
|
||||||
&& node.classList.remove(...this.__styles)
|
&& node.classList.remove(...this.__styles)
|
||||||
@ -1550,11 +1544,16 @@ var Outline = {
|
|||||||
&& node.classList.add(...parsed.style)
|
&& node.classList.add(...parsed.style)
|
||||||
delete parsed.style
|
delete parsed.style
|
||||||
} else {
|
} else {
|
||||||
html.innerHTML = data.text }
|
html.innerHTML =
|
||||||
|
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.value = data.text
|
||||||
code.updateSize() }
|
code.updateSize()
|
||||||
// NOTE: this will have no effect if the element is not attached...
|
// NOTE: this will have no effect if the element is not attached...
|
||||||
//this._updateCodeSize(code) }
|
this._updateCodeSize(code) }
|
||||||
//this._syncTextSize(code, html) }
|
//this._syncTextSize(code, html) }
|
||||||
|
|
||||||
for(var [attr, value] of Object.entries({...data, ...parsed})){
|
for(var [attr, value] of Object.entries({...data, ...parsed})){
|
||||||
@ -1903,7 +1902,7 @@ var Outline = {
|
|||||||
cur[place](block)
|
cur[place](block)
|
||||||
: undefined
|
: undefined
|
||||||
|
|
||||||
//this._updateCodeSize(code)
|
this._updateCodeSize(code)
|
||||||
//this._syncTextSize(code, view)
|
//this._syncTextSize(code, view)
|
||||||
|
|
||||||
this.setUndo(this.path(cur), 'remove', [this.path(block)]) }
|
this.setUndo(this.path(cur), 'remove', [this.path(block)]) }
|
||||||
@ -1911,7 +1910,6 @@ var Outline = {
|
|||||||
/*/ XXX
|
/*/ XXX
|
||||||
load: function(data){
|
load: function(data){
|
||||||
var that = this
|
var that = this
|
||||||
this.dom.classList.add('loading')
|
|
||||||
data = typeof(data) == 'string' ?
|
data = typeof(data) == 'string' ?
|
||||||
this.parse(data)
|
this.parse(data)
|
||||||
: data instanceof Array ?
|
: data instanceof Array ?
|
||||||
@ -1932,22 +1930,20 @@ var Outline = {
|
|||||||
.clear()
|
.clear()
|
||||||
.outline
|
.outline
|
||||||
.append(...level(data))
|
.append(...level(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...
|
||||||
//setTimeout(function(){
|
setTimeout(function(){
|
||||||
// var f = that._updateCodeSize
|
var f = that._updateCodeSize
|
||||||
// //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)
|
||||||
this.dom.classList.remove('loading')
|
|
||||||
return this },
|
return this },
|
||||||
/*/ // XXX JSON version...
|
/*/ // XXX JSON version...
|
||||||
load: function(data){
|
load: function(data){
|
||||||
var that = this
|
var that = this
|
||||||
this.dom.classList.add('loading')
|
|
||||||
data = typeof(data) == 'string' ?
|
data = typeof(data) == 'string' ?
|
||||||
this.parse(data)
|
this.parse(data)
|
||||||
: data instanceof Array ?
|
: data instanceof Array ?
|
||||||
@ -1958,19 +1954,18 @@ var Outline = {
|
|||||||
|
|
||||||
this.outline.innerHTML = this.html(data)
|
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)
|
||||||
this.dom.classList.remove('loading')
|
|
||||||
return this },
|
return this },
|
||||||
//*/
|
//*/
|
||||||
|
|
||||||
|
|||||||
@ -48,6 +48,71 @@ var setup = function(){
|
|||||||
-
|
-
|
||||||
- ## Bugs:
|
- ## Bugs:
|
||||||
focused:: true
|
focused:: true
|
||||||
|
- BUG leading/trailing blank lines mishandled:
|
||||||
|
- 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_
|
||||||
|
- 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)
|
||||||
|
|
||||||
|
- ```
|
||||||
|
editor.Block(
|
||||||
|
editor.data(
|
||||||
|
editor.get()))
|
||||||
|
.querySelector('.view').innerHTML // formatting is OK...
|
||||||
|
```
|
||||||
|
- _...this is a resize issue (???)_
|
||||||
|
- running `.updateSize() and then `._updateViewSize(..)` does not fix the issue...
|
||||||
|
- simply replacing `._updateCodeSize(..)` with `._syncTextSize(..)` fixes this but breaks lots more stuff...
|
||||||
|
_...need a better sync mechanism, preferably CSS_
|
||||||
|
-
|
||||||
|
this block also contains two lines (empty above)
|
||||||
|
-
|
||||||
|
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...
|
- BUG: styling error...
|
||||||
- this _seems `to` work_
|
- this _seems `to` work_
|
||||||
- `while` _this `does` not_
|
- `while` _this `does` not_
|
||||||
@ -108,13 +173,18 @@ var setup = function(){
|
|||||||
- side margins are a bit too large
|
- side margins are a bit too large
|
||||||
- still need to account for toolbar to the right
|
- still need to account for toolbar to the right
|
||||||
- left side does not need to be as wide
|
- left side does not need to be as wide
|
||||||
|
- DONE TEST BUG: parser: code blocks do not ignore single back-quotes...
|
||||||
|
collapsed:: true
|
||||||
|
- ```
|
||||||
|
x = `moo`
|
||||||
|
```
|
||||||
|
- _this also leads to double quoting of html..._
|
||||||
|
```
|
||||||
|
x = `<i>moo</i>`
|
||||||
|
```
|
||||||
-
|
-
|
||||||
- ## ToDo:
|
- ## ToDo:
|
||||||
- add loading spinner -- `.loading` class set on `.load(..)` and unset when done...
|
- clicking left of the block can select one of parent blocks -- bug or a feature??
|
||||||
- DONE set/unset class
|
|
||||||
- add animation
|
|
||||||
- clicking left of the block can select one of parent blocks -- bug or feature??
|
|
||||||
- _can we extend the left click zone all the way to the left edge???_
|
|
||||||
- `.json(..)`, `.data(..)`, ... should be signature compatible with `.get(..)` (???)
|
- `.json(..)`, `.data(..)`, ... should be signature compatible with `.get(..)` (???)
|
||||||
- _current state causes constant confusion..._
|
- _current state causes constant confusion..._
|
||||||
- Time to think about a standalone client -- at least to edit own notes as a test...
|
- Time to think about a standalone client -- at least to edit own notes as a test...
|
||||||
@ -124,6 +194,7 @@ var setup = function(){
|
|||||||
- Q: When moving up/down between nodes do we want to place the caret relative to markdown (current) or to view? (see: `CARET_V_MOVE`)
|
- Q: When moving up/down between nodes do we want to place the caret relative to markdown (current) or to view? (see: `CARET_V_MOVE`)
|
||||||
- Q: Should we use `HTMLTextAreaElement.autoUpdateSize(..)` or handle it globally in setup???
|
- Q: Should we use `HTMLTextAreaElement.autoUpdateSize(..)` or handle it globally in setup???
|
||||||
- _...I'm leaning towards the later..._
|
- _...I'm leaning towards the later..._
|
||||||
|
- Q: Can we place a cursor in a table correctly???
|
||||||
- Q: Should tables be text-based markdown or higher-level?
|
- Q: Should tables be text-based markdown or higher-level?
|
||||||
collapsed:: true
|
collapsed:: true
|
||||||
- for reference a normal table
|
- for reference a normal table
|
||||||
@ -187,8 +258,9 @@ var setup = function(){
|
|||||||
- delete
|
- delete
|
||||||
- copy/cut/past (???)
|
- copy/cut/past (???)
|
||||||
- touch/mouse (???)
|
- touch/mouse (???)
|
||||||
- Q: should we select text through multiple nodes??
|
- Q: should we select text (mouse/touch) without first focusing??
|
||||||
- _...should this turn into node selection as soon as node boundary is crossed???_
|
- _...logseq does not do this either_
|
||||||
|
- now this is possible by dragging from a click zone...
|
||||||
- copy/paste nodes/trees
|
- copy/paste nodes/trees
|
||||||
- numbered lists: add counters to a depth of 6-7...
|
- numbered lists: add counters to a depth of 6-7...
|
||||||
- _or find a way to make them repeat..._
|
- _or find a way to make them repeat..._
|
||||||
@ -520,18 +592,6 @@ var setup = function(){
|
|||||||
-
|
-
|
||||||
- ---
|
- ---
|
||||||
- ### Playground for testing
|
- ### Playground for testing
|
||||||
- Empty line tests::
|
|
||||||
-
|
|
||||||
leading
|
|
||||||
- trailing
|
|
||||||
|
|
||||||
-
|
|
||||||
both
|
|
||||||
|
|
||||||
- ```
|
|
||||||
block with trailing empty line
|
|
||||||
```
|
|
||||||
|
|
||||||
- A
|
- A
|
||||||
collapsed:: true
|
collapsed:: true
|
||||||
- a
|
- a
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user