mirror/pcottle.learnGitBranching
1
0
Fork 0
mirror of https://github.com/pcottle/learnGitBranching.git synced 2025-06-28 08:50:06 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

sweet some initial native views

Browse source
This commit is contained in:
Peter Cottle 2015-04-28 17:54:40 -07:00
parent e9476696f4
commit ec44f19d3e
5 changed files with 117 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/js/constants/Colors.js Normal file
View file

@ -0,0 +1,5 @@
module.exports = {
blueBackground: '#5cbcfc',
terminalBackground: '#424242',
terminalText: 'rgb(238, 238, 238)',
};

5
src/js/native/index.ios.js
View file

@ -19,6 +19,7 @@ var {
var Routes = require('../constants/Routes');
var SequenceSelectView = require('../native_react_views/SequenceSelectView');
var LevelSelectView = require('../native_react_views/LevelSelectView');
var NUXView = require('../native_react_views/NUXView');
var LearnGitBranching = React.createClass({
@ -28,6 +29,8 @@ var LearnGitBranching = React.createClass({
return <SequenceSelectView navigator={navigator} />;
case Routes.LEVEL_SELECT:
return <LevelSelectView navigator={navigator} />;
case Routes.NUX:
return <NUXView navigator={navigator} />;
}
throw new Exception('No route found for ' + route.id);
},
@ -35,7 +38,7 @@ var LearnGitBranching = React.createClass({
render: function() {
return (
<Navigator
initialRoute={Routes.getRouteForID(Routes.SEQUENCE_SELECT)}
initialRoute={Routes.getRouteForID(Routes.NUX)}
renderScene={this._renderScene}
/>
);

50
src/js/native_react_views/NUXView.js Normal file
View file

@ -0,0 +1,50 @@
var NavButton = require('../native_react_views/NavButton');
var React = require('react-native');
var Routes = require('../constants/Routes');
var {
ScrollView,
StyleSheet,
Text,
View,
} = React;
var Colors = require('../constants/Colors');
var TerminalCardView = require('../native_react_views/TerminalCardView');
var NUXView = React.createClass({
propTypes: {
navigator: React.PropTypes.object.isRequired,
},
render: function() {
return (
<View style={styles.background}>
<View style={styles.headerSpacer} />
<TerminalCardView />
<NavButton
text="Level 1"
onPress={() => {
this.props.navigator.push(
Routes.getRouteForID(Routes.LEVEL_SELECT)
);
}}
/>
</View>
);
}
});
var styles = StyleSheet.create({
background: {
backgroundColor: Colors.blueBackground,
flex: 1
},
headerSpacer: {
height: 20,
backgroundColor: '#EFEDEE',
},
});
module.exports = NUXView;

14
src/js/native_react_views/SequenceSelectView.js
View file

@ -2,13 +2,14 @@ var NavButton = require('../native_react_views/NavButton');
var React = require('react-native');
var Routes = require('../constants/Routes');
var {
PixelRatio,
ScrollView,
StyleSheet,
Text,
View,
} = React;
var Colors = require('../constants/Colors');
var SequenceSelectView = React.createClass({
propTypes: {
@ -17,8 +18,9 @@ var SequenceSelectView = React.createClass({
render: function() {
return (
<ScrollView>
<View style={styles.background}>
<View style={styles.headerSpacer} />
<ScrollView>
<View>
<NavButton
text="Level 1"
@ -30,14 +32,20 @@ var SequenceSelectView = React.createClass({
/>
</View>
</ScrollView>
</View>
);
}
});
var styles = StyleSheet.create({
background: {
backgroundColor: Colors.blueBackground,
flex: 1
},
headerSpacer: {
height: 40
height: 20,
backgroundColor: '#EFEDEE',
},
});

36
src/js/native_react_views/TerminalCardView.js Normal file
View file

@ -0,0 +1,36 @@
var React = require('react-native');
var {
StyleSheet,
Text,
View,
} = React;
var Colors = require('../constants/Colors');
var TerminalCardView = React.createClass({
render: function() {
return (
<View style={styles.terminalWindow}>
<Text style={styles.terminalText}>
Welcome to learn git branching
</Text>
</View>
);
}
});
var styles = StyleSheet.create({
terminalWindow: {
backgroundColor: Colors.terminalBackground,
},
terminalText: {
color: Colors.terminalText,
fontFamily: 'Courier',
fontSize: 16,
fontWeight: 'bold'
},
});
module.exports = TerminalCardView;