mirror of
https://github.com/flynx/pWiki.git
synced 2025-12-25 04:11:56 +00:00
Compare commits
No commits in common. "90cdc0c3c71cdbc6a61f449daac56530a09d5c48" and "6c484194ae80e71485fc46af0aa502169bbcfdd8" have entirely different histories.
90cdc0c3c7
...
6c484194ae
@ -203,7 +203,6 @@ editor .outline .block:focus {
|
|||||||
|
|
||||||
pointer-events: auto;
|
pointer-events: auto;
|
||||||
|
|
||||||
cursor: pointer;
|
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -596,33 +596,6 @@ var escaping = {
|
|||||||
|
|
||||||
//---------------------------------------------------------------------
|
//---------------------------------------------------------------------
|
||||||
|
|
||||||
var JSONOutline = {
|
|
||||||
json: undefined,
|
|
||||||
|
|
||||||
path: function(){},
|
|
||||||
get: function(){},
|
|
||||||
at: function(){},
|
|
||||||
focus: function(){},
|
|
||||||
|
|
||||||
indent: function(){},
|
|
||||||
deindent: function(){},
|
|
||||||
shift: function(){},
|
|
||||||
show: function(){},
|
|
||||||
toggleCollapse: function(){},
|
|
||||||
remove: function(){},
|
|
||||||
clear: function(){},
|
|
||||||
|
|
||||||
crom: function(){},
|
|
||||||
uncrop: function(){},
|
|
||||||
|
|
||||||
parseBlockAttrs: function(){},
|
|
||||||
parse: function(){},
|
|
||||||
|
|
||||||
data: function(){},
|
|
||||||
load: function(){},
|
|
||||||
text: function(){},
|
|
||||||
}
|
|
||||||
|
|
||||||
// XXX experiment with a concatinative model...
|
// XXX experiment with a concatinative model...
|
||||||
// .get(..) -> Outline (view)
|
// .get(..) -> Outline (view)
|
||||||
var Outline = {
|
var Outline = {
|
||||||
@ -683,15 +656,6 @@ var Outline = {
|
|||||||
return this.dom.querySelector('.toolbar') },
|
return this.dom.querySelector('.toolbar') },
|
||||||
|
|
||||||
|
|
||||||
path: function(node='focused'){
|
|
||||||
var outline = this.outline
|
|
||||||
var path = []
|
|
||||||
var node = this.get(node)
|
|
||||||
while(node != outline){
|
|
||||||
path.unshift(this.get(node, 'siblings').indexOf(node))
|
|
||||||
node = this.get(node, 'parent') }
|
|
||||||
return path },
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// .get([<offset>])
|
// .get([<offset>])
|
||||||
// .get('focused'[, <offset>])
|
// .get('focused'[, <offset>])
|
||||||
@ -762,11 +726,6 @@ var Outline = {
|
|||||||
typeof(node) == 'number' ?
|
typeof(node) == 'number' ?
|
||||||
[this.get('visible').at(node),
|
[this.get('visible').at(node),
|
||||||
edited]
|
edited]
|
||||||
: node instanceof Array ?
|
|
||||||
[node
|
|
||||||
.reduce(function(res, i){
|
|
||||||
return that.get(res, 'children')[i] }, outline),
|
|
||||||
edited]
|
|
||||||
: (node == 'outline' || node == 'root') ?
|
: (node == 'outline' || node == 'root') ?
|
||||||
[outline, edited]
|
[outline, edited]
|
||||||
: node == 'focused' ?
|
: node == 'focused' ?
|
||||||
@ -838,10 +797,8 @@ var Outline = {
|
|||||||
at: function(index, nodes='visible'){
|
at: function(index, nodes='visible'){
|
||||||
return this.get(nodes).at(index) },
|
return this.get(nodes).at(index) },
|
||||||
focus: function(node='focused', offset){
|
focus: function(node='focused', offset){
|
||||||
var elem = this.get(...arguments)
|
var elem = this.get(...arguments)
|
||||||
?? this.get(0)
|
elem?.focus()
|
||||||
elem
|
|
||||||
&& elem.focus()
|
|
||||||
return elem },
|
return elem },
|
||||||
edit: function(node='focused', offset){
|
edit: function(node='focused', offset){
|
||||||
var elem = this.get(...arguments)
|
var elem = this.get(...arguments)
|
||||||
@ -1035,32 +992,6 @@ var Outline = {
|
|||||||
this.__change__()
|
this.__change__()
|
||||||
return this },
|
return this },
|
||||||
|
|
||||||
|
|
||||||
// crop...
|
|
||||||
__crop_stack: undefined,
|
|
||||||
crop: function(node='focused'){
|
|
||||||
var stack = this.__crop_stack ??= []
|
|
||||||
stack.push([this.json(), this.path()])
|
|
||||||
this.load(this.data())
|
|
||||||
.focus()
|
|
||||||
return this },
|
|
||||||
// XXX use JSON API...
|
|
||||||
uncrop: function(){
|
|
||||||
if(this.__crop_stack == null){
|
|
||||||
return this}
|
|
||||||
var [state, path] = this.__crop_stack.pop()
|
|
||||||
if(this.__crop_stack.length == 0){
|
|
||||||
this.__crop_stack = undefined }
|
|
||||||
// update state...
|
|
||||||
path
|
|
||||||
.slice(0, -1)
|
|
||||||
.reduce(function(res, i){
|
|
||||||
return res[i].children }, state)
|
|
||||||
.splice(path.at(-1), 1, ...this.json())
|
|
||||||
this.load(state)
|
|
||||||
.focus()
|
|
||||||
return this },
|
|
||||||
|
|
||||||
// block render...
|
// block render...
|
||||||
// XXX need a way to filter input text...
|
// XXX need a way to filter input text...
|
||||||
// use-case: hidden attributes...
|
// use-case: hidden attributes...
|
||||||
@ -1319,10 +1250,8 @@ var Outline = {
|
|||||||
load: function(data){
|
load: function(data){
|
||||||
var that = this
|
var that = this
|
||||||
data = typeof(data) == 'string' ?
|
data = typeof(data) == 'string' ?
|
||||||
this.parse(data)
|
this.parse(data)
|
||||||
: data instanceof Array ?
|
: data
|
||||||
data
|
|
||||||
: [data]
|
|
||||||
// generate dom...
|
// generate dom...
|
||||||
var level = function(lst){
|
var level = function(lst){
|
||||||
return lst
|
return lst
|
||||||
@ -1508,13 +1437,7 @@ var Outline = {
|
|||||||
evt.preventDefault()
|
evt.preventDefault()
|
||||||
this.edit() },
|
this.edit() },
|
||||||
Escape: function(evt){
|
Escape: function(evt){
|
||||||
if(this.get('edited')){
|
this.focus() },
|
||||||
this.focus()
|
|
||||||
} else {
|
|
||||||
this.uncrop() } },
|
|
||||||
c: function(evt){
|
|
||||||
if(!this.get('edited')){
|
|
||||||
this.crop() } },
|
|
||||||
|
|
||||||
Delete: function(evt){
|
Delete: function(evt){
|
||||||
var edited = this.get('edited')
|
var edited = this.get('edited')
|
||||||
@ -1731,10 +1654,6 @@ var Outline = {
|
|||||||
console.log(`Parse: ${Date.now() - t}ms`) }
|
console.log(`Parse: ${Date.now() - t}ms`) }
|
||||||
|
|
||||||
this.runPlugins('__setup__', this)
|
this.runPlugins('__setup__', this)
|
||||||
|
|
||||||
// autofocus...
|
|
||||||
if(this.dom.getAttribute('autofocus') != null){
|
|
||||||
this.focus() }
|
|
||||||
|
|
||||||
return this },
|
return this },
|
||||||
}
|
}
|
||||||
|
|||||||
@ -31,7 +31,7 @@ var setup = function(){
|
|||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body onload="setup()">
|
<body onload="setup()">
|
||||||
<div class="editor" autofocus>
|
<div class="editor">
|
||||||
<!-- code -->
|
<!-- code -->
|
||||||
<textarea class="code">
|
<textarea class="code">
|
||||||
- # Outline editor prototype
|
- # Outline editor prototype
|
||||||
@ -39,27 +39,22 @@ var setup = function(){
|
|||||||
- ### Infuences::
|
- ### Infuences::
|
||||||
- Logseq
|
- Logseq
|
||||||
- Conboy (Nokia N900's Tomboy clone)
|
- Conboy (Nokia N900's Tomboy clone)
|
||||||
- Bonsai (on PalmOS)
|
- Bonsai
|
||||||
-
|
-
|
||||||
- // Seems that I unintentionally implemented quite a chunk of the markdown spec ;)
|
- // Seems that I unintentionally implemented quite a chunk of the markdown spec ;)
|
||||||
-
|
-
|
||||||
- ## Bugs:
|
- ## Bugs:
|
||||||
focused:: true
|
|
||||||
- BUG: editor: FF seems to update the style every other key press -- should be live...
|
- BUG: editor: FF seems to update the style every other key press -- should be live...
|
||||||
- BUG: scrolling into view needs tuning...
|
- BUG: scrolling into view needs tuning...
|
||||||
- BUG: mobile browsers behave quite chaotically ignoring parts of the styling...
|
- BUG: mobile browsers behave quite chaotically ignoring parts of the styling...
|
||||||
-
|
-
|
||||||
- ## ToDo:
|
- ## ToDo:
|
||||||
- crop: show crop path (and depth)
|
|
||||||
- pgup/pgdown/~home/end~ buttons
|
- pgup/pgdown/~home/end~ buttons
|
||||||
- identify a block:
|
- identify a block (index, id, ...)
|
||||||
- DONE index (flat)
|
- FEATURE: "crop" -- view block tree separately...
|
||||||
- DONE path (index)
|
- focus
|
||||||
- id
|
- `<editor>.autofocus`
|
||||||
- _the id attr is done, but we still need to get the node via id_
|
- `focused:: true` attr (`.text(..)`/`.json(..)`/`.load(..)`)
|
||||||
- focus:
|
|
||||||
- DONE `<editor>.autofocus`
|
|
||||||
- DONE `focused:: true` attr (`.text(..)`/`.json(..)`/`.load(..)`)
|
|
||||||
- focusing editor -> focus focused block
|
- focusing editor -> focus focused block
|
||||||
- undo
|
- undo
|
||||||
collapsed:: true
|
collapsed:: true
|
||||||
@ -95,11 +90,7 @@ var setup = function(){
|
|||||||
- `<editable/>` -- field marker
|
- `<editable/>` -- field marker
|
||||||
- each child node will copy the template and allow editing of only fields
|
- each child node will copy the template and allow editing of only fields
|
||||||
- not clear how to handle template changes...
|
- not clear how to handle template changes...
|
||||||
- JSON API
|
- might be a good idea to split the editor into a generic and dom versions...
|
||||||
- `.path(..)`
|
|
||||||
- `.get(..)`
|
|
||||||
- `.at(..)`
|
|
||||||
- ...
|
|
||||||
- cli
|
- cli
|
||||||
- Q: do we use \\t for indent? (option???)
|
- Q: do we use \\t for indent? (option???)
|
||||||
- Q: persistent empty first/last node (a button to create a new node)?
|
- Q: persistent empty first/last node (a button to create a new node)?
|
||||||
@ -115,7 +106,6 @@ var setup = function(){
|
|||||||
block text
|
block text
|
||||||
- NOTE: this is only a problem if making list-items manually -- disable???
|
- NOTE: this is only a problem if making list-items manually -- disable???
|
||||||
- empty item height is a bit off...
|
- empty item height is a bit off...
|
||||||
- DONE FEATURE: "crop" -- view block tree separately...
|
|
||||||
- DONE unify attr parsing
|
- DONE unify attr parsing
|
||||||
collapsed:: true
|
collapsed:: true
|
||||||
- _now duplicated in `.parse(..)` and `.__code2html__(..)`_
|
- _now duplicated in `.parse(..)` and `.__code2html__(..)`_
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user