changes
This commit is contained in:
Ran Greenberg
parent
aeefe87ada
commit
971428c0cd
|
|
@ -8,120 +8,72 @@ import {
|
|||
TouchableOpacity,
|
||||
Image,
|
||||
AlertIOS,
|
||||
CameraRoll
|
||||
CameraRoll,
|
||||
Dimensions
|
||||
} from 'react-native';
|
||||
|
||||
import _ from 'lodash';
|
||||
import Immutable from 'seamless-immutable';
|
||||
|
||||
import {
|
||||
CameraKitGallery
|
||||
CameraKitGalleryView
|
||||
} from 'react-native-camera-kit';
|
||||
|
||||
var groupByEveryN = require('groupByEveryN');
|
||||
const ds = new ListView.DataSource({
|
||||
rowHasChanged: (r1, r2) => r1 !== r2
|
||||
});
|
||||
|
||||
function renderImage(asset) {
|
||||
var imageSize = 150;
|
||||
var imageStyle = [styles.image, {width: imageSize, height: imageSize}];
|
||||
return (
|
||||
<Image
|
||||
source={asset.node.image}
|
||||
style={imageStyle}
|
||||
/>
|
||||
);
|
||||
}
|
||||
const size = Math.floor((Dimensions.get('window').width) / 3);
|
||||
const innerSize = size - 6;
|
||||
|
||||
export default class GalleryScreen extends Component {
|
||||
export default class GalleryScreenNative extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
|
||||
this.state = {
|
||||
albums: {},
|
||||
dataSource: ds,
|
||||
albumName: this.props.albumName,
|
||||
assets: []
|
||||
static navigatorButtons = {
|
||||
rightButtons: [
|
||||
{
|
||||
title: 'Done',
|
||||
id: 'navBarDone'
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
async onNavigatorEvent(event) {
|
||||
if (event.type === 'NavBarButtonPress') {
|
||||
if (event.id === 'navBarDone') {
|
||||
const selected = await this.gallery.getSelectedImages();
|
||||
|
||||
this.props.navigator.push({
|
||||
screen: 'media.PreviewScreen',
|
||||
title: 'Preview',
|
||||
backButtonTitle: 'Albums',
|
||||
passProps: {
|
||||
imagesData: selected.selectedImages
|
||||
},
|
||||
navigatorStyle: {
|
||||
navBarHidden: true
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
if (this.state.albumName) {
|
||||
|
||||
CameraKitGallery.getPhotosForAlbum(this.state.albumName, 100, (data) => this._appendAssets(data), (e) => logError(e));
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
|
||||
this.state = {
|
||||
album: this.props.album,
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Text>{this.state.albumName}</Text>
|
||||
<ListView
|
||||
renderRow={this._renderRow}
|
||||
style={{flex: 1, backgroundColor: 'blue', }}
|
||||
dataSource={this.state.dataSource}
|
||||
/>
|
||||
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
rendererChanged() {
|
||||
console.log('ppppp');
|
||||
var ds = new ListView.DataSource({rowHasChanged: this._rowHasChanged});
|
||||
this.state.dataSource = ds.cloneWithRows(
|
||||
groupByEveryN(this.state.assets, this.props.imagesPerRow)
|
||||
);
|
||||
}
|
||||
|
||||
_renderImage(asset) {
|
||||
var imageSize = 150;
|
||||
var imageStyle = [styles.image, {width: imageSize, height: imageSize}];
|
||||
return (
|
||||
<Image
|
||||
source={asset.node.image}
|
||||
style={imageStyle}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
_renderRow(rowData:Array<Image>, sectionID:string, rowID:string) {
|
||||
console.log(rowID)
|
||||
var images = rowData.map((image) => {
|
||||
if (image === null) {
|
||||
return null;
|
||||
}
|
||||
return renderImage(image);
|
||||
});
|
||||
|
||||
return (
|
||||
<View style={styles.row} key={rowID}>
|
||||
{images}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
_appendAssets(data) {
|
||||
console.log('datadata', data);
|
||||
if (data) {
|
||||
|
||||
var assets = data.edges;
|
||||
var newState:Object = {loadingMore: false};
|
||||
|
||||
if (!data.page_info.has_next_page) {
|
||||
newState.noMore = true;
|
||||
}
|
||||
|
||||
if (assets.length > 0) {
|
||||
|
||||
newState.lastCursor = data.page_info.end_cursor;
|
||||
newState.assets = this.state.assets.concat(assets);
|
||||
|
||||
newState.dataSource = this.state.dataSource.cloneWithRows(
|
||||
groupByEveryN(newState.assets, 25)
|
||||
);
|
||||
}
|
||||
this.setState(newState);
|
||||
}
|
||||
<CameraKitGalleryView
|
||||
ref={(gallery) => {
|
||||
this.gallery = gallery;
|
||||
}}
|
||||
style={{flex:1}}
|
||||
albumName={this.state.album.albumName}/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -146,9 +98,16 @@ const styles = StyleSheet.create({
|
|||
flex: 1,
|
||||
},
|
||||
image: {
|
||||
margin: 4,
|
||||
marginBottom: 0
|
||||
width: innerSize,
|
||||
height: innerSize,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center'
|
||||
},
|
||||
rowContainer: {
|
||||
width: size,
|
||||
height: size,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@
|
|||
* on the same Wi-Fi network.
|
||||
*/
|
||||
|
||||
jsCodeLocation = [NSURL URLWithString:@"http://172.31.9.77:8081/index.ios.bundle?platform=ios&dev=true"];
|
||||
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
|
||||
|
||||
/**
|
||||
* OPTION 2
|
||||
|
|
|
|||
Loading…
Reference in New Issue