Skip to content

Commit afbb050

Browse files
NhacsamNhacsam
committed
Lint the example
1 parent 551fa9e commit afbb050

11 files changed

Lines changed: 906 additions & 126 deletions

File tree

‎example/.eslintignore‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
**/node_modules
2+
**/android
3+
**/ios
4+
**/vendors
5+
**/coverage
6+
**/flow-coverage

‎example/.eslintrc‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"extends": [
3+
"react-app",
4+
"prettier",
5+
"prettier/flowtype",
6+
"prettier/react"
7+
],
8+
"plugins": [
9+
"flowtype",
10+
"react",
11+
"prettier"
12+
],
13+
"globals": {
14+
"__DEV__": true
15+
},
16+
"rules": {
17+
"no-use-before-define": 0,
18+
"no-unused-vars": "error",
19+
"prettier/prettier": [
20+
"error",
21+
{
22+
"trailingComma": "es5",
23+
"singleQuote": true,
24+
"printWidth": 100
25+
}
26+
]
27+
}
28+
}

‎example/Pages/Avignon.js‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,16 +15,14 @@ class BasicUsage extends React.Component {
1515
maxHeight={MAX_HEIGHT}
1616
minHeight={MIN_HEIGHT}
1717
minOverlayOpacity={0.4}
18-
renderHeader={() => (
19-
<Image source={require('../assets/avignon.jpg')} style={styles.image} />
20-
)}
21-
renderTouchableFixedForeground={() => (
18+
renderHeader={() =>
19+
<Image source={require('../assets/avignon.jpg')} style={styles.image} />}
20+
renderTouchableFixedForeground={() =>
2221
<View style={{ height: MAX_HEIGHT, justifyContent: 'center', alignItems: 'center' }}>
2322
<TouchableOpacity onPress={() => console.log('tap!!')} style={styles.button}>
2423
<Text style={styles.buttonText}>Discover Avignon now!</Text>
2524
</TouchableOpacity>
26-
</View>
27-
)}
25+
</View>}
2826
>
2927
<View style={{ height: 1000 }}>
3028
<TriggeringView onHide={() => console.log('text hidden')}>

‎example/Pages/BasicUsage.js‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,27 +16,23 @@ const styles = StyleSheet.create({
1616
},
1717
});
1818

19-
2019
class BasicUsage extends React.Component {
2120
render() {
2221
return (
23-
<View style={styles.container} >
22+
<View style={styles.container}>
2423
<HeaderImageScrollView
2524
maxHeight={200}
2625
minHeight={MIN_HEIGHT}
27-
renderHeader={() => (
28-
<Image source={require('../assets/NZ.jpg')} style={styles.image} />
29-
)}
30-
renderForeground={() => (
26+
renderHeader={() => <Image source={require('../assets/NZ.jpg')} style={styles.image} />}
27+
renderForeground={() =>
3128
<View style={{ height: 150, justifyContent: 'center', alignItems: 'center' }}>
32-
<TouchableOpacity onPress={() => console.log('tap!!')} >
29+
<TouchableOpacity onPress={() => console.log('tap!!')}>
3330
<Text style={{ backgroundColor: 'transparent' }}>Tap Me!</Text>
3431
</TouchableOpacity>
35-
</View>
36-
)}
32+
</View>}
3733
>
3834
<View style={{ height: 1000 }}>
39-
<TriggeringView onHide={() => console.log('text hidden')} >
35+
<TriggeringView onHide={() => console.log('text hidden')}>
4036
<Text>Scroll Me!</Text>
4137
</TriggeringView>
4238
</View>

‎example/Pages/Colors.js‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,8 @@
11
import React from 'react';
22
import { StyleSheet, Image, View, Dimensions } from 'react-native';
33

4-
import { Header } from 'react-navigation';
54
import HeaderImageScrollView from 'react-native-image-header-scroll-view';
65

7-
const MIN_HEIGHT = Header.HEIGHT;
8-
96
const styles = StyleSheet.create({
107
image: {
118
height: 200,
@@ -21,9 +18,8 @@ class ColorsPage extends React.Component {
2118
maxHeight={150}
2219
minHeight={80}
2320
fadeOutForeground
24-
renderHeader={() => (
25-
<Image source={require('../assets/cutecat.jpg')} style={styles.image} />
26-
)}
21+
renderHeader={() =>
22+
<Image source={require('../assets/cutecat.jpg')} style={styles.image} />}
2723
>
2824
<View style={{ height: 100, backgroundColor: 'blue' }} />
2925
<View style={{ height: 100, backgroundColor: 'red' }} />

‎example/Pages/Menu.js‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,23 +52,29 @@ class Button extends React.Component {
5252
>
5353
<Image style={styles.button} source={props.image}>
5454
<View style={styles.overlay}>
55-
<Text style={styles.buttonText}>{props.text}</Text>
55+
<Text style={styles.buttonText}>
56+
{props.text}
57+
</Text>
5658
</View>
5759
</Image>
5860
</TouchableOpacity>
5961
);
6062
}
6163
}
6264

63-
const Menu = (props) => (
65+
const Menu = props =>
6466
<ScrollView style={styles.page} contentContainerStyle={styles.pageContent}>
6567
<StatusBar />
6668
<Button {...props} image={require('../assets/NZ.jpg')} text="BasicUsage" target="basicUsage" />
6769
<Button {...props} image={tvShowContent.image} text="TV Show" target="tvShow" />
6870
<Button {...props} image={require('../assets/cutecat.jpg')} text="Cute cat" target="colors" />
69-
<Button {...props} image={require('../assets/avignon.jpg')} text="Forms and buttons" target="avignon" />
70-
</ScrollView>
71-
);
71+
<Button
72+
{...props}
73+
image={require('../assets/avignon.jpg')}
74+
text="Forms and buttons"
75+
target="avignon"
76+
/>
77+
</ScrollView>;
7278

7379
Menu.route = {
7480
navigationBar: {

‎example/Pages/TvShow.js‎

Lines changed: 23 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,5 @@
11
import React, { Component } from 'react';
2-
import {
3-
StyleSheet,
4-
Text,
5-
View,
6-
Image,
7-
Dimensions,
8-
StatusBar,
9-
} from 'react-native';
2+
import { StyleSheet, Text, View, Image, Dimensions, StatusBar } from 'react-native';
103
import * as Animatable from 'react-native-animatable';
114
import { Header } from 'react-navigation';
125

@@ -103,22 +96,24 @@ class TvShow extends Component {
10396
maxOverlayOpacity={0.6}
10497
minOverlayOpacity={0.3}
10598
fadeOutForeground
106-
renderHeader={() => (
107-
<Image source={tvShowContent.image} style={styles.image} />
108-
)}
109-
renderFixedForeground={() => (
99+
renderHeader={() => <Image source={tvShowContent.image} style={styles.image} />}
100+
renderFixedForeground={() =>
110101
<Animatable.View
111102
style={styles.navTitleView}
112-
ref={(navTitleView) => { this.navTitleView = navTitleView; }}
103+
ref={navTitleView => {
104+
this.navTitleView = navTitleView;
105+
}}
113106
>
114-
<Text style={styles.navTitle}>{tvShowContent.title}, ({tvShowContent.year})</Text>
115-
</Animatable.View>
116-
)}
117-
renderForeground={() => (
107+
<Text style={styles.navTitle}>
108+
{tvShowContent.title}, ({tvShowContent.year})
109+
</Text>
110+
</Animatable.View>}
111+
renderForeground={() =>
118112
<View style={styles.titleContainer}>
119-
<Text style={styles.imageTitle}>{tvShowContent.title}</Text>
120-
</View>
121-
)}
113+
<Text style={styles.imageTitle}>
114+
{tvShowContent.title}
115+
</Text>
116+
</View>}
122117
>
123118
<TriggeringView
124119
style={styles.section}
@@ -131,16 +126,20 @@ class TvShow extends Component {
131126
</TriggeringView>
132127
<View style={styles.section}>
133128
<Text style={styles.sectionTitle}>Overview</Text>
134-
<Text style={styles.sectionContent}>{tvShowContent.overview}</Text>
129+
<Text style={styles.sectionContent}>
130+
{tvShowContent.overview}
131+
</Text>
135132
</View>
136133
<View style={[styles.section, styles.sectionLarge]}>
137134
<Text style={styles.sectionTitle}>Keywords</Text>
138135
<View style={styles.keywords}>
139-
{tvShowContent.keywords.map(keyword => (
136+
{tvShowContent.keywords.map(keyword =>
140137
<View style={styles.keywordContainer} key={keyword}>
141-
<Text style={styles.keyword}>{keyword}</Text>
138+
<Text style={styles.keyword}>
139+
{keyword}
140+
</Text>
142141
</View>
143-
))}
142+
)}
144143
</View>
145144
</View>
146145
</HeaderImageScrollView>

‎example/assets/tvShowContent.js‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ export default {
1010
He's saved us from alien menaces and evil from before time began – but just who is he?`,
1111
image: require('./doctorwho.jpg'),
1212
year: 2005,
13-
genres: [
14-
'Action & Adventure',
15-
'Drama',
16-
'Sci-Fi & Fantasy',
17-
],
13+
genres: ['Action & Adventure', 'Drama', 'Sci-Fi & Fantasy'],
1814
keywords: [
1915
'time travel',
2016
'time machine',
@@ -25,4 +21,3 @@ export default {
2521
'space and aliens',
2622
],
2723
};
28-

‎example/main.js‎

Lines changed: 31 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,36 +2,39 @@ import { StackNavigator } from 'react-navigation';
22

33
import { Menu, TvShow, BasicUsage, ColorsPage, Avignon } from './Pages';
44

5-
export const App = StackNavigator({
6-
menu: {
7-
screen: Menu,
8-
},
9-
tvShow: {
10-
screen: TvShow,
11-
},
12-
basicUsage: {
13-
screen: BasicUsage,
14-
},
15-
colors: {
16-
screen: ColorsPage,
17-
},
18-
avignon: {
19-
screen: Avignon,
5+
export const App = StackNavigator(
6+
{
7+
menu: {
8+
screen: Menu,
9+
},
10+
tvShow: {
11+
screen: TvShow,
12+
},
13+
basicUsage: {
14+
screen: BasicUsage,
15+
},
16+
colors: {
17+
screen: ColorsPage,
18+
},
19+
avignon: {
20+
screen: Avignon,
21+
},
2022
},
21-
}, {
22-
navigationOptions: {
23-
headerTintColor: 'white',
24-
headerStyle: {
25-
position: 'absolute',
26-
top: 0,
27-
elevation: 0,
28-
shadowColor: 'transparent',
29-
shadowRadius: 0,
30-
shadowOffset: {
31-
height: 0,
23+
{
24+
navigationOptions: {
25+
headerTintColor: 'white',
26+
headerStyle: {
27+
position: 'absolute',
28+
top: 0,
29+
elevation: 0,
30+
shadowColor: 'transparent',
31+
shadowRadius: 0,
32+
shadowOffset: {
33+
height: 0,
34+
},
3235
},
3336
},
34-
},
35-
});
37+
}
38+
);
3639

3740
export default App;

‎example/package.json‎

Lines changed: 32 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,34 @@
11
{
2-
"name": "imageHeaderScrollView",
3-
"version": "0.6.1",
4-
"private": true,
5-
"scripts": {
6-
"start": "node node_modules/react-native/local-cli/cli.js start"
7-
},
8-
"dependencies": {
9-
"babel-preset-react-native-stage-0": "^1.0.1",
10-
"react": "16.0.0-alpha.12",
11-
"react-native": "^0.47.1",
12-
"react-native-animatable": "^1.1.0",
13-
"react-native-image-header-scroll-view": "^0.6.1",
14-
"react-navigation": "^1.0.0-beta.11"
15-
},
16-
"devDependencies": {
17-
"babel-jest": "19.0.0",
18-
"babel-preset-react-native": "1.9.1"
19-
},
20-
"jest": {
21-
"preset": "react-native"
22-
}
2+
"name": "imageHeaderScrollView",
3+
"version": "0.6.1",
4+
"private": true,
5+
"scripts": {
6+
"start": "node node_modules/react-native/local-cli/cli.js start",
7+
"prettify": "prettier --single-quote --trailing-comma es5 --print-width 100 --write Pages/**/*.js",
8+
"lint": "eslint ."
9+
},
10+
"dependencies": {
11+
"babel-preset-react-native-stage-0": "^1.0.1",
12+
"react": "16.0.0-alpha.12",
13+
"react-native": "^0.47.1",
14+
"react-native-animatable": "^1.1.0",
15+
"react-native-image-header-scroll-view": "^0.6.1",
16+
"react-navigation": "^1.0.0-beta.11"
17+
},
18+
"devDependencies": {
19+
"babel-jest": "19.0.0",
20+
"babel-preset-react-native": "1.9.1",
21+
"eslint": "^3.19.0",
22+
"eslint-config-prettier": "1.7.0",
23+
"eslint-config-react-app": "^0.6.2",
24+
"eslint-plugin-flowtype": "^2.32.1",
25+
"eslint-plugin-import": "^2.2.0",
26+
"eslint-plugin-jsx-a11y": "^4.0.0",
27+
"eslint-plugin-prettier": "2.1.2",
28+
"eslint-plugin-react": "^6.10.0",
29+
"prettier": "^1.5.3"
30+
},
31+
"jest": {
32+
"preset": "react-native"
33+
}
2334
}

0 commit comments

Comments
 (0)