Skip to content

Commit 3d0b79f

Browse files
committed
prepare alpha.5 (remain work: MD preview, keybind)
1 parent d9442aa commit 3d0b79f

18 files changed

Lines changed: 438 additions & 414 deletions

browser/main/HomePage.js

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -44,10 +44,8 @@ class HomePage extends React.Component {
4444
}
4545

4646
function remap (state) {
47-
let status = state.status
48-
// Fetch articles
49-
let data = JSON.parse(localStorage.getItem('local'))
50-
let { folders, articles } = data
47+
let { folders, articles, status } = state
48+
5149
if (articles == null) articles = []
5250
articles.sort((a, b) => {
5351
return new Date(b.updatedAt) - new Date(a.updatedAt)
@@ -112,7 +110,13 @@ function remap (state) {
112110
// 1. team have one folder at least
113111
// or Change IDLE MODE
114112
if (status.mode === CREATE_MODE) {
115-
var newArticle = _.findWhere(articles, {status: 'NEW'})
113+
let newArticle = _.findWhere(articles, {status: 'NEW'})
114+
let FolderKey = folders[0].key
115+
if (folderFilters.length > 0) {
116+
let targetFolder = _.findWhere(folders, {name: folderFilters[0].value})
117+
if (targetFolder != null) FolderKey = targetFolder.key
118+
}
119+
116120
if (newArticle == null) {
117121
newArticle = {
118122
id: null,
@@ -121,7 +125,7 @@ function remap (state) {
121125
content: '',
122126
mode: 'markdown',
123127
tags: [],
124-
FolderKey: folders[0].key,
128+
FolderKey: FolderKey,
125129
status: NEW
126130
}
127131
articles.unshift(newArticle)
@@ -131,14 +135,12 @@ function remap (state) {
131135
status.mode = IDLE_MODE
132136
}
133137

134-
let props = {
138+
return {
135139
folders,
136140
status,
137141
articles,
138142
activeArticle
139143
}
140-
141-
return props
142144
}
143145

144146
HomePage.propTypes = {

browser/main/HomePage/ArticleDetail.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -101,8 +101,8 @@ export default class ArticleDetail extends React.Component {
101101
<div className='left'>
102102
<div className='info'>
103103
<FolderMark color={folder.color}/> {folder.name}&nbsp;
104-
Created {moment(activeArticle.createdAt).format('YYYY/MM/DD')}&nbsp;
105-
Updated {moment(activeArticle.updatedAt).format('YYYY/MM/DD')}
104+
Created : {moment(activeArticle.createdAt).format('YYYY/MM/DD')}&nbsp;
105+
Updated : {moment(activeArticle.updatedAt).format('YYYY/MM/DD')}
106106
</div>
107107
<div className='tags'><i className='fa fa-fw fa-tags'/>{tags}</div>
108108
</div>
@@ -183,7 +183,6 @@ export default class ArticleDetail extends React.Component {
183183
<option key={folder.key} value={folder.key}>{folder.name}</option>
184184
)
185185
})
186-
console.log('edit rendered')
187186

188187
return (
189188
<div className='ArticleDetail edit'>

browser/main/HomePage/ArticleNavigator.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import React, { PropTypes } from 'react'
2-
import ProfileImage from 'boost/components/ProfileImage'
32
import { findWhere } from 'lodash'
43
import { setSearchFilter, switchFolder, switchMode, CREATE_MODE } from 'boost/actions'
54
import { openModal } from 'boost/modal'
65
import FolderMark from 'boost/components/FolderMark'
76
import Preferences from 'boost/components/modal/Preferences'
87
import CreateNewFolder from 'boost/components/modal/CreateNewFolder'
98

9+
import remote from 'remote'
10+
1011
export default class ArticleNavigator extends React.Component {
1112
handlePreferencesButtonClick (e) {
1213
openModal(Preferences)
@@ -50,10 +51,12 @@ export default class ArticleNavigator extends React.Component {
5051
)
5152
})
5253

54+
let userName = remote.getGlobal('process').env.USER
55+
5356
return (
5457
<div className='ArticleNavigator'>
5558
<div className='userInfo'>
56-
<div className='userProfileName'>{process.env.USER}</div>
59+
<div className='userProfileName'>{userName}</div>
5760
<div className='userName'>local</div>
5861
<button onClick={e => this.handlePreferencesButtonClick(e)} className='settingBtn'><i className='fa fa-fw fa-chevron-down'/></button>
5962
</div>

browser/main/HomePage/ArticleTopBar.js

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React, { PropTypes } from 'react'
2+
import ReactDOM from 'react-dom'
23
import ExternalLink from 'boost/components/ExternalLink'
34
import { setSearchFilter } from 'boost/actions'
45

@@ -8,14 +9,25 @@ export default class ArticleTopBar extends React.Component {
89

910
dispatch(setSearchFilter(e.target.value))
1011
}
12+
handleSearchClearButton (e) {
13+
let { dispatch } = this.props
14+
15+
dispatch(setSearchFilter(''))
16+
ReactDOM.findDOMNode(this.refs.searchInput).focus()
17+
}
1118

1219
render () {
1320
return (
1421
<div className='ArticleTopBar'>
1522
<div className='left'>
1623
<div className='search'>
1724
<i className='fa fa-search fa-fw' />
18-
<input value={this.props.status.search} onChange={e => this.handleSearchChange(e)} placeholder='Search' type='text'/>
25+
<input ref='searchInput' value={this.props.status.search} onChange={e => this.handleSearchChange(e)} placeholder='Search' type='text'/>
26+
{
27+
this.props.status.search != null && this.props.status.search.length > 0
28+
? <button onClick={e => this.handleSearchClearButton(e)} className='searchClearBtn'><i className='fa fa-times'/></button>
29+
: null
30+
}
1931
</div>
2032
</div>
2133
<div className='right'>

browser/main/index.js

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,16 @@ import MainPage from './MainPage'
66
import HomePage from './HomePage'
77
// import auth from 'boost/auth'
88
import store from 'boost/store'
9-
let ReactDOM = require('react-dom')
9+
import ReactDOM from 'react-dom'
1010
require('../styles/main/index.styl')
1111

12-
function onlyUser (state, replaceState) {
13-
// let currentUser = auth.user()
14-
// if (currentUser == null) return replaceState('login', '/login')
15-
// if (state.location.pathname === '/') return replaceState('user', '/users/' + currentUser.id)
16-
}
17-
1812
let routes = (
1913
<Route path='/' component={MainPage}>
2014
<IndexRoute name='home' component={HomePage}/>
2115
</Route>
2216
)
2317

2418
let el = document.getElementById('content')
25-
2619
ReactDOM.render((
2720
<div>
2821
<Provider store={store}>

browser/styles/main/HomeContainer/components/ArticleDetail.styl

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,7 @@ iptFocusBorderColor = #369DCD
100100
color white
101101
margin 0 2px
102102
padding 0
103+
border 1px solid darken(brandColor, 10%)
103104
button.tagRemoveBtn
104105
color white
105106
border-radius 2px
@@ -117,13 +118,13 @@ iptFocusBorderColor = #369DCD
117118
font-size 12px
118119
line-height 12px
119120
input.tagInput
120-
background-color white
121+
background-color transparent
121122
outline none
123+
margin 0 2px
122124
border-radius 2px
123-
border 1px solid borderColor
125+
border none
124126
transition 0.1s
125-
&:focus
126-
border-color iptFocusBorderColor
127+
height 18px
127128

128129

129130
.right
@@ -165,8 +166,7 @@ iptFocusBorderColor = #369DCD
165166
border none
166167
background-color transparent
167168
line-height 60px
168-
font-size 32px
169-
font-weight bold
169+
font-size 24px
170170
outline none
171171
&.idle
172172
.detailInfo
@@ -217,9 +217,9 @@ iptFocusBorderColor = #369DCD
217217
absolute top bottom
218218
left 45px
219219
right 15px
220-
font-size 32px
220+
font-size 24px
221221
line-height 60px
222-
font-weight bold
222+
223223
white-space nowrap
224224
overflow-x auto
225225
overflow-y hidden

browser/styles/main/HomeContainer/components/ArticleNavigator.styl

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ articleNavBgColor = #353535
3939
.controlSection
4040
height 88px
4141
padding 22px 15px
42+
margin-bottom 44px
4243
.newPostBtn
4344
border none
4445
background-color brandColor
@@ -80,6 +81,9 @@ articleNavBgColor = #353535
8081
border-color brandColor
8182
.folders
8283
margin-bottom 15px
84+
.folderList
85+
height 340px
86+
overflow-y auto
8387
.folderList button
8488
height 33px
8589
width 199px

browser/styles/main/HomeContainer/components/ArticleTopBar.styl

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,9 @@ bgColor = #E6E6E6
22
inputBgColor = white
33
iptFocusBorderColor = #369DCD
44

5-
refreshBtColor = #B3B3B3
6-
refreshBtnActiveColor = #3A3A3A
5+
topBarBtnColor = #B3B3B3
6+
topBarBtnBgColor = #B3B3B3
7+
topBarBtnBgActiveColor = #3A3A3A
78

89
infoBtnColor = bgColor
910
infoBtnBgColor = #B3B3B3
@@ -41,14 +42,31 @@ infoBtnActiveBgColor = #3A3A3A
4142
z-index 0
4243
&:focus
4344
border-color iptFocusBorderColor
44-
i.fa
45+
i.fa.fa-search
4546
position absolute
4647
display block
4748
top 0
4849
left 10px
4950
line-height 33px
5051
z-index 1
5152
pointer-events none
53+
.searchClearBtn
54+
position absolute
55+
top 6px
56+
right 10px
57+
width 20px
58+
height 20px
59+
border-radius 10px
60+
border none
61+
background-color transparent
62+
color topBarBtnColor
63+
transition 0.1s
64+
line-height 20px
65+
text-align center
66+
padding 0
67+
&:hover
68+
color white
69+
background-color topBarBtnBgColor
5270
&>.refreshBtn
5371
float left
5472
width 33px

lib/actions.js

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
export const ARTICLE_UPDATE = 'ARTICLE_UPDATE'
33
export const ARTICLE_DESTROY = 'ARTICLE_DESTROY'
44
export const FOLDER_CREATE = 'FOLDER_CREATE'
5+
export const FOLDER_UPDATE = 'FOLDER_UPDATE'
56
export const FOLDER_DESTROY = 'FOLDER_DESTROY'
67

78
export const SWITCH_FOLDER = 'SWITCH_FOLDER'
@@ -28,10 +29,10 @@ export function updateArticle (article) {
2829
}
2930
}
3031

31-
export function destroyArticle (articleKey) {
32+
export function destroyArticle (key) {
3233
return {
3334
type: ARTICLE_DESTROY,
34-
data: { articleKey }
35+
data: { key }
3536
}
3637
}
3738

@@ -42,6 +43,13 @@ export function createFolder (folder) {
4243
}
4344
}
4445

46+
export function updateFolder (folder) {
47+
return {
48+
type: FOLDER_UPDATE,
49+
data: { folder }
50+
}
51+
}
52+
4553
export function destroyFolder (key) {
4654
return {
4755
type: FOLDER_DESTROY,

lib/components/FolderMark.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ const GREEN = '#02FF26'
88
const DARKGREEN = '#008A59'
99
const RED = '#E10051'
1010
const PURPLE = '#B013A4'
11+
const BRAND_COLOR = '#2BAC8F'
1112

1213
function getColorByIndex (index) {
1314
switch (index % 8) {
@@ -28,7 +29,7 @@ function getColorByIndex (index) {
2829
case 7:
2930
return PURPLE
3031
default:
31-
return 'gray'
32+
return BRAND_COLOR
3233
}
3334
}
3435

0 commit comments

Comments
 (0)