From 4839838d0cdfca29a9e87fcf966ec026ee99a14f Mon Sep 17 00:00:00 2001 From: Yukai Huang Date: Wed, 12 Apr 2017 09:21:13 +0800 Subject: Manage syncscroll / currentMode in appState --- public/js/lib/appState.js | 8 ++++++++ public/js/lib/editor/modeType.js | 11 ----------- public/js/lib/modeType.js | 11 +++++++++++ public/js/lib/syncscroll.js | 31 +++++++++++++++++-------------- 4 files changed, 36 insertions(+), 25 deletions(-) create mode 100644 public/js/lib/appState.js delete mode 100644 public/js/lib/editor/modeType.js create mode 100644 public/js/lib/modeType.js (limited to 'public/js/lib') diff --git a/public/js/lib/appState.js b/public/js/lib/appState.js new file mode 100644 index 00000000..fb8030e1 --- /dev/null +++ b/public/js/lib/appState.js @@ -0,0 +1,8 @@ +import modeType from './modeType' + +let state = { + syncscroll: true, + currentMode: modeType.view +} + +export default state diff --git a/public/js/lib/editor/modeType.js b/public/js/lib/editor/modeType.js deleted file mode 100644 index f3212105..00000000 --- a/public/js/lib/editor/modeType.js +++ /dev/null @@ -1,11 +0,0 @@ -export default { - edit: { - name: 'edit' - }, - view: { - name: 'view' - }, - both: { - name: 'both' - } -} diff --git a/public/js/lib/modeType.js b/public/js/lib/modeType.js new file mode 100644 index 00000000..f3212105 --- /dev/null +++ b/public/js/lib/modeType.js @@ -0,0 +1,11 @@ +export default { + edit: { + name: 'edit' + }, + view: { + name: 'view' + }, + both: { + name: 'both' + } +} diff --git a/public/js/lib/syncscroll.js b/public/js/lib/syncscroll.js index 6b07e79c..cee317ea 100644 --- a/public/js/lib/syncscroll.js +++ b/public/js/lib/syncscroll.js @@ -5,7 +5,8 @@ import markdownitContainer from 'markdown-it-container' import { md } from '../extra' -import modeType from '../lib/editor/modeType' +import modeType from './modeType' +import appState from './appState' function addPart (tokens, idx) { if (tokens[idx].map && tokens[idx].level === 0) { @@ -110,9 +111,6 @@ md.use(markdownitContainer, 'info', { render: renderContainer }) md.use(markdownitContainer, 'warning', { render: renderContainer }) md.use(markdownitContainer, 'danger', { render: renderContainer }) -// FIXME: expose syncscroll to window -window.syncscroll = true - window.preventSyncScrollToEdit = false window.preventSyncScrollToView = false @@ -127,10 +125,15 @@ let editArea = null let viewArea = null let markdownArea = null -export function setupSyncAreas (edit, view, markdown) { +let editor + +export function setupSyncAreas (edit, view, markdown, _editor) { editArea = edit viewArea = view markdownArea = markdown + + editor = _editor + editArea.on('scroll', _.throttle(syncScrollToView, editScrollThrottle)) viewArea.on('scroll', _.throttle(syncScrollToEdit, viewScrollThrottle)) } @@ -162,8 +165,8 @@ function buildMapInner (callback) { viewBottom = viewArea[0].scrollHeight - viewArea.height() acc = 0 - const lines = window.editor.getValue().split('\n') - const lineHeight = window.editor.defaultTextHeight() + const lines = editor.getValue().split('\n') + const lineHeight = editor.defaultTextHeight() for (i = 0; i < lines.length; i++) { const str = lines[i] @@ -174,7 +177,7 @@ function buildMapInner (callback) { continue } - const h = window.editor.heightAtLine(i + 1) - window.editor.heightAtLine(i) + const h = editor.heightAtLine(i + 1) - editor.heightAtLine(i) acc += Math.round(h / lineHeight) } _lineHeightMap.push(acc) @@ -229,7 +232,7 @@ function buildMapInner (callback) { let viewScrollingTimer = null export function syncScrollToEdit (event, preventAnimate) { - if (window.currentMode !== modeType.both || !window.syncscroll || !editArea) return + if (appState.currentMode !== modeType.both || !appState.syncscroll || !editArea) return if (window.preventSyncScrollToEdit) { if (typeof window.preventSyncScrollToEdit === 'number') { window.preventSyncScrollToEdit-- @@ -269,8 +272,8 @@ export function syncScrollToEdit (event, preventAnimate) { let posTo = 0 let topDiffPercent = 0 let posToNextDiff = 0 - const scrollInfo = window.editor.getScrollInfo() - const textHeight = window.editor.defaultTextHeight() + const scrollInfo = editor.getScrollInfo() + const textHeight = editor.defaultTextHeight() const preLastLineHeight = scrollInfo.height - scrollInfo.clientHeight - textHeight const preLastLineNo = Math.round(preLastLineHeight / textHeight) const preLastLinePos = scrollMap[preLastLineNo] @@ -311,7 +314,7 @@ function viewScrollingTimeoutInner () { let editScrollingTimer = null export function syncScrollToView (event, preventAnimate) { - if (window.currentMode !== modeType.both || !window.syncscroll || !viewArea) return + if (appState.currentMode !== modeType.both || !appState.syncscroll || !viewArea) return if (window.preventSyncScrollToView) { if (typeof preventSyncScrollToView === 'number') { window.preventSyncScrollToView-- @@ -330,8 +333,8 @@ export function syncScrollToView (event, preventAnimate) { let lineNo, posTo let topDiffPercent, posToNextDiff - const scrollInfo = window.editor.getScrollInfo() - const textHeight = window.editor.defaultTextHeight() + const scrollInfo = editor.getScrollInfo() + const textHeight = editor.defaultTextHeight() lineNo = Math.floor(scrollInfo.top / textHeight) // if reach the last line, will start lerp to the bottom const diffToBottom = (scrollInfo.top + scrollInfo.clientHeight) - (scrollInfo.height - textHeight) -- cgit v1.2.3