mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 09:46:22 +00:00
add initialization modal & migration func
This commit is contained in:
Dick Choi
212
browser/main/modals/InitModal.js
Normal file
212
browser/main/modals/InitModal.js
Normal file
@@ -0,0 +1,212 @@
|
||||
import React, { PropTypes } 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'
|
||||
|
||||
const CSON = require('season')
|
||||
const path = require('path')
|
||||
const electron = require('electron')
|
||||
const { remote } = electron
|
||||
|
||||
function browseFolder () {
|
||||
let dialog = remote.dialog
|
||||
|
||||
let defaultPath = remote.app.getPath('home')
|
||||
return new Promise((resolve, reject) => {
|
||||
dialog.showOpenDialog({
|
||||
title: 'Select Directory',
|
||||
defaultPath,
|
||||
properties: ['openDirectory', 'createDirectory']
|
||||
}, function (targetPaths) {
|
||||
if (targetPaths == null) return resolve('')
|
||||
resolve(targetPaths[0])
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
class InitModal extends React.Component {
|
||||
constructor (props) {
|
||||
super(props)
|
||||
|
||||
this.state = {
|
||||
path: path.join(remote.app.getPath('home'), 'Boostnote'),
|
||||
migrationRequested: true,
|
||||
isLoading: true,
|
||||
data: null,
|
||||
legacyStorageExists: false
|
||||
}
|
||||
}
|
||||
|
||||
handleCloseButtonClick (e) {
|
||||
this.props.close()
|
||||
}
|
||||
|
||||
handlePathChange (e) {
|
||||
this.setState({
|
||||
path: e.target.value
|
||||
})
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
let data = null
|
||||
try {
|
||||
data = CSON.readFileSync(path.join(remote.app.getPath('userData'), 'local.json'))
|
||||
} catch (err) {
|
||||
if (err.code === 'ENOENT') {
|
||||
return
|
||||
}
|
||||
console.error(err)
|
||||
}
|
||||
let newState = {
|
||||
isLoading: false
|
||||
}
|
||||
if (data != null) {
|
||||
newState.legacyStorageExists = true
|
||||
newState.data = data
|
||||
}
|
||||
this.setState(newState)
|
||||
}
|
||||
|
||||
handlePathBrowseButtonClick (e) {
|
||||
browseFolder()
|
||||
.then((targetPath) => {
|
||||
if (targetPath.length > 0) {
|
||||
this.setState({
|
||||
path: targetPath
|
||||
})
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error('BrowseFAILED')
|
||||
console.error(err)
|
||||
})
|
||||
}
|
||||
|
||||
handleSubmitButtonClick (e) {
|
||||
dataApi
|
||||
.addStorage({
|
||||
name: 'My Storage',
|
||||
path: this.state.path
|
||||
})
|
||||
.then((data) => {
|
||||
if (this.state.migrationRequested && _.isObject(this.state.data) && _.isArray(this.state.data.folders) && _.isArray(this.state.data.articles)) {
|
||||
return dataApi.migrateFromV5(data.storage.key, this.state.data)
|
||||
}
|
||||
return data
|
||||
})
|
||||
.then((data) => {
|
||||
store.dispatch({
|
||||
type: 'ADD_STORAGE',
|
||||
storage: data.storage,
|
||||
notes: data.notes
|
||||
})
|
||||
|
||||
let defaultMarkdownNote = dataApi
|
||||
.createMarkdownNote(data.storage.key, data.storage.folders[0].key, {
|
||||
title: 'Welcome to Boostnote :)',
|
||||
content: '# Welcome to Boostnote :)\nThis is a markdown note.\n\nClick to edit this note.'
|
||||
})
|
||||
.then((note) => {
|
||||
store.dispatch({
|
||||
type: 'CREATE_NOTE',
|
||||
note: note
|
||||
})
|
||||
})
|
||||
let defaultSnippetNote = dataApi
|
||||
.createSnippetNote(data.storage.key, data.storage.folders[0].key, {
|
||||
title: 'Snippet note example',
|
||||
description: 'Snippet note example\nYou can store a series of snippet as a single note like Gist.',
|
||||
snippets: [
|
||||
{
|
||||
name: 'example.html',
|
||||
mode: 'html',
|
||||
content: '<html>\n<body>\n<h1 id=\'hello\'>Hello World</h1>\n</body>\n</html>'
|
||||
},
|
||||
{
|
||||
name: 'example.js',
|
||||
mode: 'javascript',
|
||||
content: 'var html = document.getElementById(\'hello\').innerHTML\n\nconsole.log(html)'
|
||||
}
|
||||
]
|
||||
})
|
||||
.then((note) => {
|
||||
store.dispatch({
|
||||
type: 'CREATE_NOTE',
|
||||
note: note
|
||||
})
|
||||
})
|
||||
|
||||
return Promise.resolve(defaultSnippetNote)
|
||||
.then(defaultMarkdownNote)
|
||||
.then(() => data.storage)
|
||||
})
|
||||
.then((storage) => {
|
||||
hashHistory.push('/storages/' + storage.key)
|
||||
this.props.close()
|
||||
})
|
||||
}
|
||||
|
||||
handleMigrationRequestedChange (e) {
|
||||
this.setState({
|
||||
migrationRequested: e.target.checked
|
||||
})
|
||||
}
|
||||
|
||||
render () {
|
||||
if (this.state.isLoading) {
|
||||
return <div styleName='root--loading'>
|
||||
<i styleName='spinner' className='fa fa-spin fa-spinner'/>
|
||||
<div styleName='loadingMessage'>Preparing initialization...</div>
|
||||
</div>
|
||||
}
|
||||
return (
|
||||
<div styleName='root'>
|
||||
|
||||
<div styleName='header'>
|
||||
<div styleName='header-title'>Initialize Storage</div>
|
||||
</div>
|
||||
<button styleName='closeButton'
|
||||
onClick={(e) => this.handleCloseButtonClick(e)}
|
||||
>Close</button>
|
||||
<div styleName='body'>
|
||||
<div styleName='body-welcome'>
|
||||
Welcome you!
|
||||
</div>
|
||||
<div styleName='body-description'>
|
||||
Boostnote will use this directory as a default storage.
|
||||
</div>
|
||||
<div styleName='body-path'>
|
||||
<input styleName='body-path-input'
|
||||
placeholder='Select Folder'
|
||||
value={this.state.path}
|
||||
onChange={(e) => this.handlePathChange(e)}
|
||||
/>
|
||||
<button styleName='body-path-button'
|
||||
onClick={(e) => this.handlePathBrowseButtonClick(e)}
|
||||
>
|
||||
...
|
||||
</button>
|
||||
</div>
|
||||
<div styleName='body-migration'>
|
||||
<label><input type='checkbox' checked={this.state.migrationRequested} onChange={(e) => this.handleMigrationRequestedChange(e)}/> Migrate old data from the legacy app v0.5</label>
|
||||
</div>
|
||||
|
||||
<div styleName='body-control'>
|
||||
<button styleName='body-control-createButton'
|
||||
onClick={(e) => this.handleSubmitButtonClick(e)}
|
||||
>Let's Go!</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
InitModal.propTypes = {
|
||||
}
|
||||
|
||||
export default CSSModules(InitModal, styles)
|
||||
Reference in New Issue
Block a user