From 2e3599d00540a46e657be33ad88b6612fbf7655e Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Mon, 3 Jul 2017 14:07:56 +0900 Subject: [PATCH 1/6] Add a feature which enables to link between notes --- browser/components/MarkdownPreview.js | 19 ++++++++++++++++++ browser/main/NoteList/index.js | 29 +++++++++++++++++++++++++++ browser/main/StatusBar/StatusBar.styl | 7 +++++++ browser/main/StatusBar/index.js | 2 ++ 4 files changed, 57 insertions(+) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index 6ec2aceb..80a9849a 100644 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -108,6 +108,8 @@ export default class MarkdownPreview extends React.Component { this.checkboxClickHandler = (e) => this.handleCheckboxClick(e) this.saveAsTextHandler = () => this.handleSaveAsText() this.saveAsMdHandler = () => this.handleSaveAsMd() + + this.linkClickHandler = this.handlelinkClick.bind(this) } handlePreviewAnchorClick (e) { @@ -249,6 +251,11 @@ export default class MarkdownPreview extends React.Component { el.removeEventListener('click', this.checkboxClickHandler) }) + _.forEach(this.refs.root.contentWindow.document.querySelectorAll('a'), (el) => { + el.removeEventListener('click', this.linkClickHandler) + }) + + let { value, theme, indentSize, codeBlockTheme } = this.props this.refs.root.contentWindow.document.body.setAttribute('data-theme', theme) @@ -273,6 +280,10 @@ export default class MarkdownPreview extends React.Component { el.addEventListener('click', this.checkboxClickHandler) }) + _.forEach(this.refs.root.contentWindow.document.querySelectorAll('a'), (el) => { + el.addEventListener('click', this.linkClickHandler) + }) + codeBlockTheme = consts.THEMES.some((_theme) => _theme === codeBlockTheme) ? codeBlockTheme : 'default' @@ -373,6 +384,14 @@ export default class MarkdownPreview extends React.Component { return new window.Notification(title, options) } + handlelinkClick (e) { + const noteHash = e.target.hash + const regexIsNoteLink = /^#(.{20})-(.{20})$/ + if (regexIsNoteLink.test(noteHash)) { + eventEmitter.emit('list:jump', noteHash.replace(/^#/, '')) + } + } + render () { let { className, style, tabIndex } = this.props return ( diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 59da9c9b..a3c258c1 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -47,6 +47,7 @@ class NoteList extends React.Component { this.alertIfSnippet() } this.importFromFileHandler = this.importFromFile.bind(this) + this.jumpNoteByHash = this.jumpNoteByHashHandler.bind(this) this.jumpToTopHandler = () => { this.jumpToTop() @@ -65,6 +66,7 @@ class NoteList extends React.Component { ee.on('list:top', this.jumpToTopHandler) ee.on('list:jumpToTop', this.jumpToTopHandler) ee.on('import:file', this.importFromFileHandler) + ee.on('list:jump', this.jumpNoteByHash) } componentWillReceiveProps (nextProps) { @@ -87,6 +89,7 @@ class NoteList extends React.Component { ee.off('list:top', this.jumpToTopHandler) ee.off('list:jumpToTop', this.jumpToTopHandler) ee.off('import:file', this.importFromFileHandler) + ee.off('list:jump', this.jumpNoteByHash) } componentDidUpdate (prevProps) { @@ -179,6 +182,32 @@ class NoteList extends React.Component { ee.emit('list:moved') } + jumpNoteByHashHandler (event, noteHash) { + // first argument event isn't used. + if (this.notes == null || this.notes.length === 0) { + return + } + + const { router } = this.context + const { location } = this.props + + let targetIndex = _.findIndex(this.notes, (note) => { + console.log(note.storage+'-'+note.key) + return note.storage + '-' + note.key === noteHash + }) + + if (targetIndex < 0) targetIndex = 0 + + router.push({ + pathname: location.pathname, + query: { + key: this.notes[targetIndex].storage + '-' + this.notes[targetIndex].key + } + }) + + ee.emit('list:moved') + } + handleNoteListKeyDown (e) { if (e.metaKey || e.ctrlKey) return true diff --git a/browser/main/StatusBar/StatusBar.styl b/browser/main/StatusBar/StatusBar.styl index 8dd8dc99..27fcbeac 100644 --- a/browser/main/StatusBar/StatusBar.styl +++ b/browser/main/StatusBar/StatusBar.styl @@ -35,6 +35,13 @@ .update-icon color $brand-color +.note-hash + display inline + line-height 24px + padding-left 5px + font-size 11px + color $ui-button-color + body[data-theme="dark"] .root background-color $ui-dark-noteDetail-backgroundColor diff --git a/browser/main/StatusBar/index.js b/browser/main/StatusBar/index.js index fdd59d32..d1dcec2e 100644 --- a/browser/main/StatusBar/index.js +++ b/browser/main/StatusBar/index.js @@ -48,6 +48,7 @@ class StatusBar extends React.Component { render () { let { config, status } = this.context + const { location } = this.props return (
+
#{location.query.key}
{status.updateReady From 525c490704d90a1cb776d598b6755b5201713309 Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Fri, 7 Apr 2017 13:42:42 -0700 Subject: [PATCH 2/6] Remove console.log --- browser/main/NoteList/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index a3c258c1..1ca82d4e 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -192,7 +192,6 @@ class NoteList extends React.Component { const { location } = this.props let targetIndex = _.findIndex(this.notes, (note) => { - console.log(note.storage+'-'+note.key) return note.storage + '-' + note.key === noteHash }) From b479b21c3797fb2a2207535602f6bd5cb4be6eb2 Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Fri, 7 Apr 2017 14:40:04 -0700 Subject: [PATCH 3/6] Remove a blank line --- browser/components/MarkdownPreview.js | 1 - 1 file changed, 1 deletion(-) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index 80a9849a..9811aac5 100644 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -255,7 +255,6 @@ export default class MarkdownPreview extends React.Component { el.removeEventListener('click', this.linkClickHandler) }) - let { value, theme, indentSize, codeBlockTheme } = this.props this.refs.root.contentWindow.document.body.setAttribute('data-theme', theme) From 8b8cb3c9b4458949ca585084ba531548e7ce364f Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Sat, 6 May 2017 18:32:31 -0700 Subject: [PATCH 4/6] Change styleName in each styles --- browser/main/Detail/MarkdownNoteDetail.js | 1 + browser/main/StatusBar/index.js | 5 +++-- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index c8d9f8f4..300120b7 100644 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -305,6 +305,7 @@ class MarkdownNoteDetail extends React.Component {
) diff --git a/browser/main/StatusBar/index.js b/browser/main/StatusBar/index.js index d1dcec2e..34d8d00e 100644 --- a/browser/main/StatusBar/index.js +++ b/browser/main/StatusBar/index.js @@ -48,7 +48,8 @@ class StatusBar extends React.Component { render () { let { config, status } = this.context - const { location } = this.props + const { location, type } = this.props + const styleName = type === 'MARKDOWN_NOTE' ? 'note-hash-md' : 'note-hash-snippet' return (
-
#{location.query.key}
+
#{location.query.key}
{status.updateReady From bd75f7fd2ca5002d9ea56cae6bf870320162b4ae Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Mon, 3 Jul 2017 14:06:06 +0900 Subject: [PATCH 5/6] Remove a display of a note hash --- browser/main/Detail/MarkdownNoteDetail.js | 1 - browser/main/StatusBar/StatusBar.styl | 7 ------- browser/main/StatusBar/index.js | 3 --- 3 files changed, 11 deletions(-) diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index 300120b7..c8d9f8f4 100644 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -305,7 +305,6 @@ class MarkdownNoteDetail extends React.Component {
) diff --git a/browser/main/StatusBar/StatusBar.styl b/browser/main/StatusBar/StatusBar.styl index 27fcbeac..8dd8dc99 100644 --- a/browser/main/StatusBar/StatusBar.styl +++ b/browser/main/StatusBar/StatusBar.styl @@ -35,13 +35,6 @@ .update-icon color $brand-color -.note-hash - display inline - line-height 24px - padding-left 5px - font-size 11px - color $ui-button-color - body[data-theme="dark"] .root background-color $ui-dark-noteDetail-backgroundColor diff --git a/browser/main/StatusBar/index.js b/browser/main/StatusBar/index.js index 34d8d00e..fdd59d32 100644 --- a/browser/main/StatusBar/index.js +++ b/browser/main/StatusBar/index.js @@ -48,8 +48,6 @@ class StatusBar extends React.Component { render () { let { config, status } = this.context - const { location, type } = this.props - const styleName = type === 'MARKDOWN_NOTE' ? 'note-hash-md' : 'note-hash-snippet' return (
-
#{location.query.key}
{status.updateReady From 75fb29c594ede023b7f1573f01626fd55d7805ad Mon Sep 17 00:00:00 2001 From: asmsuechan Date: Sat, 8 Jul 2017 15:44:20 +0900 Subject: [PATCH 6/6] Change == to === --- browser/main/NoteList/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 1ca82d4e..833c276c 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -184,7 +184,7 @@ class NoteList extends React.Component { jumpNoteByHashHandler (event, noteHash) { // first argument event isn't used. - if (this.notes == null || this.notes.length === 0) { + if (this.notes === null || this.notes.length === 0) { return }