mirror of
https://github.com/flynx/pWiki.git
synced 2025-12-25 12:21:58 +00:00
Compare commits
4 Commits
1842223a79
...
ca216df605
| Author | SHA1 | Date | |
|---|---|---|---|
| ca216df605 | |||
| 4cefc92faf | |||
| dea1a6d7ff | |||
| 670d8b5760 |
@ -6,6 +6,7 @@
|
|||||||
|
|
||||||
|
|
||||||
//---------------------------------------------------------------------
|
//---------------------------------------------------------------------
|
||||||
|
// Helpers...
|
||||||
|
|
||||||
// XXX do a caret api...
|
// XXX do a caret api...
|
||||||
|
|
||||||
@ -44,7 +45,9 @@ function clickPoint(x,y){
|
|||||||
// box corresponds the to desired coordinates. This accounts for nested
|
// box corresponds the to desired coordinates. This accounts for nested
|
||||||
// elements.
|
// elements.
|
||||||
//
|
//
|
||||||
// XXX might be a good idea to tweak this just a bit (1/2 letter) to the left...
|
// XXX it would be a better idea to do a binary search instead of a liner
|
||||||
|
// pass... but at this point this is not critical (unless we get
|
||||||
|
// gigantic blocks)
|
||||||
// XXX HACK -- is there a better way to do this???
|
// XXX HACK -- is there a better way to do this???
|
||||||
var getCharOffset = function(elem, x, y, c){
|
var getCharOffset = function(elem, x, y, c){
|
||||||
c = c ?? 0
|
c = c ?? 0
|
||||||
@ -52,15 +55,20 @@ var getCharOffset = function(elem, x, y, c){
|
|||||||
for(var e of [...elem.childNodes]){
|
for(var e of [...elem.childNodes]){
|
||||||
// text node...
|
// text node...
|
||||||
if(e instanceof Text){
|
if(e instanceof Text){
|
||||||
for(var i=0; i < e.length; i++){
|
var prev, b
|
||||||
|
for(var i=0; i <= e.length; i++){
|
||||||
r.setStart(e, i)
|
r.setStart(e, i)
|
||||||
r.setEnd(e, i)
|
r.setEnd(e, i)
|
||||||
var b = r.getBoundingClientRect()
|
prev = b
|
||||||
|
b = r.getBoundingClientRect()
|
||||||
// found target...
|
// found target...
|
||||||
if(b.x >= x
|
if(b.x >= x
|
||||||
&& b.y <= y
|
&& b.y <= y
|
||||||
&& b.bottom >= y){
|
&& b.bottom >= y){
|
||||||
return c + i } }
|
// get the closest gap between chars to the click...
|
||||||
|
return Math.abs(b.x - x) <= Math.abs(prev.x - x) ?
|
||||||
|
c + i
|
||||||
|
: c + i - 1 } }
|
||||||
c += i
|
c += i
|
||||||
// html node...
|
// html node...
|
||||||
} else {
|
} else {
|
||||||
@ -87,7 +95,7 @@ var getMarkdownOffset = function(markdown, text, i){
|
|||||||
i = i ?? text.length
|
i = i ?? text.length
|
||||||
var m = 0
|
var m = 0
|
||||||
// walk both strings skipping/counting non-matching stuff...
|
// walk both strings skipping/counting non-matching stuff...
|
||||||
for(var n=0; n < i; n++, m++){
|
for(var n=0; n <= i; n++, m++){
|
||||||
var c = text[n]
|
var c = text[n]
|
||||||
var p = m
|
var p = m
|
||||||
// walk to next match...
|
// walk to next match...
|
||||||
@ -1107,8 +1115,8 @@ var Outline = {
|
|||||||
|
|
||||||
sync: function(){
|
sync: function(){
|
||||||
var code = this.code
|
var code = this.code
|
||||||
code
|
if(code){
|
||||||
&& (code.innerHTML = this.text())
|
code.value = this.text() }
|
||||||
return this },
|
return this },
|
||||||
|
|
||||||
|
|
||||||
@ -1477,7 +1485,7 @@ var Outline = {
|
|||||||
var code = this.code
|
var code = this.code
|
||||||
if(code){
|
if(code){
|
||||||
var t = Date.now()
|
var t = Date.now()
|
||||||
this.load(code.innerHTML
|
this.load(code.value
|
||||||
.replace(/</g, '<')
|
.replace(/</g, '<')
|
||||||
.replace(/>/g, '>'))
|
.replace(/>/g, '>'))
|
||||||
console.log(`Parse: ${Date.now() - t}ms`) }
|
console.log(`Parse: ${Date.now() - t}ms`) }
|
||||||
|
|||||||
@ -33,7 +33,7 @@ var setup = function(){
|
|||||||
<body onload="setup()">
|
<body onload="setup()">
|
||||||
<div class="editor">
|
<div class="editor">
|
||||||
<!-- code -->
|
<!-- code -->
|
||||||
<pre class="code">
|
<textarea class="code">
|
||||||
- # Outline editor prototype
|
- # Outline editor prototype
|
||||||
- An outline-based markdown editor experiment
|
- An outline-based markdown editor experiment
|
||||||
- ### Infuences::
|
- ### Infuences::
|
||||||
@ -45,12 +45,11 @@ var setup = function(){
|
|||||||
-
|
-
|
||||||
- ## Bugs:
|
- ## Bugs:
|
||||||
- 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: last node seems to get trash tags added to it's end...
|
|
||||||
-
|
-
|
||||||
- ## ToDo:
|
- ## ToDo:
|
||||||
- ASAP: scroll into view is bad...
|
- ASAP: scroll into view is bad...
|
||||||
- ASAP: mobile browsers behave quite chaotically ignoring parts of the styling...
|
- ASAP: mobile browsers behave quite chaotically ignoring parts of the styling...
|
||||||
- ASAP: tweak the getCharOffset(..) by about 1/2 a letter to the left...
|
- ASAP: call `.sync()` on all changes...
|
||||||
- FEATURE: read-only mode
|
- FEATURE: read-only mode
|
||||||
- export html
|
- export html
|
||||||
- embed css
|
- embed css
|
||||||
@ -277,7 +276,7 @@ var setup = function(){
|
|||||||
- This is a set
|
- This is a set
|
||||||
text lines
|
text lines
|
||||||
- Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text
|
- Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text Lots of text
|
||||||
- </pre>
|
- </textarea>
|
||||||
<!-- outline -->
|
<!-- outline -->
|
||||||
<div class="outline"></div>
|
<div class="outline"></div>
|
||||||
<!-- toolbar (optional) -->
|
<!-- toolbar (optional) -->
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user