Skip to content
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit aa0444a

Browse files
mydearxymmydearxym
committed
prepare for protype
1 parent 01f0fe0 commit aa0444a

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+488
-342
lines changed

‎components/Navigator/index.js

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
/*
2+
*
3+
* Navigator
4+
*
5+
*/
6+
7+
import React from 'react'
8+
// import PropTypes from 'prop-types'
9+
10+
import { makeDebugger } from '../../utils/functions'
11+
import { Breadcrumbs, UL, LI, A } from './style'
12+
/* eslint-disable no-unused-vars */
13+
const debug = makeDebugger('c:Navigator:index')
14+
/* eslint-enable no-unused-vars */
15+
16+
const Navigator = () => {
17+
return (
18+
<Breadcrumbs>
19+
<UL>
20+
<LI>
21+
<A>
22+
<span>Coder-Club</span>
23+
</A>
24+
</LI>
25+
<LI>
26+
<A>
27+
<span>Js</span>
28+
</A>
29+
</LI>
30+
<LI active>
31+
<A>
32+
<span>帖子：我是一个人哈哈</span>
33+
</A>
34+
</LI>
35+
<LI>
36+
<A>
37+
<span>Checkout</span>
38+
</A>
39+
</LI>
40+
</UL>
41+
</Breadcrumbs>
42+
)
43+
}
44+
45+
/*
46+
Navigator.propTypes = {
47+
// https://www.npmjs.com/package/prop-types
48+
}
49+
50+
Navigator.defaultProps = {}
51+
*/
52+
53+
export default Navigator

‎components/Navigator/style/index.js

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import styled from 'styled-components'
2+
3+
import { theme } from '../../../utils/themes'
4+
5+
export const Breadcrumbs = styled.div`
6+
max-width: 520px;
7+
margin-left: 3vw;
8+
height: 100%;
9+
`
10+
11+
export const UL = styled.ul`
12+
&:before {
13+
content: ' ';
14+
display: table;
15+
}
16+
&:after {
17+
content: ' ';
18+
display: table;
19+
clear: both;
20+
}
21+
`
22+
export const LI = styled.li`
23+
float: left;
24+
padding: 0 5px;
25+
min-width: 15%;
26+
max-width: 30%;
27+
border-bottom: ${props =>
28+
props.active ? theme('navigator.activeBottom', props) : ''};
29+
border-right: ${theme('navigator.borderRight')};
30+
&:hover {
31+
background: ${theme('navigator.hoverBg')};
32+
}
33+
`
34+
35+
export const A = styled.a`
36+
position: relative;
37+
display: block;
38+
padding: 10px;
39+
padding-right: 0 !important;
40+
font-size: 1em;
41+
text-align: center;
42+
color: #aaa;
43+
cursor: pointer;
44+
`

‎components/Navigator/tests/index.test.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// import React from 'react'
2+
// import { shallow } from 'enzyme'
3+
4+
// import Navigator from '../index'
5+
6+
describe('<Navigator />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(false)
9+
})
10+
})

‎components/Tabber/index.js

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
/*
2+
*
3+
* Tabber
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import PropTypes from 'prop-types'
9+
import R from 'ramda'
10+
import { Tabs } from 'antd'
11+
12+
import { makeDebugger } from '../../utils/functions'
13+
/* eslint-disable no-unused-vars */
14+
const debug = makeDebugger('c:Tabber:index')
15+
/* eslint-enable no-unused-vars */
16+
17+
const { TabPane } = Tabs
18+
19+
const translator = {
20+
map: '地图',
21+
posts: '帖子',
22+
news: '动态',
23+
meetups: 'meetups',
24+
users: '用户',
25+
videos: '视频',
26+
tuts: '教程',
27+
jobs: '招聘',
28+
}
29+
30+
const Tabber = ({ source, onChange }) => {
31+
const tabitems = R.values(source)
32+
return (
33+
<Tabs onChange={onChange}>
34+
{tabitems.map(item => (
35+
<TabPane tab={translator[item.title] || '??'} key={item.raw} />
36+
))}
37+
</Tabs>
38+
)
39+
}
40+
41+
Tabber.propTypes = {
42+
// https://www.npmjs.com/package/prop-types
43+
onChange: PropTypes.func.isRequired,
44+
}
45+
46+
Tabber.defaultProps = {}
47+
48+
export default Tabber

‎components/Tabber/tests/index.test.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// import React from 'react'
2+
// import { shallow } from 'enzyme'
3+
4+
// import Tabber from '../index'
5+
6+
describe('<Tabber />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(false)
9+
})
10+
})

‎containers/Banner/index.js

Lines changed: 8 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,8 @@
66

77
import React from 'react'
88
import { inject, observer } from 'mobx-react'
9-
import { Tabs } from 'antd'
109

11-
import styled from 'styled-components'
12-
// import Link from 'next/link'
10+
import Tabber from '../../components/Tabber'
1311

1412
import {
1513
makeDebugger,
@@ -19,20 +17,12 @@ import {
1917

2018
import * as logic from './logic'
2119

22-
import { Banner, BannerLogo } from './styles'
20+
import { Banner, BannerLogo, TabberWrapper } from './styles'
2321

2422
const debug = makeDebugger('C:Banner')
2523

26-
const { TabPane } = Tabs
27-
28-
const MTabs = styled(Tabs)`
29-
position: absolute;
30-
bottom: -17px;
31-
width: 80vw;
32-
`
33-
34-
function callback(key) {
35-
console.log('callback: ', key)
24+
const onChange = e => {
25+
console.log('callback: ', e)
3626
}
3727

3828
class BannerContainer extends React.Component {
@@ -43,19 +33,17 @@ class BannerContainer extends React.Component {
4333

4434
render() {
4535
const { banner } = this.props
46-
const { curUrlPath } = banner
36+
const { curUrlPath, curCommunity } = banner
4737

4838
const defaultIcon = 'js'
4939
const iconKey = curUrlPath === '/' ? defaultIcon : curUrlPath
5040

5141
return (
5242
<Banner>
5343
<BannerLogo path={getSVGIconPath(iconKey)} />
54-
<MTabs onChange={callback}>
55-
<TabPane tab="帖子" key="1" />
56-
<TabPane tab="教程" key="2" />
57-
<TabPane tab="用户" key="3" />
58-
</MTabs>
44+
<TabberWrapper>
45+
<Tabber source={curCommunity} onChange={onChange} />
46+
</TabberWrapper>
5947
</Banner>
6048
)
6149
}

‎containers/Banner/styles/index.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,13 @@ export const Banner = styled.div`
1515
`
1616

1717
export const BannerLogo = styled(ReactSVG)`
18-
margin-top: 2em;
18+
margin-top: 1em;
1919
width: 80px;
2020
height: 80px;
2121
`
22+
23+
export const TabberWrapper = styled.div`
24+
position: absolute;
25+
bottom: -17px;
26+
width: 80vw;
27+
`

‎containers/Content/index.js

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
/*
2+
*
3+
* Content
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import { inject, observer } from 'mobx-react'
9+
import styled from 'styled-components'
10+
11+
// import Link from 'next/link'
12+
13+
import { makeDebugger, storeSelector } from '../../utils/functions'
14+
import { theme } from '../../utils/themes'
15+
16+
import * as logic from './logic'
17+
18+
const debug = makeDebugger('C:Content')
19+
20+
const Tmp = styled.div`
21+
margin: 30px;
22+
width: 95%;
23+
height: 70%;
24+
background: ${theme('content.bg')};
25+
border-radius: 10px;
26+
padding: 30px;
27+
`
28+
29+
class ContentContainer extends React.Component {
30+
componentWillMount() {
31+
debug('mount')
32+
logic.init(this.props.content)
33+
}
34+
35+
render() {
36+
return (
37+
<Tmp>
38+
<br />
39+
Content container!
40+
</Tmp>
41+
)
42+
}
43+
}
44+
45+
export default inject(storeSelector('content'))(observer(ContentContainer))

‎containers/Content/lang.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/*
2+
* Content Langs
3+
*
4+
* This contains all the text for the Content component.
5+
*/
6+
import { defineMessages } from 'react-intl'
7+
8+
export default defineMessages({
9+
header: {
10+
id: 'containers.Content.header',
11+
defaultMessage: 'This is the Content component !',
12+
},
13+
})

‎containers/Content/logic.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// import R from 'ramda'
2+
3+
import { makeDebugger } from '../../utils/functions'
4+
5+
/* eslint-disable no-unused-vars */
6+
const debug = makeDebugger('L:Content')
7+
/* eslint-enable no-unused-vars */
8+
9+
let content = null
10+
11+
export function someMethod() {}
12+
13+
export function init(selectedStore) {
14+
content = selectedStore
15+
debug('content', content)
16+
}

‎containers/Content/styles/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
// import styled from 'styled-components'

‎containers/Content/tests/index.test.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// import React from 'react'
2+
// import { shallow } from 'enzyme'
3+
4+
// import Content from '../index'
5+
6+
describe('<Content />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(false)
9+
})
10+
})

‎containers/Doraemon/index.js

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -37,12 +37,13 @@ import {
3737

3838
const debug = makeDebugger('C:Doraemon')
3939

40-
const HintIcon = ({ index, active, cur }) => {
41-
return active === cur ? (
42-
<HintEnter path={getSVGIconPath('enter')} />
43-
) : (
44-
<Hint>^ {index}</Hint>
45-
)
40+
const HintIcon = ({ index, active, cur, length }) => {
41+
if (active === cur) {
42+
return <HintEnter path={getSVGIconPath('enter')} />
43+
} else if (length <= 9) {
44+
return <Hint>^ {index}</Hint>
45+
}
46+
return <span />
4647
}
4748

4849
class DoraemonContainer extends React.Component {
@@ -83,7 +84,12 @@ class DoraemonContainer extends React.Component {
8384
<Title>{suggestion.title}</Title>
8485
<Desc>{suggestion.desc}</Desc>
8586
</ContentWraper>
86-
<HintIcon index={i} active={activeRaw} cur={suggestion.raw} />
87+
<HintIcon
88+
index={i}
89+
active={activeRaw}
90+
cur={suggestion.raw}
91+
length={suggestions.length}
92+
/>
8793
</InfoBar>
8894
))}
8995
</SuggestionWrapper>

‎containers/Doraemon/logic.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,7 @@ export function navToSuggestion(suggestion) {
175175
}
176176

177177
export function hidePanel() {
178-
doraemon.hideDoraemon()
178+
// doraemon.hideDoraemon()
179179
pockect$.stop()
180180
}
181181

0 commit comments

Comments
 (0)