fix the case that a new transaction starts in an event listener (afterTransaction, observe, observeDeep)
This commit is contained in:
parent
415b66607c
commit
3d5ba7b4cc
@ -1,4 +1,15 @@
|
|||||||
/* global Y */
|
/* global Y, HTMLElement, customElements */
|
||||||
|
|
||||||
|
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({
|
||||||
@ -17,17 +28,14 @@ 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: 0
|
captureTimeout: 500
|
||||||
})
|
})
|
||||||
|
|
||||||
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()
|
||||||
|
@ -5,9 +5,13 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
var pkg = require('./package.json')
|
var pkg = require('./package.json')
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
entry: 'src/Y.js',
|
input: 'src/Y.js',
|
||||||
moduleName: 'Y',
|
name: 'Y',
|
||||||
format: 'umd',
|
sourcemap: true,
|
||||||
|
output: {
|
||||||
|
file: 'y.js',
|
||||||
|
format: 'umd'
|
||||||
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@ -32,8 +36,6 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
dest: 'y.js',
|
|
||||||
sourceMap: true,
|
|
||||||
banner: `
|
banner: `
|
||||||
/**
|
/**
|
||||||
* ${pkg.name} - ${pkg.description}
|
* ${pkg.name} - ${pkg.description}
|
||||||
|
@ -3,9 +3,13 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
var pkg = require('./package.json')
|
var pkg = require('./package.json')
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
entry: 'src/y-dist.cjs.js',
|
input: 'src/y-dist.cjs.js',
|
||||||
moduleName: 'Y',
|
nameame: 'Y',
|
||||||
format: 'cjs',
|
sourcemap: true,
|
||||||
|
output: {
|
||||||
|
file: 'y.node.js',
|
||||||
|
format: 'cjs'
|
||||||
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@ -14,8 +18,6 @@ export default {
|
|||||||
}),
|
}),
|
||||||
commonjs()
|
commonjs()
|
||||||
],
|
],
|
||||||
dest: 'y.node.js',
|
|
||||||
sourceMap: true,
|
|
||||||
banner: `
|
banner: `
|
||||||
/**
|
/**
|
||||||
* ${pkg.name} - ${pkg.description}
|
* ${pkg.name} - ${pkg.description}
|
||||||
|
@ -3,9 +3,13 @@ import commonjs from 'rollup-plugin-commonjs'
|
|||||||
import multiEntry from 'rollup-plugin-multi-entry'
|
import multiEntry from 'rollup-plugin-multi-entry'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
entry: 'test/y-xml.tests.js',
|
input: 'test/y-xml.tests.js',
|
||||||
moduleName: 'y-tests',
|
name: 'y-tests',
|
||||||
format: 'umd',
|
sourcemap: true,
|
||||||
|
output: {
|
||||||
|
file: 'y.test.js',
|
||||||
|
format: 'umd'
|
||||||
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
nodeResolve({
|
nodeResolve({
|
||||||
main: true,
|
main: true,
|
||||||
@ -14,7 +18,5 @@ 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 (event) {
|
_callEventHandler (transaction, event) {
|
||||||
const changedParentTypes = this._y._transaction.changedParentTypes
|
const changedParentTypes = transaction.changedParentTypes
|
||||||
this._eventHandler.callEventListeners(event)
|
this._eventHandler.callEventListeners(transaction, 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 (parentSubs, remote) {
|
_callObserver (transaction, parentSubs, remote) {
|
||||||
this._callEventHandler(new YArrayEvent(this, remote))
|
this._callEventHandler(transaction, 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 (parentSubs, remote) {
|
_callObserver (transaction, parentSubs, remote) {
|
||||||
this._callEventHandler(new YMapEvent(this, parentSubs, remote))
|
this._callEventHandler(transaction, new YMapEvent(this, parentSubs, remote))
|
||||||
}
|
}
|
||||||
toJSON () {
|
toJSON () {
|
||||||
const map = {}
|
const map = {}
|
||||||
|
@ -142,8 +142,8 @@ export default class YXmlFragment extends YArray {
|
|||||||
xml.setDomFilter(f)
|
xml.setDomFilter(f)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
_callObserver (parentSubs, remote) {
|
_callObserver (transaction, parentSubs, remote) {
|
||||||
this._callEventHandler(new YXmlEvent(this, parentSubs, remote))
|
this._callEventHandler(transaction, new YXmlEvent(this, parentSubs, remote))
|
||||||
}
|
}
|
||||||
toString () {
|
toString () {
|
||||||
return this.map(xml => xml.toString()).join('')
|
return this.map(xml => xml.toString()).join('')
|
||||||
|
@ -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, remote) {
|
beforeTransactionSelectionFixer = function _beforeTransactionSelectionFixer (y, transaction, 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, remote) {
|
export function afterTransactionSelectionFixer (y, transaction, remote) {
|
||||||
if (relativeSelection === null || !remote) {
|
if (relativeSelection === null || !remote) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -138,8 +138,13 @@ export function applyChangesFromDom (dom) {
|
|||||||
export function reflectChangesOnDom (events) {
|
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) {
|
||||||
|
// event.target is Y.XmlText
|
||||||
|
return
|
||||||
|
}
|
||||||
const keys = this._domFilter(target.nodeName, Array.from(event.attributesChanged))
|
const keys = this._domFilter(target.nodeName, Array.from(event.attributesChanged))
|
||||||
if (keys === null) {
|
if (keys === null) {
|
||||||
target._delete()
|
target._delete()
|
||||||
@ -156,6 +161,7 @@ export function reflectChangesOnDom (events) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
*/
|
||||||
this._mutualExclude(() => {
|
this._mutualExclude(() => {
|
||||||
events.forEach(event => {
|
events.forEach(event => {
|
||||||
const yxml = event.target
|
const yxml = event.target
|
||||||
|
@ -17,7 +17,7 @@ export default class EventHandler {
|
|||||||
removeAllEventListeners () {
|
removeAllEventListeners () {
|
||||||
this.eventListeners = []
|
this.eventListeners = []
|
||||||
}
|
}
|
||||||
callEventListeners (event) {
|
callEventListeners (transaction, 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) {
|
constructor (y, transaction) {
|
||||||
this.created = new Date()
|
this.created = new Date()
|
||||||
const beforeState = y._transaction.beforeState
|
const beforeState = 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 = y._transaction.deletedStructs
|
this.deletedStructs = 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, remote) => {
|
y.on('afterTransaction', (y, transaction, remote) => {
|
||||||
if (!remote && y._transaction.changedParentTypes.has(scope)) {
|
if (!remote && transaction.changedParentTypes.has(scope)) {
|
||||||
let reverseOperation = new ReverseOperation(y)
|
let reverseOperation = new ReverseOperation(y, transaction)
|
||||||
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) {
|
||||||
|
20
src/Y.js
20
src/Y.js
@ -15,6 +15,7 @@ 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'
|
||||||
@ -44,8 +45,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)
|
||||||
@ -53,13 +54,15 @@ export default class Y extends NamedEventHandler {
|
|||||||
console.error(e)
|
console.error(e)
|
||||||
}
|
}
|
||||||
if (initialCall) {
|
if (initialCall) {
|
||||||
|
const transaction = this._transaction
|
||||||
|
this._transaction = null
|
||||||
// emit change events on changed types
|
// emit change events on changed types
|
||||||
this._transaction.changedTypes.forEach(function (subs, type) {
|
transaction.changedTypes.forEach(function (subs, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
type._callObserver(subs, remote)
|
type._callObserver(transaction, subs, remote)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
this._transaction.changedParentTypes.forEach(function (events, type) {
|
transaction.changedParentTypes.forEach(function (events, type) {
|
||||||
if (!type._deleted) {
|
if (!type._deleted) {
|
||||||
events = events
|
events = events
|
||||||
.filter(event =>
|
.filter(event =>
|
||||||
@ -71,12 +74,11 @@ 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(events)
|
type._deepEventHandler.callEventListeners(transaction, events)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// when all changes & events are processed, emit afterTransaction event
|
// when all changes & events are processed, emit afterTransaction event
|
||||||
this.emit('afterTransaction', this, remote)
|
this.emit('afterTransaction', this, transaction, remote)
|
||||||
this._transaction = null
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// fake _start for root properties (y.set('name', type))
|
// fake _start for root properties (y.set('name', type))
|
||||||
@ -168,7 +170,9 @@ Y.XmlText = YXmlText
|
|||||||
|
|
||||||
Y.utils = {
|
Y.utils = {
|
||||||
BinaryDecoder,
|
BinaryDecoder,
|
||||||
UndoManager
|
UndoManager,
|
||||||
|
getRelativePosition,
|
||||||
|
fromRelativePosition
|
||||||
}
|
}
|
||||||
|
|
||||||
Y.debug = debug
|
Y.debug = debug
|
||||||
|
Loading…
x
Reference in New Issue
Block a user