mirror of
https://github.com/laurent22/joplin.git
synced 2024-12-15 09:04:04 +02:00
71efff6827
* Update eslint config * Applied linter to lib * Applied eslint config to CliClient/app * Removed prettier due to https://github.com/prettier/prettier/pull/4765 * First pass on test units * Applied linter config to test units * Applied eslint config to clipper * Applied to plugin dir * Applied to root of ElectronClient * Applied on RN root * Applied on CLI root * Applied on Clipper root * Applied config to tools * test hook * test hook * test hook * Added pre-commit hook * Applied rule no-trailing-spaces * Make sure root packages are installed when installing sub-dir * Added doc
94 lines
2.6 KiB
JavaScript
94 lines
2.6 KiB
JavaScript
const React = require('react');
|
|
const Component = React.Component;
|
|
const { View, TouchableOpacity } = require('react-native');
|
|
import { RNCamera } from 'react-native-camera';
|
|
const Icon = require('react-native-vector-icons/Ionicons').default;
|
|
const { _ } = require('lib/locale.js');
|
|
|
|
class CameraView extends Component {
|
|
constructor() {
|
|
super();
|
|
|
|
this.state = {
|
|
snapping: false,
|
|
};
|
|
|
|
this.back_onPress = this.back_onPress.bind(this);
|
|
this.photo_onPress = this.photo_onPress.bind(this);
|
|
}
|
|
|
|
back_onPress() {
|
|
if (this.props.onCancel) this.props.onCancel();
|
|
}
|
|
|
|
async photo_onPress() {
|
|
if (!this.camera || !this.props.onPhoto) return;
|
|
|
|
this.setState({ snapping: true });
|
|
|
|
const result = await this.camera.takePictureAsync({
|
|
quality: 0.8,
|
|
exif: true,
|
|
fixOrientation: true,
|
|
});
|
|
|
|
if (this.props.onPhoto) this.props.onPhoto(result);
|
|
|
|
this.setState({ snapping: false });
|
|
}
|
|
|
|
render() {
|
|
const photoIcon = this.state.snapping ? 'md-checkmark' : 'md-camera';
|
|
|
|
return (
|
|
<View style={this.props.style}>
|
|
<RNCamera
|
|
style={{ flex: 1 }}
|
|
ref={ref => {
|
|
this.camera = ref;
|
|
}}
|
|
type={RNCamera.Constants.Type.back}
|
|
captureAudio={false}
|
|
androidCameraPermissionOptions={{
|
|
title: _('Permission to use camera'),
|
|
message: _('Your permission to use your camera is required.'),
|
|
buttonPositive: _('OK'),
|
|
buttonNegative: _('Cancel'),
|
|
}}
|
|
>
|
|
<View style={{ flex: 1, justifyContent: 'space-between', flexDirection: 'column' }}>
|
|
<View style={{ flex: 1, justifyContent: 'flex-start' }}>
|
|
<TouchableOpacity onPress={this.back_onPress}>
|
|
<View style={{ marginLeft: 5, marginTop: 5, borderRadius: 90, width: 50, height: 50, display: 'flex', backgroundColor: '#ffffff55', justifyContent: 'center', alignItems: 'center' }}>
|
|
<Icon
|
|
name={'md-arrow-back'}
|
|
style={{
|
|
fontSize: 40,
|
|
color: 'black',
|
|
}}
|
|
/>
|
|
</View>
|
|
</TouchableOpacity>
|
|
</View>
|
|
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'flex-end', flexDirection: 'row' }}>
|
|
<TouchableOpacity onPress={this.photo_onPress}>
|
|
<View style={{ marginBottom: 20, borderRadius: 90, width: 90, height: 90, backgroundColor: '#ffffffaa', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
|
|
<Icon
|
|
name={photoIcon}
|
|
style={{
|
|
fontSize: 60,
|
|
color: 'black',
|
|
}}
|
|
/>
|
|
</View>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</View>
|
|
</RNCamera>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
module.exports = CameraView;
|