Revert "zoom to affected shapes after undo/redo" (#2310)
Reverts tldraw/tldraw#2293
This commit is contained in:
parent
f7ae99dd1f
commit
be93cc0eb6
8 changed files with 8 additions and 123 deletions
2
.github/workflows/checks.yml
vendored
2
.github/workflows/checks.yml
vendored
|
@ -27,7 +27,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
|
@ -54,7 +54,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
2
.github/workflows/playwright.yml
vendored
2
.github/workflows/playwright.yml
vendored
|
@ -27,7 +27,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
2
.github/workflows/publish-canary.yml
vendored
2
.github/workflows/publish-canary.yml
vendored
|
@ -20,7 +20,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
2
.github/workflows/publish-manual.yml
vendored
2
.github/workflows/publish-manual.yml
vendored
|
@ -19,7 +19,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
2
.github/workflows/publish-new.yml
vendored
2
.github/workflows/publish-new.yml
vendored
|
@ -31,7 +31,7 @@ jobs:
|
|||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
node-version: 18.18.2
|
||||
cache: 'yarn'
|
||||
cache-dependency-path: 'public-yarn.lock'
|
||||
|
||||
|
|
|
@ -99,7 +99,6 @@ import {
|
|||
sortByIndex,
|
||||
} from '../utils/reordering/reordering'
|
||||
import { applyRotationToSnapshotShapes, getRotationSnapshot } from '../utils/rotation'
|
||||
import { uniq } from '../utils/uniq'
|
||||
import { uniqueId } from '../utils/uniqueId'
|
||||
import { arrowBindingsIndex } from './derivations/arrowBindingsIndex'
|
||||
import { parentsToChildren } from './derivations/parentsToChildren'
|
||||
|
@ -782,29 +781,6 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|||
}
|
||||
)
|
||||
|
||||
private _ensureAffectedShapesAreMadeVisible(fn: () => void) {
|
||||
// here we collect all the ids of shapes that are created or updated by the function
|
||||
// along with the selectedIds of the current page
|
||||
// then we attempt to make sure that they are all visible in the viewport after
|
||||
// the function is run.
|
||||
const changes = this.store.extractingChanges(fn)
|
||||
const affectedRecordIds = uniq(
|
||||
Object.keys(changes.added)
|
||||
.concat(Object.keys(changes.updated))
|
||||
.concat(this.getSelectedShapeIds())
|
||||
)
|
||||
const shapes = compact(
|
||||
affectedRecordIds.map((id) => (isShapeId(id) ? this.getShape(id) : null))
|
||||
)
|
||||
if (!shapes.length) return this
|
||||
const bounds = Box2d.Common(compact(shapes.map((shape) => this.getShapePageBounds(shape))))
|
||||
const viewport = this.getViewportPageBounds()
|
||||
if (!viewport.contains(bounds)) {
|
||||
this.zoomToBounds(bounds, this.getCamera().z, { duration: 220 })
|
||||
}
|
||||
return this
|
||||
}
|
||||
|
||||
/**
|
||||
* Undo to the last mark.
|
||||
*
|
||||
|
@ -816,9 +792,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|||
* @public
|
||||
*/
|
||||
undo(): this {
|
||||
this._ensureAffectedShapesAreMadeVisible(() => {
|
||||
this.history.undo()
|
||||
})
|
||||
this.history.undo()
|
||||
return this
|
||||
}
|
||||
|
||||
|
@ -851,9 +825,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|||
* @public
|
||||
*/
|
||||
redo(): this {
|
||||
this._ensureAffectedShapesAreMadeVisible(() => {
|
||||
this.history.redo()
|
||||
})
|
||||
this.history.redo()
|
||||
return this
|
||||
}
|
||||
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
import {
|
||||
AssetRecordType,
|
||||
BaseBoxShapeUtil,
|
||||
Box2d,
|
||||
PageRecordType,
|
||||
TLShape,
|
||||
createShapeId,
|
||||
|
@ -646,89 +645,3 @@ describe('when the user prefers light UI', () => {
|
|||
expect(editor.user.getIsDarkMode()).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('undo and redo', () => {
|
||||
test('cause the camera to move if the affected shapes are offscreen', () => {
|
||||
editor = new TestEditor({})
|
||||
editor.setScreenBounds(new Box2d(0, 0, 1000, 1000))
|
||||
editor.user.updateUserPreferences({ animationSpeed: 0 })
|
||||
|
||||
const boxId = createShapeId('box')
|
||||
editor.createShapes([{ id: boxId, type: 'geo', x: 100, y: 100, props: { w: 100, h: 100 } }])
|
||||
editor.panZoomIntoView([boxId])
|
||||
editor.mark()
|
||||
const cameraBefore = editor.getCamera()
|
||||
|
||||
editor.updateShapes([
|
||||
{
|
||||
id: boxId,
|
||||
type: 'geo',
|
||||
x: 100,
|
||||
y: 100,
|
||||
props: {
|
||||
geo: 'cloud',
|
||||
w: 100,
|
||||
h: 100,
|
||||
},
|
||||
},
|
||||
])
|
||||
|
||||
expect(editor.getCamera()).toMatchInlineSnapshot(`
|
||||
Object {
|
||||
"id": "camera:page:page",
|
||||
"meta": Object {},
|
||||
"typeName": "camera",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 1,
|
||||
}
|
||||
`)
|
||||
|
||||
editor.undo()
|
||||
expect(editor.getCamera()).toEqual(cameraBefore)
|
||||
|
||||
editor.updateShapes([
|
||||
{
|
||||
id: boxId,
|
||||
type: 'geo',
|
||||
x: -500,
|
||||
y: -500,
|
||||
},
|
||||
])
|
||||
editor.mark()
|
||||
editor.updateShapes([
|
||||
{
|
||||
id: boxId,
|
||||
type: 'geo',
|
||||
x: 500,
|
||||
y: 500,
|
||||
},
|
||||
])
|
||||
editor.undo()
|
||||
|
||||
expect(editor.getCamera()).not.toEqual(cameraBefore)
|
||||
expect(editor.getCamera()).toMatchInlineSnapshot(`
|
||||
Object {
|
||||
"id": "camera:page:page",
|
||||
"meta": Object {},
|
||||
"typeName": "camera",
|
||||
"x": 950,
|
||||
"y": 950,
|
||||
"z": 1,
|
||||
}
|
||||
`)
|
||||
|
||||
editor.redo()
|
||||
|
||||
expect(editor.getCamera()).toMatchInlineSnapshot(`
|
||||
Object {
|
||||
"id": "camera:page:page",
|
||||
"meta": Object {},
|
||||
"typeName": "camera",
|
||||
"x": -50,
|
||||
"y": -50,
|
||||
"z": 1,
|
||||
}
|
||||
`)
|
||||
})
|
||||
})
|
||||
|
|
Loading…
Reference in a new issue