implemented disconnect/reconnect in webrtc connector. adapted the example gc also collects child elements (needs improvements)

This commit is contained in:
Kevin Jahns 2015-10-13 14:50:54 +02:00
parent 51e20fb9c7
commit d6e1cd42a2
7 changed files with 124 additions and 57 deletions

View File

@ -1,20 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Y Example</title>
<body>
<button id="button">Disconnect</button>
<h1 id="contenteditable" contentEditable></h1>
<textarea style="width:80%;" rows=40 id="textfield"></textarea>
<script src="../../node_modules/simplewebrtc/simplewebrtc.bundle.js"></script>
<script src="../../y.js"></script>
<script src="./index.js"></script>
</head>
<body>
<h1 id="contenteditable" contentEditable> yjs Tutorial</h1>
<p> Collaborative Json editing with <a href="https://github.com/rwth-acis/yjs/">yjs</a>
and XMPP Connector. </p>
<textarea style="width:80%;" rows=40 id="textfield"></textarea>
<p> <a href="https://github.com/y-js/yjs/">yjs</a> is a Framework for Real-Time collaboration on arbitrary data types.
</p>
</body>
</html>

View File

@ -1,25 +1,47 @@
/* global Y */
// create a shared object. This function call will return a promise!
Y({
db: {
name: 'Memory'
},
connector: {
name: 'WebRTC',
room: 'mineeeeeee',
room: 'TextBindDemo',
debug: true
}
}).then(function (yconfig) {
window.y = yconfig.root
// yconfig holds all the information about the shared object
window.yconfig = yconfig
// yconfig.root holds the shared element
window.y = yconfig.root
// now we bind the textarea and the contenteditable h1 element
// to a shared element
var textarea = document.getElementById('textfield')
var contenteditable = document.getElementById('contenteditable')
yconfig.root.observePath(['text'], function (text) {
// every time the 'text' property of the yconfig.root changes,
// this function is called. Then we bind it to the html elements
if (text != null) {
// when the text property is deleted, text may be undefined!
// This is why we have to check if text exists..
text.bind(textarea)
text.bind(contenteditable)
window.ytext = text
}
})
// create a shared TextBind
yconfig.root.set('text', Y.TextBind)
// We also provide a button for disconnecting/reconnecting the shared element
var button = document.querySelector('#button')
button.onclick = function () {
if (button.innerText === 'Disconnect') {
yconfig.disconnect()
button.innerText = 'Reconnect'
} else {
yconfig.reconnect()
button.innerText = 'Disconnect'
}
}
})

View File

@ -97,7 +97,7 @@ if (options.regenerator) {
files.test = polyfills.concat(files.test)
}
gulp.task('build:deploy', function () {
gulp.task('deploy', function () {
gulp.src(files.src)
.pipe(sourcemaps.init())
.pipe(concat('y.js'))
@ -120,6 +120,13 @@ gulp.task('build:test', function () {
if (!options.regenerator) {
babelOptions.blacklist = 'regenerator'
}
gulp.src(files.src)
.pipe(sourcemaps.init())
.pipe(concat('y.js'))
.pipe(babel(babelOptions))
.pipe(sourcemaps.write())
.pipe(gulp.dest('.'))
return gulp.src('src/**/*.js')
.pipe(sourcemaps.init())
.pipe(babel(babelOptions))
@ -140,10 +147,6 @@ gulp.task('dev:browser', ['build:test'], function () {
.pipe(jasmineBrowser.server({port: options.testport}))
})
gulp.task('dev:deploy', ['build:deploy'], function () {
gulp.watch('src/**/*.js', ['build:deploy'])
})
gulp.task('dev', ['build:test'], function () {
gulp.start('dev:browser')
gulp.start('dev:node')

View File

@ -1,4 +1,4 @@
/* global Y */
/* global Y, SimpleWebRTC */
'use strict'
class WebRTC extends Y.AbstractConnector {
@ -11,21 +11,16 @@ class WebRTC extends Y.AbstractConnector {
}
options.role = 'slave'
super(y, options)
var room = options.room
var webrtcOptions = {
this.webrtcOptions = {
url: options.url || 'https://yatta.ninja:8888',
room: options.room
}
var swr = new SimpleWebRTC(webrtcOptions) // eslint-disable-line no-undef
var swr = new SimpleWebRTC(this.webrtcOptions)
this.swr = swr
var self = this
swr.once('connectionReady', function (userId) {
// SimpleWebRTC (swr) is initialized
swr.joinRoom(room)
swr.joinRoom(self.webrtcOptions.room)
swr.once('joinedRoom', function () {
self.setUserId(userId)
@ -61,6 +56,14 @@ class WebRTC extends Y.AbstractConnector {
})
})
}
disconnect () {
this.swr.leaveRoom()
super.disconnect()
}
reconnect () {
this.swr.joinRoom(this.webrtcOptions.room)
super.reconnect()
}
send (uid, message) {
var self = this
// we have to make sure that the message is sent under all circumstances

View File

@ -115,10 +115,26 @@ class AbstractTransaction {
})
}
}
* deleteList (start) {
if (this.store.y.connector.isSynced) {
while (start != null && this.store.y.connector.isSynced) {
start = (yield* this.getOperation(start))
start.gc = true
yield* this.setOperation(start)
// TODO: will always reset the parent..
this.store.gc1.push(start.id)
start = start.right
}
} else {
// TODO: when not possible??? do later in (gcWhenSynced)
}
}
/*
Mark an operation as deleted, and add it to the GC, if possible.
*/
* deleteOperation (targetId) {
* deleteOperation (targetId, preventCallType) {
var target = yield* this.getOperation(targetId)
if (target == null || !target.deleted) {
@ -129,12 +145,31 @@ class AbstractTransaction {
if (!target.deleted) {
// set deleted & notify type
target.deleted = true
var type = this.store.initializedTypes[JSON.stringify(target.parent)]
if (type != null) {
yield* type._changed(this, {
struct: 'Delete',
target: targetId
})
if (!preventCallType) {
var type = this.store.initializedTypes[JSON.stringify(target.parent)]
if (type != null) {
yield* type._changed(this, {
struct: 'Delete',
target: targetId
})
}
}
// delete containing lists
if (target.start != null) {
// TODO: don't do it like this .. -.-
yield* this.deleteList(target.start)
yield* this.deleteList(target.id)
}
if (target.map != null) {
for (var name in target.map) {
yield* this.deleteList(target.map[name])
}
// TODO: here to.. (see above)
yield* this.deleteList(target.id)
}
if (target.opContent != null) {
yield* this.deleteOperation(target.opContent)
target.opContent = null
}
}
var left = target.left != null ? yield* this.getOperation(target.left) : null
@ -182,10 +217,12 @@ class AbstractTransaction {
// if op exists, then clean that mess up..
var o = yield* this.getOperation(id)
if (o != null) {
/*
if (!o.deleted) {
yield* this.deleteOperation(id)
o = yield* this.getOperation(id)
}
*/
// remove gc'd op from the left op, if it exists
if (o.left != null) {
@ -233,23 +270,26 @@ class AbstractTransaction {
yield* this.setOperation(right)
}
// remove gc'd op from parent, if it exists
var parent = yield* this.getOperation(o.parent)
var setParent = false // whether to save parent to the os
if (Y.utils.compareIds(parent.start, o.id)) {
// gc'd op is the start
setParent = true
parent.start = o.right
if (o.parent != null) {
// remove gc'd op from parent, if it exists
var parent = yield* this.getOperation(o.parent)
var setParent = false // whether to save parent to the os
if (Y.utils.compareIds(parent.start, o.id)) {
// gc'd op is the start
setParent = true
parent.start = o.right
}
if (Y.utils.compareIds(parent.end, o.id)) {
// gc'd op is the end
setParent = true
parent.end = o.left
}
if (setParent) {
yield* this.setOperation(parent)
}
}
if (Y.utils.compareIds(parent.end, o.id)) {
// gc'd op is the end
setParent = true
parent.end = o.left
}
if (setParent) {
yield* this.setOperation(parent)
}
yield* this.removeOperation(o.id) // actually remove it from the os
// finally remove it from the os
yield* this.removeOperation(o.id)
}
}
}

View File

@ -203,12 +203,11 @@ Y.Memory = (function () {
for (var i in deletions) {
var del = deletions[i]
var id = [del[0], del[1]]
// always try to delete..
yield* this.deleteOperation(id)
if (del[2]) {
// gc
yield* this.garbageCollectOperation(id)
} else {
// delete
yield* this.deleteOperation(id)
}
}
}

View File

@ -194,12 +194,20 @@ var Struct = {
yield* this.setOperation(right)
}
// notify parent
// update parents .map/start/end properties
if (op.parentSub != null) {
if (left == null) {
parent.map[op.parentSub] = op.id
yield* this.setOperation(parent)
}
// is a child of a map struct.
// Then also make sure that only the most left element is not deleted
if (op.right != null) {
yield* this.deleteOperation(op.right, true)
}
if (op.left != null) {
yield* this.deleteOperation(op.id, true)
}
} else {
if (right == null || left == null) {
if (right == null) {