v0.8.6

Image drag fix

.eslintignore

@@ -0,0 +1,3 @@
+node_modules/
+compiled/
+dist/

.eslintrc

@@ -0,0 +1,6 @@
+{
+  "extends": ["standard", "standard-jsx"],
+  "rules": {
+    "no-useless-escape": 0
+  }
+}

.travis.yml

@@ -0,0 +1,6 @@
+language: node_js
+node_js:
+  - 'stable'
+  - 'lts/*'
+
+script: npm run lint && npm run test

browser/components/CodeEditor.js

@@ -1,6 +1,7 @@
 import React, { PropTypes } from 'react'
 import _ from 'lodash'
 import CodeMirror from 'codemirror'
+import path from 'path'
 
 CodeMirror.modeURL = '../node_modules/codemirror/mode/%N/%N.js'
 
@@ -52,7 +53,7 @@ export default class CodeEditor extends React.Component {
       indentUnit: this.props.indentSize,
       tabSize: this.props.indentSize,
       indentWithTabs: this.props.indentType !== 'space',
-      keyMap: 'sublime',
+      keyMap: this.props.keyMap,
       inputStyle: 'textarea',
       extraKeys: {
         Tab: function (cm) {
@@ -102,6 +103,9 @@ export default class CodeEditor extends React.Component {
     if (prevProps.fontFamily !== this.props.fontFamily) {
       needRefresh = true
     }
+    if (prevProps.keyMap !== this.props.keyMap) {
+      needRefresh = true
+    }
 
     if (prevProps.indentSize !== this.props.indentSize) {
       this.editor.setOption('indentUnit', this.props.indentSize)
@@ -160,6 +164,19 @@ export default class CodeEditor extends React.Component {
     this.editor.setCursor(cursor)
   }
 
+  handleDropImage (e) {
+    e.preventDefault()
+    let imagePath = e.dataTransfer.files[0].path
+    let filename = path.basename(imagePath)
+    let imageMd = `![${encodeURI(filename)}](${encodeURI(imagePath)})`
+    this.insertImage(imageMd)
+  }
+
+  insertImage (imageMd) {
+    const cm = this.editor
+    cm.setValue(cm.getValue() + imageMd)
+  }
+
   render () {
     let { className, fontFamily, fontSize } = this.props
     fontFamily = _.isString(fontFamily) && fontFamily.length > 0
@@ -177,6 +194,7 @@ export default class CodeEditor extends React.Component {
           fontFamily: fontFamily.join(', '),
           fontSize: fontSize
         }}
+        onDrop={(e) => this.handleDropImage(e)}
       />
     )
   }
@@ -194,6 +212,7 @@ CodeEditor.propTypes = {
 CodeEditor.defaultProps = {
   readOnly: false,
   theme: 'xcode',
+  keyMap: 'sublime',
   fontSize: 14,
   fontFamily: 'Monaco, Consolas',
   indentSize: 4,

browser/components/MarkdownEditor.js

@@ -8,9 +8,12 @@ class MarkdownEditor extends React.Component {
   constructor (props) {
     super(props)
 
+    this.escapeFromEditor = ['Control', 'w']
+
     this.state = {
       status: 'PREVIEW',
-      renderValue: props.value
+      renderValue: props.value,
+      keyPressed: {}
     }
   }
 
@@ -74,6 +77,7 @@ class MarkdownEditor extends React.Component {
   }
 
   handleBlur (e) {
+    this.setState({ keyPressed: [] })
     let { config } = this.props
     if (config.editor.switchPreview === 'BLUR') {
       let cursorPosition = this.refs.code.editor.getCursor()
@@ -142,6 +146,24 @@ class MarkdownEditor extends React.Component {
     this.renderPreview(this.props.value)
   }
 
+  handleKeyDown(e) {
+    const keyPressed = Object.assign(this.state.keyPressed, {
+      [e.key]: true
+    })
+    this.setState({ keyPressed })
+    let isNoteHandlerKey = (el) => { return this.state.keyPressed[el] }
+    if (this.state.status === 'CODE' && this.escapeFromEditor.every(isNoteHandlerKey)) {
+      document.activeElement.blur()
+    }
+  }
+
+  handleKeyUp (e) {
+    const keyPressed = Object.assign(this.state.keyPressed, {
+      [e.key]: false
+    })
+    this.setState({ keyPressed })
+  }
+
   render () {
     let { className, value, config } = this.props
 
@@ -160,12 +182,15 @@ class MarkdownEditor extends React.Component {
         }
         onContextMenu={(e) => this.handleContextMenu(e)}
         tabIndex='-1'
+        onKeyDown={(e) => this.handleKeyDown(e)}
+        onKeyUp={(e) => this.handleKeyUp(e)}
       >
         <CodeEditor styleName='codeEditor'
           ref='code'
           mode='GitHub Flavored Markdown'
           value={value}
           theme={config.editor.theme}
+          keyMap={config.editor.keyMap}
           fontFamily={config.editor.fontFamily}
           fontSize={editorFontSize}
           indentType={config.editor.indentType}
@@ -179,6 +204,7 @@ class MarkdownEditor extends React.Component {
           }
           style={previewStyle}
           theme={config.ui.theme}
+          keyMap={config.editor.keyMap}
           fontSize={config.preview.fontSize}
           fontFamily={config.preview.fontFamily}
           codeBlockTheme={config.preview.codeBlockTheme}

browser/components/MarkdownPreview.js

@@ -6,6 +6,8 @@ import consts from 'browser/lib/consts'
 import Raphael from 'raphael'
 import flowchart from 'flowchart'
 import SequenceDiagram from 'js-sequence-diagrams'
+import eventEmitter from 'browser/main/lib/eventEmitter'
+import fs from 'fs'
 
 function decodeHTMLEntities (text) {
   var entities = [
@@ -25,6 +27,7 @@ function decodeHTMLEntities (text) {
 const { remote } = require('electron')
 const { app } = remote
 const path = require('path')
+const dialog = remote.dialog
 
 const markdownStyle = require('!!css!stylus?sourceMap!./markdown.styl')[0][1]
 const appPath = 'file://' + (process.env.NODE_ENV === 'production'
@@ -49,6 +52,8 @@ body {
 }
 code {
   font-family: ${codeBlockFontFamily.join(', ')};
+  background-color: rgba(0,0,0,0.04);
+  color: #CC305F;
 }
 .lineNumber {
   ${lineNumber && 'display: block !important;'}
@@ -90,6 +95,8 @@ export default class MarkdownPreview extends React.Component {
     this.mouseUpHandler = (e) => this.handleMouseUp(e)
     this.anchorClickHandler = (e) => this.handlePreviewAnchorClick(e)
     this.checkboxClickHandler = (e) => this.handleCheckboxClick(e)
+    this.saveAsTextHandler = () => this.handleSaveAsText()
+    this.saveAsMdHandler = () => this.handleSaveAsMd()
   }
 
   handlePreviewAnchorClick (e) {
@@ -134,13 +141,38 @@ export default class MarkdownPreview extends React.Component {
     if (this.props.onMouseUp != null) this.props.onMouseUp(e)
   }
 
+  handleSaveAsText () {
+    this.exportAsDocument('txt')
+  }
+
+  handleSaveAsMd () {
+    this.exportAsDocument('md')
+  }
+
+  exportAsDocument (fileType) {
+    const options = {
+      filters: [
+        { name: 'Documents', extensions: [fileType]}
+      ],
+      properties: ['openFile', 'createDirectory']
+    }
+    dialog.showSaveDialog(remote.getCurrentWindow(), options,
+    (filename) => {
+      if (filename) {
+        fs.writeFile(filename, this.props.value, (err) => {
+          if (err) throw err
+        })
+      }
+    })
+  }
+
   componentDidMount () {
     this.refs.root.setAttribute('sandbox', 'allow-scripts')
     this.refs.root.contentWindow.document.body.addEventListener('contextmenu', this.contextMenuHandler)
 
     this.refs.root.contentWindow.document.head.innerHTML = `
       <style id='style'></style>
-      <link rel="stylesheet" href="${appPath}/compiled/katex-style.css">
+      <link rel="stylesheet" href="${appPath}/node_modules/katex/dist/katex.min.css">
       <link rel="stylesheet" href="${appPath}/node_modules/codemirror/lib/codemirror.css">
       <link rel="stylesheet" id="codeTheme">
     `
@@ -149,12 +181,16 @@ export default class MarkdownPreview extends React.Component {
 
     this.refs.root.contentWindow.document.addEventListener('mousedown', this.mouseDownHandler)
     this.refs.root.contentWindow.document.addEventListener('mouseup', this.mouseUpHandler)
+    eventEmitter.on('export:save-text', this.saveAsTextHandler)
+    eventEmitter.on('export:save-md', this.saveAsMdHandler)
   }
 
   componentWillUnmount () {
     this.refs.root.contentWindow.document.body.removeEventListener('contextmenu', this.contextMenuHandler)
     this.refs.root.contentWindow.document.removeEventListener('mousedown', this.mouseDownHandler)
     this.refs.root.contentWindow.document.removeEventListener('mouseup', this.mouseUpHandler)
+    eventEmitter.off('export:save-text', this.saveAsTextHandler)
+    eventEmitter.off('export:save-md', this.saveAsMdHandler)
   }
 
   componentDidUpdate (prevProps) {
@@ -184,9 +220,9 @@ export default class MarkdownPreview extends React.Component {
   }
 
   setCodeTheme (theme) {
-    theme = consts.THEMES.some((_theme) => _theme === theme)
+    theme = consts.THEMES.some((_theme) => _theme === theme) && theme !== 'default'
       ? theme
-      : 'default'
+      : 'elegant'
     this.getWindow().document.getElementById('codeTheme').href = `${appPath}/node_modules/codemirror/theme/${theme}.css`
   }
 
@@ -219,7 +255,7 @@ export default class MarkdownPreview extends React.Component {
       let syntax = CodeMirror.findModeByName(el.className)
       if (syntax == null) syntax = CodeMirror.findModeByName('Plain Text')
       CodeMirror.requireMode(syntax.mode, () => {
-        let content = el.innerHTML
+        let content = decodeHTMLEntities(el.innerHTML)
         el.innerHTML = ''
         el.parentNode.className += ` cm-s-${codeBlockTheme} CodeMirror`
         CodeMirror.runMode(content, syntax.mime, el, {

browser/components/NoteItem.js

@@ -75,8 +75,8 @@ const NoteItem = ({ isActive, note, dateDisplay, handleNoteClick, handleNoteCont
         : <i styleName='item-title-icon' className='fa fa-fw fa-file-text-o' />
       }
 
-      {note.isStarred ?
-        <i styleName='item-star' className='fa fa-star' /> : ''
+      {note.isStarred
+        ? <i styleName='item-star' className='fa fa-star' /> : ''
       }
     </div>
   </div>
@@ -91,10 +91,10 @@ NoteItem.propTypes = {
     type: PropTypes.string.isRequired,
     title: PropTypes.string.isrequired,
     tags: PropTypes.array,
-    isStarred: PropTypes.bool.isRequired,
+    isStarred: PropTypes.bool.isRequired
   }),
   handleNoteClick: PropTypes.func.isRequired,
-  handleNoteContextMenu: PropTypes.func.isRequired,
+  handleNoteContextMenu: PropTypes.func.isRequired
 }
 
 export default CSSModules(NoteItem, styles)

browser/components/NoteItemSimple.js

@@ -40,10 +40,10 @@ NoteItemSimple.propTypes = {
     storage: PropTypes.string.isRequired,
     key: PropTypes.string.isRequired,
     type: PropTypes.string.isRequired,
-    title: PropTypes.string.isrequired,
+    title: PropTypes.string.isrequired
   }),
   handleNoteClick: PropTypes.func.isRequired,
-  handleNoteContextMenu: PropTypes.func.isRequired,
+  handleNoteContextMenu: PropTypes.func.isRequired
 }
 
 export default CSSModules(NoteItemSimple, styles)

browser/components/SideNavFilter.js

@@ -38,7 +38,7 @@ SideNavFilter.propTypes = {
   isHomeActive: PropTypes.bool.isRequired,
   handleAllNotesButtonClick: PropTypes.func.isRequired,
   isStarredActive: PropTypes.bool.isRequired,
-  handleStarredButtonClick: PropTypes.func.isRequired,
+  handleStarredButtonClick: PropTypes.func.isRequired
 }
 
 export default CSSModules(SideNavFilter, styles)

browser/components/SnippetTab.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './SnippetTab.styl'
 import context from 'browser/lib/context'

browser/components/StorageItem.js

@@ -27,8 +27,8 @@ const StorageItem = ({
     onClick={handleButtonClick}
     onContextMenu={handleContextMenu}
   >
-    <span styleName={isFolded ?
-      'folderList-item-name--folded' : 'folderList-item-name'
+    <span styleName={isFolded
+      ? 'folderList-item-name--folded' : 'folderList-item-name'
     }
       style={{borderColor: folderColor}}
     >
@@ -52,7 +52,7 @@ StorageItem.propTypes = {
   folderName: PropTypes.string.isRequired,
   folderColor: PropTypes.string,
   isFolded: PropTypes.bool.isRequired,
-  noteCount: PropTypes.number,
+  noteCount: PropTypes.number
 }
 
 export default CSSModules(StorageItem, styles)

browser/components/StorageItem.styl

@@ -39,6 +39,8 @@
   border-width 0 0 0 3px
   border-style solid
   border-color transparent
+  overflow hidden
+  text-overflow ellipsis
 
 .folderList-item-noteCount
   float right

browser/finder/FinderMain.styl

@@ -25,6 +25,7 @@ $list-width = 250px
 .result
   absolute left right bottom
   top $search-height
+  background-color $ui-noteDetail-backgroundColor
 
 .result-nav
   user-select none
@@ -89,6 +90,9 @@ body[data-theme="dark"]
   .search-input
     color $ui-dark-text-color
 
+  .result
+    background-color $ui-dark-noteList-backgroundColor
+
   .result-nav
     background-color $ui-dark-backgroundColor
     label

browser/finder/NoteDetail.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './NoteDetail.styl'
 import MarkdownPreview from 'browser/components/MarkdownPreview'
@@ -97,9 +97,7 @@ class NoteDetail extends React.Component {
     let { note, config } = this.props
     if (note == null) {
       return (
-        <div styleName='root'>
-
-        </div>
+        <div styleName='root' />
       )
     }
 
@@ -154,6 +152,7 @@ class NoteDetail extends React.Component {
               fontSize={editorFontSize}
               indentType={config.editor.indentType}
               indentSize={editorIndentSize}
+              keyMap={config.editor.keyMap}
               readOnly
               ref={'code-' + index}
             />

browser/finder/NoteList.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import NoteItem from 'browser/components/NoteItem'
 import moment from 'moment'
 
@@ -54,12 +54,11 @@ class NoteList extends React.Component {
   }
 
   render () {
-    let { storageMap, notes, index } = this.props
+    let { notes, index } = this.props
 
     let notesList = notes
       .slice(0, 10 + 10 * this.state.range)
       .map((note, _index) => {
-
         const isActive = (index === _index)
         const key = `${note.storage}-${note.key}`
         const dateDisplay = moment(note.updatedAt).fromNow()

browser/finder/StorageSection.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './StorageSection.styl'
 import StorageItem from 'browser/components/StorageItem'

browser/finder/index.js

@@ -67,12 +67,8 @@ class FinderMain extends React.Component {
   }
 
   handleWindowBlur (e) {
-    let { filter } = this.state
-    filter.type = 'ALL'
     this.setState({
       search: '',
-      filter,
-      index: 0
     })
   }
 

browser/lib/api.js

@@ -1,21 +0,0 @@
-import superagent from 'superagent'
-import superagentPromise from 'superagent-promise'
-
-export const SERVER_URL = 'https://b00st.io/'
-// export const SERVER_URL = 'http://localhost:3333/'
-
-export const request = superagentPromise(superagent, Promise)
-
-export function shareViaPublicURL (input) {
-  return request
-    .post(SERVER_URL + 'apis/share')
-    // .set({
-    //   Authorization: 'Bearer ' + auth.token()
-    // })
-    .send(input)
-}
-
-export default {
-  SERVER_URL,
-  shareViaPublicURL
-}

browser/lib/customMeta.js

@@ -1,4 +1,3 @@
 import CodeMirror from 'codemirror'
-import _ from 'lodash'
 
 CodeMirror.modeInfo.push({name: 'Stylus', mime: 'text/x-styl', mode: 'stylus', ext: ['styl'], alias: ['styl']})

browser/lib/date-formatter.js

@@ -1,7 +1,7 @@
 /**
  * @fileoverview Formatting date string.
  */
-import moment from 'moment';
+import moment from 'moment'
 
 /**
  * @description Return date string. For example, 'Sep.9, 2016 12:00'.
@@ -11,7 +11,7 @@ import moment from 'moment';
 export function getLastUpdated (date) {
   const m = moment(date)
   if (!m.isValid()) {
-    throw Error('Invalid argument.');
+    throw Error('Invalid argument.')
   }
 
   return m.format('MMM D, gggg H:mm')

browser/main/Detail/FolderSelect.js

@@ -128,8 +128,8 @@ class FolderSelect extends React.Component {
   }
 
   nextOption () {
-    let { storages } = this.props
     let { optionIndex } = this.state
+    let { folders } = this.props
 
     optionIndex++
     if (optionIndex >= folders.length) optionIndex = 0
@@ -262,13 +262,11 @@ class FolderSelect extends React.Component {
           : <div styleName='idle'>
             <div styleName='idle-label'>
               <span styleName='idle-label-name'
-                style={{borderColor: currentOption.folder.color}}
+                style={{color: currentOption.folder.color}}
               >
-                {currentOption.folder.name}
-                <span styleName='idle-label-name-surfix'>in {currentOption.storage.name}</span>
+                {currentOption.folder.name} /
               </span>
             </div>
-            <i styleName='idle-caret' className='fa fa-fw fa-caret-down'/>
           </div>
         }
 

browser/main/Detail/FolderSelect.styl

@@ -7,29 +7,28 @@
   transition 0.15s
   user-select none
   &:hover
-    background-color white
-    border-color $ui-borderColor
+    background-color $ui-button--hover-backgroundColor
 
 .root--search, .root--focus
   @extend .root
-  background-color white
+  background-color $ui-noteDetail-backgroundColor = #F4F4F4
   border-color $ui-input--focus-borderColor
+  width 100px
   &:hover
-    background-color white
     border-color $ui-input--focus-borderColor
 
 .idle
   position relative
   cursor pointer
+
 .idle-label
-  absolute left top
-  padding 0 0 0 5px
   right 20px
   overflow ellipsis
 
 .idle-label-name
-  border-left solid 4px transparent
-  padding 2px 5px
+  font-size 16px
+  padding 2px
+
 .idle-label-name-surfix
   font-size 10px
   color $ui-inactive-text-color
@@ -60,9 +59,9 @@
   max-height 450px
   overflow auto
   z-index 200
+  border $ui-border
   background-color white
   border-radius 2px
-  box-shadow 2px 2px 10px gray
 
 .search-optionList-item
   height 34px
@@ -115,8 +114,8 @@ body[data-theme="dark"]
 
   .search-optionList
     color white
+    border-color $ui-dark-borderColor
     background-color $ui-dark-button--hover-backgroundColor
-    box-shadow 2px 2px 10px black
 
   .search-optionList-item
     &:hover

browser/main/Detail/LastUpdatedString.js

@@ -21,7 +21,7 @@ const LastUpdatedString = ({ date }) => {
 }
 
 LastUpdatedString.propTypes = {
-  date: PropTypes.string,
+  date: PropTypes.string
 }
 
 export default CSSModules(LastUpdatedString, styles)

browser/main/Detail/LastUpdatedString.styl

@@ -1,5 +1,7 @@
 .info-right-date
   display inline
+  line-height 24px
+  padding-right 25px
   font-size 11px
   color $ui-button-color
 

browser/main/Detail/MarkdownNoteDetail.js

@@ -4,7 +4,7 @@ import styles from './MarkdownNoteDetail.styl'
 import MarkdownEditor from 'browser/components/MarkdownEditor'
 import StarButton from './StarButton'
 import TagSelect from './TagSelect'
-import LastUpdatedString from './LastUpdatedString'
+import FolderSelect from './FolderSelect'
 import dataApi from 'browser/main/lib/dataApi'
 import { hashHistory } from 'react-router'
 import ee from 'browser/main/lib/eventEmitter'
@@ -219,6 +219,15 @@ class MarkdownNoteDetail extends React.Component {
               onClick={(e) => this.handleStarButtonClick(e)}
               isActive={note.isStarred}
             />
+            <div styleName='info-left-top'>
+              <FolderSelect styleName='info-left-top-folderSelect'
+                value={this.state.note.storage + '-' + this.state.note.folder}
+                ref='folder'
+                data={data}
+                onChange={(e) => this.handleFolderChange(e)}
+              />
+            </div>
+
             <TagSelect
               ref='tags'
               value={this.state.note.tags}
@@ -226,7 +235,6 @@ class MarkdownNoteDetail extends React.Component {
             />
           </div>
           <div styleName='info-right'>
-            <LastUpdatedString date={note.updatedAt} />
             <button styleName='info-right-button'
               onClick={(e) => this.handleContextButtonClick(e)}
             >
@@ -248,6 +256,7 @@ class MarkdownNoteDetail extends React.Component {
 
         <StatusBar
           {..._.pick(this.props, ['config', 'location', 'dispatch'])}
+          date={note.updatedAt}
         />
       </div>
     )

browser/main/Detail/NoteDetailInfo.styl

@@ -16,6 +16,19 @@ $info-margin-under-border = 27px
   padding 0 5px
   margin 0px 2px
 
+.info-left-top
+  display inline-block
+  height $info-height
+  line-height $info-height
+
+.info-left-top-folderSelect
+  display inline-block
+  padding 0 3px
+  height 34px
+  line-height 34px
+  vertical-align middle
+  border-radius 3px
+
 .info-left-button
   width 34px
   height 34px

browser/main/Detail/SnippetNoteDetail.js

@@ -5,7 +5,7 @@ import CodeEditor from 'browser/components/CodeEditor'
 import MarkdownEditor from 'browser/components/MarkdownEditor'
 import StarButton from './StarButton'
 import TagSelect from './TagSelect'
-import LastUpdatedString from './LastUpdatedString'
+import FolderSelect from './FolderSelect'
 import dataApi from 'browser/main/lib/dataApi'
 import { hashHistory } from 'react-router'
 import ee from 'browser/main/lib/eventEmitter'
@@ -14,6 +14,7 @@ import SnippetTab from 'browser/components/SnippetTab'
 import StatusBar from '../StatusBar'
 import context from 'browser/lib/context'
 import ConfigManager from 'browser/main/lib/ConfigManager'
+import _ from 'lodash'
 
 function pass (name) {
   switch (name) {
@@ -508,6 +509,7 @@ class SnippetNoteDetail extends React.Component {
             fontSize={editorFontSize}
             indentType={config.editor.indentType}
             indentSize={editorIndentSize}
+            keyMap={config.editor.keyMap}
             onChange={(e) => this.handleCodeChange(index)(e)}
             ref={'code-' + index}
           />
@@ -527,6 +529,15 @@ class SnippetNoteDetail extends React.Component {
               onClick={(e) => this.handleStarButtonClick(e)}
               isActive={note.isStarred}
             />
+            <div styleName='info-left-top'>
+              <FolderSelect styleName='info-left-top-folderSelect'
+                value={this.state.note.storage + '-' + this.state.note.folder}
+                ref='folder'
+                data={data}
+                onChange={(e) => this.handleFolderChange(e)}
+              />
+            </div>
+
             <TagSelect
               ref='tags'
               value={this.state.note.tags}
@@ -534,7 +545,6 @@ class SnippetNoteDetail extends React.Component {
             />
           </div>
           <div styleName='info-right'>
-            <LastUpdatedString date={note.updatedAt} />
             <button styleName='info-right-button'
               onClick={(e) => this.handleContextButtonClick(e)}
             >
@@ -595,6 +605,7 @@ class SnippetNoteDetail extends React.Component {
 
         <StatusBar
           {..._.pick(this.props, ['config', 'location', 'dispatch'])}
+          date={note.updatedAt}
         />
       </div>
     )

browser/main/Detail/SnippetNoteDetail.styl

@@ -56,6 +56,7 @@
 
 .override
   absolute bottom left
+  left 60px
   height 23px
   z-index 1
   button

browser/main/Detail/StarButton.styl

@@ -1,5 +1,4 @@
 .root
-  position absolute
   left 7px
   top 0
   padding 0

browser/main/Detail/TagSelect.js

@@ -8,7 +8,7 @@ class TagSelect extends React.Component {
     super(props)
 
     this.state = {
-      newTag: '',
+      newTag: ''
     }
   }
 

browser/main/Detail/TagSelect.styl

@@ -1,7 +1,6 @@
 .root
-  position absolute
+  display inline-block
   top 19px
-  left 44px
   user-select none
   vertical-align middle
   width 300px

browser/main/Main.js

@@ -112,7 +112,7 @@ class Main extends React.Component {
         ConfigManager.set({ navWidth })
         dispatch({
           type: 'SET_NAV_WIDTH',
-          navWidth,
+          navWidth
         })
       })
     }

browser/main/NoteList/index.js

@@ -38,6 +38,9 @@ class NoteList extends React.Component {
     this.focusHandler = () => {
       this.refs.list.focus()
     }
+    this.alertIfSnippetHnalder = () => {
+      this.alertIfSnippet()
+    }
 
     this.state = {
     }
@@ -48,6 +51,7 @@ class NoteList extends React.Component {
     ee.on('list:next', this.selectNextNoteHandler)
     ee.on('list:prior', this.selectPriorNoteHandler)
     ee.on('list:focus', this.focusHandler)
+    ee.on('list:isMarkdownNote', this.alertIfSnippetHnalder)
   }
 
   componentWillReceiveProps (nextProps) {
@@ -66,6 +70,7 @@ class NoteList extends React.Component {
     ee.off('list:next', this.selectNextNoteHandler)
     ee.off('list:prior', this.selectPriorNoteHandler)
     ee.off('list:focus', this.focusHandler)
+    ee.off('list:isMarkdownNote', this.alertIfSnippetHnalder)
   }
 
   componentDidUpdate (prevProps) {
@@ -305,6 +310,20 @@ class NoteList extends React.Component {
     })
   }
 
+  alertIfSnippet() {
+    let { location } = this.props
+    const targetIndex = _.findIndex(this.notes, (note) => {
+      return `${note.storage}-${note.key}` === location.query.key
+    })
+    if (this.notes[targetIndex].type === 'SNIPPET_NOTE') {
+      dialog.showMessageBox(remote.getCurrentWindow(), {
+        type: 'warning',
+        message: 'Sorry!',
+        detail: 'md/text import is available only a markdown note.'
+      })
+    }
+  }
+
   render () {
     let { location, notes, config } = this.props
     let sortFunc = config.sortBy === 'CREATED_AT'
@@ -324,8 +343,8 @@ class NoteList extends React.Component {
         const isDefault = config.listStyle === 'DEFAULT'
         const isActive = location.query.key === note.storage + '-' + note.key
         const dateDisplay = moment(
-          config.sortBy === 'CREATED_AT' ?
-            note.createdAt : note.updatedAt
+          config.sortBy === 'CREATED_AT'
+            ? note.createdAt : note.updatedAt
         ).fromNow()
         const key = `${note.storage}-${note.key}`
 

browser/main/SideNav/SideNav.styl

@@ -10,7 +10,7 @@
 
 .top-menu
   navButtonColor()
-  height $topBar-height - 1
+  height $topBar-height
   padding 0 15px
   font-size 14px
   width 100%

browser/main/SideNav/index.js

@@ -7,9 +7,6 @@ import ConfigManager from 'browser/main/lib/ConfigManager'
 import StorageItem from './StorageItem'
 import SideNavFilter from 'browser/components/SideNavFilter'
 
-const electron = require('electron')
-const { remote } = electron
-
 class SideNav extends React.Component {
   // TODO: should not use electron stuff v0.7
   handleMenuButtonClick (e) {

browser/main/StatusBar/index.js

@@ -2,12 +2,13 @@ import React, { PropTypes } from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './StatusBar.styl'
 import ZoomManager from 'browser/main/lib/ZoomManager'
+import LastUpdatedString from '../Detail/LastUpdatedString'
 
 const electron = require('electron')
 const { remote, ipcRenderer } = electron
 const { Menu, MenuItem, dialog } = remote
 
-const zoomOptions = [0.8, 0.9, 1, 1.1, 1.2, 1.3]
+const zoomOptions = [0.8, 0.9, 1, 1.1, 1.2, 1.3, 1.4, 1.5, 1.6, 1.7, 1.8, 1.9, 2.0]
 
 class StatusBar extends React.Component {
   updateApp () {
@@ -52,22 +53,23 @@ class StatusBar extends React.Component {
       <div className='StatusBar'
         styleName='root'
       >
-        <div styleName='blank' />
-        {status.updateReady
-          ? <button onClick={this.updateApp} styleName='update'>
-            <i styleName='update-icon' className='fa fa-cloud-download' /> Ready to Update!
-          </button>
-          : null
-        }
-        {/*<button styleName='help'>
-          <i className='fa fa-info-circle' />
-        </button>*/}
         <button styleName='zoom'
           onClick={(e) => this.handleZoomButtonClick(e)}
         >
           <i className='fa fa-search-plus' />&nbsp;
           {Math.floor(config.zoom * 100)}%
         </button>
+
+        <div styleName='blank' />
+
+        {status.updateReady
+          ? <button onClick={this.updateApp} styleName='update'>
+            <i styleName='update-icon' className='fa fa-cloud-download' /> Ready to Update!
+            </button>
+          : null
+        }
+
+        <LastUpdatedString date={this.props.date} />
       </div>
     )
   }
@@ -77,7 +79,8 @@ StatusBar.contextTypes = {
   status: PropTypes.shape({
     updateReady: PropTypes.bool.isRequired
   }).isRequired,
-  config: PropTypes.shape({}).isRequired
+  config: PropTypes.shape({}).isRequired,
+  date: PropTypes.string
 }
 
 StatusBar.propTypes = {

browser/main/TopBar/index.js

@@ -10,8 +10,6 @@ import ConfigManager from 'browser/main/lib/ConfigManager'
 import dataApi from 'browser/main/lib/dataApi'
 
 const OSX = window.process.platform === 'darwin'
-const { remote } = require('electron')
-const { Menu, MenuItem } = remote
 
 class TopBar extends React.Component {
   constructor (props) {
@@ -26,14 +24,20 @@ class TopBar extends React.Component {
     this.newNoteHandler = () => {
       this.handleNewPostButtonClick()
     }
+
+    this.focusSearchHandler = () => {
+      this.handleOnSearchFocus()
+    }
   }
 
   componentDidMount () {
     ee.on('top:new-note', this.newNoteHandler)
+    ee.on('top:focus-search', this.focusSearchHandler)
   }
 
   componentWillUnmount () {
     ee.off('top:new-note', this.newNoteHandler)
+    ee.off('top:focus-search', this.focusSearchHandler)
   }
 
   handleNewPostButtonClick (e) {
@@ -71,10 +75,10 @@ class TopBar extends React.Component {
         break
       }
     }
-    if (storage == null) alert('No storage to create a note')
+    if (storage == null) window.alert('No storage to create a note')
     let folder = _.find(storage.folders, {key: params.folderKey})
     if (folder == null) folder = storage.folders[0]
-    if (folder == null) alert('No folder to create a note')
+    if (folder == null) window.alert('No folder to create a note')
 
     return {
       storage,
@@ -246,6 +250,14 @@ class TopBar extends React.Component {
     })
   }
 
+  handleOnSearchFocus () {
+    if (this.state.searchPopupOpen) {
+      this.refs.search.childNodes[0].blur()
+    } else {
+      this.refs.search.childNodes[0].focus()
+    }
+  }
+
   render () {
     let { config, style, data } = this.props
     let searchOptionList = this.getOptions()

browser/main/lib/ConfigManager.js

@@ -16,7 +16,7 @@ export const DEFAULT_CONFIG = {
   listStyle: 'DEFAULT', // 'DEFAULT', 'SMALL'
   hotkey: {
     toggleFinder: OSX ? 'Cmd + Alt + S' : 'Super + Alt + S',
-    toggleMain: OSX ? 'Cmd + Alt + L' : 'Super + Alt + E'
+    toggleMain: OSX ? 'Cmd + Alt + L' : 'Super + Alt + E',
   },
   ui: {
     theme: 'default',
@@ -25,6 +25,7 @@ export const DEFAULT_CONFIG = {
   },
   editor: {
     theme: 'default',
+    keyMap: 'sublime',
     fontSize: '14',
     fontFamily: 'Monaco, Consolas',
     indentType: 'space',
@@ -34,7 +35,7 @@ export const DEFAULT_CONFIG = {
   preview: {
     fontSize: '14',
     fontFamily: 'Lato',
-    codeBlockTheme: 'xcode',
+    codeBlockTheme: 'elegant',
     lineNumber: true
   }
 }

browser/main/modals/InitModal.js

@@ -1,11 +1,10 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './InitModal.styl'
 import dataApi from 'browser/main/lib/dataApi'
 import store from 'browser/main/store'
 import { hashHistory } from 'react-router'
 import _ from 'lodash'
-import keygen from 'browser/lib/keygen'
 
 const CSON = require('@rokt33r/season')
 const path = require('path')

browser/main/modals/InitModal.styl

@@ -28,8 +28,6 @@
   right 10px
   height 30px
   padding 0 25px
-  border $ui-border
-  border-radius 2px
   color $ui-text-color
   colorDefaultButton()
 

browser/main/modals/NewNoteModal.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './NewNoteModal.styl'
 import dataApi from 'browser/main/lib/dataApi'
@@ -102,9 +102,10 @@ class NewNoteModal extends React.Component {
         <div styleName='header'>
           <div styleName='title'>Make a Note</div>
         </div>
-        <button styleName='closeButton'
-          onClick={(e) => this.handleCloseButtonClick(e)}
-        >Close</button>
+        <button styleName='closeButton' onClick={(e) => this.handleCloseButtonClick(e)}>
+          <div styleName='close-mark'>X</div>
+          <div styleName='close-text'>esc</div>
+        </button>
 
         <div styleName='control'>
           <button styleName='control-button'

browser/main/modals/NewNoteModal.styl

@@ -14,20 +14,24 @@
   color $ui-text-color
 
 .closeButton
+  height 50px
   position absolute
-  top 10px
+  background-color transparent
+  color $ui-inactive-text-color
+  border none
+  top 1px
   right 10px
-  height 30px
-  width 0 25px
-  border $ui-border
-  border-radius 2px
-  color $ui-text-color
-  colorDefaultButton()
+  text-align center
+  width top-bar--height
+  height top-bar--height
 
 .control
   padding 25px 15px 15px
   text-align center
 
+.close-mark
+  font-size 15px
+
 .control-button
   width 220px
   height 220px
@@ -64,11 +68,6 @@ body[data-theme="dark"]
     border-color $ui-dark-borderColor
     color $ui-dark-text-color
 
-  .closeButton
-    border-color $ui-dark-borderColor
-    color $ui-dark-text-color
-    colorDarkDefaultButton()
-
   .control-button
     border-color $ui-dark-borderColor
     color $ui-dark-text-color

browser/main/modals/PreferencesModal/ConfigTab.styl

@@ -94,6 +94,10 @@
   p
     line-height 1.2
 
+.note-for-keymap
+  margin-left: 10px
+  font-size: 12px
+
 colorDarkControl()
   border-color $ui-dark-borderColor
   background-color $ui-dark-backgroundColor

browser/main/modals/PreferencesModal/HotkeyTab.js

@@ -7,8 +7,6 @@ import store from 'browser/main/store'
 const electron = require('electron')
 const ipc = electron.ipcRenderer
 
-const OSX = global.process.platform === 'darwin'
-
 class HotkeyTab extends React.Component {
   constructor (props) {
     super(props)
@@ -140,6 +138,7 @@ class HotkeyTab extends React.Component {
                 <li><code>Escape</code> (or <code>Esc</code> for short)</li>
                 <li><code>VolumeUp</code>, <code>VolumeDown</code> and <code>VolumeMute</code></li>
                 <li><code>MediaNextTrack</code>, <code>MediaPreviousTrack</code>, <code>MediaStop</code> and <code>MediaPlayPause</code></li>
+                <li><code>Control</code> (or <code>Ctrl</code> for short)</li>
               </ul>
             </div>
           }
@@ -150,7 +149,7 @@ class HotkeyTab extends React.Component {
 }
 
 HotkeyTab.propTypes = {
-  dispatch: PropTypes.func,
+  dispatch: PropTypes.func
 }
 
 export default CSSModules(HotkeyTab, styles)

browser/main/modals/PreferencesModal/InfoTab.js

@@ -1,4 +1,4 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './InfoTab.styl'
 
@@ -34,7 +34,7 @@ class InfoTab extends React.Component {
               </div>
             </div>
           </div>
-          <div styleName='clear'></div>
+          <div styleName='clear' />
           <div styleName='madeBy'>Made by&nbsp;
             <a href='http://maisin.co/'
               onClick={(e) => this.handleLinkClick(e)}

browser/main/modals/PreferencesModal/StorageItem.js

@@ -106,7 +106,10 @@ class UnstyledFolderItem extends React.Component {
     const popover = { position: 'absolute', zIndex: 2 }
     const cover = {
       position: 'fixed',
-      top: 0, right: 0, bottom: 0, left: 0
+      top: 0,
+      right: 0,
+      bottom: 0,
+      left: 0
     }
     const pickerStyle = Object.assign({}, {
       position: 'absolute'

browser/main/modals/PreferencesModal/UiTab.js

@@ -5,9 +5,6 @@ import ConfigManager from 'browser/main/lib/ConfigManager'
 import store from 'browser/main/store'
 import consts from 'browser/lib/consts'
 
-const electron = require('electron')
-const ipc = electron.ipcRenderer
-
 const OSX = global.process.platform === 'darwin'
 
 class UiTab extends React.Component {
@@ -34,7 +31,8 @@ class UiTab extends React.Component {
       fontFamily: this.refs.editorFontFamily.value,
       indentType: this.refs.editorIndentType.value,
       indentSize: this.refs.editorIndentSize.value,
-      switchPreview: this.refs.editorSwitchPreview.value
+      switchPreview: this.refs.editorSwitchPreview.value,
+      keyMap: this.refs.editorKeyMap.value
     }
     config.preview = {
       fontSize: this.refs.previewFontSize.value,
@@ -181,6 +179,23 @@ class UiTab extends React.Component {
               </select>
             </div>
           </div>
+
+          <div styleName='group-section'>
+            <div styleName='group-section-label'>
+              Editor Keymap
+            </div>
+            <div styleName='group-section-control'>
+              <select value={config.editor.keyMap}
+                ref='editorKeyMap'
+                onChange={(e) => this.handleUIChange(e)}
+              >
+                <option value='sublime'>default</option>
+                <option value='vim'>vim</option>
+              </select>
+              <span styleName='note-for-keymap'>Please reload boostnote after you change the keymap</span>
+            </div>
+          </div>
+
           <div styleName='group-header2'>Preview</div>
           <div styleName='group-section'>
             <div styleName='group-section-label'>

browser/main/modals/RenameFolderModal.styl

@@ -75,3 +75,4 @@ body[data-theme="dark"]
 
   .control-input
     border-color $ui-dark-borderColor
+    color $ui-dark-text-color

contributing.md

@@ -1,23 +1,21 @@
 # Contributing to Boostnote
 
-> English below.
-
-## Pull requestの著作権について
-
-Pull requestをすることはその変化分のコードの著作権をMAISIN&CO.に譲渡することに同意することになります。
-
-アプリケーションのLicenseのをいつでも変える選択肢を残したいからです。
-しかし、これはいずれかBoostnoteが有料の商用アプリになる可能性がある話ではありません。
-もし、このアプリケーションで金を稼ごうとするならBoostnote専用のCloud storageの提供やMobile appとの連動、何か特殊なプレミアム機能の提供など形になると思います。
-現在考えられているのは、GPL v3の場合、他のライセンスとの互換が不可能であるため、もしより自由なLicense(BSD, MIT)に変える時に改めて著作権者としてライセンスし直す選択肢を残したいぐらいのイメージです。
-
----
-
-# Contributing to Boostnote(ENG)
-
 ## About copyright of Pull Request
 
 If you make a pull request, It means you agree to transfer the copyright of the code changes to MAISIN&CO.
 
 It doesn't mean Boostnote will become a paid app. If we want to earn some money, We will try other way, which is some kind of cloud storage, Mobile app integration or some SPECIAL features.
 Because GPL v3 is too strict to be compatible with any other License, We thought this is needed to replace the license with much freer one(like BSD, MIT) somewhen.
+
+---
+
+# Contributing to Boostnote(Japanese)
+
+## Pull requestの著作権について
+
+Pull requestをすることはその変化分のコードの著作権をMAISIN&CO.に譲渡することに同意することになります。
+
+アプリケーションのLicenseをいつでも変える選択肢を残したいと思うからです。
+これはいずれかBoostnoteが有料の商用アプリになる可能性がある話ではありません。
+もし、このアプリケーションに料金が発生する時は、Boostnote専用のCloud storageの提供やMobile appとの連動、何か特殊なプレミアム機能の提供など形になります。
+現在考えられているのは、GPL v3の場合、他のライセンスとの互換が不可能であるため、もしより自由なLicense(BSD, MIT)に変える時に改めて著作権者としてライセンスし直す選択肢を残すイメージです。

docs/build.md

@@ -29,11 +29,6 @@ $ npm run hot
 ```
 > Actually the app can be start with `npm start`. However, the app will use the compiled script.
 
-If the app gets stuck on load, you may need to run the following.
-```
-$ npm run vendor
-```
-
 By this, webpack will watch the code changes and apply it automatically.
 
 > ### Notice

gruntfile.js

@@ -5,16 +5,16 @@ const packager = require('electron-packager')
 const WIN = process.platform === 'win32'
 
 module.exports = function (grunt) {
-  var auth_code
+  var authCode
   try {
-    auth_code = grunt.file.readJSON('secret/auth_code.json')
+    authCode = grunt.file.readJSON('secret/auth_code.json')
   } catch (e) {
     if (e.origError.code === 'ENOENT') {
       console.warn('secret/auth_code.json is not found. CodeSigning is not available.')
     }
   }
-  const OSX_COMMON_NAME = auth_code != null ? auth_code.OSX_COMMON_NAME : ''
-  const WIN_CERT_PASSWORD = auth_code != null ? auth_code.WIN_CERT_PASSWORD : ''
+  const OSX_COMMON_NAME = authCode != null ? authCode.OSX_COMMON_NAME : ''
+  const WIN_CERT_PASSWORD = authCode != null ? authCode.WIN_CERT_PASSWORD : ''
 
   var initConfig = {
     pkg: grunt.file.readJSON('package.json'),
@@ -98,7 +98,7 @@ module.exports = function (grunt) {
       prune: true,
       overwrite: true,
       out: path.join(__dirname, 'dist'),
-      ignore: /node_modules\/ace-builds\/(?!src-min)|node_modules\/ace-builds\/(?=src-min-noconflict)|node_modules\/devicon\/icons|dist|^\/browser|^\/secret|\.babelrc|\.gitignore|^\/\.gitmodules|^\/gruntfile|^\/readme.md|^\/webpack|^\/appdmg\.json|^\/node_modules\/grunt/
+      ignore: /node_modules\/ace-builds\/(?!src-min)|node_modules\/ace-builds\/(?=src-min-noconflict)|node_modules\/devicon\/icons|^\/browser|^\/secret|\.babelrc|\.gitignore|^\/\.gitmodules|^\/gruntfile|^\/readme.md|^\/webpack|^\/appdmg\.json|^\/node_modules\/grunt/
     }
     switch (platform) {
       case 'win':

lib/finder-app.js

@@ -1,19 +1,14 @@
 const electron = require('electron')
 const app = electron.app
-const Menu = electron.Menu
-
-var finderWindow = null
 
 app.on('ready', function () {
   if (process.platform === 'darwin') {
     app.dock.hide()
   }
 
-  // var template = require('./finder-menu')
-  // var menu = Menu.buildFromTemplate(template)
-  // Menu.setApplicationMenu(menu)
-
+  /* eslint-disable */
   finderWindow = require('./finder-window')
+  /* eslint-enable */
 })
 
 module.exports = app

lib/finder-window.js

@@ -1,6 +1,5 @@
 const electron = require('electron')
 const { app } = electron
-const { systemPreferences } = electron
 const BrowserWindow = electron.BrowserWindow
 const Menu = electron.Menu
 const MenuItem = electron.MenuItem
@@ -45,12 +44,8 @@ finderWindow.on('close', function (e) {
   finderWindow.hide()
 })
 
-var trayIcon = process.platform === 'darwin'
-  ? !systemPreferences.isDarkMode()
+var trayIcon = process.platform === 'darwin' || process.platform === 'win32'
   ? path.join(__dirname, '../resources/tray-icon-default.png')
-    : path.join(__dirname, '../resources/tray-icon-dark.png')
-  : process.platform === 'win32'
-    ? path.join(__dirname, '../resources/tray-icon-dark.png')
   : path.join(__dirname, '../resources/tray-icon.png')
 var appIcon = new Tray(trayIcon)
 appIcon.setToolTip('Boostnote')

lib/finder.html

@@ -31,16 +31,17 @@
   <script src="../node_modules/codemirror/addon/mode/overlay.js"></script>
   <script src="../node_modules/codemirror/addon/mode/loadmode.js"></script>
   <script src="../node_modules/codemirror/keymap/sublime.js"></script>
+  <script src="../node_modules/codemirror/keymap/vim.js"></script>
   <script src="../node_modules/codemirror/addon/runmode/runmode.js"></script>
 
-  <script src="../compiled/raphael.js"></script>
-  <script src="../compiled/flowchart.js"></script>
+  <script src="../node_modules/raphael/raphael.min.js"></script>
+  <script src="../node_modules/flowchart.js/release/flowchart.min.js"></script>
 
-  <script src="../compiled/katex.js"></script>
-  <script src="../compiled/react.js"></script>
-  <script src="../compiled/react-dom.js"></script>
-  <script src="../compiled/redux.js"></script>
-  <script src="../compiled/react-redux.js"></script>
+  <script src="../node_modules/katex/dist/katex.min.js"></script>
+  <script src="../node_modules/react/dist/react.min.js"></script>
+  <script src="../node_modules/react-dom/dist/react-dom.min.js"></script>
+  <script src="../node_modules/redux/dist/redux.min.js"></script>
+  <script src="../node_modules/react-redux/dist/react-redux.min.js"></script>
   <script>
     window._ = require('lodash');
   </script>

lib/main-app.js

@@ -2,7 +2,6 @@ const electron = require('electron')
 const app = electron.app
 const Menu = electron.Menu
 const ipc = electron.ipcMain
-const autoUpdater = electron.autoUpdater
 const path = require('path')
 const ChildProcess = require('child_process')
 const _ = require('lodash')
@@ -11,7 +10,6 @@ const GhReleases = require('electron-gh-releases')
 var ipcServer = null
 
 var mainWindow = null
-var finderWindow = null
 
 var shouldQuit = app.makeSingleInstance(function (commandLine, workingDirectory) {
   if (mainWindow) {
@@ -26,12 +24,8 @@ var shouldQuit = app.makeSingleInstance(function(commandLine, workingDirectory)
 
 if (shouldQuit) {
   app.quit()
-  return
 }
 
-var version = app.getVersion()
-var versionText = (version == null || version.length === 0) ? 'DEV version' : 'v' + version
-
 var isUpdateReady = false
 
 var ghReleasesOpts = {
@@ -108,14 +102,12 @@ app.on('ready', function () {
       Menu.setApplicationMenu(menu)
       break
     case 'win32':
+      /* eslint-disable */
       finderWindow = require('./finder-window')
+      /* eslint-disable */
       mainWindow.setMenu(menu)
       break
     case 'linux':
-      // Finder is available on cinnamon only.
-      if (process.env.DESKTOP_SESSION === 'cinnamon') {
-        finderWindow = require('./finder-window')
-      }
       Menu.setApplicationMenu(menu)
       mainWindow.setMenu(menu)
   }

lib/main-menu.js

@@ -59,6 +59,35 @@ var file = {
         mainWindow.webContents.send('top:new-note')
       }
     },
+    {
+      label: 'Focus Note',
+      accelerator: 'Control + E',
+      click () {
+        mainWindow.webContents.send('detail:focus')
+      }
+    },
+    {
+      type: 'separator'
+    },
+    {
+      label: 'Export as',
+      submenu: [
+        {
+          label: 'Plain Text (.txt)',
+          click () {
+            mainWindow.webContents.send('list:isMarkdownNote')
+            mainWindow.webContents.send('export:save-text')
+          }
+        },
+        {
+          label: 'MarkDown (.md)',
+          click () {
+            mainWindow.webContents.send('list:isMarkdownNote')
+            mainWindow.webContents.send('export:save-md')
+          }
+        }
+      ]
+    },
     {
       type: 'separator'
     },
@@ -136,6 +165,33 @@ var view = {
       click: function () {
         BrowserWindow.getFocusedWindow().toggleDevTools()
       }
+    },
+    {
+      type: 'separator'
+    },
+    {
+      label: 'Next Note',
+      accelerator: 'Control + J',
+      click () {
+        mainWindow.webContents.send('list:next')
+      }
+    },
+    {
+      label: 'Previous Note',
+      accelerator: 'Control + U',
+      click () {
+        mainWindow.webContents.send('list:prior')
+      }
+    },
+    {
+      type: 'separator'
+    },
+    {
+      label: 'Focus Search',
+      accelerator: 'Control + S',
+      click () {
+        mainWindow.webContents.send('top:focus-search')
+      }
     }
   ]
 }
@@ -169,7 +225,7 @@ var help = {
   submenu: [
     {
       label: 'Boostnote official site',
-      click: function () { shell.openExternal('https://b00st.io/') }
+      click: function () { shell.openExternal('https://boostnote.io/') }
     },
     {
       label: 'Issue Tracker',

lib/main-window.js

@@ -2,12 +2,15 @@ const electron = require('electron')
 const app = electron.app
 const BrowserWindow = electron.BrowserWindow
 const path = require('path')
+const Config = require('electron-config')
+const config = new Config()
 
 var showMenu = process.platform !== 'win32'
+let windowSize = config.get('windowsize') || { width: 1080, height: 720 }
 
-var mainWindow = new BrowserWindow({
-  width: 1080,
-  height: 720,
+let mainWindow = new BrowserWindow({
+  width: windowSize.width,
+  height: windowSize.height,
   minWidth: 500,
   minHeight: 320,
   autoHideMenuBar: showMenu,
@@ -46,6 +49,12 @@ if (process.platform !== 'linux' || process.env.DESKTOP_SESSION === 'cinnamon')
   })
 
   app.on('before-quit', function (e) {
+    try {
+      config.set('windowsize', mainWindow.getBounds())
+    } catch (e) {
+      // ignore any errors because an error occurs only on update
+      // refs: https://github.com/BoostIO/Boostnote/issues/243
+    }
     mainWindow.removeAllListeners()
   })
 } else {

lib/main.html

@@ -57,22 +57,23 @@
   <script src="../node_modules/codemirror/addon/mode/overlay.js"></script>
   <script src="../node_modules/codemirror/addon/mode/loadmode.js"></script>
   <script src="../node_modules/codemirror/keymap/sublime.js"></script>
+  <script src="../node_modules/codemirror/keymap/vim.js"></script>
   <script src="../node_modules/codemirror/addon/runmode/runmode.js"></script>
 
   <script src="../node_modules/codemirror/addon/edit/continuelist.js"></script>
 
-  <script src="../compiled/raphael.js"></script>
-  <script src="../compiled/flowchart.js"></script>
+  <script src="../node_modules/raphael/raphael.min.js"></script>
+  <script src="../node_modules/flowchart.js/release/flowchart.min.js"></script>
   <script>
     window._ = require('lodash')
   </script>
-  <script src="../node_modules/js-sequence-diagrams/fucknpm/sequence-diagram-min.js"></script>
 
-  <script src="../compiled/katex.js"></script>
-  <script src="../compiled/react.js"></script>
-  <script src="../compiled/react-dom.js"></script>
-  <script src="../compiled/redux.js"></script>
-  <script src="../compiled/react-redux.js"></script>
+  <script src="../node_modules/js-sequence-diagrams/fucknpm/sequence-diagram-min.js"></script>
+  <script src="../node_modules/katex/dist/katex.min.js"></script>
+  <script src="../node_modules/react/dist/react.min.js"></script>
+  <script src="../node_modules/react-dom/dist/react-dom.min.js"></script>
+  <script src="../node_modules/redux/dist/redux.min.js"></script>
+  <script src="../node_modules/react-redux/dist/react-redux.min.js"></script>
   <script type='text/javascript'>
     const electron = require('electron')
     electron.webFrame.setZoomLevelLimits(1, 1)

oh-my-cdn.json

@@ -1,13 +0,0 @@
-{
-  "directory": "compiled",
-  "targets": {
-    "react": "https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react.js",
-    "react-dom": "https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react-dom.js",
-    "redux": "https://cdnjs.cloudflare.com/ajax/libs/redux/3.5.2/redux.js",
-    "react-redux": "https://unpkg.com/react-redux@4.4.5/dist/react-redux.min.js",
-    "katex": "https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.js",
-    "katex-style": "https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.css",
-    "raphael": "https://raw.githubusercontent.com/DmitryBaranovskiy/raphael/master/raphael.js",
-    "flowchart": "https://cdnjs.cloudflare.com/ajax/libs/flowchart/1.6.3/flowchart.js"
-  }
-}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "boost",
-  "version": "0.8.0",
+  "version": "0.8.6",
   "description": "Boostnote",
   "main": "index.js",
   "license": "GPL-3.0",
@@ -8,10 +8,10 @@
     "start": "electron ./index.js",
     "hot": "electron ./index.js --hot",
     "webpack": "webpack-dev-server --hot --inline --config webpack.config.js",
-    "postinstall": "npm run vendor",
-    "vendor": "oh-my-cdn",
     "compile": "grunt compile",
-    "test": "PWD=$(pwd) NODE_ENV=test ava"
+    "test": "PWD=$(pwd) NODE_ENV=test ava",
+    "fix": "npm run lint --fix",
+    "lint": "eslint ./**/*.js"
   },
   "config": {
     "electron-version": "1.2.8"
@@ -44,15 +44,18 @@
   "bugs": {
     "url": "https://github.com/BoostIO/Boostnote/issues"
   },
-  "homepage": "https://b00st.io",
+  "homepage": "https://boostnote.io",
   "dependencies": {
     "@rokt33r/markdown-it-math": "^4.0.1",
     "@rokt33r/season": "^5.3.0",
     "codemirror": "^5.19.0",
+    "electron-config": "^0.2.1",
     "electron-gh-releases": "^2.0.2",
+    "flowchart.js": "^1.6.5",
     "font-awesome": "^4.3.0",
     "immutable": "^3.8.1",
     "js-sequence-diagrams": "^1000000.0.6",
+    "katex": "^0.6.0",
     "lodash": "^4.11.1",
     "markdown-it": "^6.0.1",
     "markdown-it-checkbox": "^1.1.0",
@@ -62,6 +65,11 @@
     "mixpanel": "^0.4.1",
     "moment": "^2.10.3",
     "node-ipc": "^8.1.0",
+    "raphael": "^2.2.7",
+    "react": "^15.0.2",
+    "react-dom": "^15.0.2",
+    "react-redux": "^4.4.5",
+    "redux": "^3.5.2",
     "sander": "^0.5.1",
     "superagent": "^1.2.0",
     "superagent-promise": "^1.0.3"
@@ -81,6 +89,9 @@
     "dom-storage": "^2.0.2",
     "electron-packager": "^6.0.0",
     "electron-prebuilt": "^1.2.8",
+    "eslint": "^3.13.1",
+    "eslint-config-standard": "^6.2.1",
+    "eslint-config-standard-jsx": "^3.2.0",
     "faker": "^3.1.0",
     "grunt": "^0.4.5",
     "grunt-electron-installer": "^1.2.0",
@@ -88,7 +99,6 @@
     "jsdom": "^9.4.2",
     "merge-stream": "^1.0.0",
     "nib": "^1.1.0",
-    "oh-my-cdn": "^0.1.1",
     "react": "^15.3.0",
     "react-color": "^2.2.2",
     "react-css-modules": "^3.7.6",
@@ -107,14 +117,9 @@
     "grunt-electron-installer-debian": "^0.2.0"
   },
   "optional": false,
-  "standard": {
-    "globals": [
-      "localStorage"
-    ]
-  },
   "ava": {
     "files": [
-      "tests/**/*.js"
+      "tests/**/*-test.js"
     ],
     "require": [
       "babel-register"

readme-ja.md

@@ -1,84 +1,37 @@
-# Boostnote
-
-> [Boostnote store](https://boostnote.paintory.com/)をはじめました!! :tada: そして、[Pateron](https://www.patreon.com/boostnote)からも私達を支援することができます!
+<h1 align="center">
+  <a href="https://github.com/BoostIO/Boostnote"><img src="./resources/app.png" alt="Boostnote" width="180"></a>
+  <br>
+  Boostnote
+  <br>
+  <br>
+</h1>
+<h4 align="center">クールなプログラマーの為の、オープンソースのノートアプリ </h4>
+<h5 align="center">macOS, Windows, Linuxで利用できます。</h5>
+<h5 align="center">Built with Electron, React + Redux, Webpack and CSSModules</h5>
 
 ![Boostnote app screenshot](./resources/repository/top.png)
 
-オープンソースノートアプリ
-
-次の用務がある場合にはIssue trackerを利用してください。
-- Boostnoteに関して質問したい時
-- Boostnoteや計画事項にフィードバックがしたい時
-- Boostnoteにバグを報告したい時
-- Boostnoteに寄与したい時
-
-## Goal
-
-単に何かを書くのが楽しくなってほしいです。 :grinning:
-
-- ターゲット OS : OSX, Windows, Linux(後々はモバイルも!)
-- Cloud : Google drive, Dropbox, One drive, iCloud...
-- オープンソースで残ること!
-
-## 印象を受けたアプリ/サービス
-
-- Atom
-- Quiver
-- Evernote
-- GitKraken
-- GitBook
-- Gist
-- Gistbox
-- Snippets Lab
-
-
-## Using stack
-
-- Electron
-- React
-- Webpack
-- Redux
-- CSSModules
-
-## Codestyle
-
-[![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](https://github.com/feross/standard)
-
-## Development
-
-- [Build](docs/build.md)
-
-## Goods
-
-<img src="https://b00st.io/images/t3.png" width="250"/>
-<img src="https://b00st.io/images/t1.png" width="250"/>
-
-[Boostnote store](https://boostnote.paintory.com/)から幾つかのグッズを販売しています。
-
-商品は全世界何処でも届けることができます。このストアは[Paintory](https://paintory.com/)から提供されます。
-
-## Donation
-
-寄付は[Pateron page](https://www.patreon.com/boostnote)からできます。
+[![Build Status](https://travis-ci.org/BoostIO/Boostnote.svg?branch=master)](https://travis-ci.org/BoostIO/Boostnote)
 
 ## Author & Maintainer
-
-[Rokt33r(Dick Choi of MAISIN&CO.)](https://github.com/rokt33r)
+- [Rokt33r](https://github.com/rokt33r)
+- [sota1235](https://github.com/sota1235)
+- [Kohei TAKATA](https://github.com/kohei-takata)
+- [asmsuechan](https://github.com/asmsuechan)
+- [Kazu Yokomizo](https://github.com/kazup01)
 
 ## Contributors
+[Great contributors](https://github.com/BoostIO/Boostnote/graphs/contributors) :tada:
 
-- [Kazu Yokomizo](https://github.com/kazup01)
-- [dojineko](https://github.com/dojineko)
-- [Romain Bazile](https://github.com/gromain)
-- [Bruno Paz](https://github.com/brpaz)
-- [Fabian Mueller](https://github.com/dotcs)
-- [Yoshihisa Mochihara](https://github.com/yosmoc)
-- [Mike Resoli](https://github.com/mikeres0)
-- [tjado](https://github.com/tejado)
-- [sota1235](https://github.com/sota1235)
 
-## Copyright & License
+## More Information
+* Website: http://boostnote.io/
+* Roadmap(upcoming features and bug fixes): https://github.com/BoostIO/Boostnote/wiki/List-of-the-requested-features
+* Boostnote Shop(Products are shipped to all over the world :+1:): https://boostnote.paintory.com/
+* Donation: [Patreon](https://www.patreon.com/boostnote)
+* Development: https://github.com/BoostIO/Boostnote/blob/master/docs/build.md
+* Copyright (C) 2017 Maisin&Co.
 
-Copyright (C) 2016 MAISIN&CO.
+## License
 
 [GPL v3](./LICENSE).

readme-ko.md

@@ -1,85 +0,0 @@
-# Boostnote
-
-> [Boostnote store](https://boostnote.paintory.com/)가 생겼습니다!! :tada: 그리고,[Pateron](https://www.patreon.com/boostnote)에서도 저희를 지원 하실 수 있습니다.!
-
-![Boostnote app screenshot](./resources/repository/top.png)
-
-오픈소스 노트 앱
-
-다음과 같은 용무가 있는 경우 이슈트래커를 이용해 주세요.
-- Boostnote에 대해 질문을 하고 싶을 때
-- Boostnote나 계획사항에 대해 피드백을 주고 싶을 때
-- Boostnote에 버그를 보고하고 싶을 때
-- Boostnote에 기여하고 싶을 때
-
-저흰 Slack을 운영하고 있습니다. 혹시 좀 더 저희들과 깊게 관여하고 싶으시다면 @rokt33r에 초대를 부탁하세요.
-
-## Goal
-
-그냥 글쓰는게 즐거워지셨으면 좋겠어요. :grinning:
-
-- 타겟 OS : OSX, Windows, Linux(나중엔 모바일까지도!)
-- Cloud : Google drive, Dropbox, One drive, iCloud...
-- 오픈소스로 남을 것!
-
-## 영감받은 앱/서비스
-
-- Atom
-- Quiver
-- Evernote
-- GitKraken
-- GitBook
-- Gist
-- Gistbox
-- Snippets Lab
-
-## Using stack
-
-- Electron
-- React
-- Webpack
-- Redux
-- CSSModules
-
-## Codestyle
-
-[![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](https://github.com/feross/standard)
-
-## Development
-
-- [Build](docs/build.md)
-
-## Goods
-
-<img src="https://b00st.io/images/t3.png" width="250"/>
-<img src="https://b00st.io/images/t1.png" width="250"/>
-
-[Boostnote store](https://boostnote.paintory.com/)에서 몇가지 상품들을 팔고있습니다.
-
-전세계 어디든 배송 가능합니다. 이 스토어는 [Paintory](https://paintory.com/)에서 제공됩니다.
-
-## Donation
-
-[Pateron page](https://www.patreon.com/boostnote)에서 기부 하실 수 있습니다.
-
-## Author & Maintainer
-
-[Rokt33r(Dick Choi of MAISIN&CO.)](https://github.com/rokt33r)
-
-## Contributors
-
-- [Kazu Yokomizo](https://github.com/kazup01)
-- [dojineko](https://github.com/dojineko)
-- [Romain Bazile](https://github.com/gromain)
-- [Bruno Paz](https://github.com/brpaz)
-- [Fabian Mueller](https://github.com/dotcs)
-- [Yoshihisa Mochihara](https://github.com/yosmoc)
-- [Mike Resoli](https://github.com/mikeres0)
-- [tjado](https://github.com/tejado)
-- [sota1235](https://github.com/sota1235)
-
-## Copyright & License
-
-Copyright (C) 2016 MAISIN&CO.
-
-[GPL v3](./LICENSE).

readme.md

@@ -5,68 +5,33 @@
   <br>
   <br>
 </h1>
-<h4 align="center">Note app built for developers. </h4>
+<h4 align="center">Note-taking app for programmers. </h4>
 <h5 align="center">macOS, Windows and Linux</h5>
 <h5 align="center">Built with Electron, React + Redux, Webpack and CSSModules</h5>
-<h1> </h1>
-
-> We launched our [Boostnote store](https://boostnote.paintory.com/)!! :tada: Also, you can support us via [Patreon](https://www.patreon.com/boostnote) and [Open collective](https://opencollective.com/boostnote)!
 
 ![Boostnote app screenshot](./resources/repository/top.png)
 
-[日本語](./readme-ja.md) - [한국어](./readme-ko.md)
-
-## Goals
-* We want our users to enjoying writing _anything_. :grinning:
-* Open sourced forever!
-
-See upcoming features and bug fixes [here](https://github.com/BoostIO/Boostnote/issues/68)
-## Feedback
-Please use the [issue tracker](https://github.com/BoostIO/Boostnote/issues) for questions, bug reporting and contribution information.
-
-## Development
-If you want to join our dev Slack group ask @rokt33r.
-**[Build instructions](docs/build.md)**
-
-[![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](https://github.com/feross/standard)
-
-## Inspirations
-- Atom
-- Quiver
-- Evernote
-- GitKraken
-- GitBook
-- Gist
-- Gistbox
-- Snippets Lab
-
-## Store
-<img src="https://b00st.io/images/t3.png" width="250"/>
-<img src="https://b00st.io/images/t1.png" width="250"/>
-
-We're selling Boostnote goods on the [Boostnote store](https://boostnote.paintory.com/).
-
-Products are shipped worldwide. Powered by [Paintory](https://paintory.com/)
-
-## Donation
-* [Patreon](https://www.patreon.com/boostnote)
-* [Open collective](https://opencollective.com/boostnote)
+[![Build Status](https://travis-ci.org/BoostIO/Boostnote.svg?branch=master)](https://travis-ci.org/BoostIO/Boostnote)
 
 ## Author & Maintainer
-[Rokt33r(Dick Choi of MAISIN&CO.)](https://github.com/rokt33r)
+- [Rokt33r](https://github.com/rokt33r)
+- [sota1235](https://github.com/sota1235)
+- [Kohei TAKATA](https://github.com/kohei-takata)
+- [asmsuechan](https://github.com/asmsuechan)
+- [Kazu Yokomizo](https://github.com/kazup01)
 
 ## Contributors
-- [Kazu Yokomizo](https://github.com/kazup01)
-- [dojineko](https://github.com/dojineko)
-- [Romain Bazile](https://github.com/gromain)
-- [Bruno Paz](https://github.com/brpaz)
-- [Fabian Mueller](https://github.com/dotcs)
-- [Yoshihisa Mochihara](https://github.com/yosmoc)
-- [Mike Resoli](https://github.com/mikeres0)
-- [tjado](https://github.com/tejado)
-- [sota1235](https://github.com/sota1235)
+[Great contributors](https://github.com/BoostIO/Boostnote/graphs/contributors) :tada:
 
-## Copyright & License
-Copyright (C) 2016 MAISIN&CO.
+
+## More Information
+* Website: http://boostnote.io/
+* Roadmap(upcoming features and bug fixes): https://github.com/BoostIO/Boostnote/wiki/List-of-the-requested-features
+* Boostnote Shop(Products are shipped to all over the world :+1:): https://boostnote.paintory.com/
+* Donation: [Patreon](https://www.patreon.com/boostnote)
+* Development: https://github.com/BoostIO/Boostnote/blob/master/docs/build.md
+* Copyright (C) 2017 Maisin&Co.
+
+## License
 
 [GPL v3](./LICENSE).

tests/dataApi/init.js

@@ -36,7 +36,7 @@ test.beforeEach((t) => {
 })
 
 test.serial('Initialize All Storages', (t) => {
-  const { v1StorageData, legacyStorageData, emptyStorageData } = t.context
+  const { v1StorageData, legacyStorageData } = t.context
   return Promise.resolve()
     .then(function test () {
       return init()

tests/dataApi/moveNote-test.js

@@ -12,7 +12,6 @@ const TestDummy = require('../fixtures/TestDummy')
 const sander = require('sander')
 const os = require('os')
 const CSON = require('@rokt33r/season')
-const faker = require('faker')
 
 const storagePath = path.join(os.tmpdir(), 'test/move-note')
 const storagePath2 = path.join(os.tmpdir(), 'test/move-note2')