self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-03-26 21:12:59 +02:00
Code Issues Releases Activity

Desktop: Implement scroll-past-end on CodeMirror editor (#3589)

Browse Source
This commit is contained in:
Caleb John 2020-08-08 02:55:10 -06:00 committed by GitHub
parent 656615b571
commit 5c5cb0f781
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/CodeMirror.tsx
View File

@ -291,6 +291,12 @@ function CodeMirror(props: NoteBodyEditorProps, ref: any) {
position: absolute !important;
-webkit-box-shadow: none !important; // Some themes add a box shadow for some reason
}
.CodeMirror-lines {
/* This is used to enable the scroll-past end behaviour. The same height should */
/* be applied to the viewer. */
padding-bottom: 400px !important;
}
.cm-header-1 {
font-size: 1.5em;

2
ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/Editor.tsx
View File

@ -7,7 +7,6 @@ import 'codemirror/addon/comment/comment';
import 'codemirror/addon/dialog/dialog';
import 'codemirror/addon/edit/closebrackets';
import 'codemirror/addon/edit/continuelist';
import 'codemirror/addon/scroll/scrollpastend';
import 'codemirror/addon/scroll/annotatescrollbar';
import 'codemirror/addon/search/matchesonscrollbar';
import 'codemirror/addon/search/searchcursor';
@ -224,7 +223,6 @@ function Editor(props: EditorProps, ref: any) {
inputStyle: 'textarea', // contenteditable loses cursor position on focus change, use textarea instead
lineWrapping: true,
lineNumbers: false,
scrollPastEnd: true,
indentWithTabs: true,
indentUnit: 4,
spellcheck: true,

13
ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/utils/useScrollUtils.ts
View File

@ -1,19 +1,12 @@
// Helper functions to sync up scrolling
export default function useScrollUtils(CodeMirror: any) {
function getScrollHeight(cm: any) {
const info = cm.getScrollInfo();
const overdraw = cm.state.scrollPastEndPadding ? cm.state.scrollPastEndPadding : '0px';
return info.height - info.clientHeight - parseInt(overdraw, 10);
}
CodeMirror.defineExtension('getScrollPercent', function() {
const info = this.getScrollInfo();
return info.top / getScrollHeight(this);
return info.top / (info.height - info.clientHeight);
});
CodeMirror.defineExtension('setScrollPercent', function(p: number) {
this.scrollTo(null, p * getScrollHeight(this));
const info = this.getScrollInfo();
this.scrollTo(null, p * (info.height - info.clientHeight));
});
}

6
ElectronClient/gui/note-viewer/index.html
View File

@ -20,6 +20,12 @@
/* won't work with some pages due to the position: relative */
}
#rendered-md {
/* This is used to enable the scroll-past end behaviour. The same height should */
/* be applied to the editor. */
padding-bottom: 400px;
}
mark {
background: #F7D26E;
color: black;