mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-15 10:46:32 +00:00
Compare commits
19 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
050b1563df | ||
|
|
dbbcf385b1 | ||
|
|
d95a3af667 | ||
|
|
87a737babc | ||
|
|
a27ddd7490 | ||
|
|
5693b6d0f5 | ||
|
|
9debe8218d | ||
|
|
9549355ab7 | ||
|
|
88e8d2e009 | ||
|
|
a2ea5dd12e | ||
|
|
9f932a0911 | ||
|
|
71f05b9886 | ||
|
|
2b4e2638dc | ||
|
|
e55f1e0308 | ||
|
|
1d570df129 | ||
|
|
d125bd07f7 | ||
|
|
2e380ceb02 | ||
|
|
f26dea2420 | ||
|
|
5f96e314fd |
@@ -5,19 +5,19 @@ Let us know what is currently happening.
|
|||||||
|
|
||||||
Please include some **screenshots** with the **developer tools** open (console tab) when you report a bug.
|
Please include some **screenshots** with the **developer tools** open (console tab) when you report a bug.
|
||||||
|
|
||||||
If your issue is regarding Boostnote mobile, please open an issue in the Boostnote Mobile repo 👉 https://github.com/BoostIO/boostnote-mobile.
|
If your issue is regarding the new Boost Note.next, please open an issue in the new repo 👉 https://github.com/BoostIO/BoostNote.next/issues.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
# Expected behavior
|
# Expected behavior
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Let us know what you think should happen!
|
Let us know what you think should happen.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
# Steps to reproduce
|
# Steps to reproduce
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Please be thorough, issues we can reproduce are easier to fix!
|
Please be thorough, issues we can reproduce are easier to fix.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
1.
|
1.
|
||||||
@@ -26,8 +26,8 @@ Please be thorough, issues we can reproduce are easier to fix!
|
|||||||
|
|
||||||
# Environment
|
# Environment
|
||||||
|
|
||||||
- Version :
|
- Boostnote version: <!-- 0.x.x -->
|
||||||
- OS Version and name :
|
- OS version and name: <!-- Windows 10 / Ubuntu 18.04 / etc -->
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Love Boostnote? Please consider supporting us on IssueHunt:
|
Love Boostnote? Please consider supporting us on IssueHunt:
|
||||||
|
|||||||
@@ -3,13 +3,16 @@ Before submitting this PR, please make sure that:
|
|||||||
- You have read and understand the contributing.md
|
- You have read and understand the contributing.md
|
||||||
- You have checked docs/code_style.md for information on code style
|
- You have checked docs/code_style.md for information on code style
|
||||||
-->
|
-->
|
||||||
|
|
||||||
## Description
|
## Description
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Tell us what your PR does.
|
Tell us what your PR does.
|
||||||
Please attach a screenshot/ video/gif image describing your PR if possible.
|
Please attach a screenshot/ video/gif image describing your PR if possible.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
## Issue fixed
|
## Issue fixed
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Please list out all issue fixed with this PR here.
|
Please list out all issue fixed with this PR here.
|
||||||
-->
|
-->
|
||||||
@@ -20,6 +23,7 @@ your PR will be reviewed faster if we know exactly what it does.
|
|||||||
|
|
||||||
Change :white_circle: to :radio_button: in all the options that apply
|
Change :white_circle: to :radio_button: in all the options that apply
|
||||||
-->
|
-->
|
||||||
|
|
||||||
## Type of changes
|
## Type of changes
|
||||||
|
|
||||||
- :white_circle: Bug fix (Change that fixed an issue)
|
- :white_circle: Bug fix (Change that fixed an issue)
|
||||||
@@ -34,3 +38,5 @@ Change :white_circle: to :radio_button: in all the options that apply
|
|||||||
- :white_circle: I have written test for my code and it has been tested
|
- :white_circle: I have written test for my code and it has been tested
|
||||||
- :white_circle: All existing tests have been passed
|
- :white_circle: All existing tests have been passed
|
||||||
- :white_circle: I have attached a screenshot/video to visualize my change if possible
|
- :white_circle: I have attached a screenshot/video to visualize my change if possible
|
||||||
|
- :white_circle: This PR will modify the UI or affects the UX
|
||||||
|
- :white_circle: This PR will add/update/delete a keybinding
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
/* eslint-disable camelcase */
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import CSSModules from 'browser/lib/CSSModules'
|
import CSSModules from 'browser/lib/CSSModules'
|
||||||
@@ -29,20 +30,23 @@ class MarkdownEditor extends React.Component {
|
|||||||
isLocked: props.isLocked
|
isLocked: props.isLocked
|
||||||
}
|
}
|
||||||
|
|
||||||
this.lockEditorCode = () => this.handleLockEditor()
|
this.lockEditorCode = this.handleLockEditor.bind(this)
|
||||||
|
this.focusEditor = this.focusEditor.bind(this)
|
||||||
|
|
||||||
|
this.previewRef = React.createRef()
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
this.value = this.refs.code.value
|
this.value = this.refs.code.value
|
||||||
eventEmitter.on('editor:lock', this.lockEditorCode)
|
eventEmitter.on('editor:lock', this.lockEditorCode)
|
||||||
eventEmitter.on('editor:focus', this.focusEditor.bind(this))
|
eventEmitter.on('editor:focus', this.focusEditor)
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate() {
|
componentDidUpdate() {
|
||||||
this.value = this.refs.code.value
|
this.value = this.refs.code.value
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(props) {
|
UNSAFE_componentWillReceiveProps(props) {
|
||||||
if (props.value !== this.props.value) {
|
if (props.value !== this.props.value) {
|
||||||
this.queueRendering(props.value)
|
this.queueRendering(props.value)
|
||||||
}
|
}
|
||||||
@@ -51,7 +55,7 @@ class MarkdownEditor extends React.Component {
|
|||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
this.cancelQueue()
|
this.cancelQueue()
|
||||||
eventEmitter.off('editor:lock', this.lockEditorCode)
|
eventEmitter.off('editor:lock', this.lockEditorCode)
|
||||||
eventEmitter.off('editor:focus', this.focusEditor.bind(this))
|
eventEmitter.off('editor:focus', this.focusEditor)
|
||||||
}
|
}
|
||||||
|
|
||||||
focusEditor() {
|
focusEditor() {
|
||||||
@@ -60,6 +64,9 @@ class MarkdownEditor extends React.Component {
|
|||||||
status: 'CODE'
|
status: 'CODE'
|
||||||
},
|
},
|
||||||
() => {
|
() => {
|
||||||
|
if (this.refs.code == null) {
|
||||||
|
return
|
||||||
|
}
|
||||||
this.refs.code.focus()
|
this.refs.code.focus()
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
@@ -104,7 +111,7 @@ class MarkdownEditor extends React.Component {
|
|||||||
if (newStatus === 'CODE') {
|
if (newStatus === 'CODE') {
|
||||||
this.refs.code.focus()
|
this.refs.code.focus()
|
||||||
} else {
|
} else {
|
||||||
this.refs.preview.focus()
|
this.previewRef.current.focus()
|
||||||
}
|
}
|
||||||
eventEmitter.emit('topbar:togglelockbutton', this.state.status)
|
eventEmitter.emit('topbar:togglelockbutton', this.state.status)
|
||||||
|
|
||||||
@@ -131,8 +138,8 @@ class MarkdownEditor extends React.Component {
|
|||||||
status: 'PREVIEW'
|
status: 'PREVIEW'
|
||||||
},
|
},
|
||||||
() => {
|
() => {
|
||||||
this.refs.preview.focus()
|
this.previewRef.current.focus()
|
||||||
this.refs.preview.scrollToRow(cursorPosition.line)
|
this.previewRef.current.scrollToRow(cursorPosition.line)
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
eventEmitter.emit('topbar:togglelockbutton', this.state.status)
|
eventEmitter.emit('topbar:togglelockbutton', this.state.status)
|
||||||
@@ -379,6 +386,7 @@ class MarkdownEditor extends React.Component {
|
|||||||
RTL={RTL}
|
RTL={RTL}
|
||||||
/>
|
/>
|
||||||
<MarkdownPreview
|
<MarkdownPreview
|
||||||
|
ref={this.previewRef}
|
||||||
styleName={
|
styleName={
|
||||||
this.state.status === 'PREVIEW' ? 'preview' : 'preview--hide'
|
this.state.status === 'PREVIEW' ? 'preview' : 'preview--hide'
|
||||||
}
|
}
|
||||||
@@ -397,7 +405,6 @@ class MarkdownEditor extends React.Component {
|
|||||||
breaks={config.preview.breaks}
|
breaks={config.preview.breaks}
|
||||||
sanitize={config.preview.sanitize}
|
sanitize={config.preview.sanitize}
|
||||||
mermaidHTMLLabel={config.preview.mermaidHTMLLabel}
|
mermaidHTMLLabel={config.preview.mermaidHTMLLabel}
|
||||||
ref='preview'
|
|
||||||
onContextMenu={e => this.handleContextMenu(e)}
|
onContextMenu={e => this.handleContextMenu(e)}
|
||||||
onDoubleClick={e => this.handleDoubleClick(e)}
|
onDoubleClick={e => this.handleDoubleClick(e)}
|
||||||
tabIndex='0'
|
tabIndex='0'
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
import { connect } from 'react-redux'
|
||||||
import Markdown from 'browser/lib/markdown'
|
import Markdown from 'browser/lib/markdown'
|
||||||
import _ from 'lodash'
|
import _ from 'lodash'
|
||||||
import CodeMirror from 'codemirror'
|
import CodeMirror from 'codemirror'
|
||||||
@@ -21,6 +22,7 @@ import { escapeHtmlCharacters } from 'browser/lib/utils'
|
|||||||
import yaml from 'js-yaml'
|
import yaml from 'js-yaml'
|
||||||
import { render } from 'react-dom'
|
import { render } from 'react-dom'
|
||||||
import Carousel from 'react-image-carousel'
|
import Carousel from 'react-image-carousel'
|
||||||
|
import { push } from 'connected-react-router'
|
||||||
import ConfigManager from '../main/lib/ConfigManager'
|
import ConfigManager from '../main/lib/ConfigManager'
|
||||||
import uiThemes from 'browser/lib/ui-themes'
|
import uiThemes from 'browser/lib/ui-themes'
|
||||||
import i18n from 'browser/lib/i18n'
|
import i18n from 'browser/lib/i18n'
|
||||||
@@ -252,7 +254,7 @@ function getSourceLineNumberByElement(element) {
|
|||||||
return parent.dataset.line !== undefined ? parseInt(parent.dataset.line) : -1
|
return parent.dataset.line !== undefined ? parseInt(parent.dataset.line) : -1
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class MarkdownPreview extends React.Component {
|
class MarkdownPreview extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
|
|
||||||
@@ -1116,6 +1118,7 @@ export default class MarkdownPreview extends React.Component {
|
|||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
|
|
||||||
const rawHref = e.target.getAttribute('href')
|
const rawHref = e.target.getAttribute('href')
|
||||||
|
const { dispatch } = this.props
|
||||||
if (!rawHref) return // not checked href because parser will create file://... string for [empty link]()
|
if (!rawHref) return // not checked href because parser will create file://... string for [empty link]()
|
||||||
|
|
||||||
const parser = document.createElement('a')
|
const parser = document.createElement('a')
|
||||||
@@ -1123,6 +1126,8 @@ export default class MarkdownPreview extends React.Component {
|
|||||||
const isStartWithHash = rawHref[0] === '#'
|
const isStartWithHash = rawHref[0] === '#'
|
||||||
const { href, hash } = parser
|
const { href, hash } = parser
|
||||||
|
|
||||||
|
if (!rawHref) return // not checked href because parser will create file://... string for [empty link]()
|
||||||
|
|
||||||
const linkHash = hash === '' ? rawHref : hash // needed because we're having special link formats that are removed by parser e.g. :line:10
|
const linkHash = hash === '' ? rawHref : hash // needed because we're having special link formats that are removed by parser e.g. :line:10
|
||||||
|
|
||||||
const extractIdRegex = /file:\/\/.*main.?\w*.html#/ // file://path/to/main(.development.)html
|
const extractIdRegex = /file:\/\/.*main.?\w*.html#/ // file://path/to/main(.development.)html
|
||||||
@@ -1169,6 +1174,13 @@ export default class MarkdownPreview extends React.Component {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const regexIsTagLink = /^:tag:([\w]+)$/
|
||||||
|
if (regexIsTagLink.test(rawHref)) {
|
||||||
|
const tag = rawHref.match(regexIsTagLink)[1]
|
||||||
|
dispatch(push(`/tags/${encodeURIComponent(tag)}`))
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
// other case
|
// other case
|
||||||
this.openExternal(href)
|
this.openExternal(href)
|
||||||
}
|
}
|
||||||
@@ -1213,3 +1225,10 @@ MarkdownPreview.propTypes = {
|
|||||||
smartArrows: PropTypes.bool,
|
smartArrows: PropTypes.bool,
|
||||||
breaks: PropTypes.bool
|
breaks: PropTypes.bool
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export default connect(
|
||||||
|
null,
|
||||||
|
null,
|
||||||
|
null,
|
||||||
|
{ forwardRef: true }
|
||||||
|
)(MarkdownPreview)
|
||||||
|
|||||||
@@ -229,7 +229,6 @@ class MarkdownSplitEditor extends React.Component {
|
|||||||
breaks={config.preview.breaks}
|
breaks={config.preview.breaks}
|
||||||
sanitize={config.preview.sanitize}
|
sanitize={config.preview.sanitize}
|
||||||
mermaidHTMLLabel={config.preview.mermaidHTMLLabel}
|
mermaidHTMLLabel={config.preview.mermaidHTMLLabel}
|
||||||
ref='preview'
|
|
||||||
tabInde='0'
|
tabInde='0'
|
||||||
value={value}
|
value={value}
|
||||||
onCheckboxClick={e => this.handleCheckboxClick(e)}
|
onCheckboxClick={e => this.handleCheckboxClick(e)}
|
||||||
|
|||||||
@@ -21,7 +21,9 @@ const FolderIcon = ({ className, color, isActive }) => {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {boolean} isActive
|
* @param {boolean} isActive
|
||||||
|
* @param {object} tooltipRef,
|
||||||
* @param {Function} handleButtonClick
|
* @param {Function} handleButtonClick
|
||||||
|
* @param {Function} handleMouseEnter
|
||||||
* @param {Function} handleContextMenu
|
* @param {Function} handleContextMenu
|
||||||
* @param {string} folderName
|
* @param {string} folderName
|
||||||
* @param {string} folderColor
|
* @param {string} folderColor
|
||||||
@@ -35,7 +37,9 @@ const FolderIcon = ({ className, color, isActive }) => {
|
|||||||
const StorageItem = ({
|
const StorageItem = ({
|
||||||
styles,
|
styles,
|
||||||
isActive,
|
isActive,
|
||||||
|
tooltipRef,
|
||||||
handleButtonClick,
|
handleButtonClick,
|
||||||
|
handleMouseEnter,
|
||||||
handleContextMenu,
|
handleContextMenu,
|
||||||
folderName,
|
folderName,
|
||||||
folderColor,
|
folderColor,
|
||||||
@@ -49,6 +53,7 @@ const StorageItem = ({
|
|||||||
<button
|
<button
|
||||||
styleName={isActive ? 'folderList-item--active' : 'folderList-item'}
|
styleName={isActive ? 'folderList-item--active' : 'folderList-item'}
|
||||||
onClick={handleButtonClick}
|
onClick={handleButtonClick}
|
||||||
|
onMouseEnter={handleMouseEnter}
|
||||||
onContextMenu={handleContextMenu}
|
onContextMenu={handleContextMenu}
|
||||||
onDrop={handleDrop}
|
onDrop={handleDrop}
|
||||||
onDragEnter={handleDragEnter}
|
onDragEnter={handleDragEnter}
|
||||||
@@ -75,7 +80,9 @@ const StorageItem = ({
|
|||||||
<span styleName='folderList-item-noteCount'>{noteCount}</span>
|
<span styleName='folderList-item-noteCount'>{noteCount}</span>
|
||||||
)}
|
)}
|
||||||
{isFolded && (
|
{isFolded && (
|
||||||
<span styleName='folderList-item-tooltip'>{folderName}</span>
|
<span styleName='folderList-item-tooltip' ref={tooltipRef}>
|
||||||
|
{folderName}
|
||||||
|
</span>
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
)
|
)
|
||||||
@@ -83,7 +90,9 @@ const StorageItem = ({
|
|||||||
|
|
||||||
StorageItem.propTypes = {
|
StorageItem.propTypes = {
|
||||||
isActive: PropTypes.bool.isRequired,
|
isActive: PropTypes.bool.isRequired,
|
||||||
|
tooltipRef: PropTypes.object,
|
||||||
handleButtonClick: PropTypes.func,
|
handleButtonClick: PropTypes.func,
|
||||||
|
handleMouseEnter: PropTypes.func,
|
||||||
handleContextMenu: PropTypes.func,
|
handleContextMenu: PropTypes.func,
|
||||||
folderName: PropTypes.string.isRequired,
|
folderName: PropTypes.string.isRequired,
|
||||||
folderColor: PropTypes.string,
|
folderColor: PropTypes.string,
|
||||||
|
|||||||
@@ -60,6 +60,7 @@
|
|||||||
border-bottom-right-radius 2px
|
border-bottom-right-radius 2px
|
||||||
height 34px
|
height 34px
|
||||||
line-height 32px
|
line-height 32px
|
||||||
|
transition-property opacity
|
||||||
|
|
||||||
.folderList-item:hover, .folderList-item--active:hover
|
.folderList-item:hover, .folderList-item--active:hover
|
||||||
.folderList-item-tooltip
|
.folderList-item-tooltip
|
||||||
|
|||||||
@@ -1,5 +1,7 @@
|
|||||||
.storageList
|
.storageList
|
||||||
margin-bottom 37px
|
absolute left right
|
||||||
|
bottom 37px
|
||||||
|
top 180px
|
||||||
overflow-y auto
|
overflow-y auto
|
||||||
|
|
||||||
.storageList-folded
|
.storageList-folded
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
/* eslint-disable camelcase */
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import CSSModules from 'browser/lib/CSSModules'
|
import CSSModules from 'browser/lib/CSSModules'
|
||||||
@@ -57,7 +58,8 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
this.dispatchTimer = null
|
this.dispatchTimer = null
|
||||||
|
|
||||||
this.toggleLockButton = this.handleToggleLockButton.bind(this)
|
this.toggleLockButton = this.handleToggleLockButton.bind(this)
|
||||||
this.generateToc = () => this.handleGenerateToc()
|
this.generateToc = this.handleGenerateToc.bind(this)
|
||||||
|
this.handleUpdateContent = this.handleUpdateContent.bind(this)
|
||||||
}
|
}
|
||||||
|
|
||||||
focus() {
|
focus() {
|
||||||
@@ -76,7 +78,7 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
ee.on('code:generate-toc', this.generateToc)
|
ee.on('code:generate-toc', this.generateToc)
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(nextProps) {
|
UNSAFE_componentWillReceiveProps(nextProps) {
|
||||||
const isNewNote = nextProps.note.key !== this.props.note.key
|
const isNewNote = nextProps.note.key !== this.props.note.key
|
||||||
const hasDeletedTags =
|
const hasDeletedTags =
|
||||||
nextProps.note.tags.length < this.props.note.tags.length
|
nextProps.note.tags.length < this.props.note.tags.length
|
||||||
@@ -392,6 +394,9 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
handleSwitchDirection() {
|
handleSwitchDirection() {
|
||||||
|
if (!this.props.config.editor.rtlEnabled) {
|
||||||
|
return
|
||||||
|
}
|
||||||
// If in split mode, hide the lock button
|
// If in split mode, hide the lock button
|
||||||
const direction = this.state.RTL
|
const direction = this.state.RTL
|
||||||
this.setState({ RTL: !direction })
|
this.setState({ RTL: !direction })
|
||||||
@@ -436,10 +441,10 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
storageKey={note.storage}
|
storageKey={note.storage}
|
||||||
noteKey={note.key}
|
noteKey={note.key}
|
||||||
linesHighlighted={note.linesHighlighted}
|
linesHighlighted={note.linesHighlighted}
|
||||||
onChange={this.handleUpdateContent.bind(this)}
|
onChange={this.handleUpdateContent}
|
||||||
isLocked={this.state.isLocked}
|
isLocked={this.state.isLocked}
|
||||||
ignorePreviewPointerEvents={ignorePreviewPointerEvents}
|
ignorePreviewPointerEvents={ignorePreviewPointerEvents}
|
||||||
RTL={this.state.RTL}
|
RTL={config.editor.rtlEnabled && this.state.RTL}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
@@ -451,9 +456,9 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
storageKey={note.storage}
|
storageKey={note.storage}
|
||||||
noteKey={note.key}
|
noteKey={note.key}
|
||||||
linesHighlighted={note.linesHighlighted}
|
linesHighlighted={note.linesHighlighted}
|
||||||
onChange={this.handleUpdateContent.bind(this)}
|
onChange={this.handleUpdateContent}
|
||||||
ignorePreviewPointerEvents={ignorePreviewPointerEvents}
|
ignorePreviewPointerEvents={ignorePreviewPointerEvents}
|
||||||
RTL={this.state.RTL}
|
RTL={config.editor.rtlEnabled && this.state.RTL}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -536,10 +541,12 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
onClick={e => this.handleSwitchMode(e)}
|
onClick={e => this.handleSwitchMode(e)}
|
||||||
editorType={editorType}
|
editorType={editorType}
|
||||||
/>
|
/>
|
||||||
<ToggleDirectionButton
|
{this.props.config.editor.rtlEnabled && (
|
||||||
onClick={e => this.handleSwitchDirection(e)}
|
<ToggleDirectionButton
|
||||||
isRTL={this.state.RTL}
|
onClick={e => this.handleSwitchDirection(e)}
|
||||||
/>
|
isRTL={this.state.RTL}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
<StarButton
|
<StarButton
|
||||||
onClick={e => this.handleStarButtonClick(e)}
|
onClick={e => this.handleStarButtonClick(e)}
|
||||||
isActive={note.isStarred}
|
isActive={note.isStarred}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ const ToggleDirectionButton = ({ onClick, isRTL }) => (
|
|||||||
|
|
||||||
ToggleDirectionButton.propTypes = {
|
ToggleDirectionButton.propTypes = {
|
||||||
onClick: PropTypes.func.isRequired,
|
onClick: PropTypes.func.isRequired,
|
||||||
isRTL: PropTypes.string.isRequired
|
isRTL: PropTypes.bool.isRequired
|
||||||
}
|
}
|
||||||
|
|
||||||
export default CSSModules(ToggleDirectionButton, styles)
|
export default CSSModules(ToggleDirectionButton, styles)
|
||||||
|
|||||||
@@ -144,6 +144,15 @@ class StorageItem extends React.Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
handleFolderMouseEnter(e, tooltipRef, isFolded) {
|
||||||
|
if (isFolded) {
|
||||||
|
const buttonEl = e.currentTarget
|
||||||
|
const tooltipEl = tooltipRef.current
|
||||||
|
|
||||||
|
tooltipEl.style.top = buttonEl.getBoundingClientRect().y + 'px'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
handleFolderButtonContextMenu(e, folder) {
|
handleFolderButtonContextMenu(e, folder) {
|
||||||
context.popup([
|
context.popup([
|
||||||
{
|
{
|
||||||
@@ -316,6 +325,7 @@ class StorageItem extends React.Component {
|
|||||||
folder.key
|
folder.key
|
||||||
)
|
)
|
||||||
const isActive = !!location.pathname.match(folderRegex)
|
const isActive = !!location.pathname.match(folderRegex)
|
||||||
|
const tooltipRef = React.createRef(null)
|
||||||
const noteSet = folderNoteMap.get(storage.key + '-' + folder.key)
|
const noteSet = folderNoteMap.get(storage.key + '-' + folder.key)
|
||||||
|
|
||||||
let noteCount = 0
|
let noteCount = 0
|
||||||
@@ -339,7 +349,11 @@ class StorageItem extends React.Component {
|
|||||||
key={folder.key}
|
key={folder.key}
|
||||||
index={index}
|
index={index}
|
||||||
isActive={isActive || folder.key === this.state.draggedOver}
|
isActive={isActive || folder.key === this.state.draggedOver}
|
||||||
|
tooltipRef={tooltipRef}
|
||||||
handleButtonClick={e => this.handleFolderButtonClick(folder.key)(e)}
|
handleButtonClick={e => this.handleFolderButtonClick(folder.key)(e)}
|
||||||
|
handleMouseEnter={e =>
|
||||||
|
this.handleFolderMouseEnter(e, tooltipRef, isFolded)
|
||||||
|
}
|
||||||
handleContextMenu={e => this.handleFolderButtonContextMenu(e, folder)}
|
handleContextMenu={e => this.handleFolderButtonContextMenu(e, folder)}
|
||||||
folderName={folder.name}
|
folderName={folder.name}
|
||||||
folderColor={folder.color}
|
folderColor={folder.color}
|
||||||
|
|||||||
@@ -33,7 +33,7 @@ export const DEFAULT_CONFIG = {
|
|||||||
hotkey: {
|
hotkey: {
|
||||||
toggleMain: OSX ? 'Command + Alt + L' : 'Super + Alt + E',
|
toggleMain: OSX ? 'Command + Alt + L' : 'Super + Alt + E',
|
||||||
toggleMode: OSX ? 'Command + Alt + M' : 'Ctrl + M',
|
toggleMode: OSX ? 'Command + Alt + M' : 'Ctrl + M',
|
||||||
toggleDirection: OSX ? 'Command + Alt + Right' : 'Ctrl + Right',
|
toggleDirection: OSX ? 'Command + Alt + Right' : 'Ctrl + Alt + Right',
|
||||||
deleteNote: OSX
|
deleteNote: OSX
|
||||||
? 'Command + Shift + Backspace'
|
? 'Command + Shift + Backspace'
|
||||||
: 'Ctrl + Shift + Backspace',
|
: 'Ctrl + Shift + Backspace',
|
||||||
@@ -85,7 +85,8 @@ export const DEFAULT_CONFIG = {
|
|||||||
"semi": false,
|
"semi": false,
|
||||||
"singleQuote": true
|
"singleQuote": true
|
||||||
}`,
|
}`,
|
||||||
deleteUnusedAttachments: true
|
deleteUnusedAttachments: true,
|
||||||
|
rtlEnabled: false
|
||||||
},
|
},
|
||||||
preview: {
|
preview: {
|
||||||
fontSize: '14',
|
fontSize: '14',
|
||||||
|
|||||||
@@ -127,7 +127,8 @@ class UiTab extends React.Component {
|
|||||||
.getCodeMirror()
|
.getCodeMirror()
|
||||||
.getValue(),
|
.getValue(),
|
||||||
prettierConfig: this.prettierConfigCM.getCodeMirror().getValue(),
|
prettierConfig: this.prettierConfigCM.getCodeMirror().getValue(),
|
||||||
deleteUnusedAttachments: this.refs.deleteUnusedAttachments.checked
|
deleteUnusedAttachments: this.refs.deleteUnusedAttachments.checked,
|
||||||
|
rtlEnabled: this.refs.rtlEnabled.checked
|
||||||
},
|
},
|
||||||
preview: {
|
preview: {
|
||||||
fontSize: this.refs.previewFontSize.value,
|
fontSize: this.refs.previewFontSize.value,
|
||||||
@@ -742,6 +743,18 @@ class UiTab extends React.Component {
|
|||||||
)}
|
)}
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
<div styleName='group-checkBoxSection'>
|
||||||
|
<label>
|
||||||
|
<input
|
||||||
|
onChange={e => this.handleUIChange(e)}
|
||||||
|
checked={this.state.config.editor.rtlEnabled}
|
||||||
|
ref='rtlEnabled'
|
||||||
|
type='checkbox'
|
||||||
|
/>
|
||||||
|
|
||||||
|
{i18n.__('Enable right to left direction(RTL)')}
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div styleName='group-section'>
|
<div styleName='group-section'>
|
||||||
<div styleName='group-section-label'>
|
<div styleName='group-section-label'>
|
||||||
|
|||||||
@@ -16,7 +16,7 @@
|
|||||||
const modifier = macOS ? 'metaKey' : 'ctrlKey'
|
const modifier = macOS ? 'metaKey' : 'ctrlKey'
|
||||||
|
|
||||||
class HyperLink {
|
class HyperLink {
|
||||||
constructor(cm) {
|
constructor (cm) {
|
||||||
this.cm = cm
|
this.cm = cm
|
||||||
this.lineDiv = cm.display.lineDiv
|
this.lineDiv = cm.display.lineDiv
|
||||||
|
|
||||||
@@ -47,7 +47,7 @@
|
|||||||
passive: true
|
passive: true
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
getUrl(el) {
|
getUrl (el) {
|
||||||
const className = el.className.split(' ')
|
const className = el.className.split(' ')
|
||||||
|
|
||||||
if (className.indexOf('cm-url') !== -1) {
|
if (className.indexOf('cm-url') !== -1) {
|
||||||
@@ -60,7 +60,7 @@
|
|||||||
|
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
onMouseDown(e) {
|
onMouseDown (e) {
|
||||||
const { target } = e
|
const { target } = e
|
||||||
if (!e[modifier]) {
|
if (!e[modifier]) {
|
||||||
return
|
return
|
||||||
@@ -73,39 +73,37 @@
|
|||||||
shell.openExternal(url)
|
shell.openExternal(url)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onMouseEnter(e) {
|
onMouseEnter (e) {
|
||||||
const { target } = e
|
const { target } = e
|
||||||
|
|
||||||
const url = this.getUrl(target)
|
const url = this.getUrl(target)
|
||||||
if (url) {
|
if (url) {
|
||||||
if (e[modifier]) {
|
if (e[modifier]) {
|
||||||
target.classList.add('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
|
target.classList.add('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
|
||||||
}
|
} else {
|
||||||
else {
|
|
||||||
target.classList.add('CodeMirror-activeline-background')
|
target.classList.add('CodeMirror-activeline-background')
|
||||||
}
|
}
|
||||||
|
|
||||||
this.showInfo(target)
|
this.showInfo(target)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onMouseLeave(e) {
|
onMouseLeave (e) {
|
||||||
if (this.tooltip.parentElement === this.lineDiv) {
|
if (this.tooltip.parentElement === this.lineDiv) {
|
||||||
e.target.classList.remove('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
|
e.target.classList.remove('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
|
||||||
|
|
||||||
this.lineDiv.removeChild(this.tooltip)
|
this.lineDiv.removeChild(this.tooltip)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onMouseMove(e) {
|
onMouseMove (e) {
|
||||||
if (this.tooltip.parentElement === this.lineDiv) {
|
if (this.tooltip.parentElement === this.lineDiv) {
|
||||||
if (e[modifier]) {
|
if (e[modifier]) {
|
||||||
e.target.classList.add('CodeMirror-hyperlink')
|
e.target.classList.add('CodeMirror-hyperlink')
|
||||||
}
|
} else {
|
||||||
else {
|
|
||||||
e.target.classList.remove('CodeMirror-hyperlink')
|
e.target.classList.remove('CodeMirror-hyperlink')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
showInfo(relatedTo) {
|
showInfo (relatedTo) {
|
||||||
const b1 = relatedTo.getBoundingClientRect()
|
const b1 = relatedTo.getBoundingClientRect()
|
||||||
const b2 = this.lineDiv.getBoundingClientRect()
|
const b2 = this.lineDiv.getBoundingClientRect()
|
||||||
const tdiv = this.tooltip
|
const tdiv = this.tooltip
|
||||||
@@ -117,8 +115,7 @@
|
|||||||
const top = b1.top - b2.top - b3.height - yOffset
|
const top = b1.top - b2.top - b3.height - yOffset
|
||||||
if (top < 0) {
|
if (top < 0) {
|
||||||
tdiv.style.top = (b1.top - b2.top + b1.height + yOffset) + 'px'
|
tdiv.style.top = (b1.top - b2.top + b1.height + yOffset) + 'px'
|
||||||
}
|
} else {
|
||||||
else {
|
|
||||||
tdiv.style.top = top + 'px'
|
tdiv.style.top = top + 'px'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "boost",
|
"name": "boost",
|
||||||
"productName": "Boostnote",
|
"productName": "Boostnote",
|
||||||
"version": "0.15.0",
|
"version": "0.15.1",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"description": "Boostnote",
|
"description": "Boostnote",
|
||||||
"license": "GPL-3.0",
|
"license": "GPL-3.0",
|
||||||
|
|||||||
32
yarn.lock
32
yarn.lock
@@ -6001,9 +6001,10 @@ lodash._getnative@^3.0.0:
|
|||||||
resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
|
resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
|
||||||
integrity sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=
|
integrity sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=
|
||||||
|
|
||||||
lodash._reinterpolate@~3.0.0:
|
lodash._reinterpolate@^3.0.0:
|
||||||
version "3.0.0"
|
version "3.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
|
resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
|
||||||
|
integrity sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=
|
||||||
|
|
||||||
lodash.clonedeep@^4.5.0:
|
lodash.clonedeep@^4.5.0:
|
||||||
version "4.5.0"
|
version "4.5.0"
|
||||||
@@ -6087,17 +6088,19 @@ lodash.sortby@^4.7.0:
|
|||||||
resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
|
resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
|
||||||
|
|
||||||
lodash.template@^4.2.2, lodash.template@^4.3.0:
|
lodash.template@^4.2.2, lodash.template@^4.3.0:
|
||||||
version "4.4.0"
|
version "4.5.0"
|
||||||
resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.4.0.tgz#e73a0385c8355591746e020b99679c690e68fba0"
|
resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.5.0.tgz#f976195cf3f347d0d5f52483569fe8031ccce8ab"
|
||||||
|
integrity sha512-84vYFxIkmidUiFxidA/KjjH9pAycqW+h980j7Fuz5qxRtO9pgB7MDFTdys1N7A5mcucRiDyEq4fusljItR1T/A==
|
||||||
dependencies:
|
dependencies:
|
||||||
lodash._reinterpolate "~3.0.0"
|
lodash._reinterpolate "^3.0.0"
|
||||||
lodash.templatesettings "^4.0.0"
|
lodash.templatesettings "^4.0.0"
|
||||||
|
|
||||||
lodash.templatesettings@^4.0.0:
|
lodash.templatesettings@^4.0.0:
|
||||||
version "4.1.0"
|
version "4.2.0"
|
||||||
resolved "https://registry.yarnpkg.com/lodash.templatesettings/-/lodash.templatesettings-4.1.0.tgz#2b4d4e95ba440d915ff08bc899e4553666713316"
|
resolved "https://registry.yarnpkg.com/lodash.templatesettings/-/lodash.templatesettings-4.2.0.tgz#e481310f049d3cf6d47e912ad09313b154f0fb33"
|
||||||
|
integrity sha512-stgLz+i3Aa9mZgnjr/O+v9ruKZsPsndy7qPZOchbqk2cnTU1ZaldKK+v7m54WoKIyxiuMZTKT2H81F8BeAc3ZQ==
|
||||||
dependencies:
|
dependencies:
|
||||||
lodash._reinterpolate "~3.0.0"
|
lodash._reinterpolate "^3.0.0"
|
||||||
|
|
||||||
lodash.uniq@^4.5.0:
|
lodash.uniq@^4.5.0:
|
||||||
version "4.5.0"
|
version "4.5.0"
|
||||||
@@ -7777,9 +7780,10 @@ querystring@0.2.0:
|
|||||||
version "0.2.0"
|
version "0.2.0"
|
||||||
resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.0.tgz#b209849203bb25df820da756e747005878521620"
|
resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.0.tgz#b209849203bb25df820da756e747005878521620"
|
||||||
|
|
||||||
querystringify@^2.0.0:
|
querystringify@^2.1.1:
|
||||||
version "2.0.0"
|
version "2.1.1"
|
||||||
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.0.0.tgz#fa3ed6e68eb15159457c89b37bc6472833195755"
|
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
|
||||||
|
integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
|
||||||
|
|
||||||
randomatic@^3.0.0:
|
randomatic@^3.0.0:
|
||||||
version "3.0.0"
|
version "3.0.0"
|
||||||
@@ -8421,6 +8425,7 @@ require-uncached@^1.0.2, require-uncached@^1.0.3:
|
|||||||
requires-port@^1.0.0:
|
requires-port@^1.0.0:
|
||||||
version "1.0.0"
|
version "1.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
|
resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
|
||||||
|
integrity sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=
|
||||||
|
|
||||||
resolve-cwd@^2.0.0:
|
resolve-cwd@^2.0.0:
|
||||||
version "2.0.0"
|
version "2.0.0"
|
||||||
@@ -9815,10 +9820,11 @@ url-parse-lax@^1.0.0:
|
|||||||
prepend-http "^1.0.1"
|
prepend-http "^1.0.1"
|
||||||
|
|
||||||
url-parse@^1.1.8, url-parse@~1.4.0:
|
url-parse@^1.1.8, url-parse@~1.4.0:
|
||||||
version "1.4.0"
|
version "1.4.7"
|
||||||
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.0.tgz#6bfdaad60098c7fe06f623e42b22de62de0d3d75"
|
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.7.tgz#a8a83535e8c00a316e403a5db4ac1b9b853ae278"
|
||||||
|
integrity sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==
|
||||||
dependencies:
|
dependencies:
|
||||||
querystringify "^2.0.0"
|
querystringify "^2.1.1"
|
||||||
requires-port "^1.0.0"
|
requires-port "^1.0.0"
|
||||||
|
|
||||||
url@0.10.3:
|
url@0.10.3:
|
||||||
|
|||||||
Reference in New Issue
Block a user