livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-10-25 04:46:04 +08:00
Code Issues Projects Releases Packages Wiki Activity

Disable autoscroll when focusing in insert mode (#355)

Browse source
This commit is contained in:
Jonatan Kłosko 2021-06-16 16:16:26 +02:00 • committed by GitHub
parent c5a3575589
commit 3df6508b56
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
assets/js/cell/index.js
View file

@ -124,7 +124,11 @@ const Cell = {
input.addEventListener("blur", (event) => {
if (this.state.isFocused && this.state.insertMode) {
input.focus();
// We are still in the insert mode, so focus the input
// back once other handlers complete
setTimeout(() => {
input.focus();
}, 0);
}
});
}
@ -171,7 +175,7 @@ function getInput(hook) {
*/
function handleCellsEvent(hook, event) {
if (event.type === "cell_focused") {
handleCellFocused(hook, event.cellId);
handleCellFocused(hook, event.cellId, event.scroll);
} else if (event.type === "insert_mode_changed") {
handleInsertModeChanged(hook, event.enabled);
} else if (event.type === "cell_moved") {
@ -183,11 +187,13 @@ function handleCellsEvent(hook, event) {
}
}
function handleCellFocused(hook, cellId) {
function handleCellFocused(hook, cellId, scroll) {
if (hook.props.cellId === cellId) {
hook.state.isFocused = true;
hook.el.setAttribute("data-js-focused", "true");
smoothlyScrollToElement(hook.el);
if (scroll) {
smoothlyScrollToElement(hook.el);
}
} else if (hook.state.isFocused) {
hook.state.isFocused = false;
hook.el.removeAttribute("data-js-focused");

22
assets/js/session/index.js
View file

@ -342,11 +342,19 @@ function handleDocumentMouseDown(hook, event) {
// Find the cell element, if one was clicked
const cell = event.target.closest(`[data-element="cell"]`);
const cellId = cell ? cell.dataset.cellId : null;
const insertMode = editableElementClicked(event, cell);
if (cellId !== hook.state.focusedCellId) {
setFocusedCell(hook, cellId);
setFocusedCell(hook, cellId, !insertMode);
}
// Depending on whether the click targets editor disable/enable insert mode
if (hook.state.insertMode !== insertMode) {
setInsertMode(hook, insertMode);
}
}
function editableElementClicked(event, cell) {
if (cell) {
const editorContainer = cell.querySelector(
`[data-element="editor-container"]`
@ -354,12 +362,10 @@ function handleDocumentMouseDown(hook, event) {
const input = cell.querySelector(`[data-element="input"]`);
const editableElement = editorContainer || input;
const editorClicked = editableElement.contains(event.target);
const insertMode = editorClicked;
if (hook.state.insertMode !== insertMode) {
setInsertMode(hook, insertMode);
}
return editableElement.contains(event.target);
}
return false;
}
/**
@ -644,7 +650,7 @@ function insertFirstCell(hook, type) {
}
}
function setFocusedCell(hook, cellId) {
function setFocusedCell(hook, cellId, scroll = true) {
hook.state.focusedCellId = cellId;
if (hook.state.focusedCellId) {
@ -658,7 +664,7 @@ function setFocusedCell(hook, cellId) {
hook.state.focusedSectionId = null;
}
globalPubSub.broadcast("cells", { type: "cell_focused", cellId });
globalPubSub.broadcast("cells", { type: "cell_focused", cellId, scroll });
setInsertMode(hook, false);
}