merge

App/app/Router.js

@@ -36,6 +36,7 @@ import Profile from "./screens/Profile";
 import editCalendar from './screens/editCalendar';
 import choosePath from './screens/choosePath';
 import calendarDetail from './screens/calendarDetail';
+import FebradaDetail from './screens/FebradaDetail';
 import resetPassword from './screens/resetPassword';
 
 const navigationOptions = ({navigation}) => ({
@@ -202,6 +203,10 @@ const Stack = createStackNavigator({
     calendarDetail: {
         screen: calendarDetail,
     },
+    FebradaDetail: {
+        screen: FebradaDetail,
+    },
+
 
     resetPassword:{
         screen:resetPassword

App/app/screens/Eventos.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import {View, StyleSheet, Dimensions, Text, Button, ScrollView, Image} from "react-native";
+import {View, StyleSheet, Dimensions, Text, Button, ScrollView, Image, TouchableOpacity} from "react-native";
 import {TabView, TabBar, SceneMap} from "react-native-tab-view";
 
 
@@ -34,9 +34,10 @@ export default class Eventos extends React.Component {
     };
 
 
-    renderFebrada = () => {
+    renderFebrada = (navigate) => {
         return (
             <View>
+                <TouchableOpacity onPress={() => navigate('FebradaDetail')}>
                 <View style={styles.cardContainer}>
                     <Image
                         style={{
@@ -49,6 +50,7 @@ export default class Eventos extends React.Component {
                     >
                     </Image>
                 </View>
+                </TouchableOpacity>
 
             </View>
         );
@@ -98,10 +100,11 @@ export default class Eventos extends React.Component {
     };
 
     render() {
+        const {navigate} = this.props.navigation;
         return (
             <View style={styles.container}>
                 <ScrollView styles={styles.scroll}>
-                    {this.renderFebrada()}
+                    {this.renderFebrada(navigate)}
                     {this.renderRally()}
                     {this.renderCaching()}
                 </ScrollView>

App/app/screens/FebradaDetail.js

@@ -3,29 +3,23 @@ import {
     View,
     StyleSheet,
     Dimensions,
-    Image,
     ScrollView,
     Text,
-    Button,
-    TouchableOpacity,
     ImageBackground
 } from 'react-native';
 
-import {Divider, Icon, Avatar} from 'react-native-elements'
+import {Divider} from 'react-native-elements'
-import {TabView, TabBar, SceneMap} from 'react-native-tab-view';
+import AppIntroSlider from 'react-native-app-intro-slider';
-import {
-    RkButton, RkCard, RkText,
-    RkTheme
-} from 'react-native-ui-kitten';
-import Timeline from 'react-native-timeline-feed'
-
-import * as Progress from 'react-native-progress';
 
 import NavAbsolute from '../components/Nav';
 import * as Actions from "../store/actions";
 import {connect} from "react-redux";
 import {bindActionCreators} from "redux";
 
+
+const SCREEN_HEIGHT = Dimensions.get("window").height;
+const SCREEN_WIDTH = Dimensions.get("window").width;
+
 class FebradaDetail extends React.Component {
 
 
@@ -57,68 +51,76 @@ class FebradaDetail extends React.Component {
 
     renderDescription = () => {
         return (
-            <View>
+            <View style={{height: SCREEN_HEIGHT * (1 / 3)}}>
-                <View style={styles.header}>
+                <View
-                    <View style={{flexDirection: "row", alignItems: 'center', alignSelf: 'center'}}>
+                    style={{flexDirection: "row"}}>
-
+                    <View style={styles.header}>
+                        <View style={styles.nameText}>
+                            <Text
+                                style={{color: '#CC1A17', fontSize: 20}}>Febrada</Text>
+                        </View>
                         <View style={styles.timeText}>
                             <Text style={{color: "#CC1A17", fontSize: 15}}>
-                                {info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`}
+                                <Text style={{color: "#CC1A17", fontSize: 15}}>
+                                    Sexta 12 -
+                                </Text>
+                                14h00{/*{info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`}*/}
                             </Text>
                         </View>
                     </View>
-                    <View><Text
+                </View>
-                        style={{margin: 10, marginTop: 0, fontSize: 20, color: '#CC1A17'}}>{info.name}</Text></View>
+                <View style={styles.descContainer}>
-
+                    <Text style={{fontSize: 20, color: '#CC1A17'}}>Descrição</Text>
-                    <View style={{margin: 10}}>
-
-                        <Progress.Bar color={'#000000'} progress={info.Enrolled / info.MaxAttendees} height={10}
-                                      unfilledColor={'white'} width={210}/>
-                        <Text>{info.Enrolled} / {info.MaxAttendees}</Text>
-                    </View>
                     <Divider style={{backgroundColor: '#000'}}/>
-                    <View>
+                    <Text style={{paddingRight: 10, paddingTop: 10}}>g</Text>
-                        <Text style={{fontSize: 15, color: '#CC1A17', padding: 10}}>Descrição</Text>
-                        <Text style={{paddingLeft: 10, paddingRigh: 10}}></Text>
-                    </View>
                 </View>
 
-                <View style={styles.block}>
-                    <Text style={{fontSize: 20, color: "#CC1A17"}}>Descrição</Text>
-                    <Divider style={{backgroundColor: '#000'}}/>
-                    <View style={{marginTop: 10}}>
-                        <Text>
-                            {info.description}
-                        </Text>
-                    </View>
-                </View>
             </View>
         )
     };
 
-    /*
 
-        renderMap = () => {
+    renderSlider = () => {
-            return (
+        const slides = [
-                <MapView
+            {
-                    provider={PROVIDER_GOOGLE}
+                key: 'somethun',
-                    style={{flex: 2}}
+                title: 'Title 1',
-                    region={{
+                titleStyle: '',
-                        latitude: 40.19092111672049,
+                text: 'blblbalbalba',
-                        latitudeDelta: 0.007664297080957283,
+                textStyle: '',
-                        longitude: -8.410662319511175,
+                backgroundColor: '#59b2ab',
-                        longitudeDelta: 0.007551424205303192
+            },
-                    }}
+            {
-                    onRegionChangeComplete={(region) => {
+                key: 'somethun-dos',
+                title: 'Title 2',
+                titleStyle: '',
+                text: 'blblbalbalba',
+                textStyle: '',
+                backgroundColor: '#febe29',
+            },
+            {
+                key: 'somethun1',
+                title: 'Rocket guy',
+                titleStyle: '',
+                text: 'blblbalbalba',
+                textStyle: '',
+                backgroundColor: '#22bcb5',
+            }
+        ];
+        return (
+            <AppIntroSlider
+                slides={slides}
+                style={{height: SCREEN_WIDTH * 0.54}}
+                activeDotStyle={{backgroundColor:'#CC1A17'}}
+                renderDoneButton={this._buyFinosOrBifanas()}
+                renderNextButton={this._renderNextButton}
+            />
+        )
+    };
 
-                        console.log(region);
+    _buyFinosOrBifanas = () => {
-
+        //Modal
-                    }}
+    };
-
-                />
-            )
-        };
-    */
 
 
     render() {
@@ -126,16 +128,17 @@ class FebradaDetail extends React.Component {
         return (
 
             <View style={styles.mainViewStyle}>
-
+                <ScrollView style={styles.scroll}>
-                <View style={styles.container}>
+                    <View style={styles.container}>
-                    <View style={styles.headerContainer}>
+                        <View style={styles.headerContainer}>
-                        {this.renderHeader()}
+                            {this.renderHeader()}
+                        </View>
+                        <View style={{backgroundColor: "#fff"}}>
+                            {this.renderDescription()}
+                            {this.renderSlider()}
+                        </View>
                     </View>
-                    {this.renderDescription()}
+                </ScrollView>
-                </View>
-                <View>
-
-                </View>
             </View>
 
         )
@@ -145,80 +148,44 @@ class FebradaDetail extends React.Component {
 
 const styles = StyleSheet.create({
 
-    block: {
+    mainContent: {
-        marginTop: 15,
+        flex: 1,
-
-        backgroundColor: 'white',
-        padding: 20
-    },
-    AttendeeContainer: {
-        flexDirection: 'row',
-        height: 55,
-        justifyContent: 'center',
-        marginLeft: 10,
-        marginRight: 10,
-    },
-
-    centerRow: {
         alignItems: 'center',
+        justifyContent: 'space-around',
+    },
+    text: {
+        //color: 'rgba(255, 255, 255, 0.8)',
         backgroundColor: 'transparent',
-        flex: 3,
+        textAlign: 'center',
-        flexDirection: 'column',
+        color:'#000',
-        justifyContent: 'center',
+        paddingHorizontal: 16,
     },
-
+    title: {
-    leftRow: {
+        fontSize: 22,
-        backgroundColor: 'transparent',
-        flex: 1,
-        flexDirection: 'row',
-        justifyContent: 'flex-start',
-        alignSelf: 'center',
-    },
-    rightRow: {
-        alignItems: 'flex-end',
-        backgroundColor: 'transparent',
-        flex: 2,
-        flexDirection: 'row',
-        justifyContent: 'flex-end',
-        marginRight: 4,
-        alignSelf: 'center'
-    },
-
-    icon: {
-        justifyContent: 'flex-start',
-        marginTop: 2.8,
-    },
-
-    nameAttendee: {
-        alignSelf: 'center',
-        fontSize: 20,
-        fontWeight: '400',
-        color: '#000',
-        marginBottom: 10,
-    },
-
-    details: {
-        marginTop: 20,
-        flex: 1,
-        alignSelf: 'center',
-    },
-
-    infoRow: {
-        margin: 25,
-    },
-
-    ramoText: {
-        alignSelf: 'flex-start',
-        marginBottom: 5,
         color: 'white',
-        fontSize: 17,
+        backgroundColor: 'transparent',
-        fontWeight: '400',
+        textAlign: 'center',
+        marginBottom: 16,
+    },
+
+
+    header: {
+        flex: 1,
+        flexDirection: 'row',
+        padding: 10,
+        backgroundColor: 'white',
+        //height: SCREEN_HEIGHT * (1 / 3),
+    },
+
+    nameText: {
+        alignSelf: 'flex-start',
+        flex: 1,
+
     },
 
     timeText: {
         alignItems: 'flex-end',
-        flex: 2,
+        flex: 1,
-        lineHeight: 10,
         marginRight: 4,
     },
 
@@ -234,19 +201,9 @@ const styles = StyleSheet.create({
         //marginBottom: 55,
     },
 
-    header: {
-        flex: 1,
-        padding: 10,
-        backgroundColor: 'white',
-        borderRadius: 0,
 
-    },
+    descContainer: {
-    cardContainer: {
-        flex: 1,
         padding: 10,
-        //    margin: 20,
-        backgroundColor: 'white',
-        borderRadius: 5,
     },
 
     headerContainer: {
@@ -264,10 +221,6 @@ const styles = StyleSheet.create({
         height: Dimensions.get('window').width * (2 / 4),
         width: Dimensions.get('window').width,
     },
-    /*headerContainer: {
-        alignItems: 'center',
-        backgroundColor: '#FFF',
-    },*/
 
 });