From 3b1d6910aae71481b4ff7ab359b3221594b3929b Mon Sep 17 00:00:00 2001 From: Daishi Kato Date: Sat, 9 May 2020 17:57:00 +0900 Subject: [PATCH] fix resizing: dynamic pointer offset for better UX (#1560) --- src/components/App.tsx | 38 +- src/element/index.ts | 6 +- src/element/resizeElements.ts | 153 ++-- .../regressionTests.test.tsx.snap | 676 +++++++++--------- 4 files changed, 455 insertions(+), 418 deletions(-) diff --git a/src/components/App.tsx b/src/components/App.tsx index 584e5c1e2..8e42fe1a5 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -24,6 +24,7 @@ import { resizeElements, getElementWithResizeHandler, canResizeMutlipleElements, + getResizeOffsetXY, getResizeHandlerFromCoords, isNonDeletedElement, } from "../element"; @@ -1845,6 +1846,7 @@ class App extends React.Component { const setResizeHandle = (nextResizeHandle: ResizeTestType) => { resizeHandle = nextResizeHandle; }; + let resizeOffsetXY: [number, number] = [0, 0]; let isResizingElements = false; let draggingOccurred = false; let hitElement: ExcalidrawElement | null = null; @@ -1891,6 +1893,14 @@ class App extends React.Component { } } } + if (isResizingElements) { + resizeOffsetXY = getResizeOffsetXY( + resizeHandle, + selectedElements, + x, + y, + ); + } if (!isResizingElements) { hitElement = getElementAtPosition( elements, @@ -2123,25 +2133,34 @@ class App extends React.Component { } } - const resized = - isResizingElements && - resizeElements( + if (isResizingElements) { + const selectedElements = getSelectedElements( + globalSceneState.getElements(), + this.state, + ); + this.setState({ + isResizing: resizeHandle && resizeHandle !== "rotation", + isRotating: resizeHandle === "rotation", + }); + const resized = resizeElements( resizeHandle, setResizeHandle, - this.state, - this.setAppState, + selectedElements, resizeArrowFn, setResizeArrowFn, event, x, y, + resizeOffsetXY[0], + resizeOffsetXY[1], lastX, lastY, ); - if (resized) { - lastX = x; - lastY = y; - return; + if (resized) { + lastX = x; + lastY = y; + return; + } } if (hitElement && this.state.selectedElementIds[hitElement.id]) { @@ -2310,6 +2329,7 @@ class App extends React.Component { this.savePointer(childEvent.clientX, childEvent.clientY, "up"); resizeArrowFn = null; + resizeOffsetXY = [0, 0]; lastPointerUp = null; window.removeEventListener(EVENT.POINTER_MOVE, onPointerMove); diff --git a/src/element/index.ts b/src/element/index.ts index b6d4c88c2..4d639365a 100644 --- a/src/element/index.ts +++ b/src/element/index.ts @@ -32,7 +32,11 @@ export { getElementWithResizeHandler, getResizeHandlerFromCoords, } from "./resizeTest"; -export { resizeElements, canResizeMutlipleElements } from "./resizeElements"; +export { + resizeElements, + canResizeMutlipleElements, + getResizeOffsetXY, +} from "./resizeElements"; export { isTextElement, isExcalidrawElement } from "./typeChecks"; export { textWysiwyg } from "./textWysiwyg"; export { redrawTextBoundingBox } from "./textElement"; diff --git a/src/element/resizeElements.ts b/src/element/resizeElements.ts index 60ad8a159..f19ac9a4f 100644 --- a/src/element/resizeElements.ts +++ b/src/element/resizeElements.ts @@ -1,6 +1,4 @@ -import { AppState } from "../types"; import { SHIFT_LOCKING_ANGLE } from "../constants"; -import { getSelectedElements, globalSceneState } from "../scene"; import { rescalePoints } from "../points"; import { rotate, adjustXYWithRotation, getFlipAdjustment } from "../math"; @@ -33,31 +31,21 @@ type ResizeTestType = ReturnType; export const resizeElements = ( resizeHandle: ResizeTestType, setResizeHandle: (nextResizeHandle: ResizeTestType) => void, - appState: AppState, - setAppState: (obj: any) => void, + selectedElements: NonDeletedExcalidrawElement[], resizeArrowFn: ResizeArrowFnType | null, // XXX eliminate in #1339 setResizeArrowFn: (fn: ResizeArrowFnType) => void, // XXX eliminate in #1339 event: PointerEvent, // XXX we want to make it independent? - xPointer: number, - yPointer: number, + pointerX: number, + pointerY: number, + offsetX: number, + offsetY: number, lastX: number, // XXX eliminate in #1339 lastY: number, // XXX eliminate in #1339 ) => { - setAppState({ - isResizing: resizeHandle && resizeHandle !== "rotation", - isRotating: resizeHandle === "rotation", - }); - const selectedElements = getSelectedElements( - globalSceneState.getElements(), - appState, - ); - const handleOffset = 4 / appState.zoom; // XXX import constant - const dashedLinePadding = 4 / appState.zoom; // XXX import constant - const offsetPointer = handleOffset + dashedLinePadding; if (selectedElements.length === 1) { const [element] = selectedElements; if (resizeHandle === "rotation") { - rotateSingleElement(element, xPointer, yPointer, event.shiftKey); + rotateSingleElement(element, pointerX, pointerY, event.shiftKey); } else if ( isLinearElement(element) && element.points.length === 2 && @@ -72,8 +60,8 @@ export const resizeElements = ( resizeArrowFn, setResizeArrowFn, event.shiftKey, - xPointer, - yPointer, + pointerX, + pointerY, lastX, lastY, ); @@ -83,9 +71,10 @@ export const resizeElements = ( resizeHandle, getResizeWithSidesSameLengthKey(event), getResizeCenterPointKey(event), - xPointer, - yPointer, - offsetPointer, + pointerX, + pointerY, + offsetX, + offsetY, ); setResizeHandle(normalizeResizeHandle(element, resizeHandle)); if (element.width < 0) { @@ -96,18 +85,12 @@ export const resizeElements = ( } } - // XXX do we need this? + // update cursor + // FIXME it is not very nice to have this here document.documentElement.style.cursor = getCursorForResizingElement({ element, resizeHandle, }); - // XXX why do we need this? - if (appState.resizingElement) { - mutateElement(appState.resizingElement, { - x: element.x, - y: element.y, - }); - } return true; } else if ( @@ -120,9 +103,10 @@ export const resizeElements = ( resizeMultipleElements( selectedElements, resizeHandle, - xPointer, - yPointer, - offsetPointer, + pointerX, + pointerY, + offsetX, + offsetY, ); return true; } @@ -131,14 +115,14 @@ export const resizeElements = ( const rotateSingleElement = ( element: NonDeletedExcalidrawElement, - xPointer: number, - yPointer: number, + pointerX: number, + pointerY: number, isAngleLocking: boolean, ) => { const [x1, y1, x2, y2] = getElementAbsoluteCoords(element); const cx = (x1 + x2) / 2; const cy = (y1 + y2) / 2; - let angle = (5 * Math.PI) / 2 + Math.atan2(yPointer - cy, xPointer - cx); + let angle = (5 * Math.PI) / 2 + Math.atan2(pointerY - cy, pointerX - cx); if (isAngleLocking) { angle += SHIFT_LOCKING_ANGLE / 2; angle -= angle % SHIFT_LOCKING_ANGLE; @@ -155,8 +139,8 @@ const resizeSingleTwoPointElement = ( resizeArrowFn: ResizeArrowFnType | null, setResizeArrowFn: (fn: ResizeArrowFnType) => void, sidesWithSameLength: boolean, - xPointer: number, - yPointer: number, + pointerX: number, + pointerY: number, lastX: number, lastY: number, ) => { @@ -172,8 +156,8 @@ const resizeSingleTwoPointElement = ( setResizeArrowFn, isResizeEnd, sidesWithSameLength, - xPointer, - yPointer, + pointerX, + pointerY, lastX, lastY, ); @@ -274,43 +258,35 @@ const resizeSingleElement = ( resizeHandle: "n" | "s" | "w" | "e" | "nw" | "ne" | "sw" | "se", sidesWithSameLength: boolean, isResizeFromCenter: boolean, - xPointer: number, - yPointer: number, - offsetPointer: number, + pointerX: number, + pointerY: number, + offsetX: number, + offsetY: number, ) => { const [x1, y1, x2, y2] = getElementAbsoluteCoords(element); const cx = (x1 + x2) / 2; const cy = (y1 + y2) / 2; // rotation pointer with reverse angle const [rotatedX, rotatedY] = rotate( - xPointer, - yPointer, + pointerX - offsetX, + pointerY - offsetY, cx, cy, -element.angle, ); - // XXX this might be slow with closure - const adjustWithOffsetPointer = (wh: number) => { - if (wh > offsetPointer) { - return wh - offsetPointer; - } else if (wh < -offsetPointer) { - return wh + offsetPointer; - } - return 0; - }; let scaleX = 1; let scaleY = 1; if (resizeHandle === "e" || resizeHandle === "ne" || resizeHandle === "se") { - scaleX = adjustWithOffsetPointer(rotatedX - x1) / (x2 - x1); + scaleX = (rotatedX - x1) / (x2 - x1); } if (resizeHandle === "s" || resizeHandle === "sw" || resizeHandle === "se") { - scaleY = adjustWithOffsetPointer(rotatedY - y1) / (y2 - y1); + scaleY = (rotatedY - y1) / (y2 - y1); } if (resizeHandle === "w" || resizeHandle === "nw" || resizeHandle === "sw") { - scaleX = adjustWithOffsetPointer(x2 - rotatedX) / (x2 - x1); + scaleX = (x2 - rotatedX) / (x2 - x1); } if (resizeHandle === "n" || resizeHandle === "nw" || resizeHandle === "ne") { - scaleY = adjustWithOffsetPointer(y2 - rotatedY) / (y2 - y1); + scaleY = (y2 - rotatedY) / (y2 - y1); } let nextWidth = element.width * scaleX; let nextHeight = element.height * scaleY; @@ -388,16 +364,17 @@ const resizeSingleElement = ( const resizeMultipleElements = ( elements: readonly NonDeletedExcalidrawElement[], resizeHandle: "nw" | "ne" | "sw" | "se", - xPointer: number, - yPointer: number, - offsetPointer: number, + pointerX: number, + pointerY: number, + offsetX: number, + offsetY: number, ) => { const [x1, y1, x2, y2] = getCommonBounds(elements); switch (resizeHandle) { case "se": { const scale = Math.max( - (xPointer - offsetPointer - x1) / (x2 - x1), - (yPointer - offsetPointer - y1) / (y2 - y1), + (pointerX - offsetX - x1) / (x2 - x1), + (pointerY - offsetY - y1) / (y2 - y1), ); if (scale > 0) { elements.forEach((element) => { @@ -412,8 +389,8 @@ const resizeMultipleElements = ( } case "nw": { const scale = Math.max( - (x2 - offsetPointer - xPointer) / (x2 - x1), - (y2 - offsetPointer - yPointer) / (y2 - y1), + (x2 - (pointerX - offsetX)) / (x2 - x1), + (y2 - (pointerY - offsetY)) / (y2 - y1), ); if (scale > 0) { elements.forEach((element) => { @@ -428,8 +405,8 @@ const resizeMultipleElements = ( } case "ne": { const scale = Math.max( - (xPointer - offsetPointer - x1) / (x2 - x1), - (y2 - offsetPointer - yPointer) / (y2 - y1), + (pointerX - offsetX - x1) / (x2 - x1), + (y2 - (pointerY - offsetY)) / (y2 - y1), ); if (scale > 0) { elements.forEach((element) => { @@ -444,8 +421,8 @@ const resizeMultipleElements = ( } case "sw": { const scale = Math.max( - (x2 - offsetPointer - xPointer) / (x2 - x1), - (yPointer - offsetPointer - y1) / (y2 - y1), + (x2 - (pointerX - offsetX)) / (x2 - x1), + (pointerY - offsetY - y1) / (y2 - y1), ); if (scale > 0) { elements.forEach((element) => { @@ -468,3 +445,39 @@ export const canResizeMutlipleElements = ( ["rectangle", "diamond", "ellipse"].includes(element.type), ); }; + +export const getResizeOffsetXY = ( + resizeHandle: ResizeTestType, + selectedElements: NonDeletedExcalidrawElement[], + x: number, + y: number, +): [number, number] => { + const [x1, y1, x2, y2] = + selectedElements.length === 1 + ? getElementAbsoluteCoords(selectedElements[0]) + : getCommonBounds(selectedElements); + const cx = (x1 + x2) / 2; + const cy = (y1 + y2) / 2; + const angle = selectedElements.length === 1 ? selectedElements[0].angle : 0; + [x, y] = rotate(x, y, cx, cy, -angle); + switch (resizeHandle) { + case "n": + return rotate(x - (x1 + x2) / 2, y - y1, 0, 0, angle); + case "s": + return rotate(x - (x1 + x2) / 2, y - y2, 0, 0, angle); + case "w": + return rotate(x - x1, y - (y1 + y2) / 2, 0, 0, angle); + case "e": + return rotate(x - x2, y - (y1 + y2) / 2, 0, 0, angle); + case "nw": + return rotate(x - x1, y - y1, 0, 0, angle); + case "ne": + return rotate(x - x2, y - y1, 0, 0, angle); + case "sw": + return rotate(x - x1, y - y2, 0, 0, angle); + case "se": + return rotate(x - x2, y - y2, 0, 0, angle); + default: + return [0, 0]; + } +}; diff --git a/src/tests/__snapshots__/regressionTests.test.tsx.snap b/src/tests/__snapshots__/regressionTests.test.tsx.snap index ae6d1b2eb..34d4bbd3f 100644 --- a/src/tests/__snapshots__/regressionTests.test.tsx.snap +++ b/src/tests/__snapshots__/regressionTests.test.tsx.snap @@ -3684,8 +3684,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 34, - "versionNonce": 1388251943, + "version": 18, + "versionNonce": 651223591, "width": 10, "x": 10, "y": 10, @@ -3770,8 +3770,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -3812,8 +3812,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -3855,8 +3855,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -3899,8 +3899,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -3944,8 +3944,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -3990,8 +3990,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -4037,8 +4037,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -4085,8 +4085,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -4134,8 +4134,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -4184,8 +4184,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -4235,8 +4235,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -4287,8 +4287,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -4340,8 +4340,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 29, - "versionNonce": 1532871783, + "version": 16, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -4394,8 +4394,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 31, - "versionNonce": 1934038695, + "version": 17, + "versionNonce": 1573789895, "width": 10, "x": 10, "y": 10, @@ -4449,8 +4449,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 33, - "versionNonce": 909170919, + "version": 18, + "versionNonce": 2066753033, "width": 15, "x": 10, "y": 10, @@ -4505,8 +4505,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 35, - "versionNonce": 1388251943, + "version": 19, + "versionNonce": 651223591, "width": 10, "x": 10, "y": 10, @@ -4588,8 +4588,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 16, - "versionNonce": 1359939303, + "version": 9, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -4674,8 +4674,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -4716,8 +4716,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -4759,8 +4759,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -4803,8 +4803,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -4848,8 +4848,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -4894,8 +4894,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -4941,8 +4941,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -5022,8 +5022,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 12, - "versionNonce": 289600103, + "version": 7, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -5108,8 +5108,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -5150,8 +5150,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -5193,8 +5193,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -5237,8 +5237,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -5282,8 +5282,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -5361,8 +5361,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 8, - "versionNonce": 23633383, + "version": 5, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -5447,8 +5447,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -5489,8 +5489,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -5532,8 +5532,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -5609,8 +5609,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 4, - "versionNonce": 2019559783, + "version": 3, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -5695,8 +5695,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -5786,8 +5786,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 32, - "versionNonce": 909170919, + "version": 17, + "versionNonce": 2066753033, "width": 15, "x": 10, "y": 10, @@ -5872,8 +5872,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -5914,8 +5914,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -5957,8 +5957,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -6001,8 +6001,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -6046,8 +6046,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -6092,8 +6092,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -6139,8 +6139,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -6187,8 +6187,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -6236,8 +6236,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -6286,8 +6286,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -6337,8 +6337,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -6389,8 +6389,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -6442,8 +6442,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 29, - "versionNonce": 1532871783, + "version": 16, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -6496,8 +6496,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 31, - "versionNonce": 1934038695, + "version": 17, + "versionNonce": 1573789895, "width": 10, "x": 10, "y": 10, @@ -6551,8 +6551,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 33, - "versionNonce": 909170919, + "version": 18, + "versionNonce": 2066753033, "width": 15, "x": 10, "y": 10, @@ -6640,8 +6640,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 28, - "versionNonce": 1532871783, + "version": 15, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -6726,8 +6726,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -6768,8 +6768,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -6811,8 +6811,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -6855,8 +6855,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -6900,8 +6900,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -6946,8 +6946,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -6993,8 +6993,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -7041,8 +7041,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -7090,8 +7090,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -7140,8 +7140,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -7191,8 +7191,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -7243,8 +7243,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -7296,8 +7296,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 29, - "versionNonce": 1532871783, + "version": 16, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -7383,8 +7383,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 24, - "versionNonce": 888958951, + "version": 13, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -7469,8 +7469,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -7511,8 +7511,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -7554,8 +7554,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -7598,8 +7598,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -7643,8 +7643,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -7689,8 +7689,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -7736,8 +7736,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -7784,8 +7784,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -7833,8 +7833,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -7883,8 +7883,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -7934,8 +7934,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -8019,8 +8019,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 20, - "versionNonce": 1508694887, + "version": 11, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -8105,8 +8105,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -8147,8 +8147,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -8190,8 +8190,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -8234,8 +8234,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -8279,8 +8279,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -8325,8 +8325,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -8372,8 +8372,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -8420,8 +8420,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -8469,8 +8469,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -8553,8 +8553,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 18, - "versionNonce": 845789479, + "version": 10, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -8639,8 +8639,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -8681,8 +8681,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -8724,8 +8724,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -8768,8 +8768,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -8813,8 +8813,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -8859,8 +8859,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -8906,8 +8906,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -8954,8 +8954,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -9036,8 +9036,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 14, - "versionNonce": 406373543, + "version": 8, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -9122,8 +9122,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -9164,8 +9164,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -9207,8 +9207,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -9251,8 +9251,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -9296,8 +9296,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -9342,8 +9342,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -9422,8 +9422,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 10, - "versionNonce": 747212839, + "version": 6, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -9508,8 +9508,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -9550,8 +9550,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -9593,8 +9593,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -9637,8 +9637,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -9715,8 +9715,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 6, - "versionNonce": 238820263, + "version": 4, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -9801,8 +9801,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -9843,8 +9843,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -9935,8 +9935,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 34, - "versionNonce": 1388251943, + "version": 18, + "versionNonce": 651223591, "width": 10, "x": 10, "y": 10, @@ -10021,8 +10021,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -10063,8 +10063,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -10106,8 +10106,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -10150,8 +10150,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -10195,8 +10195,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -10241,8 +10241,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -10288,8 +10288,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -10336,8 +10336,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -10385,8 +10385,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -10435,8 +10435,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -10486,8 +10486,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -10538,8 +10538,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -10591,8 +10591,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 29, - "versionNonce": 1532871783, + "version": 16, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -10645,8 +10645,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 31, - "versionNonce": 1934038695, + "version": 17, + "versionNonce": 1573789895, "width": 10, "x": 10, "y": 10, @@ -10700,8 +10700,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 33, - "versionNonce": 909170919, + "version": 18, + "versionNonce": 2066753033, "width": 15, "x": 10, "y": 10, @@ -10756,8 +10756,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 35, - "versionNonce": 1388251943, + "version": 19, + "versionNonce": 651223591, "width": 10, "x": 10, "y": 10, @@ -10846,8 +10846,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 30, - "versionNonce": 1934038695, + "version": 16, + "versionNonce": 1573789895, "width": 10, "x": 10, "y": 10, @@ -10932,8 +10932,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -10974,8 +10974,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -11017,8 +11017,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -11061,8 +11061,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -11106,8 +11106,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -11152,8 +11152,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -11199,8 +11199,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -11247,8 +11247,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -11296,8 +11296,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -11346,8 +11346,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -11397,8 +11397,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -11449,8 +11449,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -11502,8 +11502,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 29, - "versionNonce": 1532871783, + "version": 16, + "versionNonce": 1996028265, "width": 5, "x": 10, "y": 10, @@ -11556,8 +11556,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 31, - "versionNonce": 1934038695, + "version": 17, + "versionNonce": 1573789895, "width": 10, "x": 10, "y": 10, @@ -11644,8 +11644,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 26, - "versionNonce": 651223591, + "version": 14, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -11730,8 +11730,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -11772,8 +11772,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -11815,8 +11815,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -11859,8 +11859,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -11904,8 +11904,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -11950,8 +11950,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -11997,8 +11997,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -12045,8 +12045,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -12094,8 +12094,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -12144,8 +12144,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -12195,8 +12195,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 25, - "versionNonce": 888958951, + "version": 14, + "versionNonce": 1292308681, "width": 5, "x": 15, "y": 10, @@ -12247,8 +12247,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 27, - "versionNonce": 651223591, + "version": 15, + "versionNonce": 1508694887, "width": 10, "x": 10, "y": 10, @@ -12333,8 +12333,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 22, - "versionNonce": 1279028647, + "version": 12, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10, @@ -12419,8 +12419,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 5, - "versionNonce": 2019559783, + "version": 4, + "versionNonce": 401146281, "width": 15, "x": 5, "y": 5, @@ -12461,8 +12461,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 7, - "versionNonce": 238820263, + "version": 5, + "versionNonce": 1116226695, "width": 10, "x": 10, "y": 10, @@ -12504,8 +12504,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 9, - "versionNonce": 23633383, + "version": 6, + "versionNonce": 400692809, "width": 5, "x": 15, "y": 15, @@ -12548,8 +12548,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 11, - "versionNonce": 747212839, + "version": 7, + "versionNonce": 23633383, "width": 10, "x": 10, "y": 10, @@ -12593,8 +12593,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 13, - "versionNonce": 289600103, + "version": 8, + "versionNonce": 81784553, "width": 5, "x": 10, "y": 5, @@ -12639,8 +12639,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 15, - "versionNonce": 406373543, + "version": 9, + "versionNonce": 760410951, "width": 10, "x": 10, "y": 10, @@ -12686,8 +12686,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 17, - "versionNonce": 1359939303, + "version": 10, + "versionNonce": 1315507081, "width": 15, "x": 10, "y": 15, @@ -12734,8 +12734,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 19, - "versionNonce": 845789479, + "version": 11, + "versionNonce": 406373543, "width": 10, "x": 10, "y": 10, @@ -12783,8 +12783,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 21, - "versionNonce": 1508694887, + "version": 12, + "versionNonce": 1402203177, "width": 15, "x": 5, "y": 10, @@ -12833,8 +12833,8 @@ Object { "strokeColor": "#000000", "strokeWidth": 1, "type": "rectangle", - "version": 23, - "versionNonce": 1279028647, + "version": 13, + "versionNonce": 2004587015, "width": 10, "x": 10, "y": 10,