yonote/yjs
24
0
Fork 0
Code Pull Requests 1 Releases Activity

added support for html content editable. Now you can bind event html tags to text types

Browse Source
This commit is contained in:
DadaMonad 2015-01-19 01:56:22 +00:00
parent 02d0ace241
commit 54844f4535
10 changed files with 492 additions and 143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
build/browser/yatta-element.js
View File

File diff suppressed because one or more lines are too long

122
build/browser/yatta.js
View File

File diff suppressed because one or more lines are too long

122
build/test/JsonYatta_test.js
View File

File diff suppressed because one or more lines are too long

122
build/test/TextYatta_test.js
View File

File diff suppressed because one or more lines are too long

2
examples/XMPP-Json/index.html
View File

@ -8,7 +8,7 @@
<script src="./index.js"></script> <script src="./index.js"></script>
</head> </head>
<body> <body>
<h1> PeerJs + Json Tutorial</h1> <h1 contentEditable> PeerJs + Json Tutorial</h1>
<p> Collaborative Json editing with <a href="https://github.com/DadaMonad/Yatta/">Yatta</a> <p> Collaborative Json editing with <a href="https://github.com/DadaMonad/Yatta/">Yatta</a>
and <a href="http://peerjs.com/">PeerJs</a> (WebRTC). </p> and <a href="http://peerjs.com/">PeerJs</a> (WebRTC). </p>

1
examples/XMPP-Json/index.js
View File

@ -46,6 +46,7 @@ window.onload = function(){
var event = events[i]; var event = events[i];
if(event.name === "textfield" && event.type !== "delete"){ if(event.name === "textfield" && event.type !== "delete"){
yatta.val("textfield").bind(textbox); yatta.val("textfield").bind(textbox);
yatta.val("textfield").bind(document.querySelector("h1"))
} }
} }
}); });

4
gulpfile.coffee
View File

@ -70,8 +70,8 @@ gulp.task 'build_browser', ->
extname: ".js" extname: ".js"
.pipe gulp.dest './build/test/' .pipe gulp.dest './build/test/'
gulp.task 'watch', ['build_browser','mocha'], -> gulp.task 'watch', ['build_browser'], ->
gulp.watch files.all, ['build_browser', 'mocha'] gulp.watch files.all, ['build_browser']
gulp.task 'mocha', -> gulp.task 'mocha', ->
gulp.src files.test, { read: false } gulp.src files.test, { read: false }

136
lib/Types/TextTypes.coffee
View File

@ -276,34 +276,81 @@ module.exports = (HB)->
textfield.value = @val() textfield.value = @val()
@textfields.push textfield @textfields.push textfield
if textfield.selectionStart? and textfield.setSelectionRange?
createRange = (fix)->
left = textfield.selectionStart
right = textfield.selectionEnd
if fix?
left = fix left
right = fix right
{
left: left
right: right
}
writeRange = (range)->
textfield.setSelectionRange range.left, range.right
writeContent = (content)->
textfield.value = content
else
createRange = (fix)->
textnode = textfield.childNodes[0]
s = window.getSelection().getRangeAt(0)
if s.startContainer is textnode and s.endContainer is textnode
left = s.startOffset
right = s.endOffset
if fix?
left = fix left
right = fix right
{
left: left
right: right
isReal: true
}
else
{
left: 0
right: 0
}
writeRange = (range)->
textnode = textfield.childNodes[0]
if range.isReal
r = new Range()
r.setStart(textnode, range.left)
r.setEnd(textnode, range.right)
s = window.getSelection()
s.removeAllRanges()
s.addRange(r)
writeContent = (content)->
textfield.textContent = content
@observe (events)-> @observe (events)->
for event in events for event in events
if event.type is "insert" if event.type is "insert"
o_pos = event.position o_pos = event.position
fix = (cursor)-> fix = (cursor)->
if cursor <= o_pos if cursor <= o_pos
cursor cursor
else else
cursor += 1 cursor += 1
cursor cursor
left = fix textfield.selectionStart r = createRange fix
right = fix textfield.selectionEnd writeContent word.val()
writeRange r
textfield.value = word.val() else if event.type is "delete"
textfield.setSelectionRange left, right o_pos = event.position
else if event.type is "delete" fix = (cursor)->
o_pos = event.position if cursor < o_pos
fix = (cursor)-> cursor
if cursor < o_pos else
cursor cursor -= 1
else cursor
cursor -= 1 r = createRange fix
cursor writeContent word.val()
left = fix textfield.selectionStart writeRange r
right = fix textfield.selectionEnd
textfield.value = word.val()
textfield.setSelectionRange left, right
# consume all text-insert changes. # consume all text-insert changes.
textfield.onkeypress = (event)-> textfield.onkeypress = (event)->
@ -322,12 +369,14 @@ module.exports = (HB)->
else else
char = window.String.fromCharCode event.keyCode char = window.String.fromCharCode event.keyCode
if char.length > 0 if char.length > 0
pos = Math.min textfield.selectionStart, textfield.selectionEnd r = createRange()
diff = Math.abs(textfield.selectionEnd - textfield.selectionStart) pos = Math.min r.left, r.right
word.delete (pos), diff diff = Math.abs(r.right - r.left)
word.delete pos, diff
word.insert pos, char word.insert pos, char
new_pos = pos + char.length r.left = pos + char.length
textfield.setSelectionRange new_pos, new_pos r.right = r.left
writeRange r
event.preventDefault() event.preventDefault()
else else
event.preventDefault() event.preventDefault()
@ -357,15 +406,21 @@ module.exports = (HB)->
# if word is deleted, do not do anything ever again # if word is deleted, do not do anything ever again
textfield.onkeydown = null textfield.onkeydown = null
return true return true
pos = Math.min textfield.selectionStart, textfield.selectionEnd r = createRange()
diff = Math.abs(textfield.selectionEnd - textfield.selectionStart) pos = Math.min r.left, r.right
diff = Math.abs(r.left - r.right)
if event.keyCode? and event.keyCode is 8 # Backspace if event.keyCode? and event.keyCode is 8 # Backspace
if diff > 0 if diff > 0
word.delete pos, diff word.delete pos, diff
textfield.setSelectionRange pos, pos r.left = pos
r.right = pos
writeRange r
else else
if event.ctrlKey? and event.ctrlKey if event.ctrlKey? and event.ctrlKey
val = textfield.value if textfield.value?
val = textfield.value
else
val = textfield.textContent
new_pos = pos new_pos = pos
del_length = 0 del_length = 0
if pos > 0 if pos > 0
@ -375,18 +430,23 @@ module.exports = (HB)->
new_pos-- new_pos--
del_length++ del_length++
word.delete new_pos, (pos-new_pos) word.delete new_pos, (pos-new_pos)
textfield.setSelectionRange new_pos, new_pos r.left = new_pos
r.right = new_pos
writeRange r
else else
word.delete (pos-1), 1 word.delete (pos-1), 1
event.preventDefault() event.preventDefault()
else if event.keyCode? and event.keyCode is 46 # Delete else if event.keyCode? and event.keyCode is 46 # Delete
if diff > 0 if diff > 0
word.delete pos, diff word.delete pos, diff
textfield.setSelectionRange pos, pos r.left = pos
r.right = pos
writeRange r
else else
word.delete pos, 1 word.delete pos, 1
textfield.setSelectionRange pos, pos r.left = pos
event.preventDefault() r.right = pos
writeRange r
# #
# @private # @private

2
yatta-element.js
View File

File diff suppressed because one or more lines are too long

2
yatta.js
View File

File diff suppressed because one or more lines are too long