diff --git a/client/components/codeEditor/codeEditor.jsx b/client/components/codeEditor/codeEditor.jsx index b285c5898..6c16b6f75 100644 --- a/client/components/codeEditor/codeEditor.jsx +++ b/client/components/codeEditor/codeEditor.jsx @@ -129,12 +129,6 @@ const CodeEditor = forwardRef( onCursorChange(line); } - if(update.viewportChanged) { - const { from } = update.view.viewport; - const line = update.state.doc.lineAt(from).number; - - onViewChange(line); - } }); const highlightExtension = renderer === 'V3' @@ -169,7 +163,7 @@ const CodeEditor = forwardRef( themeCompartment.of(themeExtension), highlightActiveLine(), highlightActiveLineGutter(), - + //keyboard shortcut keymap.of([...defaultKeymap, foldKeymap, ...searchKeymap]), generalKeymap, @@ -195,9 +189,35 @@ const CodeEditor = forwardRef( parent : editorRef.current, }); + const view = viewRef.current; + + let ticking = false; + + const handleScroll = ()=>{ + if(ticking) return; + + ticking = true; + requestAnimationFrame(()=>{ + const view = viewRef.current; + if(!view?.scrollDOM) return; + + const top = view.scrollDOM.scrollTop; + const block = view.lineBlockAtHeight(top); + const line = view.state.doc.lineAt(block.from).number; + + onViewChange(line); + ticking = false; + }); + }; + + view.scrollDOM.addEventListener('scroll', handleScroll); + docsRef.current[tab] = state; - return ()=>viewRef.current?.destroy(); + return ()=>{ + view.scrollDOM.removeEventListener('scroll', handleScroll); + viewRef.current?.destroy(); + }; }, []); useEffect(()=>{ diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index c701710e3..96021d2e2 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -266,29 +266,6 @@ const Editor = createReactClass({ this.forceUpdate(); }, - //temporary fix until cm6 comes next update - attachCodeMirrorListeners : function(cm) { - if(!cm) return; - // detach previous (important on remount / view switch) - if(this._cm) { - this._cm.off('cursorActivity', this._onCursor); - this._cm.off('scroll', this._onScroll); - } - - this._cm = cm; - - this._onCursor = ()=>{ - this.updateCurrentCursorPage(cm.getCursor()); - }; - - this._onScroll = _.throttle(()=>{ - const topLine = cm.lineAtHeight(cm.getScrollInfo().top, 'local'); - this.updateCurrentViewPage(topLine); - }, 200); - - cm.on('cursorActivity', this._onCursor); - cm.on('scroll', this._onScroll); - }, renderEditor : function(){ if(this.isText()){ return <>