1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 01:36:22 +00:00

Toggle linting gutter with document.querySelector and style.display

This commit is contained in:
AWolf81
2019-05-25 07:16:03 +02:00
parent 270a015514
commit b68b367b3c
2 changed files with 7 additions and 7 deletions

View File

@@ -40,8 +40,6 @@ function translateHotkey (hotkey) {
return hotkey.replace(/\s*\+\s*/g, '-').replace(/Command/g, 'Cmd').replace(/Control/g, 'Ctrl') return hotkey.replace(/\s*\+\s*/g, '-').replace(/Command/g, 'Cmd').replace(/Control/g, 'Ctrl')
} }
const DEFAULT_GUTTERS = ['CodeMirror-linenumbers', 'CodeMirror-foldgutter']
export default class CodeEditor extends React.Component { export default class CodeEditor extends React.Component {
constructor (props) { constructor (props) {
super(props) super(props)
@@ -280,7 +278,7 @@ export default class CodeEditor extends React.Component {
dragDrop: false, dragDrop: false,
foldGutter: true, foldGutter: true,
lint: enableMarkdownLint ? this.setCodeEditorLintConfig() : false, lint: enableMarkdownLint ? this.setCodeEditorLintConfig() : false,
gutters: [...DEFAULT_GUTTERS, enableMarkdownLint && 'CodeMirror-lint-markers'], gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter', 'CodeMirror-lint-markers'],
autoCloseBrackets: { autoCloseBrackets: {
pairs: this.props.matchingPairs, pairs: this.props.matchingPairs,
triples: this.props.matchingTriples, triples: this.props.matchingTriples,
@@ -290,6 +288,8 @@ export default class CodeEditor extends React.Component {
extraKeys: this.defaultKeyMap extraKeys: this.defaultKeyMap
}) })
document.querySelector('.CodeMirror-lint-markers').style.display = enableMarkdownLint ? 'inline-block' : 'none'
if (!this.props.mode && this.props.value && this.props.autoDetect) { if (!this.props.mode && this.props.value && this.props.autoDetect) {
this.autoDetectLanguage(this.props.value) this.autoDetectLanguage(this.props.value)
} else { } else {
@@ -539,12 +539,11 @@ export default class CodeEditor extends React.Component {
if (prevProps.enableMarkdownLint !== enableMarkdownLint || prevProps.customMarkdownLintConfig !== customMarkdownLintConfig) { if (prevProps.enableMarkdownLint !== enableMarkdownLint || prevProps.customMarkdownLintConfig !== customMarkdownLintConfig) {
if (!enableMarkdownLint) { if (!enableMarkdownLint) {
this.editor.setOption('lint', {default: false}) this.editor.setOption('lint', {default: false})
this.editor.setOption('gutters', DEFAULT_GUTTERS) document.querySelector('.CodeMirror-lint-markers').style.display = 'none'
} else { } else {
this.editor.setOption('lint', this.setCodeEditorLintConfig()) this.editor.setOption('lint', this.setCodeEditorLintConfig())
this.editor.setOption('gutters', [...DEFAULT_GUTTERS, 'CodeMirror-lint-markers']) document.querySelector('.CodeMirror-lint-markers').style.display = 'inline-block'
} }
needRefresh = true needRefresh = true
} }

View File

@@ -194,6 +194,7 @@ class MarkdownEditor extends React.Component {
} }
reload () { reload () {
console.log('reloading editor...')
this.refs.code.reload() this.refs.code.reload()
this.cancelQueue() this.cancelQueue()
this.renderPreview(this.props.value) this.renderPreview(this.props.value)
@@ -277,7 +278,7 @@ class MarkdownEditor extends React.Component {
if (this.props.ignorePreviewPointerEvents) previewStyle.pointerEvents = 'none' if (this.props.ignorePreviewPointerEvents) previewStyle.pointerEvents = 'none'
const storage = findStorage(storageKey) const storage = findStorage(storageKey)
console.log('render editor', config)
return ( return (
<div className={className == null <div className={className == null
? 'MarkdownEditor' ? 'MarkdownEditor'