diff --git a/App.js b/App.js index 32248fd..760cf7c 100644 --- a/App.js +++ b/App.js @@ -87,7 +87,7 @@ const localStyle = StyleSheet.create({ }, content: { flex: 1, - paddingTop: 65, + paddingTop: '30%', paddingHorizontal: 15 }, bottom: { diff --git a/src/component/comment/comment.js b/src/component/comment/comment.js index 8e64fa1..5fdb75d 100644 --- a/src/component/comment/comment.js +++ b/src/component/comment/comment.js @@ -1,12 +1,12 @@ import React, {Component} from 'react'; -import {StyleSheet, Text, View} from 'react-native'; +import {StyleSheet, Text, View, TouchableOpacity, Alert} from 'react-native'; +import Ionicons from 'react-native-vector-icons/Ionicons'; +import ActionSheet from 'react-native-actionsheet-api'; import moment from 'moment'; import Color from '../../style/color'; import UserIcon from '../userIcon'; -import CommentActionIcon from './commentActionIcon'; - export default class Comment extends Component { @@ -18,7 +18,7 @@ export default class Comment extends Component { return ( - + @@ -40,7 +40,9 @@ export default class Comment extends Component { { editable - ? + ? + + : null } @@ -91,5 +93,12 @@ const localStyle = StyleSheet.create({ backgroundColor: Color.line, marginHorizontal: 16, marginLeft: 56 + }, + moreIcon: { + position: 'absolute', + bottom: 0, + right: 10, + paddingHorizontal: 12, + paddingVertical: 5 } }); \ No newline at end of file diff --git a/src/component/comment/commentActionIcon.js b/src/component/comment/commentActionIcon.js deleted file mode 100644 index 1682a74..0000000 --- a/src/component/comment/commentActionIcon.js +++ /dev/null @@ -1,37 +0,0 @@ -import React, {Component} from 'react'; -import {StyleSheet, Text, View, TouchableOpacity, Alert} from 'react-native'; -import Icon from 'react-native-vector-icons/Ionicons'; -import ActionSheet from 'react-native-actionsheet-api'; - -import Color from '../../style/color' - - -export default class CommentActionIcon extends Component { - - _defaultOnPress() { - - } - - render() { - return ( - - - - - ); - } -} - -const localStyle = StyleSheet.create({ - moreIcon: { - position: 'absolute', - bottom: 0, - right: 10, - paddingHorizontal: 12, - paddingVertical: 5 - } -}); diff --git a/src/component/comment/commentIcon.js b/src/component/comment/commentIcon.js deleted file mode 100644 index 26895cd..0000000 --- a/src/component/comment/commentIcon.js +++ /dev/null @@ -1,36 +0,0 @@ -import React, {Component} from 'react'; -import {StyleSheet, Text, View} from 'react-native'; -import Icon from 'react-native-vector-icons/Ionicons'; - -import Color from '../../style/color' - - -export default class CommentIcon extends Component { - - render() { - return ( - - - - {this.props.count} - - ); - } -} - -const localStyle = StyleSheet.create({ - commentIconBox: { - flexDirection: "row" - }, - buttonIcon: { - marginRight: 8, - marginLeft: 2 - }, - commentIconIext: { - fontSize: 15, - color: Color.inactiveText - } -}); diff --git a/src/component/comment/commentList.js b/src/component/comment/commentList.js index b11ff3c..800061a 100644 --- a/src/component/comment/commentList.js +++ b/src/component/comment/commentList.js @@ -10,6 +10,7 @@ import { Keyboard, DeviceEventEmitter } from 'react-native'; +import {Navigation} from 'react-native-navigation'; import {Divider} from "react-native-elements"; import Touchable from '../touchable'; @@ -57,6 +58,26 @@ export default class CommentList extends Component { DeviceEventEmitter.emit(Event.commentPressed, comment); } + _onUserIconPress(comment) { + Navigation.push(this.props.componentId, { + component: { + name: 'User', + options: { + bottomTabs: { + visible: false, + + // hide bottom tab for android + drawBehind: true, + animate: true + } + }, + passProps: { + user: comment.user + } + } + }); + } + _onCommentAction(comment) { ActionSheet.showActionSheetWithOptions({ options:['删除回复', '取消'], @@ -107,6 +128,7 @@ export default class CommentList extends Component { return ( this._onCommentPress(item)}> this._onUserIconPress(item)} onCommentAction={() => this._onCommentAction(item)}> diff --git a/src/component/diary/diaryActionIcon.js b/src/component/diary/diaryActionIcon.js deleted file mode 100644 index 47c9a88..0000000 --- a/src/component/diary/diaryActionIcon.js +++ /dev/null @@ -1,34 +0,0 @@ -import React, {Component} from 'react'; -import {StyleSheet, Text, View, TouchableOpacity} from 'react-native'; -import Ionicons from 'react-native-vector-icons/Ionicons'; - -import Color from '../../style/color' - - -export default class DiaryActionIcon extends Component { - - _defaultOnPress() { - - } - - render() { - return ( - - - - - ); - } -} - -const localStyle = StyleSheet.create({ - moreIcon: { - paddingVertical: 5, - paddingHorizontal: 5 - } -}); diff --git a/src/component/diary/diaryBrief.js b/src/component/diary/diaryBrief.js index 6032310..fe38fbe 100644 --- a/src/component/diary/diaryBrief.js +++ b/src/component/diary/diaryBrief.js @@ -1,14 +1,12 @@ import React, {Component} from 'react'; -import {StyleSheet, Text, View} from 'react-native'; +import {StyleSheet, Text, View, TouchableOpacity} from 'react-native'; +import Ionicons from 'react-native-vector-icons/Ionicons'; import moment from 'moment'; import Color from '../../style/color'; import UserIcon from '../userIcon'; import Photo from '../photo'; -import CommentIcon from '../comment/commentIcon'; -import DiaryActionIcon from './diaryActionIcon'; - export default class DiaryBrief extends Component { @@ -70,14 +68,22 @@ export default class DiaryBrief extends Component { { diary.comment_count > 0 - ? + ? + + {diary.comment_count} + : null } { this.editable - ? + ? + + : null } @@ -130,5 +136,20 @@ const localStyle = StyleSheet.create({ height: 30, marginTop: 10, justifyContent: 'space-between' + }, + moreIcon: { + paddingVertical: 5, + paddingHorizontal: 5 + }, + commentIconBox: { + flexDirection: "row" + }, + buttonIcon: { + marginRight: 8, + marginLeft: 2 + }, + commentIconIext: { + fontSize: 15, + color: Color.inactiveText } }); diff --git a/src/component/diary/diaryFull.js b/src/component/diary/diaryFull.js index 4724351..1641ec7 100644 --- a/src/component/diary/diaryFull.js +++ b/src/component/diary/diaryFull.js @@ -109,6 +109,8 @@ export default class DiaryFull extends Component { this.commentList = r} diaryId={diary.id} editable={this.state.editable} + onUserIconPress={this._onUserIconPress.bind(this)} + {...this.props} > diff --git a/src/component/diary/diaryList.js b/src/component/diary/diaryList.js index 536b9d6..98ef05e 100644 --- a/src/component/diary/diaryList.js +++ b/src/component/diary/diaryList.js @@ -17,7 +17,12 @@ import Msg from '../../util/msg'; import Api from '../../util/api'; import Touchable from '../touchable'; -import ListFooter from '../listFooter'; +import { + ListFooterLoading, + ListFooterEnd, + ListFooterFailed +} from '../listFooter'; +import {ListEmptyRefreshable} from '../listEmpty'; import DiaryBrief from './diaryBrief'; @@ -30,6 +35,7 @@ export default class DiaryList extends Component { this.dataSource = props.dataSource; this.state = { + mounting: true, diaries: [], refreshing: false, @@ -91,7 +97,6 @@ export default class DiaryList extends Component { }); } - // to be seperated as diaryAction component _onDiaryAction(diary) { ActionSheet.showActionSheetWithOptions({ options:['修改','删除', '取消'], @@ -113,10 +118,7 @@ export default class DiaryList extends Component { } }, passProps: { - diary: diary, - onSave: (diary) => { - // - } + diary: diary } } }); @@ -152,11 +154,11 @@ export default class DiaryList extends Component { url: photoUrl } } - }) + }); } async refresh() { - if (this.state.refreshing) { + if(this.state.refreshing) { return; } @@ -169,14 +171,6 @@ export default class DiaryList extends Component { } } else { - let diaries = this.state.diaries; - let newDiaries = result.list; - if (diaries.length > 0 && newDiaries.length > 0 - && diaries[0].id === newDiaries[0].id) { - - Msg.showMsg('没有新内容'); - } - this.setState({ diaries: result.list ? result.list : [], hasMore: result.more, @@ -191,6 +185,7 @@ export default class DiaryList extends Component { }).done(() => { this.setState({ + mounting: false, refreshing: false }); }); @@ -231,6 +226,20 @@ export default class DiaryList extends Component { } render() { + if(!this.state.mounting && (!this.state.diaries || this.state.diaries.length == 0)) { + let message = this.editable + ? '今天还没有写日记,马上写一篇吧' + : '今天还没有人写日记'; + return ( + + ); + } + return ( ; } if (!this.state.hasMore) { - return ListFooter.renderFooterEnd(); + return ; } - return ListFooter.renderFooterLoading(); + return ; }} refreshing={this.state.refreshing} diff --git a/src/component/follow/followUserList.js b/src/component/follow/followUserList.js index b3e6594..7fd36e0 100644 --- a/src/component/follow/followUserList.js +++ b/src/component/follow/followUserList.js @@ -7,7 +7,11 @@ import Touchable from '../touchable'; import Color from '../../style/color'; import UserIcon from '../userIcon'; -import ListFooter from '../listFooter'; +import { + ListFooterLoading, + ListFooterEnd, + ListFooterFailed +} from '../listFooter'; export default class FollowUserList extends Component { @@ -157,7 +161,7 @@ export default class FollowUserList extends Component { return ( this._onItemPress(item)}> - + this._onItemPress(item)}> {item.name} this._onDeletePress(item)}> ; } if (!this.state.hasMore) { - return ListFooter.renderFooterEnd(); + return ; } - return ListFooter.renderFooterLoading(); + return ; }} refreshing={this.state.refreshing} diff --git a/src/component/image/imageAction.js b/src/component/image/imageAction.js index a31b832..3f4077f 100644 --- a/src/component/image/imageAction.js +++ b/src/component/image/imageAction.js @@ -3,11 +3,9 @@ import ImagePicker from 'react-native-image-crop-picker' import ImageResizer from 'react-native-image-resizer' -async function resize(uri, oWidth, oHeight) { +async function resize(uri, oWidth, oHeight, maxPixel) { let width = oWidth; let height = oHeight; - - let maxPixel = 640 * 640; let oPixel = oWidth * oHeight; if(oPixel > maxPixel) { @@ -15,11 +13,11 @@ async function resize(uri, oWidth, oHeight) { height = Math.sqrt(oHeight * maxPixel / oWidth); } - const newUri = await ImageResizer.createResizedImage(uri, width, height, 'JPEG', 75); + const newUri = await ImageResizer.createResizedImage(uri, width, height); return 'file://' + newUri.uri; } -function action(imageOption, callback) { +function action(imageOption, maxSize, maxPixel, callback) { ActionSheet.showActionSheetWithOptions({ options: ['拍照', '从相册选择', '取消'], cancelButtonIndex: 2, @@ -37,13 +35,19 @@ function action(imageOption, callback) { : ImagePicker.openPicker(imageOption) ) .then(async (image) => { - let imageUri = await resize(image.path, image.width, image.height); - if(typeof callback == 'function') { - callback(imageUri); + let imageUri = image.path; + if(image.size > maxSize) { + imageUri = await resize(image.path, image.width, image.height, maxPixel); } + + callback(null, imageUri); }) .catch(e => { - // + if(e.message === "User cancelled image selection") { + return; + } + + callback(e); }) .done(); } @@ -52,4 +56,4 @@ function action(imageOption, callback) { export default { action -} \ No newline at end of file +} diff --git a/src/component/listEmpty.js b/src/component/listEmpty.js index e69de29..d1e0cdb 100644 --- a/src/component/listEmpty.js +++ b/src/component/listEmpty.js @@ -0,0 +1,37 @@ +import React, {Component} from 'react'; +import {StyleSheet, Text, View} from 'react-native'; +import {Button} from 'react-native-elements' + +import Color from '../style/color'; + + +const ListEmptyRefreshable = (props) => { + let text = props.error ? '出错了 :(' : props.message; + + return ( + + {text} +