Compare commits
1 Commits
v13.0.0-33
...
v13.0.0-29
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
b4f06e8f62 |
@@ -1,15 +1,4 @@
|
|||||||
/* global Y, HTMLElement, customElements */
|
/* global Y */
|
||||||
|
|
||||||
class MagicTable extends HTMLElement {
|
|
||||||
constructor () {
|
|
||||||
super()
|
|
||||||
var shadow = this.attachShadow({mode: 'open'})
|
|
||||||
setTimeout(() => {
|
|
||||||
shadow.append(this.childNodes[0])
|
|
||||||
}, 1000)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
customElements.define('magic-table', MagicTable)
|
|
||||||
|
|
||||||
// initialize a shared object. This function call returns a promise!
|
// initialize a shared object. This function call returns a promise!
|
||||||
let y = new Y({
|
let y = new Y({
|
||||||
@@ -28,14 +17,17 @@ window.onload = function () {
|
|||||||
window.yXmlType.bindToDom(document.body)
|
window.yXmlType.bindToDom(document.body)
|
||||||
}
|
}
|
||||||
window.undoManager = new Y.utils.UndoManager(window.yXmlType, {
|
window.undoManager = new Y.utils.UndoManager(window.yXmlType, {
|
||||||
captureTimeout: 500
|
captureTimeout: 0
|
||||||
})
|
})
|
||||||
|
|
||||||
document.onkeydown = function interceptUndoRedo (e) {
|
document.onkeydown = function interceptUndoRedo (e) {
|
||||||
if (e.keyCode === 90 && e.metaKey) {
|
if (e.keyCode === 90 && e.metaKey) {
|
||||||
|
console.log('uidtaren')
|
||||||
if (!e.shiftKey) {
|
if (!e.shiftKey) {
|
||||||
|
console.info('Undo!')
|
||||||
window.undoManager.undo()
|
window.undoManager.undo()
|
||||||
} else {
|
} else {
|
||||||
|
console.info('Redo!')
|
||||||
window.undoManager.redo()
|
window.undoManager.redo()
|
||||||
}
|
}
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
|
|||||||
@@ -14,7 +14,10 @@
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<script src="../bower_components/yjs/y.js"></script>
|
<script src="../bower_components/yjs/y.js"></script>
|
||||||
|
<script src="../bower_components/y-array/y-array.js"></script>
|
||||||
|
<script src="../bower_components/y-text/y-text.js"></script>
|
||||||
<script src="../bower_components/y-websockets-client/y-websockets-client.js"></script>
|
<script src="../bower_components/y-websockets-client/y-websockets-client.js"></script>
|
||||||
|
<script src="../bower_components/y-memory/y-memory.js"></script>
|
||||||
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
|
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
|
||||||
<script src="./index.js"></script>
|
<script src="./index.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
2
package-lock.json
generated
2
package-lock.json
generated
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "yjs",
|
"name": "yjs",
|
||||||
"version": "13.0.0-32",
|
"version": "13.0.0-29",
|
||||||
"lockfileVersion": 1,
|
"lockfileVersion": 1,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "yjs",
|
"name": "yjs",
|
||||||
"version": "13.0.0-33",
|
"version": "13.0.0-29",
|
||||||
"description": "A framework for real-time p2p shared editing on any data",
|
"description": "A framework for real-time p2p shared editing on any data",
|
||||||
"main": "./y.node.js",
|
"main": "./y.node.js",
|
||||||
"browser": "./y.js",
|
"browser": "./y.js",
|
||||||
@@ -15,8 +15,7 @@
|
|||||||
"postpublish": "tag-dist-files --overwrite-existing-tag"
|
"postpublish": "tag-dist-files --overwrite-existing-tag"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"y.*",
|
"y.*"
|
||||||
"src/*"
|
|
||||||
],
|
],
|
||||||
"standard": {
|
"standard": {
|
||||||
"ignore": [
|
"ignore": [
|
||||||
|
|||||||
@@ -5,13 +5,9 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
var pkg = require('./package.json')
|
var pkg = require('./package.json')
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
input: 'src/Y.js',
|
entry: 'src/Y.js',
|
||||||
name: 'Y',
|
moduleName: 'Y',
|
||||||
sourcemap: true,
|
format: 'umd',
|
||||||
output: {
|
|
||||||
file: 'y.js',
|
|
||||||
format: 'umd'
|
|
||||||
},
|
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@@ -36,6 +32,8 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
|
dest: 'y.js',
|
||||||
|
sourceMap: true,
|
||||||
banner: `
|
banner: `
|
||||||
/**
|
/**
|
||||||
* ${pkg.name} - ${pkg.description}
|
* ${pkg.name} - ${pkg.description}
|
||||||
|
|||||||
@@ -3,13 +3,9 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
var pkg = require('./package.json')
|
var pkg = require('./package.json')
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
input: 'src/y-dist.cjs.js',
|
entry: 'src/y-dist.cjs.js',
|
||||||
nameame: 'Y',
|
moduleName: 'Y',
|
||||||
sourcemap: true,
|
format: 'cjs',
|
||||||
output: {
|
|
||||||
file: 'y.node.js',
|
|
||||||
format: 'cjs'
|
|
||||||
},
|
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@@ -18,6 +14,8 @@ export default {
|
|||||||
}),
|
}),
|
||||||
commonjs()
|
commonjs()
|
||||||
],
|
],
|
||||||
|
dest: 'y.node.js',
|
||||||
|
sourceMap: true,
|
||||||
banner: `
|
banner: `
|
||||||
/**
|
/**
|
||||||
* ${pkg.name} - ${pkg.description}
|
* ${pkg.name} - ${pkg.description}
|
||||||
|
|||||||
@@ -3,13 +3,9 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
import multiEntry from 'rollup-plugin-multi-entry'
|
import multiEntry from 'rollup-plugin-multi-entry'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
input: 'test/y-xml.tests.js',
|
entry: 'test/y-xml.tests.js',
|
||||||
name: 'y-tests',
|
moduleName: 'y-tests',
|
||||||
sourcemap: true,
|
format: 'umd',
|
||||||
output: {
|
|
||||||
file: 'y.test.js',
|
|
||||||
format: 'umd'
|
|
||||||
},
|
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@@ -18,5 +14,7 @@ export default {
|
|||||||
}),
|
}),
|
||||||
commonjs(),
|
commonjs(),
|
||||||
multiEntry()
|
multiEntry()
|
||||||
]
|
],
|
||||||
|
dest: 'y.test.js',
|
||||||
|
sourceMap: true
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -65,9 +65,9 @@ export default class Type extends Item {
|
|||||||
}
|
}
|
||||||
return path
|
return path
|
||||||
}
|
}
|
||||||
_callEventHandler (transaction, event) {
|
_callEventHandler (event) {
|
||||||
const changedParentTypes = transaction.changedParentTypes
|
const changedParentTypes = this._y._transaction.changedParentTypes
|
||||||
this._eventHandler.callEventListeners(transaction, event)
|
this._eventHandler.callEventListeners(event)
|
||||||
let type = this
|
let type = this
|
||||||
while (type !== this._y) {
|
while (type !== this._y) {
|
||||||
let events = changedParentTypes.get(type)
|
let events = changedParentTypes.get(type)
|
||||||
|
|||||||
@@ -12,8 +12,8 @@ class YArrayEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default class YArray extends Type {
|
export default class YArray extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YArrayEvent(this, remote))
|
this._callEventHandler(new YArrayEvent(this, remote))
|
||||||
}
|
}
|
||||||
get (pos) {
|
get (pos) {
|
||||||
let n = this._start
|
let n = this._start
|
||||||
|
|||||||
@@ -13,8 +13,8 @@ class YMapEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default class YMap extends Type {
|
export default class YMap extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YMapEvent(this, parentSubs, remote))
|
this._callEventHandler(new YMapEvent(this, parentSubs, remote))
|
||||||
}
|
}
|
||||||
toJSON () {
|
toJSON () {
|
||||||
const map = {}
|
const map = {}
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import YMap from '../YMap.js'
|
|||||||
import YXmlFragment from './YXmlFragment.js'
|
import YXmlFragment from './YXmlFragment.js'
|
||||||
|
|
||||||
export default class YXmlElement extends YXmlFragment {
|
export default class YXmlElement extends YXmlFragment {
|
||||||
constructor (arg1, arg2, _document) {
|
constructor (arg1, arg2) {
|
||||||
super()
|
super()
|
||||||
this.nodeName = null
|
this.nodeName = null
|
||||||
this._scrollElement = null
|
this._scrollElement = null
|
||||||
@@ -13,7 +13,7 @@ export default class YXmlElement extends YXmlFragment {
|
|||||||
this.nodeName = arg1.toUpperCase()
|
this.nodeName = arg1.toUpperCase()
|
||||||
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
||||||
this.nodeName = arg1.nodeName
|
this.nodeName = arg1.nodeName
|
||||||
this._setDom(arg1, _document)
|
this._setDom(arg1)
|
||||||
} else {
|
} else {
|
||||||
this.nodeName = 'UNDEFINED'
|
this.nodeName = 'UNDEFINED'
|
||||||
}
|
}
|
||||||
@@ -26,25 +26,28 @@ export default class YXmlElement extends YXmlFragment {
|
|||||||
struct.nodeName = this.nodeName
|
struct.nodeName = this.nodeName
|
||||||
return struct
|
return struct
|
||||||
}
|
}
|
||||||
_setDom (dom, _document) {
|
_setDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
throw new Error('Only call this method if you know what you are doing ;)')
|
throw new Error('Only call this method if you know what you are doing ;)')
|
||||||
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
||||||
throw new Error('Already bound to an YXml type')
|
throw new Error('Already bound to an YXml type')
|
||||||
} else {
|
} else {
|
||||||
|
this._dom = dom
|
||||||
|
dom._yxml = this
|
||||||
// tag is already set in constructor
|
// tag is already set in constructor
|
||||||
// set attributes
|
// set attributes
|
||||||
let attributes = new Map()
|
let attrNames = []
|
||||||
for (let i = 0; i < dom.attributes.length; i++) {
|
for (let i = 0; i < dom.attributes.length; i++) {
|
||||||
let attr = dom.attributes[i]
|
attrNames.push(dom.attributes[i].name)
|
||||||
attributes.set(attr.name, attr.value)
|
|
||||||
}
|
}
|
||||||
attributes = this._domFilter(dom, attributes)
|
attrNames = this._domFilter(dom, attrNames)
|
||||||
attributes.forEach((value, name) => {
|
for (let i = 0; i < attrNames.length; i++) {
|
||||||
this.setAttribute(name, value)
|
let attrName = attrNames[i]
|
||||||
})
|
let attrValue = dom.getAttribute(attrName)
|
||||||
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes), _document)
|
this.setAttribute(attrName, attrValue)
|
||||||
this._bindToDom(dom, _document)
|
}
|
||||||
|
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes))
|
||||||
|
this._bindToDom(dom)
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -103,9 +106,7 @@ export default class YXmlElement extends YXmlFragment {
|
|||||||
getAttributes () {
|
getAttributes () {
|
||||||
const obj = {}
|
const obj = {}
|
||||||
for (let [key, value] of this._map) {
|
for (let [key, value] of this._map) {
|
||||||
if (!value._deleted) {
|
obj[key] = value._content[0]
|
||||||
obj[key] = value._content[0]
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return obj
|
return obj
|
||||||
}
|
}
|
||||||
@@ -114,6 +115,7 @@ export default class YXmlElement extends YXmlFragment {
|
|||||||
let dom = this._dom
|
let dom = this._dom
|
||||||
if (dom == null) {
|
if (dom == null) {
|
||||||
dom = _document.createElement(this.nodeName)
|
dom = _document.createElement(this.nodeName)
|
||||||
|
this._dom = dom
|
||||||
dom._yxml = this
|
dom._yxml = this
|
||||||
let attrs = this.getAttributes()
|
let attrs = this.getAttributes()
|
||||||
for (let key in attrs) {
|
for (let key in attrs) {
|
||||||
@@ -122,7 +124,7 @@ export default class YXmlElement extends YXmlFragment {
|
|||||||
this.forEach(yxml => {
|
this.forEach(yxml => {
|
||||||
dom.appendChild(yxml.getDom(_document))
|
dom.appendChild(yxml.getDom(_document))
|
||||||
})
|
})
|
||||||
this._bindToDom(dom, _document)
|
this._bindToDom(dom)
|
||||||
}
|
}
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,18 +9,18 @@ import YXmlEvent from './YXmlEvent.js'
|
|||||||
import { logID } from '../../MessageHandler/messageToString.js'
|
import { logID } from '../../MessageHandler/messageToString.js'
|
||||||
import diff from 'fast-diff'
|
import diff from 'fast-diff'
|
||||||
|
|
||||||
function domToYXml (parent, doms, _document) {
|
function domToYXml (parent, doms) {
|
||||||
const types = []
|
const types = []
|
||||||
doms.forEach(d => {
|
doms.forEach(d => {
|
||||||
if (d._yxml != null && d._yxml !== false) {
|
if (d._yxml != null && d._yxml !== false) {
|
||||||
d._yxml._unbindFromDom()
|
d._yxml._unbindFromDom()
|
||||||
}
|
}
|
||||||
if (parent._domFilter(d.nodeName, new Map()) !== null) {
|
if (parent._domFilter(d, []) !== null) {
|
||||||
let type
|
let type
|
||||||
if (d.nodeType === d.TEXT_NODE) {
|
if (d.nodeType === d.TEXT_NODE) {
|
||||||
type = new YXmlText(d)
|
type = new YXmlText(d)
|
||||||
} else if (d.nodeType === d.ELEMENT_NODE) {
|
} else if (d.nodeType === d.ELEMENT_NODE) {
|
||||||
type = new YXmlFragment._YXmlElement(d, parent._domFilter, _document)
|
type = new YXmlFragment._YXmlElement(d, parent._domFilter)
|
||||||
} else {
|
} else {
|
||||||
throw new Error('Unsupported node!')
|
throw new Error('Unsupported node!')
|
||||||
}
|
}
|
||||||
@@ -98,9 +98,7 @@ export default class YXmlFragment extends YArray {
|
|||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e)
|
console.error(e)
|
||||||
}
|
}
|
||||||
if (this._domObserver !== null) {
|
this._domObserver.takeRecords()
|
||||||
this._domObserver.takeRecords()
|
|
||||||
}
|
|
||||||
token = true
|
token = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -144,8 +142,8 @@ export default class YXmlFragment extends YArray {
|
|||||||
xml.setDomFilter(f)
|
xml.setDomFilter(f)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YXmlEvent(this, parentSubs, remote))
|
this._callEventHandler(new YXmlEvent(this, parentSubs, remote))
|
||||||
}
|
}
|
||||||
toString () {
|
toString () {
|
||||||
return this.map(xml => xml.toString()).join('')
|
return this.map(xml => xml.toString()).join('')
|
||||||
@@ -164,167 +162,113 @@ export default class YXmlFragment extends YArray {
|
|||||||
this._dom = null
|
this._dom = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
insertDomElementsAfter (prev, doms, _document) {
|
insertDomElementsAfter (prev, doms) {
|
||||||
const types = domToYXml(this, doms, _document)
|
const types = domToYXml(this, doms)
|
||||||
this.insertAfter(prev, types)
|
this.insertAfter(prev, types)
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
insertDomElements (pos, doms, _document) {
|
insertDomElements (pos, doms) {
|
||||||
const types = domToYXml(this, doms, _document)
|
const types = domToYXml(this, doms)
|
||||||
this.insert(pos, types)
|
this.insert(pos, types)
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
getDom () {
|
getDom () {
|
||||||
return this._dom
|
return this._dom
|
||||||
}
|
}
|
||||||
bindToDom (dom, _document) {
|
bindToDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
this._unbindFromDom()
|
this._unbindFromDom()
|
||||||
}
|
}
|
||||||
if (dom._yxml != null) {
|
if (dom._yxml != null) {
|
||||||
dom._yxml._unbindFromDom()
|
dom._yxml._unbindFromDom()
|
||||||
}
|
}
|
||||||
|
if (MutationObserver == null) {
|
||||||
|
throw new Error('Not able to bind to a DOM element, because MutationObserver is not available!')
|
||||||
|
}
|
||||||
dom.innerHTML = ''
|
dom.innerHTML = ''
|
||||||
|
this._dom = dom
|
||||||
|
dom._yxml = this
|
||||||
this.forEach(t => {
|
this.forEach(t => {
|
||||||
dom.insertBefore(t.getDom(_document), null)
|
dom.insertBefore(t.getDom(), null)
|
||||||
})
|
})
|
||||||
this._bindToDom(dom, _document)
|
this._bindToDom(dom)
|
||||||
}
|
}
|
||||||
// binds to a dom element
|
// binds to a dom element
|
||||||
// Only call if dom and YXml are isomorph
|
// Only call if dom and YXml are isomorph
|
||||||
_bindToDom (dom, _document) {
|
_bindToDom (dom) {
|
||||||
_document = _document || document
|
if (this._parent === null || this._parent._dom != null || typeof MutationObserver === 'undefined') {
|
||||||
this._dom = dom
|
// only bind if parent did not already bind
|
||||||
dom._yxml = this
|
|
||||||
// TODO: refine this..
|
|
||||||
if ((this.constructor !== YXmlFragment && this._parent !== this._y) || this._parent === null) {
|
|
||||||
// TODO: only top level YXmlFragment can bind. Also allow YXmlElements..
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
this._y.on('beforeTransaction', () => {
|
||||||
|
this._domObserverListener(this._domObserver.takeRecords())
|
||||||
|
})
|
||||||
this._y.on('beforeTransaction', beforeTransactionSelectionFixer)
|
this._y.on('beforeTransaction', beforeTransactionSelectionFixer)
|
||||||
this._y.on('afterTransaction', afterTransactionSelectionFixer)
|
this._y.on('afterTransaction', afterTransactionSelectionFixer)
|
||||||
const applyFilter = (type) => {
|
|
||||||
if (type._deleted) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// check if type is a child of this
|
|
||||||
let isChild = false
|
|
||||||
let p = type
|
|
||||||
while (p !== this._y) {
|
|
||||||
if (p === this) {
|
|
||||||
isChild = true
|
|
||||||
break
|
|
||||||
}
|
|
||||||
p = p._parent
|
|
||||||
}
|
|
||||||
if (!isChild) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// filter attributes
|
|
||||||
let attributes = new Map()
|
|
||||||
if (type.getAttributes !== undefined) {
|
|
||||||
let attrs = type.getAttributes()
|
|
||||||
for (let key in attrs) {
|
|
||||||
attributes.set(key, attrs[key])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
let result = this._domFilter(type.nodeName, new Map(attributes))
|
|
||||||
if (result === null) {
|
|
||||||
type._delete(this._y)
|
|
||||||
} else {
|
|
||||||
attributes.forEach((value, key) => {
|
|
||||||
if (!result.has(key)) {
|
|
||||||
type.removeAttribute(key)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this._y.on('beforeObserverCalls', function (y, transaction) {
|
|
||||||
// apply dom filter to new and changed types
|
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
|
||||||
if (subs.size > 1 || !subs.has(null)) {
|
|
||||||
// only apply changes on attributes
|
|
||||||
applyFilter(type)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
transaction.newTypes.forEach(applyFilter)
|
|
||||||
})
|
|
||||||
// Apply Y.Xml events to dom
|
// Apply Y.Xml events to dom
|
||||||
this.observeDeep(events => {
|
this.observeDeep(reflectChangesOnDom.bind(this))
|
||||||
reflectChangesOnDom.call(this, events, _document)
|
|
||||||
})
|
|
||||||
// Apply Dom changes on Y.Xml
|
// Apply Dom changes on Y.Xml
|
||||||
if (typeof MutationObserver !== 'undefined') {
|
this._domObserverListener = mutations => {
|
||||||
this._y.on('beforeTransaction', () => {
|
this._mutualExclude(() => {
|
||||||
this._domObserverListener(this._domObserver.takeRecords())
|
this._y.transact(() => {
|
||||||
})
|
let diffChildren = new Set()
|
||||||
this._domObserverListener = mutations => {
|
mutations.forEach(mutation => {
|
||||||
this._mutualExclude(() => {
|
const dom = mutation.target
|
||||||
this._y.transact(() => {
|
const yxml = dom._yxml
|
||||||
let diffChildren = new Set()
|
if (yxml == null) {
|
||||||
mutations.forEach(mutation => {
|
// dom element is filtered
|
||||||
const dom = mutation.target
|
return
|
||||||
const yxml = dom._yxml
|
}
|
||||||
if (yxml == null) {
|
switch (mutation.type) {
|
||||||
// dom element is filtered
|
case 'characterData':
|
||||||
return
|
var diffs = diff(yxml.toString(), dom.nodeValue)
|
||||||
}
|
var pos = 0
|
||||||
switch (mutation.type) {
|
for (var i = 0; i < diffs.length; i++) {
|
||||||
case 'characterData':
|
var d = diffs[i]
|
||||||
var diffs = diff(yxml.toString(), dom.nodeValue)
|
if (d[0] === 0) { // EQUAL
|
||||||
var pos = 0
|
pos += d[1].length
|
||||||
for (var i = 0; i < diffs.length; i++) {
|
} else if (d[0] === -1) { // DELETE
|
||||||
var d = diffs[i]
|
yxml.delete(pos, d[1].length)
|
||||||
if (d[0] === 0) { // EQUAL
|
} else { // INSERT
|
||||||
pos += d[1].length
|
yxml.insert(pos, d[1])
|
||||||
} else if (d[0] === -1) { // DELETE
|
pos += d[1].length
|
||||||
yxml.delete(pos, d[1].length)
|
}
|
||||||
} else { // INSERT
|
}
|
||||||
yxml.insert(pos, d[1])
|
break
|
||||||
pos += d[1].length
|
case 'attributes':
|
||||||
|
let name = mutation.attributeName
|
||||||
|
// check if filter accepts attribute
|
||||||
|
if (this._domFilter(dom, [name]).length > 0 && this.constructor !== YXmlFragment) {
|
||||||
|
var val = dom.getAttribute(name)
|
||||||
|
if (yxml.getAttribute(name) !== val) {
|
||||||
|
if (val == null) {
|
||||||
|
yxml.removeAttribute(name)
|
||||||
|
} else {
|
||||||
|
yxml.setAttribute(name, val)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
break
|
}
|
||||||
case 'attributes':
|
break
|
||||||
if (yxml.constructor === YXmlFragment) {
|
case 'childList':
|
||||||
break
|
diffChildren.add(mutation.target)
|
||||||
}
|
break
|
||||||
let name = mutation.attributeName
|
|
||||||
let val = dom.getAttribute(name)
|
|
||||||
// check if filter accepts attribute
|
|
||||||
let attributes = new Map()
|
|
||||||
attributes.set(name, val)
|
|
||||||
if (this._domFilter(dom.nodeName, attributes).size > 0 && yxml.constructor !== YXmlFragment) {
|
|
||||||
if (yxml.getAttribute(name) !== val) {
|
|
||||||
if (val == null) {
|
|
||||||
yxml.removeAttribute(name)
|
|
||||||
} else {
|
|
||||||
yxml.setAttribute(name, val)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break
|
|
||||||
case 'childList':
|
|
||||||
diffChildren.add(mutation.target)
|
|
||||||
break
|
|
||||||
}
|
|
||||||
})
|
|
||||||
for (let dom of diffChildren) {
|
|
||||||
if (dom._yxml != null && dom._yxml !== false) {
|
|
||||||
applyChangesFromDom(dom)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
for (let dom of diffChildren) {
|
||||||
|
if (dom._yxml != null && dom._yxml !== false) {
|
||||||
|
applyChangesFromDom(dom)
|
||||||
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
|
||||||
this._domObserver = new MutationObserver(this._domObserverListener)
|
|
||||||
this._domObserver.observe(dom, {
|
|
||||||
childList: true,
|
|
||||||
attributes: true,
|
|
||||||
characterData: true,
|
|
||||||
subtree: true
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
this._domObserver = new MutationObserver(this._domObserverListener)
|
||||||
|
this._domObserver.observe(dom, {
|
||||||
|
childList: true,
|
||||||
|
attributes: true,
|
||||||
|
characterData: true,
|
||||||
|
subtree: true
|
||||||
|
})
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
_logString () {
|
_logString () {
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ let relativeSelection = null
|
|||||||
|
|
||||||
export let beforeTransactionSelectionFixer
|
export let beforeTransactionSelectionFixer
|
||||||
if (typeof getSelection !== 'undefined') {
|
if (typeof getSelection !== 'undefined') {
|
||||||
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, transaction, remote) {
|
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, remote) {
|
||||||
if (!remote) {
|
if (!remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -30,7 +30,7 @@ if (typeof getSelection !== 'undefined') {
|
|||||||
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {}
|
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {}
|
||||||
}
|
}
|
||||||
|
|
||||||
export function afterTransactionSelectionFixer (y, transaction, remote) {
|
export function afterTransactionSelectionFixer (y, remote) {
|
||||||
if (relativeSelection === null || !remote) {
|
if (relativeSelection === null || !remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -135,22 +135,18 @@ export function applyChangesFromDom (dom) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export function reflectChangesOnDom (events, _document) {
|
export function reflectChangesOnDom (events) {
|
||||||
// Make sure that no filtered attributes are applied to the structure
|
// Make sure that no filtered attributes are applied to the structure
|
||||||
// if they were, delete them
|
// if they were, delete them
|
||||||
/*
|
/*
|
||||||
events.forEach(event => {
|
events.forEach(event => {
|
||||||
const target = event.target
|
const target = event.target
|
||||||
if (event.attributesChanged === undefined) {
|
const keys = this._domFilter(target.nodeName, Array.from(event.keysChanged))
|
||||||
// event.target is Y.XmlText
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const keys = this._domFilter(target.nodeName, Array.from(event.attributesChanged))
|
|
||||||
if (keys === null) {
|
if (keys === null) {
|
||||||
target._delete()
|
target._delete()
|
||||||
} else {
|
} else {
|
||||||
const removeKeys = new Set() // is a copy of event.attributesChanged
|
const removeKeys = new Set() // is a copy of event.keysChanged
|
||||||
event.attributesChanged.forEach(key => { removeKeys.add(key) })
|
event.keysChanged.forEach(key => { removeKeys.add(key) })
|
||||||
keys.forEach(key => {
|
keys.forEach(key => {
|
||||||
// remove all accepted keys from removeKeys
|
// remove all accepted keys from removeKeys
|
||||||
removeKeys.delete(key)
|
removeKeys.delete(key)
|
||||||
@@ -183,9 +179,9 @@ export function reflectChangesOnDom (events, _document) {
|
|||||||
})
|
})
|
||||||
if (event.childListChanged) {
|
if (event.childListChanged) {
|
||||||
// create fragment of undeleted nodes
|
// create fragment of undeleted nodes
|
||||||
const fragment = _document.createDocumentFragment()
|
const fragment = document.createDocumentFragment()
|
||||||
yxml.forEach(function (t) {
|
yxml.forEach(function (t) {
|
||||||
fragment.appendChild(t.getDom(_document))
|
fragment.append(t.getDom())
|
||||||
})
|
})
|
||||||
// remove remainding nodes
|
// remove remainding nodes
|
||||||
let lastChild = dom.lastChild
|
let lastChild = dom.lastChild
|
||||||
@@ -194,7 +190,7 @@ export function reflectChangesOnDom (events, _document) {
|
|||||||
lastChild = dom.lastChild
|
lastChild = dom.lastChild
|
||||||
}
|
}
|
||||||
// insert fragment of undeleted nodes
|
// insert fragment of undeleted nodes
|
||||||
dom.appendChild(fragment)
|
dom.append(fragment)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/* TODO: smartscrolling
|
/* TODO: smartscrolling
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ export default class EventHandler {
|
|||||||
removeAllEventListeners () {
|
removeAllEventListeners () {
|
||||||
this.eventListeners = []
|
this.eventListeners = []
|
||||||
}
|
}
|
||||||
callEventListeners (transaction, event) {
|
callEventListeners (event) {
|
||||||
for (var i = 0; i < this.eventListeners.length; i++) {
|
for (var i = 0; i < this.eventListeners.length; i++) {
|
||||||
try {
|
try {
|
||||||
const f = this.eventListeners[i]
|
const f = this.eventListeners[i]
|
||||||
|
|||||||
@@ -1,16 +1,16 @@
|
|||||||
import ID from './ID.js'
|
import ID from './ID.js'
|
||||||
|
|
||||||
class ReverseOperation {
|
class ReverseOperation {
|
||||||
constructor (y, transaction) {
|
constructor (y) {
|
||||||
this.created = new Date()
|
this.created = new Date()
|
||||||
const beforeState = transaction.beforeState
|
const beforeState = y._transaction.beforeState
|
||||||
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1)
|
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1)
|
||||||
if (beforeState.has(y.userID)) {
|
if (beforeState.has(y.userID)) {
|
||||||
this.fromState = new ID(y.userID, beforeState.get(y.userID))
|
this.fromState = new ID(y.userID, beforeState.get(y.userID))
|
||||||
} else {
|
} else {
|
||||||
this.fromState = this.toState
|
this.fromState = this.toState
|
||||||
}
|
}
|
||||||
this.deletedStructs = transaction.deletedStructs
|
this.deletedStructs = y._transaction.deletedStructs
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -70,9 +70,9 @@ export default class UndoManager {
|
|||||||
this._redoing = false
|
this._redoing = false
|
||||||
const y = scope._y
|
const y = scope._y
|
||||||
this.y = y
|
this.y = y
|
||||||
y.on('afterTransaction', (y, transaction, remote) => {
|
y.on('afterTransaction', (y, remote) => {
|
||||||
if (!remote && transaction.changedParentTypes.has(scope)) {
|
if (!remote && y._transaction.changedParentTypes.has(scope)) {
|
||||||
let reverseOperation = new ReverseOperation(y, transaction)
|
let reverseOperation = new ReverseOperation(y)
|
||||||
if (!this._undoing) {
|
if (!this._undoing) {
|
||||||
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null
|
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null
|
||||||
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
||||||
|
|||||||
32
src/Y.js
32
src/Y.js
@@ -15,7 +15,6 @@ import YMap from './Type/YMap.js'
|
|||||||
import YText from './Type/YText.js'
|
import YText from './Type/YText.js'
|
||||||
import { YXmlFragment, YXmlElement, YXmlText } from './Type/y-xml/y-xml.js'
|
import { YXmlFragment, YXmlElement, YXmlText } from './Type/y-xml/y-xml.js'
|
||||||
import BinaryDecoder from './Binary/Decoder.js'
|
import BinaryDecoder from './Binary/Decoder.js'
|
||||||
import { getRelativePosition, fromRelativePosition } from './Util/relativePosition.js'
|
|
||||||
|
|
||||||
import debug from 'debug'
|
import debug from 'debug'
|
||||||
import Transaction from './Transaction.js'
|
import Transaction from './Transaction.js'
|
||||||
@@ -45,8 +44,8 @@ export default class Y extends NamedEventHandler {
|
|||||||
transact (f, remote = false) {
|
transact (f, remote = false) {
|
||||||
let initialCall = this._transaction === null
|
let initialCall = this._transaction === null
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
|
this.emit('beforeTransaction', this, remote)
|
||||||
this._transaction = new Transaction(this)
|
this._transaction = new Transaction(this)
|
||||||
this.emit('beforeTransaction', this, this._transaction, remote)
|
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
f(this)
|
f(this)
|
||||||
@@ -54,16 +53,13 @@ export default class Y extends NamedEventHandler {
|
|||||||
console.error(e)
|
console.error(e)
|
||||||
}
|
}
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
this.emit('beforeObserverCalls', this, this._transaction, remote)
|
|
||||||
const transaction = this._transaction
|
|
||||||
this._transaction = null
|
|
||||||
// emit change events on changed types
|
// emit change events on changed types
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
this._transaction.changedTypes.forEach(function (subs, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
type._callObserver(transaction, subs, remote)
|
type._callObserver(subs, remote)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
transaction.changedParentTypes.forEach(function (events, type) {
|
this._transaction.changedParentTypes.forEach(function (events, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
events = events
|
events = events
|
||||||
.filter(event =>
|
.filter(event =>
|
||||||
@@ -75,11 +71,12 @@ export default class Y extends NamedEventHandler {
|
|||||||
})
|
})
|
||||||
// we don't have to check for events.length
|
// we don't have to check for events.length
|
||||||
// because there is no way events is empty..
|
// because there is no way events is empty..
|
||||||
type._deepEventHandler.callEventListeners(transaction, events)
|
type._deepEventHandler.callEventListeners(events)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// when all changes & events are processed, emit afterTransaction event
|
// when all changes & events are processed, emit afterTransaction event
|
||||||
this.emit('afterTransaction', this, transaction, remote)
|
this.emit('afterTransaction', this, remote)
|
||||||
|
this._transaction = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// fake _start for root properties (y.set('name', type))
|
// fake _start for root properties (y.set('name', type))
|
||||||
@@ -95,10 +92,17 @@ export default class Y extends NamedEventHandler {
|
|||||||
define (name, TypeConstructor) {
|
define (name, TypeConstructor) {
|
||||||
let id = new RootID(name, TypeConstructor)
|
let id = new RootID(name, TypeConstructor)
|
||||||
let type = this.os.get(id)
|
let type = this.os.get(id)
|
||||||
|
if (type === null) {
|
||||||
|
type = new TypeConstructor()
|
||||||
|
type._id = id
|
||||||
|
type._parent = this
|
||||||
|
type._integrate(this)
|
||||||
|
if (this.share[name] !== undefined) {
|
||||||
|
throw new Error('Type is already defined with a different constructor!')
|
||||||
|
}
|
||||||
|
}
|
||||||
if (this.share[name] === undefined) {
|
if (this.share[name] === undefined) {
|
||||||
this.share[name] = type
|
this.share[name] = type
|
||||||
} else if (this.share[name] !== type) {
|
|
||||||
throw new Error('Type is already defined with a different constructor')
|
|
||||||
}
|
}
|
||||||
return type
|
return type
|
||||||
}
|
}
|
||||||
@@ -164,9 +168,7 @@ Y.XmlText = YXmlText
|
|||||||
|
|
||||||
Y.utils = {
|
Y.utils = {
|
||||||
BinaryDecoder,
|
BinaryDecoder,
|
||||||
UndoManager,
|
UndoManager
|
||||||
getRelativePosition,
|
|
||||||
fromRelativePosition
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Y.debug = debug
|
Y.debug = debug
|
||||||
|
|||||||
@@ -230,8 +230,8 @@ test('filter node', async function xml14 (t) {
|
|||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 })
|
var { users, xml0, xml1 } = await initArrays(t, { users: 3 })
|
||||||
let dom0 = xml0.getDom()
|
let dom0 = xml0.getDom()
|
||||||
let dom1 = xml1.getDom()
|
let dom1 = xml1.getDom()
|
||||||
let domFilter = (nodeName, attrs) => {
|
let domFilter = (node, attrs) => {
|
||||||
if (nodeName === 'H1') {
|
if (node.nodeName === 'H1') {
|
||||||
return null
|
return null
|
||||||
} else {
|
} else {
|
||||||
return attrs
|
return attrs
|
||||||
@@ -251,9 +251,8 @@ test('filter attribute', async function xml15 (t) {
|
|||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 })
|
var { users, xml0, xml1 } = await initArrays(t, { users: 3 })
|
||||||
let dom0 = xml0.getDom()
|
let dom0 = xml0.getDom()
|
||||||
let dom1 = xml1.getDom()
|
let dom1 = xml1.getDom()
|
||||||
let domFilter = (nodeName, attrs) => {
|
let domFilter = (node, attrs) => {
|
||||||
attrs.delete('hidden')
|
return attrs.filter(name => name !== 'hidden')
|
||||||
return attrs
|
|
||||||
}
|
}
|
||||||
xml0.setDomFilter(domFilter)
|
xml0.setDomFilter(domFilter)
|
||||||
xml1.setDomFilter(domFilter)
|
xml1.setDomFilter(domFilter)
|
||||||
@@ -304,51 +303,6 @@ test('treeWalker', async function xml17 (t) {
|
|||||||
await compareUsers(t, users)
|
await compareUsers(t, users)
|
||||||
})
|
})
|
||||||
|
|
||||||
/**
|
|
||||||
* The expected behavior is that changes on your own dom (e.g. malicious attributes) persist.
|
|
||||||
* Yjs should just ignore them, never propagate those attributes.
|
|
||||||
* Incoming changes that contain malicious attributes should be deleted.
|
|
||||||
*/
|
|
||||||
test('Filtering remote changes', async function xmlFilteringRemote (t) {
|
|
||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 })
|
|
||||||
xml0.setDomFilter(function (nodeName, attributes) {
|
|
||||||
attributes.delete('malicious')
|
|
||||||
if (nodeName === 'HIDEME') {
|
|
||||||
return null
|
|
||||||
} else if (attributes.has('isHidden')) {
|
|
||||||
return null
|
|
||||||
} else {
|
|
||||||
return attributes
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// make sure that dom filters are active
|
|
||||||
// TODO: do not rely on .getDom for domFilters
|
|
||||||
xml0.getDom()
|
|
||||||
xml1.getDom()
|
|
||||||
let paragraph = new Y.XmlElement('p')
|
|
||||||
let hideMe = new Y.XmlElement('hideMe')
|
|
||||||
let span = new Y.XmlElement('span')
|
|
||||||
span.setAttribute('malicious', 'alert("give me money")')
|
|
||||||
let tag = new Y.XmlElement('tag')
|
|
||||||
tag.setAttribute('isHidden', 'true')
|
|
||||||
paragraph.insert(0, [hideMe, span, tag])
|
|
||||||
xml0.insert(0, [paragraph])
|
|
||||||
let tag2 = new Y.XmlElement('tag')
|
|
||||||
tag2.setAttribute('isHidden', 'true')
|
|
||||||
paragraph.insert(0, [tag2])
|
|
||||||
await flushAll(t, users)
|
|
||||||
// check dom
|
|
||||||
paragraph.getDom().setAttribute('malicious', 'true')
|
|
||||||
span.getDom().setAttribute('malicious', 'true')
|
|
||||||
console.log(xml0.toString())
|
|
||||||
// check incoming attributes
|
|
||||||
xml1.get(0).get(0).setAttribute('malicious', 'true')
|
|
||||||
xml1.insert(0, [new Y.XmlElement('hideMe')])
|
|
||||||
await flushAll(t, users)
|
|
||||||
|
|
||||||
await compareUsers(t, users)
|
|
||||||
})
|
|
||||||
|
|
||||||
// TODO: move elements
|
// TODO: move elements
|
||||||
var xmlTransactions = [
|
var xmlTransactions = [
|
||||||
function attributeChange (t, user, chance) {
|
function attributeChange (t, user, chance) {
|
||||||
|
|||||||
@@ -153,12 +153,12 @@ export async function initArrays (t, opts) {
|
|||||||
result['array' + i] = y.define('array', Y.Array)
|
result['array' + i] = y.define('array', Y.Array)
|
||||||
result['map' + i] = y.define('map', Y.Map)
|
result['map' + i] = y.define('map', Y.Map)
|
||||||
result['xml' + i] = y.define('xml', Y.XmlElement)
|
result['xml' + i] = y.define('xml', Y.XmlElement)
|
||||||
y.get('xml').setDomFilter(function (nodeName, attrs) {
|
y.get('xml', Y.Xml).setDomFilter(function (d, attrs) {
|
||||||
if (nodeName === 'HIDDEN') {
|
if (d.nodeName === 'HIDDEN') {
|
||||||
return null
|
return null
|
||||||
|
} else {
|
||||||
|
return attrs.filter(a => a !== 'hidden')
|
||||||
}
|
}
|
||||||
attrs.delete('hidden')
|
|
||||||
return attrs
|
|
||||||
})
|
})
|
||||||
y.on('afterTransaction', function () {
|
y.on('afterTransaction', function () {
|
||||||
for (let missing of y._missingStructs.values()) {
|
for (let missing of y._missingStructs.values()) {
|
||||||
|
|||||||
333
y.node.js
333
y.node.js
@@ -1,7 +1,7 @@
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* yjs - A framework for real-time p2p shared editing on any data
|
* yjs - A framework for real-time p2p shared editing on any data
|
||||||
* @version v13.0.0-33
|
* @version v13.0.0-29
|
||||||
* @license MIT
|
* @license MIT
|
||||||
*/
|
*/
|
||||||
|
|
||||||
@@ -1899,7 +1899,7 @@ class EventHandler {
|
|||||||
removeAllEventListeners () {
|
removeAllEventListeners () {
|
||||||
this.eventListeners = [];
|
this.eventListeners = [];
|
||||||
}
|
}
|
||||||
callEventListeners (transaction, event) {
|
callEventListeners (event) {
|
||||||
for (var i = 0; i < this.eventListeners.length; i++) {
|
for (var i = 0; i < this.eventListeners.length; i++) {
|
||||||
try {
|
try {
|
||||||
const f = this.eventListeners[i];
|
const f = this.eventListeners[i];
|
||||||
@@ -1966,9 +1966,9 @@ class Type extends Item {
|
|||||||
}
|
}
|
||||||
return path
|
return path
|
||||||
}
|
}
|
||||||
_callEventHandler (transaction, event) {
|
_callEventHandler (event) {
|
||||||
const changedParentTypes = transaction.changedParentTypes;
|
const changedParentTypes = this._y._transaction.changedParentTypes;
|
||||||
this._eventHandler.callEventListeners(transaction, event);
|
this._eventHandler.callEventListeners(event);
|
||||||
let type = this;
|
let type = this;
|
||||||
while (type !== this._y) {
|
while (type !== this._y) {
|
||||||
let events = changedParentTypes.get(type);
|
let events = changedParentTypes.get(type);
|
||||||
@@ -2211,8 +2211,8 @@ class YArrayEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class YArray extends Type {
|
class YArray extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YArrayEvent(this, remote));
|
this._callEventHandler(new YArrayEvent(this, remote));
|
||||||
}
|
}
|
||||||
get (pos) {
|
get (pos) {
|
||||||
let n = this._start;
|
let n = this._start;
|
||||||
@@ -2429,8 +2429,8 @@ class YMapEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class YMap extends Type {
|
class YMap extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YMapEvent(this, parentSubs, remote));
|
this._callEventHandler(new YMapEvent(this, parentSubs, remote));
|
||||||
}
|
}
|
||||||
toJSON () {
|
toJSON () {
|
||||||
const map = {};
|
const map = {};
|
||||||
@@ -2776,22 +2776,18 @@ function applyChangesFromDom (dom) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function reflectChangesOnDom (events, _document) {
|
function reflectChangesOnDom (events) {
|
||||||
// Make sure that no filtered attributes are applied to the structure
|
// Make sure that no filtered attributes are applied to the structure
|
||||||
// if they were, delete them
|
// if they were, delete them
|
||||||
/*
|
/*
|
||||||
events.forEach(event => {
|
events.forEach(event => {
|
||||||
const target = event.target
|
const target = event.target
|
||||||
if (event.attributesChanged === undefined) {
|
const keys = this._domFilter(target.nodeName, Array.from(event.keysChanged))
|
||||||
// event.target is Y.XmlText
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const keys = this._domFilter(target.nodeName, Array.from(event.attributesChanged))
|
|
||||||
if (keys === null) {
|
if (keys === null) {
|
||||||
target._delete()
|
target._delete()
|
||||||
} else {
|
} else {
|
||||||
const removeKeys = new Set() // is a copy of event.attributesChanged
|
const removeKeys = new Set() // is a copy of event.keysChanged
|
||||||
event.attributesChanged.forEach(key => { removeKeys.add(key) })
|
event.keysChanged.forEach(key => { removeKeys.add(key) })
|
||||||
keys.forEach(key => {
|
keys.forEach(key => {
|
||||||
// remove all accepted keys from removeKeys
|
// remove all accepted keys from removeKeys
|
||||||
removeKeys.delete(key)
|
removeKeys.delete(key)
|
||||||
@@ -2824,9 +2820,9 @@ function reflectChangesOnDom (events, _document) {
|
|||||||
});
|
});
|
||||||
if (event.childListChanged) {
|
if (event.childListChanged) {
|
||||||
// create fragment of undeleted nodes
|
// create fragment of undeleted nodes
|
||||||
const fragment = _document.createDocumentFragment();
|
const fragment = document.createDocumentFragment();
|
||||||
yxml.forEach(function (t) {
|
yxml.forEach(function (t) {
|
||||||
fragment.appendChild(t.getDom(_document));
|
fragment.append(t.getDom());
|
||||||
});
|
});
|
||||||
// remove remainding nodes
|
// remove remainding nodes
|
||||||
let lastChild = dom.lastChild;
|
let lastChild = dom.lastChild;
|
||||||
@@ -2835,7 +2831,7 @@ function reflectChangesOnDom (events, _document) {
|
|||||||
lastChild = dom.lastChild;
|
lastChild = dom.lastChild;
|
||||||
}
|
}
|
||||||
// insert fragment of undeleted nodes
|
// insert fragment of undeleted nodes
|
||||||
dom.appendChild(fragment);
|
dom.append(fragment);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/* TODO: smartscrolling
|
/* TODO: smartscrolling
|
||||||
@@ -2956,7 +2952,7 @@ let relativeSelection = null;
|
|||||||
|
|
||||||
let beforeTransactionSelectionFixer;
|
let beforeTransactionSelectionFixer;
|
||||||
if (typeof getSelection !== 'undefined') {
|
if (typeof getSelection !== 'undefined') {
|
||||||
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, transaction, remote) {
|
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, remote) {
|
||||||
if (!remote) {
|
if (!remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -2979,7 +2975,7 @@ if (typeof getSelection !== 'undefined') {
|
|||||||
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {};
|
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {};
|
||||||
}
|
}
|
||||||
|
|
||||||
function afterTransactionSelectionFixer (y, transaction, remote) {
|
function afterTransactionSelectionFixer (y, remote) {
|
||||||
if (relativeSelection === null || !remote) {
|
if (relativeSelection === null || !remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -3778,18 +3774,18 @@ function merge_tuples (diffs, start, length) {
|
|||||||
|
|
||||||
/* global MutationObserver */
|
/* global MutationObserver */
|
||||||
|
|
||||||
function domToYXml (parent, doms, _document) {
|
function domToYXml (parent, doms) {
|
||||||
const types = [];
|
const types = [];
|
||||||
doms.forEach(d => {
|
doms.forEach(d => {
|
||||||
if (d._yxml != null && d._yxml !== false) {
|
if (d._yxml != null && d._yxml !== false) {
|
||||||
d._yxml._unbindFromDom();
|
d._yxml._unbindFromDom();
|
||||||
}
|
}
|
||||||
if (parent._domFilter(d.nodeName, new Map()) !== null) {
|
if (parent._domFilter(d, []) !== null) {
|
||||||
let type;
|
let type;
|
||||||
if (d.nodeType === d.TEXT_NODE) {
|
if (d.nodeType === d.TEXT_NODE) {
|
||||||
type = new YXmlText(d);
|
type = new YXmlText(d);
|
||||||
} else if (d.nodeType === d.ELEMENT_NODE) {
|
} else if (d.nodeType === d.ELEMENT_NODE) {
|
||||||
type = new YXmlFragment._YXmlElement(d, parent._domFilter, _document);
|
type = new YXmlFragment._YXmlElement(d, parent._domFilter);
|
||||||
} else {
|
} else {
|
||||||
throw new Error('Unsupported node!')
|
throw new Error('Unsupported node!')
|
||||||
}
|
}
|
||||||
@@ -3867,9 +3863,7 @@ class YXmlFragment extends YArray {
|
|||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
if (this._domObserver !== null) {
|
this._domObserver.takeRecords();
|
||||||
this._domObserver.takeRecords();
|
|
||||||
}
|
|
||||||
token = true;
|
token = true;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -3913,8 +3907,8 @@ class YXmlFragment extends YArray {
|
|||||||
xml.setDomFilter(f);
|
xml.setDomFilter(f);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YXmlEvent(this, parentSubs, remote));
|
this._callEventHandler(new YXmlEvent(this, parentSubs, remote));
|
||||||
}
|
}
|
||||||
toString () {
|
toString () {
|
||||||
return this.map(xml => xml.toString()).join('')
|
return this.map(xml => xml.toString()).join('')
|
||||||
@@ -3933,167 +3927,113 @@ class YXmlFragment extends YArray {
|
|||||||
this._dom = null;
|
this._dom = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
insertDomElementsAfter (prev, doms, _document) {
|
insertDomElementsAfter (prev, doms) {
|
||||||
const types = domToYXml(this, doms, _document);
|
const types = domToYXml(this, doms);
|
||||||
this.insertAfter(prev, types);
|
this.insertAfter(prev, types);
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
insertDomElements (pos, doms, _document) {
|
insertDomElements (pos, doms) {
|
||||||
const types = domToYXml(this, doms, _document);
|
const types = domToYXml(this, doms);
|
||||||
this.insert(pos, types);
|
this.insert(pos, types);
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
getDom () {
|
getDom () {
|
||||||
return this._dom
|
return this._dom
|
||||||
}
|
}
|
||||||
bindToDom (dom, _document) {
|
bindToDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
this._unbindFromDom();
|
this._unbindFromDom();
|
||||||
}
|
}
|
||||||
if (dom._yxml != null) {
|
if (dom._yxml != null) {
|
||||||
dom._yxml._unbindFromDom();
|
dom._yxml._unbindFromDom();
|
||||||
}
|
}
|
||||||
|
if (MutationObserver == null) {
|
||||||
|
throw new Error('Not able to bind to a DOM element, because MutationObserver is not available!')
|
||||||
|
}
|
||||||
dom.innerHTML = '';
|
dom.innerHTML = '';
|
||||||
|
this._dom = dom;
|
||||||
|
dom._yxml = this;
|
||||||
this.forEach(t => {
|
this.forEach(t => {
|
||||||
dom.insertBefore(t.getDom(_document), null);
|
dom.insertBefore(t.getDom(), null);
|
||||||
});
|
});
|
||||||
this._bindToDom(dom, _document);
|
this._bindToDom(dom);
|
||||||
}
|
}
|
||||||
// binds to a dom element
|
// binds to a dom element
|
||||||
// Only call if dom and YXml are isomorph
|
// Only call if dom and YXml are isomorph
|
||||||
_bindToDom (dom, _document) {
|
_bindToDom (dom) {
|
||||||
_document = _document || document;
|
if (this._parent === null || this._parent._dom != null || typeof MutationObserver === 'undefined') {
|
||||||
this._dom = dom;
|
// only bind if parent did not already bind
|
||||||
dom._yxml = this;
|
|
||||||
// TODO: refine this..
|
|
||||||
if ((this.constructor !== YXmlFragment && this._parent !== this._y) || this._parent === null) {
|
|
||||||
// TODO: only top level YXmlFragment can bind. Also allow YXmlElements..
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
this._y.on('beforeTransaction', () => {
|
||||||
|
this._domObserverListener(this._domObserver.takeRecords());
|
||||||
|
});
|
||||||
this._y.on('beforeTransaction', beforeTransactionSelectionFixer);
|
this._y.on('beforeTransaction', beforeTransactionSelectionFixer);
|
||||||
this._y.on('afterTransaction', afterTransactionSelectionFixer);
|
this._y.on('afterTransaction', afterTransactionSelectionFixer);
|
||||||
const applyFilter = (type) => {
|
|
||||||
if (type._deleted) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// check if type is a child of this
|
|
||||||
let isChild = false;
|
|
||||||
let p = type;
|
|
||||||
while (p !== this._y) {
|
|
||||||
if (p === this) {
|
|
||||||
isChild = true;
|
|
||||||
break
|
|
||||||
}
|
|
||||||
p = p._parent;
|
|
||||||
}
|
|
||||||
if (!isChild) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// filter attributes
|
|
||||||
let attributes = new Map();
|
|
||||||
if (type.getAttributes !== undefined) {
|
|
||||||
let attrs = type.getAttributes();
|
|
||||||
for (let key in attrs) {
|
|
||||||
attributes.set(key, attrs[key]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
let result = this._domFilter(type.nodeName, new Map(attributes));
|
|
||||||
if (result === null) {
|
|
||||||
type._delete(this._y);
|
|
||||||
} else {
|
|
||||||
attributes.forEach((value, key) => {
|
|
||||||
if (!result.has(key)) {
|
|
||||||
type.removeAttribute(key);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
this._y.on('beforeObserverCalls', function (y, transaction) {
|
|
||||||
// apply dom filter to new and changed types
|
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
|
||||||
if (subs.size > 1 || !subs.has(null)) {
|
|
||||||
// only apply changes on attributes
|
|
||||||
applyFilter(type);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
transaction.newTypes.forEach(applyFilter);
|
|
||||||
});
|
|
||||||
// Apply Y.Xml events to dom
|
// Apply Y.Xml events to dom
|
||||||
this.observeDeep(events => {
|
this.observeDeep(reflectChangesOnDom.bind(this));
|
||||||
reflectChangesOnDom.call(this, events, _document);
|
|
||||||
});
|
|
||||||
// Apply Dom changes on Y.Xml
|
// Apply Dom changes on Y.Xml
|
||||||
if (typeof MutationObserver !== 'undefined') {
|
this._domObserverListener = mutations => {
|
||||||
this._y.on('beforeTransaction', () => {
|
this._mutualExclude(() => {
|
||||||
this._domObserverListener(this._domObserver.takeRecords());
|
this._y.transact(() => {
|
||||||
});
|
let diffChildren = new Set();
|
||||||
this._domObserverListener = mutations => {
|
mutations.forEach(mutation => {
|
||||||
this._mutualExclude(() => {
|
const dom = mutation.target;
|
||||||
this._y.transact(() => {
|
const yxml = dom._yxml;
|
||||||
let diffChildren = new Set();
|
if (yxml == null) {
|
||||||
mutations.forEach(mutation => {
|
// dom element is filtered
|
||||||
const dom = mutation.target;
|
return
|
||||||
const yxml = dom._yxml;
|
}
|
||||||
if (yxml == null) {
|
switch (mutation.type) {
|
||||||
// dom element is filtered
|
case 'characterData':
|
||||||
return
|
var diffs = diff_1(yxml.toString(), dom.nodeValue);
|
||||||
}
|
var pos = 0;
|
||||||
switch (mutation.type) {
|
for (var i = 0; i < diffs.length; i++) {
|
||||||
case 'characterData':
|
var d = diffs[i];
|
||||||
var diffs = diff_1(yxml.toString(), dom.nodeValue);
|
if (d[0] === 0) { // EQUAL
|
||||||
var pos = 0;
|
pos += d[1].length;
|
||||||
for (var i = 0; i < diffs.length; i++) {
|
} else if (d[0] === -1) { // DELETE
|
||||||
var d = diffs[i];
|
yxml.delete(pos, d[1].length);
|
||||||
if (d[0] === 0) { // EQUAL
|
} else { // INSERT
|
||||||
pos += d[1].length;
|
yxml.insert(pos, d[1]);
|
||||||
} else if (d[0] === -1) { // DELETE
|
pos += d[1].length;
|
||||||
yxml.delete(pos, d[1].length);
|
}
|
||||||
} else { // INSERT
|
}
|
||||||
yxml.insert(pos, d[1]);
|
break
|
||||||
pos += d[1].length;
|
case 'attributes':
|
||||||
|
let name = mutation.attributeName;
|
||||||
|
// check if filter accepts attribute
|
||||||
|
if (this._domFilter(dom, [name]).length > 0 && this.constructor !== YXmlFragment) {
|
||||||
|
var val = dom.getAttribute(name);
|
||||||
|
if (yxml.getAttribute(name) !== val) {
|
||||||
|
if (val == null) {
|
||||||
|
yxml.removeAttribute(name);
|
||||||
|
} else {
|
||||||
|
yxml.setAttribute(name, val);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
break
|
}
|
||||||
case 'attributes':
|
break
|
||||||
if (yxml.constructor === YXmlFragment) {
|
case 'childList':
|
||||||
break
|
diffChildren.add(mutation.target);
|
||||||
}
|
break
|
||||||
let name = mutation.attributeName;
|
|
||||||
let val = dom.getAttribute(name);
|
|
||||||
// check if filter accepts attribute
|
|
||||||
let attributes = new Map();
|
|
||||||
attributes.set(name, val);
|
|
||||||
if (this._domFilter(dom.nodeName, attributes).size > 0 && yxml.constructor !== YXmlFragment) {
|
|
||||||
if (yxml.getAttribute(name) !== val) {
|
|
||||||
if (val == null) {
|
|
||||||
yxml.removeAttribute(name);
|
|
||||||
} else {
|
|
||||||
yxml.setAttribute(name, val);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break
|
|
||||||
case 'childList':
|
|
||||||
diffChildren.add(mutation.target);
|
|
||||||
break
|
|
||||||
}
|
|
||||||
});
|
|
||||||
for (let dom of diffChildren) {
|
|
||||||
if (dom._yxml != null && dom._yxml !== false) {
|
|
||||||
applyChangesFromDom(dom);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
for (let dom of diffChildren) {
|
||||||
|
if (dom._yxml != null && dom._yxml !== false) {
|
||||||
|
applyChangesFromDom(dom);
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
};
|
|
||||||
this._domObserver = new MutationObserver(this._domObserverListener);
|
|
||||||
this._domObserver.observe(dom, {
|
|
||||||
childList: true,
|
|
||||||
attributes: true,
|
|
||||||
characterData: true,
|
|
||||||
subtree: true
|
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
this._domObserver = new MutationObserver(this._domObserverListener);
|
||||||
|
this._domObserver.observe(dom, {
|
||||||
|
childList: true,
|
||||||
|
attributes: true,
|
||||||
|
characterData: true,
|
||||||
|
subtree: true
|
||||||
|
});
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
_logString () {
|
_logString () {
|
||||||
@@ -4105,7 +4045,7 @@ class YXmlFragment extends YArray {
|
|||||||
|
|
||||||
// import diff from 'fast-diff'
|
// import diff from 'fast-diff'
|
||||||
class YXmlElement extends YXmlFragment {
|
class YXmlElement extends YXmlFragment {
|
||||||
constructor (arg1, arg2, _document) {
|
constructor (arg1, arg2) {
|
||||||
super();
|
super();
|
||||||
this.nodeName = null;
|
this.nodeName = null;
|
||||||
this._scrollElement = null;
|
this._scrollElement = null;
|
||||||
@@ -4113,7 +4053,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
this.nodeName = arg1.toUpperCase();
|
this.nodeName = arg1.toUpperCase();
|
||||||
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
||||||
this.nodeName = arg1.nodeName;
|
this.nodeName = arg1.nodeName;
|
||||||
this._setDom(arg1, _document);
|
this._setDom(arg1);
|
||||||
} else {
|
} else {
|
||||||
this.nodeName = 'UNDEFINED';
|
this.nodeName = 'UNDEFINED';
|
||||||
}
|
}
|
||||||
@@ -4126,25 +4066,28 @@ class YXmlElement extends YXmlFragment {
|
|||||||
struct.nodeName = this.nodeName;
|
struct.nodeName = this.nodeName;
|
||||||
return struct
|
return struct
|
||||||
}
|
}
|
||||||
_setDom (dom, _document) {
|
_setDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
throw new Error('Only call this method if you know what you are doing ;)')
|
throw new Error('Only call this method if you know what you are doing ;)')
|
||||||
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
||||||
throw new Error('Already bound to an YXml type')
|
throw new Error('Already bound to an YXml type')
|
||||||
} else {
|
} else {
|
||||||
|
this._dom = dom;
|
||||||
|
dom._yxml = this;
|
||||||
// tag is already set in constructor
|
// tag is already set in constructor
|
||||||
// set attributes
|
// set attributes
|
||||||
let attributes = new Map();
|
let attrNames = [];
|
||||||
for (let i = 0; i < dom.attributes.length; i++) {
|
for (let i = 0; i < dom.attributes.length; i++) {
|
||||||
let attr = dom.attributes[i];
|
attrNames.push(dom.attributes[i].name);
|
||||||
attributes.set(attr.name, attr.value);
|
|
||||||
}
|
}
|
||||||
attributes = this._domFilter(dom, attributes);
|
attrNames = this._domFilter(dom, attrNames);
|
||||||
attributes.forEach((value, name) => {
|
for (let i = 0; i < attrNames.length; i++) {
|
||||||
this.setAttribute(name, value);
|
let attrName = attrNames[i];
|
||||||
});
|
let attrValue = dom.getAttribute(attrName);
|
||||||
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes), _document);
|
this.setAttribute(attrName, attrValue);
|
||||||
this._bindToDom(dom, _document);
|
}
|
||||||
|
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes));
|
||||||
|
this._bindToDom(dom);
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -4203,9 +4146,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
getAttributes () {
|
getAttributes () {
|
||||||
const obj = {};
|
const obj = {};
|
||||||
for (let [key, value] of this._map) {
|
for (let [key, value] of this._map) {
|
||||||
if (!value._deleted) {
|
obj[key] = value._content[0];
|
||||||
obj[key] = value._content[0];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return obj
|
return obj
|
||||||
}
|
}
|
||||||
@@ -4214,6 +4155,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
let dom = this._dom;
|
let dom = this._dom;
|
||||||
if (dom == null) {
|
if (dom == null) {
|
||||||
dom = _document.createElement(this.nodeName);
|
dom = _document.createElement(this.nodeName);
|
||||||
|
this._dom = dom;
|
||||||
dom._yxml = this;
|
dom._yxml = this;
|
||||||
let attrs = this.getAttributes();
|
let attrs = this.getAttributes();
|
||||||
for (let key in attrs) {
|
for (let key in attrs) {
|
||||||
@@ -4222,7 +4164,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
this.forEach(yxml => {
|
this.forEach(yxml => {
|
||||||
dom.appendChild(yxml.getDom(_document));
|
dom.appendChild(yxml.getDom(_document));
|
||||||
});
|
});
|
||||||
this._bindToDom(dom, _document);
|
this._bindToDom(dom);
|
||||||
}
|
}
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
@@ -4463,16 +4405,16 @@ class NamedEventHandler {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class ReverseOperation {
|
class ReverseOperation {
|
||||||
constructor (y, transaction) {
|
constructor (y) {
|
||||||
this.created = new Date();
|
this.created = new Date();
|
||||||
const beforeState = transaction.beforeState;
|
const beforeState = y._transaction.beforeState;
|
||||||
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1);
|
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1);
|
||||||
if (beforeState.has(y.userID)) {
|
if (beforeState.has(y.userID)) {
|
||||||
this.fromState = new ID(y.userID, beforeState.get(y.userID));
|
this.fromState = new ID(y.userID, beforeState.get(y.userID));
|
||||||
} else {
|
} else {
|
||||||
this.fromState = this.toState;
|
this.fromState = this.toState;
|
||||||
}
|
}
|
||||||
this.deletedStructs = transaction.deletedStructs;
|
this.deletedStructs = y._transaction.deletedStructs;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -4532,9 +4474,9 @@ class UndoManager {
|
|||||||
this._redoing = false;
|
this._redoing = false;
|
||||||
const y = scope._y;
|
const y = scope._y;
|
||||||
this.y = y;
|
this.y = y;
|
||||||
y.on('afterTransaction', (y, transaction, remote) => {
|
y.on('afterTransaction', (y, remote) => {
|
||||||
if (!remote && transaction.changedParentTypes.has(scope)) {
|
if (!remote && y._transaction.changedParentTypes.has(scope)) {
|
||||||
let reverseOperation = new ReverseOperation(y, transaction);
|
let reverseOperation = new ReverseOperation(y);
|
||||||
if (!this._undoing) {
|
if (!this._undoing) {
|
||||||
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null;
|
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null;
|
||||||
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
||||||
@@ -5490,8 +5432,8 @@ class Y$1 extends NamedEventHandler {
|
|||||||
transact (f, remote = false) {
|
transact (f, remote = false) {
|
||||||
let initialCall = this._transaction === null;
|
let initialCall = this._transaction === null;
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
|
this.emit('beforeTransaction', this, remote);
|
||||||
this._transaction = new Transaction(this);
|
this._transaction = new Transaction(this);
|
||||||
this.emit('beforeTransaction', this, this._transaction, remote);
|
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
f(this);
|
f(this);
|
||||||
@@ -5499,16 +5441,13 @@ class Y$1 extends NamedEventHandler {
|
|||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
this.emit('beforeObserverCalls', this, this._transaction, remote);
|
|
||||||
const transaction = this._transaction;
|
|
||||||
this._transaction = null;
|
|
||||||
// emit change events on changed types
|
// emit change events on changed types
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
this._transaction.changedTypes.forEach(function (subs, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
type._callObserver(transaction, subs, remote);
|
type._callObserver(subs, remote);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
transaction.changedParentTypes.forEach(function (events, type) {
|
this._transaction.changedParentTypes.forEach(function (events, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
events = events
|
events = events
|
||||||
.filter(event =>
|
.filter(event =>
|
||||||
@@ -5520,11 +5459,12 @@ class Y$1 extends NamedEventHandler {
|
|||||||
});
|
});
|
||||||
// we don't have to check for events.length
|
// we don't have to check for events.length
|
||||||
// because there is no way events is empty..
|
// because there is no way events is empty..
|
||||||
type._deepEventHandler.callEventListeners(transaction, events);
|
type._deepEventHandler.callEventListeners(events);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// when all changes & events are processed, emit afterTransaction event
|
// when all changes & events are processed, emit afterTransaction event
|
||||||
this.emit('afterTransaction', this, transaction, remote);
|
this.emit('afterTransaction', this, remote);
|
||||||
|
this._transaction = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// fake _start for root properties (y.set('name', type))
|
// fake _start for root properties (y.set('name', type))
|
||||||
@@ -5540,10 +5480,17 @@ class Y$1 extends NamedEventHandler {
|
|||||||
define (name, TypeConstructor) {
|
define (name, TypeConstructor) {
|
||||||
let id = new RootID(name, TypeConstructor);
|
let id = new RootID(name, TypeConstructor);
|
||||||
let type = this.os.get(id);
|
let type = this.os.get(id);
|
||||||
|
if (type === null) {
|
||||||
|
type = new TypeConstructor();
|
||||||
|
type._id = id;
|
||||||
|
type._parent = this;
|
||||||
|
type._integrate(this);
|
||||||
|
if (this.share[name] !== undefined) {
|
||||||
|
throw new Error('Type is already defined with a different constructor!')
|
||||||
|
}
|
||||||
|
}
|
||||||
if (this.share[name] === undefined) {
|
if (this.share[name] === undefined) {
|
||||||
this.share[name] = type;
|
this.share[name] = type;
|
||||||
} else if (this.share[name] !== type) {
|
|
||||||
throw new Error('Type is already defined with a different constructor')
|
|
||||||
}
|
}
|
||||||
return type
|
return type
|
||||||
}
|
}
|
||||||
@@ -5609,9 +5556,7 @@ Y$1.XmlText = YXmlText;
|
|||||||
|
|
||||||
Y$1.utils = {
|
Y$1.utils = {
|
||||||
BinaryDecoder,
|
BinaryDecoder,
|
||||||
UndoManager,
|
UndoManager
|
||||||
getRelativePosition,
|
|
||||||
fromRelativePosition
|
|
||||||
};
|
};
|
||||||
|
|
||||||
Y$1.debug = browser;
|
Y$1.debug = browser;
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
421
y.test.js
421
y.test.js
@@ -1448,6 +1448,10 @@ function logID (id) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Delete all items in an ID-range
|
||||||
|
* TODO: implement getItemCleanStartNode for better performance (only one lookup)
|
||||||
|
*/
|
||||||
function deleteItemRange (y, user, clock, range) {
|
function deleteItemRange (y, user, clock, range) {
|
||||||
const createDelete = y.connector._forwardAppliedStructs;
|
const createDelete = y.connector._forwardAppliedStructs;
|
||||||
let item = y.os.getItemCleanStart(new ID(user, clock));
|
let item = y.os.getItemCleanStart(new ID(user, clock));
|
||||||
@@ -1552,6 +1556,13 @@ function transactionTypeChanged (y, type, sub) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Helper utility to split an Item (see _splitAt)
|
||||||
|
* - copy all properties from a to b
|
||||||
|
* - connect a to b
|
||||||
|
* - assigns the correct _id
|
||||||
|
* - save b to os
|
||||||
|
*/
|
||||||
function splitHelper (y, a, b, diff) {
|
function splitHelper (y, a, b, diff) {
|
||||||
const aID = a._id;
|
const aID = a._id;
|
||||||
b._id = new ID(aID.user, aID.clock + diff);
|
b._id = new ID(aID.user, aID.clock + diff);
|
||||||
@@ -1885,7 +1896,7 @@ class EventHandler {
|
|||||||
removeAllEventListeners () {
|
removeAllEventListeners () {
|
||||||
this.eventListeners = [];
|
this.eventListeners = [];
|
||||||
}
|
}
|
||||||
callEventListeners (transaction, event) {
|
callEventListeners (event) {
|
||||||
for (var i = 0; i < this.eventListeners.length; i++) {
|
for (var i = 0; i < this.eventListeners.length; i++) {
|
||||||
try {
|
try {
|
||||||
const f = this.eventListeners[i];
|
const f = this.eventListeners[i];
|
||||||
@@ -1902,6 +1913,7 @@ class EventHandler {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// restructure children as if they were inserted one after another
|
||||||
function integrateChildren (y, start) {
|
function integrateChildren (y, start) {
|
||||||
let right;
|
let right;
|
||||||
do {
|
do {
|
||||||
@@ -1951,9 +1963,9 @@ class Type extends Item {
|
|||||||
}
|
}
|
||||||
return path
|
return path
|
||||||
}
|
}
|
||||||
_callEventHandler (transaction, event) {
|
_callEventHandler (event) {
|
||||||
const changedParentTypes = transaction.changedParentTypes;
|
const changedParentTypes = this._y._transaction.changedParentTypes;
|
||||||
this._eventHandler.callEventListeners(transaction, event);
|
this._eventHandler.callEventListeners(event);
|
||||||
let type = this;
|
let type = this;
|
||||||
while (type !== this._y) {
|
while (type !== this._y) {
|
||||||
let events = changedParentTypes.get(type);
|
let events = changedParentTypes.get(type);
|
||||||
@@ -2196,8 +2208,8 @@ class YArrayEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class YArray extends Type {
|
class YArray extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YArrayEvent(this, remote));
|
this._callEventHandler(new YArrayEvent(this, remote));
|
||||||
}
|
}
|
||||||
get (pos) {
|
get (pos) {
|
||||||
let n = this._start;
|
let n = this._start;
|
||||||
@@ -2414,8 +2426,8 @@ class YMapEvent extends YEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class YMap extends Type {
|
class YMap extends Type {
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YMapEvent(this, parentSubs, remote));
|
this._callEventHandler(new YMapEvent(this, parentSubs, remote));
|
||||||
}
|
}
|
||||||
toJSON () {
|
toJSON () {
|
||||||
const map = {};
|
const map = {};
|
||||||
@@ -2761,22 +2773,18 @@ function applyChangesFromDom (dom) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function reflectChangesOnDom (events, _document) {
|
function reflectChangesOnDom (events) {
|
||||||
// Make sure that no filtered attributes are applied to the structure
|
// Make sure that no filtered attributes are applied to the structure
|
||||||
// if they were, delete them
|
// if they were, delete them
|
||||||
/*
|
/*
|
||||||
events.forEach(event => {
|
events.forEach(event => {
|
||||||
const target = event.target
|
const target = event.target
|
||||||
if (event.attributesChanged === undefined) {
|
const keys = this._domFilter(target.nodeName, Array.from(event.keysChanged))
|
||||||
// event.target is Y.XmlText
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const keys = this._domFilter(target.nodeName, Array.from(event.attributesChanged))
|
|
||||||
if (keys === null) {
|
if (keys === null) {
|
||||||
target._delete()
|
target._delete()
|
||||||
} else {
|
} else {
|
||||||
const removeKeys = new Set() // is a copy of event.attributesChanged
|
const removeKeys = new Set() // is a copy of event.keysChanged
|
||||||
event.attributesChanged.forEach(key => { removeKeys.add(key) })
|
event.keysChanged.forEach(key => { removeKeys.add(key) })
|
||||||
keys.forEach(key => {
|
keys.forEach(key => {
|
||||||
// remove all accepted keys from removeKeys
|
// remove all accepted keys from removeKeys
|
||||||
removeKeys.delete(key)
|
removeKeys.delete(key)
|
||||||
@@ -2809,9 +2817,9 @@ function reflectChangesOnDom (events, _document) {
|
|||||||
});
|
});
|
||||||
if (event.childListChanged) {
|
if (event.childListChanged) {
|
||||||
// create fragment of undeleted nodes
|
// create fragment of undeleted nodes
|
||||||
const fragment = _document.createDocumentFragment();
|
const fragment = document.createDocumentFragment();
|
||||||
yxml.forEach(function (t) {
|
yxml.forEach(function (t) {
|
||||||
fragment.appendChild(t.getDom(_document));
|
fragment.append(t.getDom());
|
||||||
});
|
});
|
||||||
// remove remainding nodes
|
// remove remainding nodes
|
||||||
let lastChild = dom.lastChild;
|
let lastChild = dom.lastChild;
|
||||||
@@ -2820,7 +2828,7 @@ function reflectChangesOnDom (events, _document) {
|
|||||||
lastChild = dom.lastChild;
|
lastChild = dom.lastChild;
|
||||||
}
|
}
|
||||||
// insert fragment of undeleted nodes
|
// insert fragment of undeleted nodes
|
||||||
dom.appendChild(fragment);
|
dom.append(fragment);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/* TODO: smartscrolling
|
/* TODO: smartscrolling
|
||||||
@@ -2941,7 +2949,7 @@ let relativeSelection = null;
|
|||||||
|
|
||||||
let beforeTransactionSelectionFixer;
|
let beforeTransactionSelectionFixer;
|
||||||
if (typeof getSelection !== 'undefined') {
|
if (typeof getSelection !== 'undefined') {
|
||||||
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, transaction, remote) {
|
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, remote) {
|
||||||
if (!remote) {
|
if (!remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -2964,7 +2972,7 @@ if (typeof getSelection !== 'undefined') {
|
|||||||
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {};
|
beforeTransactionSelectionFixer = function _fakeBeforeTransactionSelectionFixer () {};
|
||||||
}
|
}
|
||||||
|
|
||||||
function afterTransactionSelectionFixer (y, transaction, remote) {
|
function afterTransactionSelectionFixer (y, remote) {
|
||||||
if (relativeSelection === null || !remote) {
|
if (relativeSelection === null || !remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -3763,18 +3771,18 @@ function merge_tuples (diffs, start, length) {
|
|||||||
|
|
||||||
/* global MutationObserver */
|
/* global MutationObserver */
|
||||||
|
|
||||||
function domToYXml (parent, doms, _document) {
|
function domToYXml (parent, doms) {
|
||||||
const types = [];
|
const types = [];
|
||||||
doms.forEach(d => {
|
doms.forEach(d => {
|
||||||
if (d._yxml != null && d._yxml !== false) {
|
if (d._yxml != null && d._yxml !== false) {
|
||||||
d._yxml._unbindFromDom();
|
d._yxml._unbindFromDom();
|
||||||
}
|
}
|
||||||
if (parent._domFilter(d.nodeName, new Map()) !== null) {
|
if (parent._domFilter(d, []) !== null) {
|
||||||
let type;
|
let type;
|
||||||
if (d.nodeType === d.TEXT_NODE) {
|
if (d.nodeType === d.TEXT_NODE) {
|
||||||
type = new YXmlText(d);
|
type = new YXmlText(d);
|
||||||
} else if (d.nodeType === d.ELEMENT_NODE) {
|
} else if (d.nodeType === d.ELEMENT_NODE) {
|
||||||
type = new YXmlFragment._YXmlElement(d, parent._domFilter, _document);
|
type = new YXmlFragment._YXmlElement(d, parent._domFilter);
|
||||||
} else {
|
} else {
|
||||||
throw new Error('Unsupported node!')
|
throw new Error('Unsupported node!')
|
||||||
}
|
}
|
||||||
@@ -3852,9 +3860,7 @@ class YXmlFragment extends YArray {
|
|||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
if (this._domObserver !== null) {
|
this._domObserver.takeRecords();
|
||||||
this._domObserver.takeRecords();
|
|
||||||
}
|
|
||||||
token = true;
|
token = true;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -3898,8 +3904,8 @@ class YXmlFragment extends YArray {
|
|||||||
xml.setDomFilter(f);
|
xml.setDomFilter(f);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
_callObserver (transaction, parentSubs, remote) {
|
_callObserver (parentSubs, remote) {
|
||||||
this._callEventHandler(transaction, new YXmlEvent(this, parentSubs, remote));
|
this._callEventHandler(new YXmlEvent(this, parentSubs, remote));
|
||||||
}
|
}
|
||||||
toString () {
|
toString () {
|
||||||
return this.map(xml => xml.toString()).join('')
|
return this.map(xml => xml.toString()).join('')
|
||||||
@@ -3918,167 +3924,113 @@ class YXmlFragment extends YArray {
|
|||||||
this._dom = null;
|
this._dom = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
insertDomElementsAfter (prev, doms, _document) {
|
insertDomElementsAfter (prev, doms) {
|
||||||
const types = domToYXml(this, doms, _document);
|
const types = domToYXml(this, doms);
|
||||||
this.insertAfter(prev, types);
|
this.insertAfter(prev, types);
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
insertDomElements (pos, doms, _document) {
|
insertDomElements (pos, doms) {
|
||||||
const types = domToYXml(this, doms, _document);
|
const types = domToYXml(this, doms);
|
||||||
this.insert(pos, types);
|
this.insert(pos, types);
|
||||||
return types
|
return types
|
||||||
}
|
}
|
||||||
getDom () {
|
getDom () {
|
||||||
return this._dom
|
return this._dom
|
||||||
}
|
}
|
||||||
bindToDom (dom, _document) {
|
bindToDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
this._unbindFromDom();
|
this._unbindFromDom();
|
||||||
}
|
}
|
||||||
if (dom._yxml != null) {
|
if (dom._yxml != null) {
|
||||||
dom._yxml._unbindFromDom();
|
dom._yxml._unbindFromDom();
|
||||||
}
|
}
|
||||||
|
if (MutationObserver == null) {
|
||||||
|
throw new Error('Not able to bind to a DOM element, because MutationObserver is not available!')
|
||||||
|
}
|
||||||
dom.innerHTML = '';
|
dom.innerHTML = '';
|
||||||
|
this._dom = dom;
|
||||||
|
dom._yxml = this;
|
||||||
this.forEach(t => {
|
this.forEach(t => {
|
||||||
dom.insertBefore(t.getDom(_document), null);
|
dom.insertBefore(t.getDom(), null);
|
||||||
});
|
});
|
||||||
this._bindToDom(dom, _document);
|
this._bindToDom(dom);
|
||||||
}
|
}
|
||||||
// binds to a dom element
|
// binds to a dom element
|
||||||
// Only call if dom and YXml are isomorph
|
// Only call if dom and YXml are isomorph
|
||||||
_bindToDom (dom, _document) {
|
_bindToDom (dom) {
|
||||||
_document = _document || document;
|
if (this._parent === null || this._parent._dom != null || typeof MutationObserver === 'undefined') {
|
||||||
this._dom = dom;
|
// only bind if parent did not already bind
|
||||||
dom._yxml = this;
|
|
||||||
// TODO: refine this..
|
|
||||||
if ((this.constructor !== YXmlFragment && this._parent !== this._y) || this._parent === null) {
|
|
||||||
// TODO: only top level YXmlFragment can bind. Also allow YXmlElements..
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
this._y.on('beforeTransaction', () => {
|
||||||
|
this._domObserverListener(this._domObserver.takeRecords());
|
||||||
|
});
|
||||||
this._y.on('beforeTransaction', beforeTransactionSelectionFixer);
|
this._y.on('beforeTransaction', beforeTransactionSelectionFixer);
|
||||||
this._y.on('afterTransaction', afterTransactionSelectionFixer);
|
this._y.on('afterTransaction', afterTransactionSelectionFixer);
|
||||||
const applyFilter = (type) => {
|
|
||||||
if (type._deleted) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// check if type is a child of this
|
|
||||||
let isChild = false;
|
|
||||||
let p = type;
|
|
||||||
while (p !== this._y) {
|
|
||||||
if (p === this) {
|
|
||||||
isChild = true;
|
|
||||||
break
|
|
||||||
}
|
|
||||||
p = p._parent;
|
|
||||||
}
|
|
||||||
if (!isChild) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// filter attributes
|
|
||||||
let attributes = new Map();
|
|
||||||
if (type.getAttributes !== undefined) {
|
|
||||||
let attrs = type.getAttributes();
|
|
||||||
for (let key in attrs) {
|
|
||||||
attributes.set(key, attrs[key]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
let result = this._domFilter(type.nodeName, new Map(attributes));
|
|
||||||
if (result === null) {
|
|
||||||
type._delete(this._y);
|
|
||||||
} else {
|
|
||||||
attributes.forEach((value, key) => {
|
|
||||||
if (!result.has(key)) {
|
|
||||||
type.removeAttribute(key);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
this._y.on('beforeObserverCalls', function (y, transaction) {
|
|
||||||
// apply dom filter to new and changed types
|
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
|
||||||
if (subs.size > 1 || !subs.has(null)) {
|
|
||||||
// only apply changes on attributes
|
|
||||||
applyFilter(type);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
transaction.newTypes.forEach(applyFilter);
|
|
||||||
});
|
|
||||||
// Apply Y.Xml events to dom
|
// Apply Y.Xml events to dom
|
||||||
this.observeDeep(events => {
|
this.observeDeep(reflectChangesOnDom.bind(this));
|
||||||
reflectChangesOnDom.call(this, events, _document);
|
|
||||||
});
|
|
||||||
// Apply Dom changes on Y.Xml
|
// Apply Dom changes on Y.Xml
|
||||||
if (typeof MutationObserver !== 'undefined') {
|
this._domObserverListener = mutations => {
|
||||||
this._y.on('beforeTransaction', () => {
|
this._mutualExclude(() => {
|
||||||
this._domObserverListener(this._domObserver.takeRecords());
|
this._y.transact(() => {
|
||||||
});
|
let diffChildren = new Set();
|
||||||
this._domObserverListener = mutations => {
|
mutations.forEach(mutation => {
|
||||||
this._mutualExclude(() => {
|
const dom = mutation.target;
|
||||||
this._y.transact(() => {
|
const yxml = dom._yxml;
|
||||||
let diffChildren = new Set();
|
if (yxml == null) {
|
||||||
mutations.forEach(mutation => {
|
// dom element is filtered
|
||||||
const dom = mutation.target;
|
return
|
||||||
const yxml = dom._yxml;
|
}
|
||||||
if (yxml == null) {
|
switch (mutation.type) {
|
||||||
// dom element is filtered
|
case 'characterData':
|
||||||
return
|
var diffs = diff_1(yxml.toString(), dom.nodeValue);
|
||||||
}
|
var pos = 0;
|
||||||
switch (mutation.type) {
|
for (var i = 0; i < diffs.length; i++) {
|
||||||
case 'characterData':
|
var d = diffs[i];
|
||||||
var diffs = diff_1(yxml.toString(), dom.nodeValue);
|
if (d[0] === 0) { // EQUAL
|
||||||
var pos = 0;
|
pos += d[1].length;
|
||||||
for (var i = 0; i < diffs.length; i++) {
|
} else if (d[0] === -1) { // DELETE
|
||||||
var d = diffs[i];
|
yxml.delete(pos, d[1].length);
|
||||||
if (d[0] === 0) { // EQUAL
|
} else { // INSERT
|
||||||
pos += d[1].length;
|
yxml.insert(pos, d[1]);
|
||||||
} else if (d[0] === -1) { // DELETE
|
pos += d[1].length;
|
||||||
yxml.delete(pos, d[1].length);
|
}
|
||||||
} else { // INSERT
|
}
|
||||||
yxml.insert(pos, d[1]);
|
break
|
||||||
pos += d[1].length;
|
case 'attributes':
|
||||||
|
let name = mutation.attributeName;
|
||||||
|
// check if filter accepts attribute
|
||||||
|
if (this._domFilter(dom, [name]).length > 0 && this.constructor !== YXmlFragment) {
|
||||||
|
var val = dom.getAttribute(name);
|
||||||
|
if (yxml.getAttribute(name) !== val) {
|
||||||
|
if (val == null) {
|
||||||
|
yxml.removeAttribute(name);
|
||||||
|
} else {
|
||||||
|
yxml.setAttribute(name, val);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
break
|
}
|
||||||
case 'attributes':
|
break
|
||||||
if (yxml.constructor === YXmlFragment) {
|
case 'childList':
|
||||||
break
|
diffChildren.add(mutation.target);
|
||||||
}
|
break
|
||||||
let name = mutation.attributeName;
|
|
||||||
let val = dom.getAttribute(name);
|
|
||||||
// check if filter accepts attribute
|
|
||||||
let attributes = new Map();
|
|
||||||
attributes.set(name, val);
|
|
||||||
if (this._domFilter(dom.nodeName, attributes).size > 0 && yxml.constructor !== YXmlFragment) {
|
|
||||||
if (yxml.getAttribute(name) !== val) {
|
|
||||||
if (val == null) {
|
|
||||||
yxml.removeAttribute(name);
|
|
||||||
} else {
|
|
||||||
yxml.setAttribute(name, val);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break
|
|
||||||
case 'childList':
|
|
||||||
diffChildren.add(mutation.target);
|
|
||||||
break
|
|
||||||
}
|
|
||||||
});
|
|
||||||
for (let dom of diffChildren) {
|
|
||||||
if (dom._yxml != null && dom._yxml !== false) {
|
|
||||||
applyChangesFromDom(dom);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
for (let dom of diffChildren) {
|
||||||
|
if (dom._yxml != null && dom._yxml !== false) {
|
||||||
|
applyChangesFromDom(dom);
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
};
|
|
||||||
this._domObserver = new MutationObserver(this._domObserverListener);
|
|
||||||
this._domObserver.observe(dom, {
|
|
||||||
childList: true,
|
|
||||||
attributes: true,
|
|
||||||
characterData: true,
|
|
||||||
subtree: true
|
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
this._domObserver = new MutationObserver(this._domObserverListener);
|
||||||
|
this._domObserver.observe(dom, {
|
||||||
|
childList: true,
|
||||||
|
attributes: true,
|
||||||
|
characterData: true,
|
||||||
|
subtree: true
|
||||||
|
});
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
_logString () {
|
_logString () {
|
||||||
@@ -4090,7 +4042,7 @@ class YXmlFragment extends YArray {
|
|||||||
|
|
||||||
// import diff from 'fast-diff'
|
// import diff from 'fast-diff'
|
||||||
class YXmlElement extends YXmlFragment {
|
class YXmlElement extends YXmlFragment {
|
||||||
constructor (arg1, arg2, _document) {
|
constructor (arg1, arg2) {
|
||||||
super();
|
super();
|
||||||
this.nodeName = null;
|
this.nodeName = null;
|
||||||
this._scrollElement = null;
|
this._scrollElement = null;
|
||||||
@@ -4098,7 +4050,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
this.nodeName = arg1.toUpperCase();
|
this.nodeName = arg1.toUpperCase();
|
||||||
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
} else if (arg1 != null && arg1.nodeType != null && arg1.nodeType === arg1.ELEMENT_NODE) {
|
||||||
this.nodeName = arg1.nodeName;
|
this.nodeName = arg1.nodeName;
|
||||||
this._setDom(arg1, _document);
|
this._setDom(arg1);
|
||||||
} else {
|
} else {
|
||||||
this.nodeName = 'UNDEFINED';
|
this.nodeName = 'UNDEFINED';
|
||||||
}
|
}
|
||||||
@@ -4111,25 +4063,28 @@ class YXmlElement extends YXmlFragment {
|
|||||||
struct.nodeName = this.nodeName;
|
struct.nodeName = this.nodeName;
|
||||||
return struct
|
return struct
|
||||||
}
|
}
|
||||||
_setDom (dom, _document) {
|
_setDom (dom) {
|
||||||
if (this._dom != null) {
|
if (this._dom != null) {
|
||||||
throw new Error('Only call this method if you know what you are doing ;)')
|
throw new Error('Only call this method if you know what you are doing ;)')
|
||||||
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
} else if (dom._yxml != null) { // TODO do i need to check this? - no.. but for dev purps..
|
||||||
throw new Error('Already bound to an YXml type')
|
throw new Error('Already bound to an YXml type')
|
||||||
} else {
|
} else {
|
||||||
|
this._dom = dom;
|
||||||
|
dom._yxml = this;
|
||||||
// tag is already set in constructor
|
// tag is already set in constructor
|
||||||
// set attributes
|
// set attributes
|
||||||
let attributes = new Map();
|
let attrNames = [];
|
||||||
for (let i = 0; i < dom.attributes.length; i++) {
|
for (let i = 0; i < dom.attributes.length; i++) {
|
||||||
let attr = dom.attributes[i];
|
attrNames.push(dom.attributes[i].name);
|
||||||
attributes.set(attr.name, attr.value);
|
|
||||||
}
|
}
|
||||||
attributes = this._domFilter(dom, attributes);
|
attrNames = this._domFilter(dom, attrNames);
|
||||||
attributes.forEach((value, name) => {
|
for (let i = 0; i < attrNames.length; i++) {
|
||||||
this.setAttribute(name, value);
|
let attrName = attrNames[i];
|
||||||
});
|
let attrValue = dom.getAttribute(attrName);
|
||||||
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes), _document);
|
this.setAttribute(attrName, attrValue);
|
||||||
this._bindToDom(dom, _document);
|
}
|
||||||
|
this.insertDomElements(0, Array.prototype.slice.call(dom.childNodes));
|
||||||
|
this._bindToDom(dom);
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -4188,9 +4143,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
getAttributes () {
|
getAttributes () {
|
||||||
const obj = {};
|
const obj = {};
|
||||||
for (let [key, value] of this._map) {
|
for (let [key, value] of this._map) {
|
||||||
if (!value._deleted) {
|
obj[key] = value._content[0];
|
||||||
obj[key] = value._content[0];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return obj
|
return obj
|
||||||
}
|
}
|
||||||
@@ -4199,6 +4152,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
let dom = this._dom;
|
let dom = this._dom;
|
||||||
if (dom == null) {
|
if (dom == null) {
|
||||||
dom = _document.createElement(this.nodeName);
|
dom = _document.createElement(this.nodeName);
|
||||||
|
this._dom = dom;
|
||||||
dom._yxml = this;
|
dom._yxml = this;
|
||||||
let attrs = this.getAttributes();
|
let attrs = this.getAttributes();
|
||||||
for (let key in attrs) {
|
for (let key in attrs) {
|
||||||
@@ -4207,7 +4161,7 @@ class YXmlElement extends YXmlFragment {
|
|||||||
this.forEach(yxml => {
|
this.forEach(yxml => {
|
||||||
dom.appendChild(yxml.getDom(_document));
|
dom.appendChild(yxml.getDom(_document));
|
||||||
});
|
});
|
||||||
this._bindToDom(dom, _document);
|
this._bindToDom(dom);
|
||||||
}
|
}
|
||||||
return dom
|
return dom
|
||||||
}
|
}
|
||||||
@@ -4448,16 +4402,16 @@ class NamedEventHandler {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class ReverseOperation {
|
class ReverseOperation {
|
||||||
constructor (y, transaction) {
|
constructor (y) {
|
||||||
this.created = new Date();
|
this.created = new Date();
|
||||||
const beforeState = transaction.beforeState;
|
const beforeState = y._transaction.beforeState;
|
||||||
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1);
|
this.toState = new ID(y.userID, y.ss.getState(y.userID) - 1);
|
||||||
if (beforeState.has(y.userID)) {
|
if (beforeState.has(y.userID)) {
|
||||||
this.fromState = new ID(y.userID, beforeState.get(y.userID));
|
this.fromState = new ID(y.userID, beforeState.get(y.userID));
|
||||||
} else {
|
} else {
|
||||||
this.fromState = this.toState;
|
this.fromState = this.toState;
|
||||||
}
|
}
|
||||||
this.deletedStructs = transaction.deletedStructs;
|
this.deletedStructs = y._transaction.deletedStructs;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -4517,9 +4471,9 @@ class UndoManager {
|
|||||||
this._redoing = false;
|
this._redoing = false;
|
||||||
const y = scope._y;
|
const y = scope._y;
|
||||||
this.y = y;
|
this.y = y;
|
||||||
y.on('afterTransaction', (y, transaction, remote) => {
|
y.on('afterTransaction', (y, remote) => {
|
||||||
if (!remote && transaction.changedParentTypes.has(scope)) {
|
if (!remote && y._transaction.changedParentTypes.has(scope)) {
|
||||||
let reverseOperation = new ReverseOperation(y, transaction);
|
let reverseOperation = new ReverseOperation(y);
|
||||||
if (!this._undoing) {
|
if (!this._undoing) {
|
||||||
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null;
|
let lastUndoOp = this._undoBuffer.length > 0 ? this._undoBuffer[this._undoBuffer.length - 1] : null;
|
||||||
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
if (lastUndoOp !== null && reverseOperation.created - lastUndoOp.created <= options.captureTimeout) {
|
||||||
@@ -5475,8 +5429,8 @@ class Y$2 extends NamedEventHandler {
|
|||||||
transact (f, remote = false) {
|
transact (f, remote = false) {
|
||||||
let initialCall = this._transaction === null;
|
let initialCall = this._transaction === null;
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
|
this.emit('beforeTransaction', this, remote);
|
||||||
this._transaction = new Transaction(this);
|
this._transaction = new Transaction(this);
|
||||||
this.emit('beforeTransaction', this, this._transaction, remote);
|
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
f(this);
|
f(this);
|
||||||
@@ -5484,16 +5438,13 @@ class Y$2 extends NamedEventHandler {
|
|||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
this.emit('beforeObserverCalls', this, this._transaction, remote);
|
|
||||||
const transaction = this._transaction;
|
|
||||||
this._transaction = null;
|
|
||||||
// emit change events on changed types
|
// emit change events on changed types
|
||||||
transaction.changedTypes.forEach(function (subs, type) {
|
this._transaction.changedTypes.forEach(function (subs, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
type._callObserver(transaction, subs, remote);
|
type._callObserver(subs, remote);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
transaction.changedParentTypes.forEach(function (events, type) {
|
this._transaction.changedParentTypes.forEach(function (events, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
events = events
|
events = events
|
||||||
.filter(event =>
|
.filter(event =>
|
||||||
@@ -5505,11 +5456,12 @@ class Y$2 extends NamedEventHandler {
|
|||||||
});
|
});
|
||||||
// we don't have to check for events.length
|
// we don't have to check for events.length
|
||||||
// because there is no way events is empty..
|
// because there is no way events is empty..
|
||||||
type._deepEventHandler.callEventListeners(transaction, events);
|
type._deepEventHandler.callEventListeners(events);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// when all changes & events are processed, emit afterTransaction event
|
// when all changes & events are processed, emit afterTransaction event
|
||||||
this.emit('afterTransaction', this, transaction, remote);
|
this.emit('afterTransaction', this, remote);
|
||||||
|
this._transaction = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// fake _start for root properties (y.set('name', type))
|
// fake _start for root properties (y.set('name', type))
|
||||||
@@ -5525,10 +5477,17 @@ class Y$2 extends NamedEventHandler {
|
|||||||
define (name, TypeConstructor) {
|
define (name, TypeConstructor) {
|
||||||
let id = new RootID(name, TypeConstructor);
|
let id = new RootID(name, TypeConstructor);
|
||||||
let type = this.os.get(id);
|
let type = this.os.get(id);
|
||||||
|
if (type === null) {
|
||||||
|
type = new TypeConstructor();
|
||||||
|
type._id = id;
|
||||||
|
type._parent = this;
|
||||||
|
type._integrate(this);
|
||||||
|
if (this.share[name] !== undefined) {
|
||||||
|
throw new Error('Type is already defined with a different constructor!')
|
||||||
|
}
|
||||||
|
}
|
||||||
if (this.share[name] === undefined) {
|
if (this.share[name] === undefined) {
|
||||||
this.share[name] = type;
|
this.share[name] = type;
|
||||||
} else if (this.share[name] !== type) {
|
|
||||||
throw new Error('Type is already defined with a different constructor')
|
|
||||||
}
|
}
|
||||||
return type
|
return type
|
||||||
}
|
}
|
||||||
@@ -5594,9 +5553,7 @@ Y$2.XmlText = YXmlText;
|
|||||||
|
|
||||||
Y$2.utils = {
|
Y$2.utils = {
|
||||||
BinaryDecoder,
|
BinaryDecoder,
|
||||||
UndoManager,
|
UndoManager
|
||||||
getRelativePosition,
|
|
||||||
fromRelativePosition
|
|
||||||
};
|
};
|
||||||
|
|
||||||
Y$2.debug = browser;
|
Y$2.debug = browser;
|
||||||
@@ -13122,6 +13079,19 @@ var chance_1 = createCommonjsModule(function (module, exports) {
|
|||||||
|
|
||||||
var chance_2 = chance_1.Chance;
|
var chance_2 = chance_1.Chance;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Try to merge all items in os with their successors.
|
||||||
|
*
|
||||||
|
* Some transformations (like delete) fragment items.
|
||||||
|
* Item(c: 'ab') + Delete(1,1) + Delete(0, 1) -> Item(c: 'a',deleted);Item(c: 'b',deleted)
|
||||||
|
*
|
||||||
|
* This functions merges the fragmented nodes together:
|
||||||
|
* Item(c: 'a',deleted);Item(c: 'b',deleted) -> Item(c: 'ab', deleted)
|
||||||
|
*
|
||||||
|
* TODO: The Tree implementation does not support deletions in-spot.
|
||||||
|
* This is why all deletions must be performed after the traversal.
|
||||||
|
*
|
||||||
|
*/
|
||||||
function defragmentItemContent (y) {
|
function defragmentItemContent (y) {
|
||||||
const os = y.os;
|
const os = y.os;
|
||||||
if (os.length < 2) {
|
if (os.length < 2) {
|
||||||
@@ -13279,12 +13249,12 @@ async function initArrays (t, opts) {
|
|||||||
result['array' + i] = y.define('array', Y$1.Array);
|
result['array' + i] = y.define('array', Y$1.Array);
|
||||||
result['map' + i] = y.define('map', Y$1.Map);
|
result['map' + i] = y.define('map', Y$1.Map);
|
||||||
result['xml' + i] = y.define('xml', Y$1.XmlElement);
|
result['xml' + i] = y.define('xml', Y$1.XmlElement);
|
||||||
y.get('xml').setDomFilter(function (nodeName, attrs) {
|
y.get('xml', Y$1.Xml).setDomFilter(function (d, attrs) {
|
||||||
if (nodeName === 'HIDDEN') {
|
if (d.nodeName === 'HIDDEN') {
|
||||||
return null
|
return null
|
||||||
|
} else {
|
||||||
|
return attrs.filter(a => a !== 'hidden')
|
||||||
}
|
}
|
||||||
attrs.delete('hidden');
|
|
||||||
return attrs
|
|
||||||
});
|
});
|
||||||
y.on('afterTransaction', function () {
|
y.on('afterTransaction', function () {
|
||||||
for (let missing of y._missingStructs.values()) {
|
for (let missing of y._missingStructs.values()) {
|
||||||
@@ -18944,9 +18914,6 @@ function test (testDescription, ...args) {
|
|||||||
testHandler.register(testCase);
|
testHandler.register(testCase);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//# sourceMappingURL=cutest.mjs.map
|
|
||||||
|
|
||||||
test('set property', async function xml0 (t) {
|
test('set property', async function xml0 (t) {
|
||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 2 });
|
var { users, xml0, xml1 } = await initArrays(t, { users: 2 });
|
||||||
xml0.setAttribute('height', 10);
|
xml0.setAttribute('height', 10);
|
||||||
@@ -19176,8 +19143,8 @@ test('filter node', async function xml14 (t) {
|
|||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 });
|
var { users, xml0, xml1 } = await initArrays(t, { users: 3 });
|
||||||
let dom0 = xml0.getDom();
|
let dom0 = xml0.getDom();
|
||||||
let dom1 = xml1.getDom();
|
let dom1 = xml1.getDom();
|
||||||
let domFilter = (nodeName, attrs) => {
|
let domFilter = (node, attrs) => {
|
||||||
if (nodeName === 'H1') {
|
if (node.nodeName === 'H1') {
|
||||||
return null
|
return null
|
||||||
} else {
|
} else {
|
||||||
return attrs
|
return attrs
|
||||||
@@ -19197,9 +19164,8 @@ test('filter attribute', async function xml15 (t) {
|
|||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 });
|
var { users, xml0, xml1 } = await initArrays(t, { users: 3 });
|
||||||
let dom0 = xml0.getDom();
|
let dom0 = xml0.getDom();
|
||||||
let dom1 = xml1.getDom();
|
let dom1 = xml1.getDom();
|
||||||
let domFilter = (nodeName, attrs) => {
|
let domFilter = (node, attrs) => {
|
||||||
attrs.delete('hidden');
|
return attrs.filter(name => name !== 'hidden')
|
||||||
return attrs
|
|
||||||
};
|
};
|
||||||
xml0.setDomFilter(domFilter);
|
xml0.setDomFilter(domFilter);
|
||||||
xml1.setDomFilter(domFilter);
|
xml1.setDomFilter(domFilter);
|
||||||
@@ -19250,51 +19216,6 @@ test('treeWalker', async function xml17 (t) {
|
|||||||
await compareUsers(t, users);
|
await compareUsers(t, users);
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
|
||||||
* The expected behavior is that changes on your own dom (e.g. malicious attributes) persist.
|
|
||||||
* Yjs should just ignore them, never propagate those attributes.
|
|
||||||
* Incoming changes that contain malicious attributes should be deleted.
|
|
||||||
*/
|
|
||||||
test('Filtering remote changes', async function xmlFilteringRemote (t) {
|
|
||||||
var { users, xml0, xml1 } = await initArrays(t, { users: 3 });
|
|
||||||
xml0.setDomFilter(function (nodeName, attributes) {
|
|
||||||
attributes.delete('malicious');
|
|
||||||
if (nodeName === 'HIDEME') {
|
|
||||||
return null
|
|
||||||
} else if (attributes.has('isHidden')) {
|
|
||||||
return null
|
|
||||||
} else {
|
|
||||||
return attributes
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// make sure that dom filters are active
|
|
||||||
// TODO: do not rely on .getDom for domFilters
|
|
||||||
xml0.getDom();
|
|
||||||
xml1.getDom();
|
|
||||||
let paragraph = new Y$1.XmlElement('p');
|
|
||||||
let hideMe = new Y$1.XmlElement('hideMe');
|
|
||||||
let span = new Y$1.XmlElement('span');
|
|
||||||
span.setAttribute('malicious', 'alert("give me money")');
|
|
||||||
let tag = new Y$1.XmlElement('tag');
|
|
||||||
tag.setAttribute('isHidden', 'true');
|
|
||||||
paragraph.insert(0, [hideMe, span, tag]);
|
|
||||||
xml0.insert(0, [paragraph]);
|
|
||||||
let tag2 = new Y$1.XmlElement('tag');
|
|
||||||
tag2.setAttribute('isHidden', 'true');
|
|
||||||
paragraph.insert(0, [tag2]);
|
|
||||||
await flushAll(t, users);
|
|
||||||
// check dom
|
|
||||||
paragraph.getDom().setAttribute('malicious', 'true');
|
|
||||||
span.getDom().setAttribute('malicious', 'true');
|
|
||||||
console.log(xml0.toString());
|
|
||||||
// check incoming attributes
|
|
||||||
xml1.get(0).get(0).setAttribute('malicious', 'true');
|
|
||||||
xml1.insert(0, [new Y$1.XmlElement('hideMe')]);
|
|
||||||
await flushAll(t, users);
|
|
||||||
|
|
||||||
await compareUsers(t, users);
|
|
||||||
});
|
|
||||||
|
|
||||||
// TODO: move elements
|
// TODO: move elements
|
||||||
var xmlTransactions = [
|
var xmlTransactions = [
|
||||||
function attributeChange (t, user, chance) {
|
function attributeChange (t, user, chance) {
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user