Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ENTREP-88 Remove non-sanctioned behaviors: Part II #4

Merged
merged 3 commits into from
Jul 19, 2023
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/actions/actionCanvas.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -301,7 +301,8 @@ export const actionToggleTheme = register({
commitToHistory: false,
};
},
keyTest: (event) => event.altKey && event.shiftKey && event.code === CODES.D,
keyTest: () => false,
// keyTest: (event) => event.altKey && event.shiftKey && event.code === CODES.D,
predicate: (elements, appState, props, app) => {
return !!app.props.UIOptions.canvasActions.toggleTheme;
},
Expand Down
3 changes: 2 additions & 1 deletion src/actions/actionClipboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,8 @@ export const actionCut = register({
return app.device.isMobile && !!navigator.clipboard;
},
contextItemLabel: "labels.cut",
keyTest: (event) => event[KEYS.CTRL_OR_CMD] && event.key === KEYS.X,
keyTest: () => false,
// keyTest: (event) => event[KEYS.CTRL_OR_CMD] && event.key === KEYS.X,
});

export const actionCopyAsSvg = register({
Expand Down
17 changes: 9 additions & 8 deletions src/actions/actionElementLock.ts
Original file line number Diff line number Diff line change
Expand Up @@ -49,14 +49,15 @@ export const actionToggleElementLock = register({
? "labels.elementLock.lockAll"
: "labels.elementLock.unlockAll";
},
keyTest: (event, appState, elements) => {
return (
event.key.toLocaleLowerCase() === KEYS.L &&
event[KEYS.CTRL_OR_CMD] &&
event.shiftKey &&
getSelectedElements(elements, appState, false).length > 0
);
},
keyTest: () => false,
// keyTest: (event, appState, elements) => {
// return (
// event.key.toLocaleLowerCase() === KEYS.L &&
// event[KEYS.CTRL_OR_CMD] &&
// event.shiftKey &&
// getSelectedElements(elements, appState, false).length > 0
// );
// },
});

export const actionUnlockAllElements = register({
Expand Down
3 changes: 2 additions & 1 deletion src/actions/actionMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -86,5 +86,6 @@ export const actionShortcuts = register({
commitToHistory: false,
};
},
keyTest: (event) => event.key === KEYS.QUESTION_MARK,
keyTest: () => false,
// keyTest: (event) => event.key === KEYS.QUESTION_MARK,
});
5 changes: 3 additions & 2 deletions src/actions/actionToggleStats.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ export const actionToggleStats = register({
},
checked: (appState) => appState.showStats,
contextItemLabel: "stats.title",
keyTest: (event) =>
!event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.SLASH,
keyTest: () => false,
// keyTest: (event) =>
// !event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.SLASH,
});
4 changes: 2 additions & 2 deletions src/actions/actionToggleViewMode.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,6 @@ export const actionToggleViewMode = register({
return typeof appProps.viewModeEnabled === "undefined";
},
contextItemLabel: "labels.viewMode",
keyTest: (event) =>
!event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.R,
keyTest: () => false,
// !event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.R,
});
5 changes: 3 additions & 2 deletions src/actions/actionToggleZenMode.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ export const actionToggleZenMode = register({
return typeof appProps.zenModeEnabled === "undefined";
},
contextItemLabel: "buttons.zenMode",
keyTest: (event) =>
!event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.Z,
keyTest: () => false,
// keyTest: (event) =>
// !event[KEYS.CTRL_OR_CMD] && event.altKey && event.code === CODES.Z,
});
264 changes: 92 additions & 172 deletions src/components/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -586,7 +586,6 @@ class App extends React.Component<AppProps, AppState> {
"excalidraw--mobile": this.device.isMobile,
})}
ref={this.excalidrawContainerRef}
onDrop={this.handleAppOnDrop}
tabIndex={0}
onKeyDown={
this.props.handleKeyboardGlobally ? undefined : this.onKeyDown
Expand Down Expand Up @@ -2260,10 +2259,7 @@ class App extends React.Component<AppProps, AppState> {
});
}
}
} else if (
isTextElement(selectedElement) ||
isValidTextContainer(selectedElement)
) {
} else if (isTextElement(selectedElement)) {
let container;
if (!isTextElement(selectedElement)) {
container = selectedElement as ExcalidrawTextContainer;
Expand Down Expand Up @@ -2896,33 +2892,36 @@ class App extends React.Component<AppProps, AppState> {

resetCursor(this.canvas);
if (!event[KEYS.CTRL_OR_CMD] && !this.state.viewModeEnabled) {
const container = getTextBindableContainerAtPosition(
this.scene.getNonDeletedElements(),
this.state,
sceneX,
sceneY,
);
if (container) {
if (
hasBoundTextElement(container) ||
!isTransparent(container.backgroundColor) ||
isHittingElementNotConsideringBoundingBox(container, this.state, [
sceneX,
sceneY,
])
) {
const midPoint = getContainerCenter(container, this.state);

sceneX = midPoint.x;
sceneY = midPoint.y;
}
// const container = getTextBindableContainerAtPosition(
// this.scene.getNonDeletedElements(),
// this.state,
// sceneX,
// sceneY,
// );
// if (container) {
// if (
// hasBoundTextElement(container) ||
// !isTransparent(container.backgroundColor) ||
// isHittingElementNotConsideringBoundingBox(container, this.state, [
// sceneX,
// sceneY,
// ])
// ) {
// const midPoint = getContainerCenter(container, this.state);

// sceneX = midPoint.x;
// sceneY = midPoint.y;
// }
// }
const hitElement = this.getElementAtPosition(sceneX, sceneY);
mpqmpqm marked this conversation as resolved.
Show resolved Hide resolved
if (isTextElement(hitElement)) {
mpqmpqm marked this conversation as resolved.
Show resolved Hide resolved
this.startTextEditing({
sceneX,
sceneY,
insertAtParentCenter: !event.altKey,
container: null,
});
}
this.startTextEditing({
sceneX,
sceneY,
insertAtParentCenter: !event.altKey,
container,
});
}
};

Expand Down Expand Up @@ -4795,68 +4794,68 @@ class App extends React.Component<AppProps, AppState> {
);
this.maybeSuggestBindingForAll(selectedElements);

// We duplicate the selected element if alt is pressed on pointer move
if (event.altKey && !pointerDownState.hit.hasBeenDuplicated) {
// Move the currently selected elements to the top of the z index stack, and
// put the duplicates where the selected elements used to be.
// (the origin point where the dragging started)

pointerDownState.hit.hasBeenDuplicated = true;

const nextElements = [];
const elementsToAppend = [];
const groupIdMap = new Map();
const oldIdToDuplicatedId = new Map();
const hitElement = pointerDownState.hit.element;
const elements = this.scene.getElementsIncludingDeleted();
const selectedElementIds: Array<ExcalidrawElement["id"]> =
getSelectedElements(elements, this.state, true).map(
(element) => element.id,
);

for (const element of elements) {
if (
selectedElementIds.includes(element.id) ||
// case: the state.selectedElementIds might not have been
// updated yet by the time this mousemove event is fired
(element.id === hitElement?.id &&
pointerDownState.hit.wasAddedToSelection)
) {
const duplicatedElement = duplicateElement(
this.state.editingGroupId,
groupIdMap,
element,
);
const [originDragX, originDragY] = getGridPoint(
pointerDownState.origin.x - pointerDownState.drag.offset.x,
pointerDownState.origin.y - pointerDownState.drag.offset.y,
this.state.gridSize,
);
mutateElement(duplicatedElement, {
x: duplicatedElement.x + (originDragX - dragX),
y: duplicatedElement.y + (originDragY - dragY),
});
nextElements.push(duplicatedElement);
elementsToAppend.push(element);
oldIdToDuplicatedId.set(element.id, duplicatedElement.id);
} else {
nextElements.push(element);
}
}
const nextSceneElements = [...nextElements, ...elementsToAppend];
bindTextToShapeAfterDuplication(
nextElements,
elementsToAppend,
oldIdToDuplicatedId,
);
fixBindingsAfterDuplication(
nextSceneElements,
elementsToAppend,
oldIdToDuplicatedId,
"duplicatesServeAsOld",
);
this.scene.replaceAllElements(nextSceneElements);
}
// // We duplicate the selected element if alt is pressed on pointer move
// if (event.altKey && !pointerDownState.hit.hasBeenDuplicated) {
// // Move the currently selected elements to the top of the z index stack, and
// // put the duplicates where the selected elements used to be.
// // (the origin point where the dragging started)

// pointerDownState.hit.hasBeenDuplicated = true;

// const nextElements = [];
// const elementsToAppend = [];
// const groupIdMap = new Map();
// const oldIdToDuplicatedId = new Map();
// const hitElement = pointerDownState.hit.element;
// const elements = this.scene.getElementsIncludingDeleted();
// const selectedElementIds: Array<ExcalidrawElement["id"]> =
// getSelectedElements(elements, this.state, true).map(
// (element) => element.id,
// );

// for (const element of elements) {
// if (
// selectedElementIds.includes(element.id) ||
// // case: the state.selectedElementIds might not have been
// // updated yet by the time this mousemove event is fired
// (element.id === hitElement?.id &&
// pointerDownState.hit.wasAddedToSelection)
// ) {
// const duplicatedElement = duplicateElement(
// this.state.editingGroupId,
// groupIdMap,
// element,
// );
// const [originDragX, originDragY] = getGridPoint(
// pointerDownState.origin.x - pointerDownState.drag.offset.x,
// pointerDownState.origin.y - pointerDownState.drag.offset.y,
// this.state.gridSize,
// );
// mutateElement(duplicatedElement, {
// x: duplicatedElement.x + (originDragX - dragX),
// y: duplicatedElement.y + (originDragY - dragY),
// });
// nextElements.push(duplicatedElement);
// elementsToAppend.push(element);
// oldIdToDuplicatedId.set(element.id, duplicatedElement.id);
// } else {
// nextElements.push(element);
// }
// }
// const nextSceneElements = [...nextElements, ...elementsToAppend];
// bindTextToShapeAfterDuplication(
// nextElements,
// elementsToAppend,
// oldIdToDuplicatedId,
// );
// fixBindingsAfterDuplication(
// nextSceneElements,
// elementsToAppend,
// oldIdToDuplicatedId,
// "duplicatesServeAsOld",
// );
// this.scene.replaceAllElements(nextSceneElements);
// }
return;
}
}
Expand Down Expand Up @@ -6060,84 +6059,6 @@ class App extends React.Component<AppProps, AppState> {
}
};

private handleAppOnDrop = async (event: React.DragEvent<HTMLDivElement>) => {
// must be retrieved first, in the same frame
const { file, fileHandle } = await getFileFromEvent(event);

try {
if (isSupportedImageFile(file)) {
// first attempt to decode scene from the image if it's embedded
// ---------------------------------------------------------------------

if (file?.type === MIME_TYPES.png || file?.type === MIME_TYPES.svg) {
try {
const scene = await loadFromBlob(
file,
this.state,
this.scene.getElementsIncludingDeleted(),
fileHandle,
);
this.syncActionResult({
...scene,
appState: {
...(scene.appState || this.state),
isLoading: false,
},
replaceFiles: true,
commitToHistory: true,
});
return;
} catch (error: any) {
if (error.name !== "EncodingError") {
throw error;
}
}
}

// if no scene is embedded or we fail for whatever reason, fall back
// to importing as regular image
// ---------------------------------------------------------------------

const { x: sceneX, y: sceneY } = viewportCoordsToSceneCoords(
event,
this.state,
);

const imageElement = this.createImageElement({ sceneX, sceneY });
this.insertImageElement(imageElement, file);
this.initializeImageDimensions(imageElement);
this.setState({ selectedElementIds: { [imageElement.id]: true } });

return;
}
} catch (error: any) {
return this.setState({
isLoading: false,
errorMessage: error.message,
});
}

const libraryJSON = event.dataTransfer.getData(MIME_TYPES.excalidrawlib);
if (libraryJSON && typeof libraryJSON === "string") {
try {
const libraryItems = parseLibraryJSON(libraryJSON);
this.addElementsFromPasteOrLibrary({
elements: distributeLibraryItemsOnSquareGrid(libraryItems),
position: event,
files: null,
});
} catch (error: any) {
this.setState({ errorMessage: error.message });
}
return;
}

if (file) {
// atetmpt to parse an excalidraw/excalidrawlib file
await this.loadFileToCanvas(file, fileHandle);
}
};

loadFileToCanvas = async (
file: File,
fileHandle: FileSystemHandle | null,
Expand Down Expand Up @@ -6409,7 +6330,6 @@ class App extends React.Component<AppProps, AppState> {
actionGroup,
actionUnbindText,
actionBindText,
actionWrapTextInContainer,
actionUngroup,
CONTEXT_MENU_SEPARATOR,
// actionAddToLibrary,
Expand Down
3 changes: 0 additions & 3 deletions src/components/HintViewer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -105,9 +105,6 @@ const getHints = ({
}
return t("hints.lineEditor_info");
}
if (isTextBindableContainer(selectedElements[0])) {
return t("hints.bindTextToElement");
}
}

return null;
Expand Down
Loading