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