diff --git a/app/screens/main.js b/app/screens/main.js index fe86962..5e256f7 100644 --- a/app/screens/main.js +++ b/app/screens/main.js @@ -39,9 +39,7 @@ export default class Main extends Component { lat: props.lat } } - } - componentWillMount() { this.retrieveAvatar(); } @@ -51,22 +49,29 @@ export default class Main extends Component { if (value !== null) { // We have data!! console.log("Have avatar: " + value); + + this.setState({ + avatar: parseInt(value) + }); } else { - this.storeAvatar(Math.floor(Math.random() * allAvatarLinks.length).toString()); + var newValue = Math.floor(Math.random() * allAvatarLinks.length); + this.storeAvatar(newValue.toString()); + + this.setState({ + avatar: newValue + }); } - this.setState({ - avatar: parseInt(value) - }); + } catch (error) { // Error retrieving data console.log(error); } } - storeAvatar = async (link) => { + storeAvatar = async (linkIndex) => { try { - await AsyncStorage.setItem('avatar', link); + await AsyncStorage.setItem('avatar', linkIndex); } catch (error) { // Error saving data console.log(error); @@ -86,6 +91,8 @@ export default class Main extends Component { this.setState({ avatar: newAvatar }); + + this.storeAvatar(newAvatar.toString()); } openDrawer = () => { diff --git a/app/screens/main/apis/news.js b/app/screens/main/apis/news.js new file mode 100644 index 0000000..f66f0ab --- /dev/null +++ b/app/screens/main/apis/news.js @@ -0,0 +1,98 @@ +/* + * Twitter view component for the chat + */ +import React, { Component } from 'react'; +import { + Dimensions, + View, + TouchableOpacity, + Image, + Linking, + Text +} from 'react-native'; +import Icon from 'react-native-vector-icons/FontAwesome'; + +const windowWidth = Dimensions.get('window').width; +const windowHeight = Dimensions.get('window').height; + +type Props = {}; +export default class NewsPost extends Component { + + handleClick = () => { + Linking.canOpenURL(this.props.url).then(supported => { + if (supported) { + Linking.openURL(this.props.url); + } else { + console.log("Don't know how to open URI: " + this.props.url); + } + }); + }; + + render() { + const { title, source } = this.props; + + return ( + + + {title} + + + unversal + @{source} + + + ); + } +} + +const styles = { + container: { + justifyContent: 'center', + alignItems: 'center', + flexDirection: 'column', + backgroundColor: '#0e8f9e', + margin: 30, + padding: 10, + borderRadius: 5, + shadowColor: 'grey', + shadowOffset: { + width: 0, + height: 3 + }, + shadowRadius: 5, + shadowOpacity: 1.0, + elevation: 4 + }, + icon: { + borderRadius: 60, + fontSize: 20, + color: 'gold' + }, + bodyTxt: { + fontSize: 16, + color: 'white', + margin: 5 + }, + infoCont: { + flex: 1, + alignSelf: 'stretch', + justifyContent: 'space-between', + alignItems: 'center', + flexDirection: 'row', + margin: 5 + }, + typeTxt: { + fontSize: 12, + color: 'gold', + backgroundColor: 'black', + borderRadius: 4, + padding: 5 + }, + screenNameTxt: { + fontSize: 12, + color: 'gold' + } +} diff --git a/app/screens/main/chat.js b/app/screens/main/chat.js index 20a1c94..6ce8699 100644 --- a/app/screens/main/chat.js +++ b/app/screens/main/chat.js @@ -22,6 +22,7 @@ require('react-native'); // Socket.io imports import './UserAgent'; import TwitterPost from './apis/twitter.js'; +import NewsPost from './apis/news.js'; window.navigator.userAgent = "react-native"; const io = require('socket.io-client/dist/socket.io'); @@ -50,7 +51,7 @@ export default class Chat extends Component { console.log(props); } - storeUserId = async (location, item) => { + storeItem = async (location, item) => { try { await AsyncStorage.setItem(location, item); } catch (error) { @@ -72,7 +73,7 @@ export default class Chat extends Component { this.socket.emit('userId', {user_id: value, newUser: true, position: this.props.position, avatar: this.props.avatar}); this.socket.on('getNewUserId', (result) => { console.log('New id: ' + result.user_id); - this.storeUserId('userId', result.user_id.toString()); + this.storeItem('userId', result.user_id.toString()); id = result.user_id; }); } @@ -101,6 +102,26 @@ export default class Chat extends Component { }); }); + this.socket.on('initNews', (posts) => { + console.log(posts); + this.setState({ + news: posts, + postNum: 0 + }, () => { + var welcomeMessage = { + id: 0, + text: 'Welcome to Nexto! Break the ice by starting a conversation!', + user_id: this.state.userId, + created: new Date(), + long: 0, + lat: 0, + avatar: this.props.avatar + }; + + this.addMessage(welcomeMessage); + }); + }); + this.socket.on('newMessage', (msg) => { this.addMessage(msg); }); @@ -110,6 +131,15 @@ export default class Chat extends Component { console.log('New message received!'); var oldDOM = this.state.messagesDOM; + if (oldDOM.length % 5 == 0) { + var actualPost = this.state.news[this.state.postNum]; + var newPost = ( + + ); + + oldDOM.push(newPost); + } + var newMessage = this.createMessage(msg); if (this.state.prevMessageUser != msg.user_id && this.state.prevMessageUser) { @@ -125,7 +155,8 @@ export default class Chat extends Component { this.setState({ messagesDOM: oldDOM, - prevMessageUser: msg.user_id + prevMessageUser: msg.user_id, + postNum: this.state.postNum + 1 }); } @@ -146,25 +177,32 @@ export default class Chat extends Component { } createMessage = (msg) => { + console.log(msg.id); var isUser = msg.user_id == this.state.userId; var contStyle = isUser ? styles.userMsg : styles.otherMsg; var txtContStyle = isUser ? styles.userMsgBox : styles.otherMsgBox; var txtStyle = isUser ? styles.userTxt : null; var avatarLink = msg.avatar; + var avatar = ( ); + var avatarAlready = this.state.prevMessageUser == msg.user_id; var result = ( + {!isUser && !avatarAlready ? avatar : null} + {msg.text} + {isUser && !avatarAlready ? avatar : null} + ); return result; @@ -199,8 +237,9 @@ export default class Chat extends Component { }} scrollEnabled={true} contentContainerStyle={styles.chatFieldScroll}> - + {this.state.messagesDOM} + )