1import * as events from '../../services/events';
 2import NewWorkoutScreen from './new-workout-screen';
 3import React, { Component } from 'react';
 4import Screen from './screen';
 5import WorkoutSummary from '../components/workout-summary';
 6import { Container, Header, Title, Content, Footer, FooterTab, Button, Icon, Spinner, DeckSwiper } from 'native-base';
 7import { Platform, View, Image } from 'react-native';
 8
 9export default class DashboardScreen extends Screen {
10  constructor(props) {
11    super(props)
12    this.state = {
13      eventsOfInterest: [events.FETCHED_WORKOUTS],
14      workouts: [],
15    };
16  }
17
18  componentDidMount() {
19    super.componentDidMount();
20    this.onLoadHistory();
21  }
22
23  render() {
24    let content = this.state.isLoading ? <Spinner /> : this.renderWorkouts(this.state.workouts);
25    let gravatarUri = this.gravatarUri();
26    return (
27      <Container>
28        <Header>
29          <Title>{this.props.username}</Title>
30          <Button transparent rounded>
31            <Image source={{uri: gravatarUri}} style={{width: 32, height: 32}} />
32          </Button>
33        </Header>
34        <Content>
35          {content}
36        </Content>
37        <Footer>
38          <FooterTab>
39            <Button transparent active onPress={this.onLoadHistory.bind(this)}>
40              <Icon name='ios-home' />
41            </Button>
42            <Button transparent onPress={this.onStartWorkout.bind(this)}>
43              <Icon name='ios-play' />
44            </Button>
45            <Button transparent onPress={this.onLogout.bind(this)}>
46              <Icon name='ios-log-out' />
47            </Button>
48          </FooterTab>
49        </Footer>
50      </Container>
51    );
52  }
53
54  renderWorkouts(workouts) {
55    let renderEach = (workout) => <WorkoutSummary key={workout.id} {...workout} />;
56    if (Platform.OS == 'ios') {
57      return (
58        <DeckSwiper dataSource={workouts} renderItem={renderEach} />
59      );
60    } else {
61      return (
62        <View>{workouts.map(renderEach)}</View>
63      );
64    }
65  }
66
67  onLoadHistory() {
68    this.setState({isLoading: true})
69    this.publish({event: events.FETCH_WORKOUTS});
70  }
71
72  notify(event) {
73    switch(event.event) {
74      case events.FETCHED_WORKOUTS:
75        this.setState({
76          isLoading: false,
77          workouts: event.workouts
78        });
79    }
80  }
81
82  onStartWorkout() {
83    console.log("start workout");
84    this.loadScreen(NewWorkoutScreen)
85  }
86
87  onLogout() {
88    this.publish({event: events.LOGOUT})
89    this.props.navigator.pop();
90  }
91
92  gravatarUri() {
93    const secureHost = "https://secure.gravatar.com/avatar";
94    return `${secureHost}/${this.props.gravatar_id}?s=32&d=mm`;
95  }
96}