From 26d7f4923df468b9d0736c0efc630a9a52853d96 Mon Sep 17 00:00:00 2001 From: yosmoc Date: Sat, 12 May 2018 23:21:02 +0200 Subject: [PATCH 1/3] support multiplex mode embedded javascript uses combined several modes. Multiplex mode renders ejs and other formats which uses several modes. --- lib/main.html | 1 + 1 file changed, 1 insertion(+) diff --git a/lib/main.html b/lib/main.html index 5e5d13c31..15e2bbebc 100644 --- a/lib/main.html +++ b/lib/main.html @@ -77,6 +77,7 @@ + From 67bba043ed587798bea1279ea1c3c2c93883c3c9 Mon Sep 17 00:00:00 2001 From: yosmoc Date: Sat, 12 May 2018 23:23:12 +0200 Subject: [PATCH 2/3] MarkdownPreview also needs to convert the mode name for specific modes --- browser/components/MarkdownPreview.js | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index 058dce192..935f97e3d 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -123,6 +123,20 @@ if (!OSX) { } const defaultCodeBlockFontFamily = ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', 'monospace'] +function pass (name) { + switch (name) { + case 'ejs': + return 'Embedded Javascript' + case 'html_ruby': + return 'Embedded Ruby' + case 'objectivec': + return 'Objective C' + case 'text': + return 'Plain Text' + default: + return name + } +} export default class MarkdownPreview extends React.Component { constructor (props) { super(props) @@ -430,7 +444,7 @@ export default class MarkdownPreview extends React.Component { : 'default' _.forEach(this.refs.root.contentWindow.document.querySelectorAll('.code code'), (el) => { - let syntax = CodeMirror.findModeByName(el.className) + let syntax = CodeMirror.findModeByName(pass(el.className)) if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text') CodeMirror.requireMode(syntax.mode, () => { const content = htmlTextHelper.decodeEntities(el.innerHTML) From 7e1596de3090969c5e09f4bab669944643e45912 Mon Sep 17 00:00:00 2001 From: yosmoc Date: Sat, 12 May 2018 23:58:15 +0200 Subject: [PATCH 3/3] refactor code duplication --- browser/components/CodeEditor.js | 18 ++---------------- browser/components/MarkdownPreview.js | 18 ++---------------- browser/lib/convertModeName.js | 14 ++++++++++++++ browser/main/Detail/SnippetNoteDetail.js | 18 ++---------------- 4 files changed, 20 insertions(+), 48 deletions(-) create mode 100644 browser/lib/convertModeName.js diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index dfe072ef2..7feef2e84 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -4,6 +4,7 @@ import _ from 'lodash' import CodeMirror from 'codemirror' import 'codemirror-mode-elixir' import attachmentManagement from 'browser/main/lib/dataApi/attachmentManagement' +import convertModeName from 'browser/lib/convertModeName' import eventEmitter from 'browser/main/lib/eventEmitter' import iconv from 'iconv-lite' @@ -15,21 +16,6 @@ const defaultEditorFontFamily = ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', ' const buildCMRulers = (rulers, enableRulers) => enableRulers ? rulers.map(ruler => ({ column: ruler })) : [] -function pass (name) { - switch (name) { - case 'ejs': - return 'Embedded Javascript' - case 'html_ruby': - return 'Embedded Ruby' - case 'objectivec': - return 'Objective C' - case 'text': - return 'Plain Text' - default: - return name - } -} - export default class CodeEditor extends React.Component { constructor (props) { super(props) @@ -229,7 +215,7 @@ export default class CodeEditor extends React.Component { } setMode (mode) { - let syntax = CodeMirror.findModeByName(pass(mode)) + let syntax = CodeMirror.findModeByName(convertModeName(mode)) if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text') this.editor.setOption('mode', syntax.mime) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index 935f97e3d..6646f7494 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -10,6 +10,7 @@ import flowchart from 'flowchart' import SequenceDiagram from 'js-sequence-diagrams' import eventEmitter from 'browser/main/lib/eventEmitter' import htmlTextHelper from 'browser/lib/htmlTextHelper' +import convertModeName from 'browser/lib/convertModeName' import copy from 'copy-to-clipboard' import mdurl from 'mdurl' import exportNote from 'browser/main/lib/dataApi/exportNote' @@ -122,21 +123,6 @@ if (!OSX) { defaultFontFamily.unshift('meiryo') } const defaultCodeBlockFontFamily = ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', 'monospace'] - -function pass (name) { - switch (name) { - case 'ejs': - return 'Embedded Javascript' - case 'html_ruby': - return 'Embedded Ruby' - case 'objectivec': - return 'Objective C' - case 'text': - return 'Plain Text' - default: - return name - } -} export default class MarkdownPreview extends React.Component { constructor (props) { super(props) @@ -444,7 +430,7 @@ export default class MarkdownPreview extends React.Component { : 'default' _.forEach(this.refs.root.contentWindow.document.querySelectorAll('.code code'), (el) => { - let syntax = CodeMirror.findModeByName(pass(el.className)) + let syntax = CodeMirror.findModeByName(convertModeName(el.className)) if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text') CodeMirror.requireMode(syntax.mode, () => { const content = htmlTextHelper.decodeEntities(el.innerHTML) diff --git a/browser/lib/convertModeName.js b/browser/lib/convertModeName.js new file mode 100644 index 000000000..b04310591 --- /dev/null +++ b/browser/lib/convertModeName.js @@ -0,0 +1,14 @@ +export default function convertModeName (name) { + switch (name) { + case 'ejs': + return 'Embedded Javascript' + case 'html_ruby': + return 'Embedded Ruby' + case 'objectivec': + return 'Objective C' + case 'text': + return 'Plain Text' + default: + return name + } +} diff --git a/browser/main/Detail/SnippetNoteDetail.js b/browser/main/Detail/SnippetNoteDetail.js index 411027d52..4f9903e91 100644 --- a/browser/main/Detail/SnippetNoteDetail.js +++ b/browser/main/Detail/SnippetNoteDetail.js @@ -18,6 +18,7 @@ import context from 'browser/lib/context' import ConfigManager from 'browser/main/lib/ConfigManager' import _ from 'lodash' import {findNoteTitle} from 'browser/lib/findNoteTitle' +import convertModeName from 'browser/lib/convertModeName' import AwsMobileAnalyticsConfig from 'browser/main/lib/AwsMobileAnalyticsConfig' import TrashButton from './TrashButton' import RestoreButton from './RestoreButton' @@ -29,21 +30,6 @@ import { formatDate } from 'browser/lib/date-formatter' import i18n from 'browser/lib/i18n' import { confirmDeleteNote } from 'browser/lib/confirmDeleteNote' -function pass (name) { - switch (name) { - case 'ejs': - return 'Embedded Javascript' - case 'html_ruby': - return 'Embedded Ruby' - case 'objectivec': - return 'Objective C' - case 'text': - return 'Plain Text' - default: - return name - } -} - const electron = require('electron') const { remote } = electron const { Menu, MenuItem, dialog } = remote @@ -677,7 +663,7 @@ class SnippetNoteDetail extends React.Component { const viewList = note.snippets.map((snippet, index) => { const isActive = this.state.snippetIndex === index - let syntax = CodeMirror.findModeByName(pass(snippet.mode)) + let syntax = CodeMirror.findModeByName(convertModeName(snippet.mode)) if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text') return