style: use prettier

This commit is contained in:
AntoineDoubovetzky 2018-06-13 19:34:15 +02:00
parent 4ed8798020
commit ca0de304b9
8 changed files with 100 additions and 95 deletions

5
.prettierrc Normal file
View File

@ -0,0 +1,5 @@
{
"singleQuote": true,
"trailingComma": "es5",
"printWidth": 120
}

View File

@ -4,16 +4,7 @@
*/
import React, { Component } from 'react';
import {
AppRegistry,
CameraRoll,
StyleSheet,
Text,
View,
Image,
Alert,
TouchableOpacity
} from 'react-native';
import { AppRegistry, CameraRoll, StyleSheet, Text, View, Image, Alert, TouchableOpacity } from 'react-native';
import Spinner from 'react-native-gifted-spinner';
import ImageResizer from 'react-native-image-resizer';
@ -42,7 +33,7 @@ const styles = StyleSheet.create({
color: '#333333',
fontWeight: 'bold',
marginBottom: 5,
}
},
});
export default class ResizerExample extends Component {
@ -56,60 +47,53 @@ export default class ResizerExample extends Component {
}
componentDidMount() {
CameraRoll.getPhotos({first: 1}).then((photos) => {
if (!photos.edges || photos.edges.length === 0) {
return Alert.alert('Unable to load camera roll',
'Check that you authorized the access to the camera roll photos and that there is at least one photo in it');
}
CameraRoll.getPhotos({ first: 1 })
.then(photos => {
if (!photos.edges || photos.edges.length === 0) {
return Alert.alert(
'Unable to load camera roll',
'Check that you authorized the access to the camera roll photos and that there is at least one photo in it'
);
}
this.setState({
image: photos.edges[0].node.image,
this.setState({
image: photos.edges[0].node.image,
});
})
}).catch(() => {
return Alert.alert('Unable to load camera roll',
'Check that you authorized the access to the camera roll photos');
});
.catch(() => {
return Alert.alert(
'Unable to load camera roll',
'Check that you authorized the access to the camera roll photos'
);
});
}
resize() {
ImageResizer.createResizedImage(this.state.image.uri, 800, 600, 'JPEG', 80)
.then(({uri}) => {
this.setState({
resizedImageUri: uri,
ImageResizer.createResizedImage(this.state.image.uri, 8, 6, 'JPEG', 80)
.then(({ uri }) => {
this.setState({
resizedImageUri: uri,
});
})
.catch(err => {
console.log(err);
return Alert.alert('Unable to resize the photo', 'Check the console for full the error message');
});
}).catch((err) => {
console.log(err);
return Alert.alert('Unable to resize the photo',
'Check the console for full the error message');
});
}
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Image Resizer example
</Text>
<Text style={styles.instructions}>
This is the original image:
</Text>
{
this.state.image ?
<Image style={styles.image} source={{uri: this.state.image.uri}} /> :
<Spinner />
}
<Text style={styles.instructions}>
Resized image:
</Text>
<Text style={styles.welcome}>Image Resizer example</Text>
<Text style={styles.instructions}>This is the original image:</Text>
{this.state.image ? <Image style={styles.image} source={{ uri: this.state.image.uri }} /> : <Spinner />}
<Text style={styles.instructions}>Resized image:</Text>
<TouchableOpacity onPress={() => this.resize()}>
<Text style={styles.resizeButton}>
Click me to resize the image
</Text>
<Text style={styles.resizeButton}>Click me to resize the image</Text>
</TouchableOpacity>
{
this.state.resizedImageUri ?
<Image style={styles.image} source={{uri: this.state.resizedImageUri}} /> : null
}
{this.state.resizedImageUri ? (
<Image style={styles.image} source={{ uri: this.state.resizedImageUri }} />
) : null}
</View>
);
}

View File

@ -5,9 +5,7 @@
*/
import React, { Component } from 'react';
import {
AppRegistry,
} from 'react-native';
import { AppRegistry } from 'react-native';
import ResizerExample from './app';
AppRegistry.registerComponent('ResizerExample', () => ResizerExample);

View File

@ -5,9 +5,7 @@
*/
import React, { Component } from 'react';
import {
AppRegistry,
} from 'react-native';
import { AppRegistry } from 'react-native';
import ResizerExample from './app';
AppRegistry.registerComponent('ResizerExample', () => ResizerExample);

View File

@ -5,8 +5,17 @@ const ImageResizerAndroid = React.NativeModules.ImageResizerAndroid;
export default {
createResizedImage: (imagePath, newWidth, newHeight, compressFormat, quality, rotation = 0, outputPath) => {
return new Promise((resolve, reject) => {
ImageResizerAndroid.createResizedImage(imagePath, newWidth, newHeight,
compressFormat, quality, rotation, outputPath, resolve, reject);
ImageResizerAndroid.createResizedImage(
imagePath,
newWidth,
newHeight,
compressFormat,
quality,
rotation,
outputPath,
resolve,
reject
);
});
},
};

32
index.d.ts vendored
View File

@ -1,16 +1,20 @@
declare module "react-native-image-resizer" {
export interface Response {
path: string;
uri: string;
size?: number;
name?: string;
}
declare module 'react-native-image-resizer' {
export interface Response {
path: string;
uri: string;
size?: number;
name?: string;
}
export default class ImageResizer {
static createResizedImage(
uri: string, width: number, height: number,
format: "PNG" | "JPEG" | "WEBP", quality: number,
rotation?: number, outputPath?: string
): Promise<Response>;
}
export default class ImageResizer {
static createResizedImage(
uri: string,
width: number,
height: number,
format: 'PNG' | 'JPEG' | 'WEBP',
quality: number,
rotation?: number,
outputPath?: string
): Promise<Response>;
}
}

View File

@ -1,6 +1,4 @@
import {
NativeModules,
} from 'react-native';
import { NativeModules } from 'react-native';
export default {
createResizedImage: (path, width, height, format, quality, rotation = 0, outputPath) => {
@ -9,13 +7,22 @@ export default {
}
return new Promise((resolve, reject) => {
NativeModules.ImageResizer.createResizedImage(path, width, height, format, quality, rotation, outputPath, (err, response) => {
if (err) {
return reject(err);
}
NativeModules.ImageResizer.createResizedImage(
path,
width,
height,
format,
quality,
rotation,
outputPath,
(err, response) => {
if (err) {
return reject(err);
}
resolve(response);
});
resolve(response);
}
);
});
},
};

View File

@ -1,21 +1,21 @@
// @flow
declare type ResizedImageInfo = {
path: string,
uri: string,
size?: number,
name?: string
path: string,
uri: string,
size?: number,
name?: string,
};
declare function createResizedImage(
uri: string,
width: number,
height: number,
format: 'PNG' | 'JPEG' | 'WEBP',
quality: number,
rotation?: number,
outputPath?: string
uri: string,
width: number,
height: number,
format: 'PNG' | 'JPEG' | 'WEBP',
quality: number,
rotation?: number,
outputPath?: string
): Promise<ResizedImageInfo>;
declare export default {
createResizedImage: createResizedImage
createResizedImage: createResizedImage,
};