Compare commits

..

No commits in common. "71cb3f1f97fe1ac10a32c6e17f165b579e9bb317" and "d2d10c68fb291eb4ecbf31dabd4529f08433990f" have entirely different histories.

3 changed files with 24 additions and 107 deletions

View File

@ -89,21 +89,11 @@
border: none;
}
/* show/hide node's view/code... */
/*.editor .outline [tabindex]>textarea:focus+span,*/
.editor .outline [tabindex]>textarea:focus+span,
.editor .outline [tabindex]>textarea:not(:focus) {
position: absolute;
opacity: 0;
}
/* hide span content but show before/after -- keep bulets and touch zones... */
.editor .outline [tabindex]>textarea:focus+span {
position: absolute;
top: 0;
visibility: hidden;
}
.editor .outline [tabindex]>textarea:focus+span:before,
.editor .outline [tabindex]>textarea:focus+span:after {
visibility: visible;
}
/* click through the span text to the textarea */
.editor .outline [tabindex]>span {
position: relative;
@ -234,14 +224,6 @@ editor .outline [tabindex]:focus {
/********************************************************** Styles ***/
/* Headings... */
.editor .outline .heading-1,
.editor .outline .heading-2,
.editor .outline .heading-3,
.editor .outline .heading-4,
.editor .outline .heading-5,
.editor .outline .heading-6 {
margin-top: 1rem;
}
.editor .outline .heading-1>span,
.editor .outline .heading-1>textarea,
.editor .outline .heading-2>span,
@ -254,6 +236,7 @@ editor .outline [tabindex]:focus {
.editor .outline .heading-5>textarea,
.editor .outline .heading-6>span,
.editor .outline .heading-6>textarea {
margin-top: 1rem;
font-weight: bold;
}
.editor .outline .heading-1>span,
@ -314,7 +297,7 @@ editor .outline [tabindex]:focus {
}
/* List... */
/* Lists... */
/* XXX needs to be in the middle of the first span but with universal size... */
.editor .outline .list-item>span:before,
.editor .outline .list>[tabindex]>span:not(:empty):before {
@ -331,19 +314,6 @@ editor .outline [tabindex]:focus {
content: "▪";
}
/* List... */
/* XXX nested lists are broken -- seems that I need a container for the children... */
.editor .outline .numbered-list {
counter-reset: numbered-list;
}
.editor .outline .numbered-list>[tabindex]>span:not(:empty):before {
counter-increment: numbered-list;
content: counter(numbered-list) ".";
color: gray;
}
/* Notes... */
.editor .outline .NOTE {
--margin: 1rem;
@ -403,8 +373,8 @@ editor .outline [tabindex]:focus {
var(--checkbox-size)
+ var(--checkbox-margin));
}
.editor .outline [tabindex].check>span input[type=checkbox],
.editor .outline [tabindex].todo>span input[type=checkbox] {
.editor .outline [tabindex].check>span>input[type=checkbox],
.editor .outline [tabindex].todo>span>input[type=checkbox] {
height: var(--checkbox-size);
width: var(--checkbox-size);
@ -417,7 +387,7 @@ editor .outline [tabindex]:focus {
/* NOTE: this appears to be needed for the em sizes above to work correctly */
font-size: 1em;
}
.editor .outline [tabindex].todo>span input[type=checkbox]:first-child {
.editor .outline [tabindex].todo>span>input[type=checkbox]:first-child {
margin-left: calc(
-1 * var(--checkbox-size)
- var(--checkbox-margin));
@ -439,25 +409,6 @@ editor .outline [tabindex]:focus {
}
/* Tables... */
.editor .outline [tabindex]>span>table {
width: 100%;
border-collapse: collapse;
}
.editor .outline [tabindex]>span>table tr:nth-child(odd) {
background: rgba(0,0,0,0.03);
}
.editor .outline [tabindex]>span>table tr:first-child {
font-weight: bold;
border-bottom: solid 0.1rem silver;
background: transparent;
}
.editor .outline [tabindex]>span>table td {
height: calc(1em + var(--item-padding) * 2);
padding: 0 1em;
/*text-align: center;*/
}
/********************************************************* Testing ***/

View File

@ -93,13 +93,6 @@ var Outline = {
var outline = this.outline
// get parent node...
if(node instanceof HTMLElement){
while(!node.getAttribute('tabindex')){
node = node.parentElement
if(node === this.outline){
return undefined } } }
// node lists...
var NO_NODES = {}
var nodes =
@ -311,12 +304,6 @@ var Outline = {
elem.style.push(...style)
return code
?? text } }
var table = function(_, body){
return `<table><tr><td>${
body
.replace(/\s*\|\s*\n\s*\|\s*/gm, '</td></tr>\n<tr><td>')
.replace(/\s*\|\s*/gm, '</td><td>')
}</td></td></table>` }
elem.text = code
// hidden attributes...
// XXX make this generic...
@ -342,7 +329,6 @@ var Outline = {
// style: list...
//.replace(/^(?<!\\)[-\*]\s+(.*)$/m, style('list-item'))
.replace(/^\s*(.*)(?<!\\):\s*$/m, style('list'))
.replace(/^\s*(.*)(?<!\\)#\s*$/m, style('numbered-list'))
// style: misc...
.replace(/^\s*(?<!\\)>\s+(.*)$/m, style('quote'))
.replace(/^\s*(?<!\\)((\/\/|;)\s+.*)$/m, style('comment'))
@ -365,8 +351,6 @@ var Outline = {
style('check', '<input type="checkbox">'))
.replace(/\s*(?<!\\)\[[Xx]\]\s*/gm,
style('check', '<input type="checkbox" checked>'))
// tables...
.replace(/^\s*(?<!\\)\|\s*((.|\n)*)\s*\|\s*$/, table)
// basic styling...
// XXX revise...
.replace(/(?<!\\)\*(?=[^\s*])(([^*]|\\\*)*[^\s*])(?<!\\)\*/gm, '<b>$1</b>')
@ -375,14 +359,8 @@ var Outline = {
.replace(/(?<!\\)`(?=[^\s])(([^`]|\\`)*[^\s])(?<!\\)`/gm, '<code>$1</code>')
// XXX support "\==" in mark...
.replace(/(?<!\\)==(?=[^\s])(.*[^\s])(?<!\\)==/gm, '<mark>$1</mark>')
// links...
.replace(/(?<!\\)\[([^\]]*)\]\(([^)]*)\)/g, '<a href="$2">$1</a>')
.replace(/((?:https?:|ftps?:)[^\s]*)(\s*)/g, '<a href="$1">$1</a>$2')
// characters...
// XXX use ligatures for these???
.replace(/(?<!\\)\(i\)/gm, '🛈')
.replace(/(?<!\\)\(c\)/gm, '©')
.replace(/(?<!\\)\/!\\/gm, '⚠')
.replace(/(?<!\\)---(?!-)/gm, '&mdash;')
.replace(/(?<!\\)--(?!-)/gm, '&ndash;')
// quoting...
@ -707,7 +685,7 @@ var Outline = {
// click: right of elem (outside)
} else if(elem.offsetWidth < evt.offsetX){
that.toggleCollapse(that.get(elem))
that.toggleCollapse(elem.parentElement)
// click inside element...
} else {
@ -722,7 +700,7 @@ var Outline = {
// toggle checkbox...
if(elem.type == 'checkbox'){
var node = that.get(elem)
var node = elem.parentElement.parentElement
var text = node.querySelector('textarea')
// get the checkbox order...
var i = [...node.querySelectorAll('input[type=checkbox]')].indexOf(elem)

View File

@ -40,8 +40,6 @@ var setup = function(){
- BUG? pressing down from a longer line will jump over a shorter line
- here is the line to jump from, for example from here
an we'll not get here...
- ASAP: fix quotes
- Example: /\n\s*\|\s+/ -&gt; &lt;tr&gt;&lt;td&gt;
- ASAP: editor: bksapce/del at start/end of a block should join it with prev/next
- ASAP: editor: pressing enter in text edit mode should split text into two blocks
- ASAP: editor: shifting nodes up/down
@ -80,6 +78,14 @@ var setup = function(){
- delete node
- indent/deindent
- edit node
- markdown: tables
collapsed:: true
- /^\s*(\|\s+.*\s+\|)\s*$/m -&gt; &lt;table&gt;&lt;tr&gt;&lt;td&gt;$1&lt;/td&gt;&lt;/tr&gt;&lt;table&gt;
- /\n\s*\|\s+/ -&gt; &lt;tr&gt;&lt;td&gt;
- /\s+\|\s*\n/ -&gt; &lt;/td&gt;&lt;/tr&gt;
- /\s+\|\s+/ -&gt; &lt;/td&gt;&lt;td&gt;
- ASAP: fix quotes
- Example: /\n\s*\|\s+/ -&gt; &lt;tr&gt;&lt;td&gt;
- empty item height is a bit off...
- ~handle links gracefully -- open/edit
_just click in the empty space_~
@ -98,18 +104,10 @@ var setup = function(){
- ##### Heading 5
- ###### Heading 6
- Text
- Lists::
- bullet:
- List::
- a
- b
- c
- numbered#
- a
- b#
- x
- y
- z
- c
- &gt; quoted text
- Notes
- NOTE: a note text
@ -119,31 +117,21 @@ var setup = function(){
- // C-style comment
- ; ASM-style comment
- XXX Highlight
- Basic inline *bold*, _italic_ and ~striked~
- Marking ==text==
- Line
- ---
- Markers: ASAP, BUG, FIX, HACK, STUB, WARNING, and CAUTION
- Basic inline *bold*, _italic_ and ~striked~
- Marking ==text==
- Inline [X] checkboxes [_]
- To do items/blocks
- [_] undone item
_(clicking the checkbox updates the item)_
- [X] done item
- [_] we can also add inline [x] checkboxes
- link
- [example](about:blank)
- https://example.com
- ./path/to/file /path/to -- not supported yet
- Tables
- | a | b | c |
| 1 | 2 | 3 |
| 11 | 22 | 33 |
- Symbols -- should these be ligatures?
- (i), (c), /!\, ...
- -- and ---
- link <a href="about:blank">example</a>
- markdown:
- numbered lists
- ~tables~
- tables
- code blocks
- ~alerts~
- footnotes??