From 743b220953f85bd995594707289c2d052163b749 Mon Sep 17 00:00:00 2001 From: Sosuke Suzuki Date: Sat, 4 Feb 2017 14:41:26 +0900 Subject: [PATCH 01/17] unfinished syntaxHighLightCheck --- .../PreferencesModal/CheckHighlightEditor.js | 59 +++++++++++++++++++ browser/main/modals/PreferencesModal/UiTab.js | 8 ++- 2 files changed, 65 insertions(+), 2 deletions(-) create mode 100644 browser/main/modals/PreferencesModal/CheckHighlightEditor.js diff --git a/browser/main/modals/PreferencesModal/CheckHighlightEditor.js b/browser/main/modals/PreferencesModal/CheckHighlightEditor.js new file mode 100644 index 00000000..e656733a --- /dev/null +++ b/browser/main/modals/PreferencesModal/CheckHighlightEditor.js @@ -0,0 +1,59 @@ +import React, { PropTypes } from 'react' +import CodeMirror from 'codemirror' +import _ from 'lodash' +const defaultEditorFontFamily = ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', 'monospace'] + +export default class CheckHighlightEditor extends React.Component { + constructor (props) { + super(props) + } + + componentDidMount () { + this.value = this.props.value + this.editor = CodeMirror(this.refs.root, { + value: this.props.value, + lineNumbers: true, + lineWrapping: true, + theme: this.props.theme, + indentUnit: 4, + tabSize: 4, + inputStyle: 'textarea' + }) + + this.setMode(this.props.mode) + + let editorTheme = document.getElementById('editorTheme') + } + + setMode(mode) { + let syntax = CodeMirror.findModeByName('ejs') + } + + render() { + let { className, fontFamily } = this.props + fontFamily = _.isString(fontFamily) && fontFamily.length > 0 + ? [fontFamily].concat(defaultEditorFontFamily) + : defaultEditorFontFamily + return ( +
+ ) + } +} + +CheckHighlightEditor.propTypes = { + value: PropTypes.string.isRequired, + mode: PropTypes.string, + theme: PropTypes.string.isRequired, + className: PropTypes.string, +} + +CheckHighlightEditor.defaultProps = { + readOnly: true, + theme: 'base16-dark', + fontSize: 14, + fontFamily: 'Monaco, Consolas', + indentSize: 4, + indentType: 'space' +} diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index 47903f87..c06858f3 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -4,6 +4,7 @@ import styles from './ConfigTab.styl' import ConfigManager from 'browser/main/lib/ConfigManager' import store from 'browser/main/store' import consts from 'browser/lib/consts' +import CheckHighlghtEditor from '../PreferencesModal/CheckHighlightEditor' const OSX = global.process.platform === 'darwin' @@ -18,7 +19,6 @@ class UiTab extends React.Component { handleUIChange (e) { let { config } = this.state - config.ui = { theme: this.refs.uiTheme.value, disableDirectWrite: this.refs.uiD2w != null @@ -62,7 +62,6 @@ class UiTab extends React.Component { render () { const themes = consts.THEMES const { config } = this.state - return (
@@ -113,6 +112,11 @@ class UiTab extends React.Component { }) } +
From 7b5a7aabeda9ec88506f8275beace5f065f4e667 Mon Sep 17 00:00:00 2001 From: Sosuke Suzuki Date: Thu, 16 Feb 2017 13:00:45 +0900 Subject: [PATCH 02/17] add HighLightCheckEditor --- .../PreferencesModal/CheckHighlightEditor.js | 59 ------------------- .../modals/PreferencesModal/ConfigTab.styl | 7 +++ browser/main/modals/PreferencesModal/UiTab.js | 48 ++++++++++++--- package.json | 1 + 4 files changed, 47 insertions(+), 68 deletions(-) delete mode 100644 browser/main/modals/PreferencesModal/CheckHighlightEditor.js diff --git a/browser/main/modals/PreferencesModal/CheckHighlightEditor.js b/browser/main/modals/PreferencesModal/CheckHighlightEditor.js deleted file mode 100644 index e656733a..00000000 --- a/browser/main/modals/PreferencesModal/CheckHighlightEditor.js +++ /dev/null @@ -1,59 +0,0 @@ -import React, { PropTypes } from 'react' -import CodeMirror from 'codemirror' -import _ from 'lodash' -const defaultEditorFontFamily = ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', 'monospace'] - -export default class CheckHighlightEditor extends React.Component { - constructor (props) { - super(props) - } - - componentDidMount () { - this.value = this.props.value - this.editor = CodeMirror(this.refs.root, { - value: this.props.value, - lineNumbers: true, - lineWrapping: true, - theme: this.props.theme, - indentUnit: 4, - tabSize: 4, - inputStyle: 'textarea' - }) - - this.setMode(this.props.mode) - - let editorTheme = document.getElementById('editorTheme') - } - - setMode(mode) { - let syntax = CodeMirror.findModeByName('ejs') - } - - render() { - let { className, fontFamily } = this.props - fontFamily = _.isString(fontFamily) && fontFamily.length > 0 - ? [fontFamily].concat(defaultEditorFontFamily) - : defaultEditorFontFamily - return ( -
- ) - } -} - -CheckHighlightEditor.propTypes = { - value: PropTypes.string.isRequired, - mode: PropTypes.string, - theme: PropTypes.string.isRequired, - className: PropTypes.string, -} - -CheckHighlightEditor.defaultProps = { - readOnly: true, - theme: 'base16-dark', - fontSize: 14, - fontFamily: 'Monaco, Consolas', - indentSize: 4, - indentType: 'space' -} diff --git a/browser/main/modals/PreferencesModal/ConfigTab.styl b/browser/main/modals/PreferencesModal/ConfigTab.styl index 896b06ed..6bb12f86 100644 --- a/browser/main/modals/PreferencesModal/ConfigTab.styl +++ b/browser/main/modals/PreferencesModal/ConfigTab.styl @@ -98,10 +98,17 @@ margin-left: 10px font-size: 12px +.code-mirror + width 400px + height 140px + margin-top 10px + margin-bottom 10px + colorDarkControl() border-color $ui-dark-borderColor background-color $ui-dark-backgroundColor color $ui-dark-text-color + body[data-theme="dark"] .root color $ui-dark-text-color diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index c06858f3..9b3a0b3e 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -4,7 +4,7 @@ import styles from './ConfigTab.styl' import ConfigManager from 'browser/main/lib/ConfigManager' import store from 'browser/main/store' import consts from 'browser/lib/consts' -import CheckHighlghtEditor from '../PreferencesModal/CheckHighlightEditor' +import CodeMirror from 'react-codemirror' const OSX = global.process.platform === 'darwin' @@ -13,12 +13,28 @@ class UiTab extends React.Component { super(props) this.state = { - config: props.config + config: props.config, + options: { + lineNumbers: true, + theme: props.config.editor.theme, + readOnly: true, + mode: 'javascript' + }, + code: ' function iamHappy(happy) {\n\tif(happy){\n\t console.log("I am Happy!")\n\t}else{\n\t console.log("I am not Happy!")\n\t}\n};' } } handleUIChange (e) { - let { config } = this.state + let { config, options } = this.state + let checkHighLight = document.getElementById('checkHighLight') + + if (checkHighLight == null) { + checkHighLight = document.createElement('link') + checkHighLight.setAttribute('id', 'checkHighLight') + checkHighLight.setAttribute('rel', 'stylesheet') + document.head.appendChild(checkHighLight) + } + config.ui = { theme: this.refs.uiTheme.value, disableDirectWrite: this.refs.uiD2w != null @@ -41,7 +57,23 @@ class UiTab extends React.Component { lineNumber: this.refs.previewLineNumber.checked } + + + let newOptions = { + lineNumbers: true, + theme: config.editor.theme, + readOnly: true, + mode: 'javascript' + } + + if (newOptions.theme !== options.theme) { + checkHighLight.setAttribute('href', '../node_modules/codemirror/theme/' + newOptions.theme + '.css') + } + + this.setState({options: newOptions}) + this.setState({ config }) + } handleSaveUIClick (e) { @@ -61,7 +93,7 @@ class UiTab extends React.Component { render () { const themes = consts.THEMES - const { config } = this.state + const { config, options } = this.state return (
@@ -112,11 +144,9 @@ class UiTab extends React.Component { }) } - +
+ +
diff --git a/package.json b/package.json index 7a0df7c8..9cf16f8f 100644 --- a/package.json +++ b/package.json @@ -67,6 +67,7 @@ "node-ipc": "^8.1.0", "raphael": "^2.2.7", "react": "^15.0.2", + "react-codemirror": "^0.3.0", "react-dom": "^15.0.2", "react-redux": "^4.4.5", "redux": "^3.5.2", From 5a201dd1b9ab8a777b54100a18412660c717d5bb Mon Sep 17 00:00:00 2001 From: Sosuke Suzuki Date: Sat, 18 Feb 2017 12:26:38 +0900 Subject: [PATCH 03/17] correction the pointed out code --- browser/main/modals/PreferencesModal/UiTab.js | 77 ++++++++----------- 1 file changed, 32 insertions(+), 45 deletions(-) diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index 9b3a0b3e..7e32cdbb 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -14,66 +14,52 @@ class UiTab extends React.Component { this.state = { config: props.config, - options: { - lineNumbers: true, - theme: props.config.editor.theme, - readOnly: true, - mode: 'javascript' - }, - code: ' function iamHappy(happy) {\n\tif(happy){\n\t console.log("I am Happy!")\n\t}else{\n\t console.log("I am not Happy!")\n\t}\n};' + codemirrorTheme: props.config.editor.theme } } handleUIChange (e) { - let { config, options } = this.state + let { codemirrorTheme } = this.state let checkHighLight = document.getElementById('checkHighLight') - if (checkHighLight == null) { + if (checkHighLight === null) { checkHighLight = document.createElement('link') checkHighLight.setAttribute('id', 'checkHighLight') checkHighLight.setAttribute('rel', 'stylesheet') document.head.appendChild(checkHighLight) } - config.ui = { - theme: this.refs.uiTheme.value, - disableDirectWrite: this.refs.uiD2w != null - ? this.refs.uiD2w.checked - : false - } - config.editor = { - theme: this.refs.editorTheme.value, - fontSize: this.refs.editorFontSize.value, - fontFamily: this.refs.editorFontFamily.value, - indentType: this.refs.editorIndentType.value, - indentSize: this.refs.editorIndentSize.value, - switchPreview: this.refs.editorSwitchPreview.value, - keyMap: this.refs.editorKeyMap.value - } - config.preview = { - fontSize: this.refs.previewFontSize.value, - fontFamily: this.refs.previewFontFamily.value, - codeBlockTheme: this.refs.previewCodeBlockTheme.value, - lineNumber: this.refs.previewLineNumber.checked + const newConfig = { + ui: { + theme: this.refs.uiTheme.value, + disableDirectWrite: this.refs.uiD2w != null + ? this.refs.uiD2w.checked + : false + }, + editor: { + theme: this.refs.editorTheme.value, + fontSize: this.refs.editorFontSize.value, + fontFamily: this.refs.editorFontFamily.value, + indentType: this.refs.editorIndentType.value, + indentSize: this.refs.editorIndentSize.value, + switchPreview: this.refs.editorSwitchPreview.value, + keyMap: this.refs.editorKeyMap.value + }, + preview: { + fontSize: this.refs.previewFontSize.value, + fontFamily: this.refs.previewFontFamily.value, + codeBlockTheme: this.refs.previewCodeBlockTheme.value, + lineNumber: this.refs.previewLineNumber.checked + } } + const newCodemirrorTheme = this.refs.editorTheme.value - - let newOptions = { - lineNumbers: true, - theme: config.editor.theme, - readOnly: true, - mode: 'javascript' + if (newCodemirrorTheme !== codemirrorTheme) { + checkHighLight.setAttribute('href', '../node_modules/codemirror/theme/' + newCodemirrorTheme + '.css') } - if (newOptions.theme !== options.theme) { - checkHighLight.setAttribute('href', '../node_modules/codemirror/theme/' + newOptions.theme + '.css') - } - - this.setState({options: newOptions}) - - this.setState({ config }) - + this.setState({ config: newConfig, codemirrorTheme: newCodemirrorTheme }) } handleSaveUIClick (e) { @@ -93,7 +79,8 @@ class UiTab extends React.Component { render () { const themes = consts.THEMES - const { config, options } = this.state + const { config, codemirrorTheme } = this.state + const codemirrorSampleCode = 'function iamHappy (happy) {\n\tif (happy) {\n\t console.log("I am Happy!")\n\t} else {\n\t console.log("I am not Happy!")\n\t}\n};' return (
@@ -145,7 +132,7 @@ class UiTab extends React.Component { }
- +
From a74651b515bce766218663213419f6600573b2fd Mon Sep 17 00:00:00 2001 From: Sosuke Suzuki Date: Sat, 25 Mar 2017 15:32:45 +0900 Subject: [PATCH 04/17] load javascript mode of codemirror & clean up dirty codes --- browser/main/modals/PreferencesModal/UiTab.js | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index 7e32cdbb..e3f8bc62 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -4,22 +4,26 @@ import styles from './ConfigTab.styl' import ConfigManager from 'browser/main/lib/ConfigManager' import store from 'browser/main/store' import consts from 'browser/lib/consts' -import CodeMirror from 'react-codemirror' +import ReactCodeMirror from 'react-codemirror' +import CodeMirror from 'codemirror' const OSX = global.process.platform === 'darwin' class UiTab extends React.Component { constructor (props) { super(props) - this.state = { config: props.config, codemirrorTheme: props.config.editor.theme } } + componentWillMount () { + CodeMirror.autoLoadMode(ReactCodeMirror, 'javascript') + } + handleUIChange (e) { - let { codemirrorTheme } = this.state + const { codemirrorTheme } = this.state let checkHighLight = document.getElementById('checkHighLight') if (checkHighLight === null) { @@ -56,7 +60,7 @@ class UiTab extends React.Component { const newCodemirrorTheme = this.refs.editorTheme.value if (newCodemirrorTheme !== codemirrorTheme) { - checkHighLight.setAttribute('href', '../node_modules/codemirror/theme/' + newCodemirrorTheme + '.css') + checkHighLight.setAttribute('href', `../node_modules/codemirror/theme/${newCodemirrorTheme}.css`) } this.setState({ config: newConfig, codemirrorTheme: newCodemirrorTheme }) @@ -132,7 +136,7 @@ class UiTab extends React.Component { }
- +
From a5531e20f24a91874fe580035adb126672825500 Mon Sep 17 00:00:00 2001 From: Hanju Jo Date: Fri, 14 Apr 2017 17:09:30 +0900 Subject: [PATCH 05/17] Fix new line problem of list and task list --- browser/components/CodeEditor.js | 32 +------------------------------- 1 file changed, 1 insertion(+), 31 deletions(-) diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index 9920cf41..ecf02c15 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -83,37 +83,7 @@ export default class CodeEditor extends React.Component { 'Cmd-T': function (cm) { // Do nothing }, - Enter: (cm) => { - const cursor = cm.getCursor() - const line = cm.getLine(cursor.line) - let bulletType - if (line.trim().startsWith('- ')) { - bulletType = 1 // dash - } else if (line.trim().startsWith('* ')) { - bulletType = 2 // star - } else if (line.trim().startsWith('+ ')) { - bulletType = 3 // plus - } else { - bulletType = 0 // not a bullet - } - const numberedListRegex = /^(\d+)\. .+/ - const match = line.trim().match(numberedListRegex) - if (bulletType !== 0 || match) { - cm.execCommand('newlineAndIndent') - const range = {line: cursor.line + 1, ch: cm.getLine(cursor.line + 1).length} - if (match) { - cm.replaceRange((parseInt(match[1]) + 1) + '. ', range) - } else if (bulletType === 1) { - cm.replaceRange('- ', range) - } else if (bulletType === 2) { - cm.replaceRange('* ', range) - } else if (bulletType === 3) { - cm.replaceRange('+ ', range) - } - } else { - cm.execCommand('newlineAndIndent') - } - } + Enter: 'newlineAndIndentContinueMarkdownList' } }) From fded0ad3e8ee2d3eebd0870d6d8339b573fc79e3 Mon Sep 17 00:00:00 2001 From: Thai Tran Date: Wed, 19 Apr 2017 15:05:47 +1000 Subject: [PATCH 06/17] double click on tab to rename --- browser/components/SnippetTab.js | 1 + 1 file changed, 1 insertion(+) diff --git a/browser/components/SnippetTab.js b/browser/components/SnippetTab.js index 2b4f3ad6..5c0377bd 100644 --- a/browser/components/SnippetTab.js +++ b/browser/components/SnippetTab.js @@ -96,6 +96,7 @@ class SnippetTab extends React.Component { {!this.state.isRenaming ?
Welcome! From e3fb2361395521c8f365b50f2d69dc2daf635b67 Mon Sep 17 00:00:00 2001 From: Kazu Yokomizo Date: Sat, 22 Apr 2017 16:06:01 +0900 Subject: [PATCH 15/17] Fix the config tab layout --- .../modals/PreferencesModal/ConfigTab.styl | 6 +++--- yarn.lock | 19 ++++++++++++++++--- 2 files changed, 19 insertions(+), 6 deletions(-) diff --git a/browser/main/modals/PreferencesModal/ConfigTab.styl b/browser/main/modals/PreferencesModal/ConfigTab.styl index b68eff64..11114272 100644 --- a/browser/main/modals/PreferencesModal/ConfigTab.styl +++ b/browser/main/modals/PreferencesModal/ConfigTab.styl @@ -106,9 +106,9 @@ .code-mirror width 400px - height 140px - margin-top 10px - margin-bottom 10px + height 120px + margin 5px 0 + font-size 12px colorDarkControl() border-color $ui-dark-borderColor diff --git a/yarn.lock b/yarn.lock index 72a9e8c8..f4914772 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1,5 +1,7 @@ # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. # yarn lockfile v1 + + "@rokt33r/markdown-it-math@^4.0.1": version "4.0.2" resolved "https://registry.yarnpkg.com/@rokt33r/markdown-it-math/-/markdown-it-math-4.0.2.tgz#87c7172f459833b05e406cfc846e0c0b7ebc24ef" @@ -1371,6 +1373,10 @@ clap@^1.0.9: dependencies: chalk "^1.1.3" +classnames@^2.2.5: + version "2.2.5" + resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.5.tgz#fb3801d453467649ef3603c7d61a02bd129bde6d" + clean-yaml-object@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/clean-yaml-object/-/clean-yaml-object-0.1.0.tgz#63fb110dc2ce1a84dc21f6d9334876d010ae8b68" @@ -1440,7 +1446,7 @@ code-point-at@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77" -codemirror@^5.19.0: +codemirror@^5.18.2, codemirror@^5.19.0: version "5.25.0" resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.25.0.tgz#78e06939c7bb41f65707b8aa9c5328111948b756" @@ -3813,7 +3819,7 @@ lodash.clonedeep@^4.5.0: version "4.5.0" resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef" -lodash.debounce@^4.0.3: +lodash.debounce@^4.0.3, lodash.debounce@^4.0.8: version "4.0.8" resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" @@ -5123,6 +5129,14 @@ rcedit@^0.5.0: version "0.5.1" resolved "https://registry.yarnpkg.com/rcedit/-/rcedit-0.5.1.tgz#d0bdcf5d280a9d1c29da6f118ccce2ce153cef1d" +react-codemirror@^0.3.0: + version "0.3.0" + resolved "https://registry.yarnpkg.com/react-codemirror/-/react-codemirror-0.3.0.tgz#cd6bd6ef458ec1e035cfd8b3fe7b30c8c7883c6c" + dependencies: + classnames "^2.2.5" + codemirror "^5.18.2" + lodash.debounce "^4.0.8" + react-color@^2.2.2: version "2.11.4" resolved "https://registry.yarnpkg.com/react-color/-/react-color-2.11.4.tgz#43f64630e5d47a243f6bd35300224c9c69c73921" @@ -6670,4 +6684,3 @@ yauzl@2.4.1: resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.4.1.tgz#9528f442dab1b2284e58b4379bb194e22e0c4005" dependencies: fd-slicer "~1.0.1" - From 9d8e71aeb3af7598c0da841545490cfd286f3978 Mon Sep 17 00:00:00 2001 From: sota1235 Date: Sat, 22 Apr 2017 16:34:58 +0900 Subject: [PATCH 16/17] v8.8.8 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index be008d85..94a853f5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "boost", - "version": "0.8.7", + "version": "0.8.8", "description": "Boostnote", "main": "index.js", "license": "GPL-3.0", From 8c11a0b42d2978ebbcc2a04b0c78a50a9572a69d Mon Sep 17 00:00:00 2001 From: Saurabh Date: Sun, 23 Apr 2017 12:43:39 +0530 Subject: [PATCH 17/17] Added `Shift` to HotkeyTab.js --- browser/main/modals/PreferencesModal/HotkeyTab.js | 1 + 1 file changed, 1 insertion(+) diff --git a/browser/main/modals/PreferencesModal/HotkeyTab.js b/browser/main/modals/PreferencesModal/HotkeyTab.js index bbce7c62..f75e41b8 100644 --- a/browser/main/modals/PreferencesModal/HotkeyTab.js +++ b/browser/main/modals/PreferencesModal/HotkeyTab.js @@ -139,6 +139,7 @@ class HotkeyTab extends React.Component {
  • VolumeUp, VolumeDown and VolumeMute
  • MediaNextTrack, MediaPreviousTrack, MediaStop and MediaPlayPause
  • Control (or Ctrl for short)
    • +
  • Shift
    • }