ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-11-22 14:18:32 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Author, Discover, Profile, Side Menu Image Caching

Browse Source
This commit is contained in:
Hüseyin Terkir 2018-08-03 23:42:08 +03:00
parent f7ed862786
commit fc6316d038
21 changed files with 644 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
android/app/build.gradle
View File

@ -137,6 +137,7 @@ android {
}
dependencies {
compile project(':react-native-fast-image')
compile project(':react-native-vector-icons')
compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"

BIN
android/app/src/main/assets/fonts/Roboto.ttf Normal file
View File

Binary file not shown.

BIN
android/app/src/main/assets/fonts/Roboto_medium.ttf Normal file
View File

Binary file not shown.

BIN
android/app/src/main/assets/fonts/rubicon-icon-font.ttf Normal file
View File

Binary file not shown.

2
android/app/src/main/java/com/esteem/MainApplication.java
View File

@ -3,6 +3,7 @@ package com.esteem;
import android.app.Application;
import com.facebook.react.ReactApplication;
import com.dylanvann.fastimage.FastImageViewPackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
@ -24,6 +25,7 @@ public class MainApplication extends Application implements ReactApplication {
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new FastImageViewPackage(),
new VectorIconsPackage()
);
}

2
android/settings.gradle
View File

@ -1,4 +1,6 @@
rootProject.name = 'eSteem'
include ':react-native-fast-image'
project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

32
ios/eSteem.xcodeproj/project.pbxproj
View File

@ -5,7 +5,6 @@
};
objectVersion = 46;
objects = {
/* Begin PBXBuildFile section */
00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; };
00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; };
@ -61,6 +60,10 @@
F31624561A5F492FA0EACC97 /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 81CB98D1E7EC4EFBABE1CACF /* Ionicons.ttf */; };
F3662FE59ED5455DB030A2F8 /* SimpleLineIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = EA05FC2565FA4A058864397B /* SimpleLineIcons.ttf */; };
FF83A7D6C028495BBFB1CE66 /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 631FBEBAA38C47D987E3D463 /* Foundation.ttf */; };
1AF2CD16F43F426588739EA1 /* libFastImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = F9B5C34A6AFD4A7EAF9FCA5B /* libFastImage.a */; };
95F52A0E16D34F3B98D482D0 /* Roboto_medium.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 6637816CC58243EA8CD66369 /* Roboto_medium.ttf */; };
DE6394B3D03149F08E18FDB4 /* Roboto.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D7C020CD375646989DFB5A00 /* Roboto.ttf */; };
E8030163FFB34D83B1E185A2 /* rubicon-icon-font.ttf in Resources */ = {isa = PBXBuildFile; fileRef = AADF1241EEAB4F6E8C363CEC /* rubicon-icon-font.ttf */; };
/* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */
@ -397,6 +400,11 @@
D45D48954F524BD6AA0654DA /* FontAwesome.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = FontAwesome.ttf; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; };
EA05FC2565FA4A058864397B /* SimpleLineIcons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = SimpleLineIcons.ttf; path = "../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf"; sourceTree = "<group>"; };
EDAA66611DD74053A67DB5E6 /* Feather.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Feather.ttf; path = "../node_modules/react-native-vector-icons/Fonts/Feather.ttf"; sourceTree = "<group>"; };
BB460CE5C23F4F18BD70B31E /* FastImage.xcodeproj */ = {isa = PBXFileReference; name = "FastImage.xcodeproj"; path = "../node_modules/react-native-fast-image/ios/FastImage.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
F9B5C34A6AFD4A7EAF9FCA5B /* libFastImage.a */ = {isa = PBXFileReference; name = "libFastImage.a"; path = "libFastImage.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
6637816CC58243EA8CD66369 /* Roboto_medium.ttf */ = {isa = PBXFileReference; name = "Roboto_medium.ttf"; path = "../node_modules/native-base/Fonts/Roboto_medium.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
D7C020CD375646989DFB5A00 /* Roboto.ttf */ = {isa = PBXFileReference; name = "Roboto.ttf"; path = "../node_modules/native-base/Fonts/Roboto.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
AADF1241EEAB4F6E8C363CEC /* rubicon-icon-font.ttf */ = {isa = PBXFileReference; name = "rubicon-icon-font.ttf"; path = "../node_modules/native-base/Fonts/rubicon-icon-font.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
@ -426,6 +434,7 @@
00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */,
139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
5BA0766B63644D679B1E03EB /* libRNVectorIcons.a in Frameworks */,
1AF2CD16F43F426588739EA1 /* libFastImage.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -613,6 +622,7 @@
00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
23B20A8D9E714DBC8FCD4CAC /* RNVectorIcons.xcodeproj */,
BB460CE5C23F4F18BD70B31E /* FastImage.xcodeproj */,
);
name = Libraries;
sourceTree = "<group>";
@ -703,6 +713,9 @@
4B93197E996E43A48AC65531 /* Octicons.ttf */,
B8FDA6A3A2AB4894B988A968 /* SimpleLineIcons.ttf */,
97593E7AD1CE4284BA62C90B /* Zocial.ttf */,
6637816CC58243EA8CD66369 /* Roboto_medium.ttf */,
D7C020CD375646989DFB5A00 /* Roboto.ttf */,
AADF1241EEAB4F6E8C363CEC /* rubicon-icon-font.ttf */,
);
name = Resources;
sourceTree = "<group>";
@ -1189,6 +1202,9 @@
C914988BD09E47C6A810D30F /* Octicons.ttf in Resources */,
9224F9CFABAE48BBB8262C24 /* SimpleLineIcons.ttf in Resources */,
D030F1F660404F24B5F24ACB /* Zocial.ttf in Resources */,
95F52A0E16D34F3B98D482D0 /* Roboto_medium.ttf in Resources */,
DE6394B3D03149F08E18FDB4 /* Roboto.ttf in Resources */,
E8030163FFB34D83B1E185A2 /* rubicon-icon-font.ttf in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -1314,6 +1330,7 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = eSteemTests/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@ -1321,6 +1338,7 @@
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",
@ -1339,6 +1357,7 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = eSteemTests/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@ -1346,6 +1365,7 @@
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",
@ -1366,6 +1386,7 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = eSteem/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@ -1389,6 +1410,7 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = eSteem/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@ -1418,12 +1440,14 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = "eSteem-tvOS/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",
@ -1452,12 +1476,14 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = "eSteem-tvOS/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",
@ -1485,12 +1511,14 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = "eSteem-tvOSTests/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",
@ -1518,12 +1546,14 @@
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
);
INFOPLIST_FILE = "eSteem-tvOSTests/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
"\"$(SRCROOT)/$(TARGET_NAME)\"",
);
OTHER_LDFLAGS = (
"-ObjC",

5
ios/eSteem/Info.plist
View File

@ -36,7 +36,7 @@
</dict>
</dict>
<key>NSLocationWhenInUseUsageDescription</key>
<string></string>
<string/>
<key>UIAppFonts</key>
<array>
<string>Entypo.ttf</string>
@ -50,6 +50,9 @@
<string>Octicons.ttf</string>
<string>SimpleLineIcons.ttf</string>
<string>Zocial.ttf</string>
<string>Roboto_medium.ttf</string>
<string>Roboto.ttf</string>
<string>rubicon-icon-font.ttf</string>
</array>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>

21
package-lock.json generated
View File

@ -2613,6 +2613,11 @@
"integrity": "sha1-JJXduvbrh0q7Dhvp3yLS5aVEMmw=",
"dev": true
},
"deep-diff": {
"version": "0.3.8",
"resolved": "https://registry.npmjs.org/deep-diff/-/deep-diff-0.3.8.tgz",
"integrity": "sha1-wB3mPvsO7JeYgB1Ax+Da4ltYLIQ="
},
"deep-is": {
"version": "0.1.3",
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
@ -7584,6 +7589,14 @@
"lodash": "^4.11.1"
}
},
"react-native-fast-image": {
"version": "4.0.14",
"resolved": "https://registry.npmjs.org/react-native-fast-image/-/react-native-fast-image-4.0.14.tgz",
"integrity": "sha512-MeRgL70JxoY/hn8ZRGBsDED9SGvTEeznneL//fWZyLaG0CM+w2CH4QXAMvADnIvu2RFd8WQWNii6c6VOpVe4Tg==",
"requires": {
"prop-types": "^15.5.10"
}
},
"react-native-htmlview": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/react-native-htmlview/-/react-native-htmlview-0.12.1.tgz",
@ -7886,6 +7899,14 @@
"symbol-observable": "^1.2.0"
}
},
"redux-logger": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/redux-logger/-/redux-logger-3.0.6.tgz",
"integrity": "sha1-91VZZvMJjzyIYExEnPC69XeCdL8=",
"requires": {
"deep-diff": "^0.3.5"
}
},
"redux-thunk": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",

2
package.json
View File

@ -17,6 +17,7 @@
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-circular-action-menu": "^0.5.0",
"react-native-fast-image": "^4.0.14",
"react-native-htmlview": "^0.12.1",
"react-native-render-html": "^3.10.0",
"react-native-scrollable-tab-view": "^0.8.0",
@ -24,6 +25,7 @@
"react-navigation": "^2.8.0",
"react-redux": "^5.0.7",
"redux": "^4.0.0",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0",
"remarkable": "^1.7.1",
"rn-placeholder": "^1.2.0"

9
src/navigation/Tabs.js
View File

@ -18,6 +18,7 @@ import NotificationPage from '../screens/notifications/notification';
import SinglePostPage from '../screens/single-post/Post';
import LoginPage from '../screens/login/Login';
import AuthorPage from '../screens/author-profile/Author';
import DiscoverPage from '../screens/discover/Discover';
const HomeScreen = ({ navigation }) => <HomePage navigation={navigation} />;
@ -98,6 +99,10 @@ const LoginScreen = ({ navigation }) => <LoginPage navigation={navigation} />;
const AuthorScreen = ({ navigation }) => <AuthorPage navigation={navigation} />;
const DiscoverScreen = ({ navigation }) => (
<DiscoverPage navigation={navigation} />
);
const BottomTabs = createBottomTabNavigator(
{
Home: {
@ -162,6 +167,10 @@ const StacksOverTabs = createStackNavigator(
screen: AuthorScreen,
path: '/author',
},
Discover: {
screen: DiscoverScreen,
path: 'discover',
},
},
{
headerMode: 'none',

17
src/providers/steem/Dsteem.js
View File

@ -30,6 +30,23 @@ export const getAccount = user => {
});
};
/**
* @method getFollows get account data
* @param user username
*/
export const getFollows = user => {
return new Promise((resolve, reject) => {
client
.call('follow_api', 'get_follow_count', [user])
.then(result => {
resolve(result);
})
.catch(err => {
reject(err);
});
});
};
/**
* @method getPosts get posts method
* @param by get discussions by trending, created, active etc.

216
src/screens/author-profile/Author.js
View File

@ -1,7 +1,9 @@
import * as React from 'react';
import { StatusBar } from 'react-native';
import { StatusBar, Dimensions } from 'react-native';
import {
Container,
Card,
CardItem,
Header,
Left,
Body,
@ -11,8 +13,13 @@ import {
Title,
Content,
Text,
View,
} from 'native-base';
import { getAccount } from '../../providers/steem/Dsteem';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import CustomTabBar from '../home/FeedTabs';
import moment from 'moment';
import FastImage from 'react-native-fast-image';
class AuthorPage extends React.Component {
constructor(props) {
@ -20,14 +27,21 @@ class AuthorPage extends React.Component {
this.state = {
author: 'author',
about: {},
follows: {},
};
}
componentDidMount() {
let info;
let json_metadata;
getAccount(this.props.navigation.state.params.author)
.then(author => {
json_metadata = JSON.parse(author[0].json_metadata);
info = json_metadata.profile;
this.setState({
author: author[0],
about: info,
});
})
.catch(err => {});
@ -59,7 +73,205 @@ class AuthorPage extends React.Component {
</Header>
<Content>
<Text>{JSON.stringify(this.state.author)}</Text>
<View style={{ flex: 1 }}>
<Header
style={{
backgroundColor: 'transparent',
position: 'absolute',
top: StatusBar.currentHeight,
}}
>
<Left>
<Button transparent>
<Icon name="menu" />
</Button>
</Left>
<Body>
<Title>{this.state.author.name}</Title>
</Body>
<Right>
<Button transparent>
<Icon name="search" />
</Button>
<Button transparent>
<Icon name="heart" />
</Button>
<Button transparent>
<Icon name="more" />
</Button>
</Right>
</Header>
<Content
style={{ flex: 1, backgroundColor: '#f9f9f9' }}
>
<FastImage
style={{
width: Dimensions.get('window').width,
height: 160,
}}
source={{
uri: this.state.about.cover_image,
priority: FastImage.priority.high,
}}
/>
<FastImage
style={{
width: 100,
height: 100,
borderRadius: 50,
top: -50,
borderWidth: 1,
borderColor: 'white',
alignSelf: 'center',
}}
source={{
uri: this.state.about.profile_image,
priority: FastImage.priority.high,
}}
/>
<Body style={{ top: -40 }}>
<Text style={{ fontWeight: 'bold' }}>
{this.state.author.name}
</Text>
<Text>{this.state.about.about}</Text>
</Body>
<Card
style={{
marginTop: 0,
marginLeft: 0,
marginRight: 0,
marginBottom: 0,
}}
>
<CardItem
style={{
borderColor: 'lightgray',
borderTopWidth: 1,
borderBottomWidth: 1,
flexDirection: 'row',
}}
>
<View style={{ flex: 0.3 }}>
<Text>
{this.state.author.post_count} Posts
</Text>
</View>
<View style={{ flex: 0.4 }}>
<Text> Followers</Text>
</View>
<View style={{ flex: 0.4 }}>
<Text> Following</Text>
</View>
</CardItem>
<CardItem
style={{
flexDirection: 'row',
borderBottomWidth: 0,
}}
>
<View style={{ flex: 0.5 }}>
<Text
style={{
marginLeft: 20,
alignSelf: 'flex-start',
}}
>
<Icon
style={{
fontSize: 20,
alignSelf: 'flex-start',
right: 10,
}}
name="md-pin"
/>
</Text>
</View>
<View style={{ flex: 0.5 }}>
<Text>
<Icon
style={{
fontSize: 20,
marginRight: 10,
}}
name="md-calendar"
/>
{moment
.utc(this.state.author.created)
.local()
.fromNow()}
</Text>
</View>
</CardItem>
</Card>
<View>
<ScrollableTabView
style={{
alignSelf: 'center',
backgroundColor: 'transparent',
}}
renderTabBar={() => (
<CustomTabBar
style={{
alignSelf: 'center',
height: 40,
backgroundColor: '#fff',
}}
tabUnderlineDefaultWidth={30} // default containerWidth / (numberOfTabs * 4)
tabUnderlineScaleX={3} // default 3
activeColor={'#222'}
inactiveColor={'#222'}
/>
)}
>
<View
tabLabel="Blog"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Comments"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Replies"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Wallet"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
</ScrollableTabView>
</View>
</Content>
</View>
</Content>
</Container>
);

22
src/screens/discover/Discover.js Normal file
View File

@ -0,0 +1,22 @@
// TODO: Add top users from Surfer
import React from 'react';
import { View, Text } from 'native-base';
class DiscoverPage extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {}
render() {
return (
<View>
<Text> Discover </Text>
</View>
);
}
}
export default DiscoverPage;

0
src/screens/discover/TopUsers.js Normal file
View File

0
src/screens/home/CustomTabBar.js → src/screens/home/FeedTabs.js
View File

2
src/screens/home/home.js
View File

@ -29,7 +29,7 @@ import HotPage from './hot';
import TrendingPage from './trending';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import CustomTabBar from './CustomTabBar';
import CustomTabBar from './FeedTabs';
class HomePage extends React.Component {
constructor(props) {

331
src/screens/profile/profile.js
View File

@ -1,7 +1,20 @@
import * as React from 'react';
import { StatusBar } from 'react-native';
import { StatusBar, Image, Dimensions, AsyncStorage } from 'react-native';
import moment from 'moment';
import FastImage from 'react-native-fast-image';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import CustomTabBar from '../home/FeedTabs';
import DiscoverPage from '../discover/Discover';
import { getAccount, getFollows } from '../../providers/steem/Dsteem';
import {
Container,
Content,
Card,
CardItem,
Thumbnail,
View,
Header,
Left,
Body,
@ -13,36 +26,296 @@ import {
} from 'native-base';
class ProfilePage extends React.Component {
static navigationOptions = {
title: 'Profile',
};
constructor() {
super();
this.state = {
user: [],
about: {},
follows: {},
isLoggedIn: false,
};
}
async componentWillMount() {
let isLoggedIn;
await AsyncStorage.getItem('isLoggedIn').then(result => {
isLoggedIn = JSON.parse(result);
if (isLoggedIn == true) {
this.setState({
isLoggedIn: true,
});
} else {
}
});
}
componentDidMount() {
let user;
let info;
let json_metadata;
AsyncStorage.getItem('user')
.then(result => {
if (!result) {
return false;
}
user = JSON.parse(result);
})
.then(() => {
getAccount(user.username).then(account => {
json_metadata = JSON.parse(account[0].json_metadata);
info = json_metadata.profile;
this.setState({
user: account[0],
about: info,
});
});
})
.then(() => {
getFollows(user.username)
.then(result => {
this.setState({
follows: result,
});
})
.catch(err => {
alert(err);
});
})
.catch(err => {
alert(err);
});
}
render() {
return (
<Container style={{ flex: 1, top: StatusBar.currentHeight }}>
<Header>
<Left>
<Button transparent>
<Icon name="menu" />
</Button>
</Left>
<Body>
<Title>Profile</Title>
</Body>
<Right>
<Button transparent>
<Icon name="search" />
</Button>
<Button transparent>
<Icon name="heart" />
</Button>
<Button transparent>
<Icon name="more" />
</Button>
</Right>
</Header>
<Text>Profile</Text>
</Container>
<View style={{ flex: 1, top: StatusBar.currentHeight }}>
{this.state.isLoggedIn ? (
<View style={{ flex: 1 }}>
<Header
style={{
backgroundColor: 'transparent',
position: 'absolute',
top: StatusBar.currentHeight,
}}
>
<Left>
<Button transparent>
<Icon name="menu" />
</Button>
</Left>
<Body>
<Title>{this.state.user.name}</Title>
</Body>
<Right>
<Button transparent>
<Icon name="search" />
</Button>
<Button transparent>
<Icon name="heart" />
</Button>
<Button transparent>
<Icon name="more" />
</Button>
</Right>
</Header>
<Content
style={{ flex: 1, backgroundColor: '#f9f9f9' }}
>
<FastImage
style={{
width: Dimensions.get('window').width,
height: 160,
}}
source={{
uri: this.state.about.cover_image,
priority: FastImage.priority.high,
}}
/>
<FastImage
style={{
width: 100,
height: 100,
borderRadius: 50,
top: -50,
borderWidth: 1,
borderColor: 'white',
alignSelf: 'center',
}}
source={{
uri: this.state.about.profile_image,
priority: FastImage.priority.high,
}}
/>
<Body style={{ top: -40 }}>
<Text style={{ fontWeight: 'bold' }}>
{this.state.user.name}
</Text>
<Text>{this.state.about.about}</Text>
</Body>
<Card
style={{
marginTop: 0,
marginLeft: 0,
marginRight: 0,
marginBottom: 0,
}}
>
<CardItem
style={{
borderColor: 'lightgray',
borderTopWidth: 1,
borderBottomWidth: 1,
flexDirection: 'row',
}}
>
<View style={{ flex: 0.3 }}>
<Text>
{this.state.user.post_count} Posts
</Text>
</View>
<View style={{ flex: 0.4 }}>
<Text>
{this.state.follows.follower_count}{' '}
Followers
</Text>
</View>
<View style={{ flex: 0.4 }}>
<Text>
{this.state.follows.following_count}{' '}
Following
</Text>
</View>
</CardItem>
<CardItem
style={{
flexDirection: 'row',
borderBottomWidth: 0,
}}
>
<View style={{ flex: 0.5 }}>
<Text
style={{
marginLeft: 20,
alignSelf: 'flex-start',
}}
>
<Icon
style={{
fontSize: 20,
alignSelf: 'flex-start',
}}
name="md-pin"
/>
{this.state.about.location}
</Text>
</View>
<View style={{ flex: 0.5 }}>
<Text>
<Icon
style={{
fontSize: 20,
marginRight: 10,
}}
name="md-calendar"
/>
{moment
.utc(this.state.user.created)
.local()
.fromNow()}
</Text>
</View>
</CardItem>
</Card>
<View>
<ScrollableTabView
style={{
alignSelf: 'center',
backgroundColor: 'transparent',
}}
renderTabBar={() => (
<CustomTabBar
style={{
alignSelf: 'center',
height: 40,
backgroundColor: '#fff',
}}
tabUnderlineDefaultWidth={30} // default containerWidth / (numberOfTabs * 4)
tabUnderlineScaleX={3} // default 3
activeColor={'#222'}
inactiveColor={'#222'}
/>
)}
>
<View
tabLabel="Blog"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Comments"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Replies"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
<View
tabLabel="Wallet"
style={{
paddingHorizontal: 7,
backgroundColor: '#f9f9f9',
flex: 1,
minWidth:
Dimensions.get('window').width /
1,
}}
/>
</ScrollableTabView>
</View>
</Content>
</View>
) : (
<View>
<Header style={{}}>
<Left>
<Button transparent>
<Icon name="menu" />
</Button>
</Left>
<Body>
<Title />
</Body>
<Right>
<Button transparent>
<Icon name="more" />
</Button>
</Right>
</Header>
<DiscoverPage />
</View>
)}
</View>
);
}
}

11
src/screens/side-menu/LoggedInMenu.js
View File

@ -15,9 +15,9 @@ import {
} from 'native-base';
import styles from './style';
import FastImage from 'react-native-fast-image';
import { getAccount } from '../../providers/steem/Dsteem';
const drawerCover = require('../../assets/drawer-cover.png');
const masterKeyMenuOptions = [
{
name: 'Home',
@ -194,9 +194,14 @@ export class LoggedInSideBar extends Component {
bounces={false}
style={{ flex: 1, backgroundColor: '#fff', top: -1 }}
>
<Image source={drawerCover} style={styles.drawerCover} />
<FastImage
source={{
uri: this.state.json_metadata.cover_image,
priority: FastImage.priority.high,
}}
style={styles.drawerCover}
/>
<Thumbnail
square
style={styles.drawerImage}
source={{ uri: this.state.avatar }}
/>

8
src/screens/side-menu/style.js
View File

@ -14,8 +14,8 @@ export default {
},
drawerImage: {
position: 'absolute',
left: Platform.OS === 'android' ? deviceWidth / 10 : deviceWidth / 30,
top: Platform.OS === 'android' ? deviceHeight / 13 : deviceHeight / 15,
left: Platform.OS === 'android' ? deviceWidth / 12 : deviceWidth / 30,
top: Platform.OS === 'android' ? deviceHeight / 15 : deviceHeight / 15,
width: 60,
height: 60,
resizeMode: 'cover',
@ -36,8 +36,8 @@ export default {
},
info: {
position: 'absolute',
top: Platform.OS === 'android' ? deviceHeight / 13 : deviceHeight / 5.8,
left: Platform.OS === 'android' ? deviceWidth / 10 : deviceWidth / 40,
top: Platform.OS === 'android' ? deviceHeight / 6 : deviceHeight / 5.8,
left: Platform.OS === 'android' ? deviceWidth / 12 : deviceWidth / 40,
},
userLabel: {
fontWeight: 'bold',

6
src/screens/single-post/Post.js
View File

@ -51,9 +51,11 @@ class SinglePostPage extends React.Component {
}
alterNode(node) {
if (node.name == 'img' || node.name == 'a') {
// console.log(node);
if (node.name == 'img') {
node.attribs.style = `max-width: ${Dimensions.get('window').width}`;
} else if (node.name == 'iframe') {
node.attribs.style = `max-width: ${Dimensions.get('window').width}`;
node.attribs.style = `width: ${Dimensions.get('window').width}`;
node.attribs.height = 200;
}
}