Delete playground.js
This commit is contained in:
Michael Diarmid
GitHub
parent
eb48435421
commit
2d8f6314d4
|
|
@ -1,159 +0,0 @@
|
|||
import React, { Component } from 'react';
|
||||
import { View, SectionList, Text, Button } from 'react-native';
|
||||
|
||||
export default class HomeScreen extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
bgColor: '#cb2600',
|
||||
};
|
||||
}
|
||||
|
||||
clickMe = () => {
|
||||
if (this.state.bgColor === '#a8139f') {
|
||||
this.setState({ bgColor: '#cb2600' });
|
||||
} else {
|
||||
this.setState({ bgColor: '#a8139f' });
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={{ backgroundColor: this.state.bgColor }}>
|
||||
<Text style={{ color: '#fff' }}>Hello</Text>
|
||||
<Text style={{ color: '#22ff31' }}>World</Text>
|
||||
<Button title="Change to pink" onPress={this.clickMe} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const sampleData = {
|
||||
somePostId1: {
|
||||
title: 'today now',
|
||||
timestamp: Date.now(),
|
||||
startOfDay: 1502838000,
|
||||
},
|
||||
|
||||
somePostId3: {
|
||||
title: 'today but older',
|
||||
timestamp: Date.now() - 10000000,
|
||||
startOfDay: 1502838000,
|
||||
},
|
||||
|
||||
somePostId4: {
|
||||
title: 'today but even older',
|
||||
timestamp: Date.now() - 60000000,
|
||||
startOfDay: 1502838000,
|
||||
},
|
||||
|
||||
somePostId2: {
|
||||
title: 'hello yesterday',
|
||||
timestamp: Date.now() - 82000000, // minus 23 hours - just to make it yesterday ;p
|
||||
startOfDay: 1502751600, // yesterday ;p
|
||||
},
|
||||
|
||||
somePostId5: {
|
||||
title: 'hello yesterday but older',
|
||||
timestamp: Date.now() - 82800000, // minus 23 hours - just to make it yesterday ;p
|
||||
startOfDay: 1502751600, // yesterday ;p
|
||||
},
|
||||
};
|
||||
|
||||
// export default class PostsScreen extends Component {
|
||||
// constructor(props) {
|
||||
// super(props);
|
||||
// this.ref = null;
|
||||
// this.state = {
|
||||
// postSections: [],
|
||||
// };
|
||||
// }
|
||||
//
|
||||
// componentDidMount() {
|
||||
// // this.ref = firebase.database().ref('posts');
|
||||
// // this.ref.on('value', this._onPostsUpdate);
|
||||
// // just fake it to test
|
||||
// this._onPostsUpdate({
|
||||
// val() {
|
||||
// return sampleData;
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// componentWillUnmount() {
|
||||
// // always unsubscribe from realtime events when component unmounts
|
||||
// // if (this.ref) {
|
||||
// // this.ref.off('value', this._onPostsUpdate);
|
||||
// // }
|
||||
// }
|
||||
//
|
||||
// _onPostsUpdate(snapshot) {
|
||||
// const value = snapshot.val() || {};
|
||||
// const keys = Object.keys(value);
|
||||
// const sections = {};
|
||||
//
|
||||
// // we'll group them now by date
|
||||
// for (let i = 0, len = keys.length; i < len; i++) {
|
||||
// const key = keys[i];
|
||||
// const post = value[key];
|
||||
//
|
||||
// // assuming post will have a 'timestamp' field and a `startOfDay` field
|
||||
// // start of day can be calculated as above `startOfToday`
|
||||
//
|
||||
// if (!sections[post.startOfDay]) {
|
||||
// sections[post.startOfDay] = {
|
||||
// title: 'Header - I will leave this up to you', // todo today/yesterday/3 days ago etc
|
||||
// // will use this later to sort the sections so today is on top
|
||||
// key: post.startOfDay,
|
||||
// data: [],
|
||||
// };
|
||||
// }
|
||||
//
|
||||
// const data = Object.assign({ key }, post);
|
||||
// // add a post to a specific section date
|
||||
// // we'll push/unshift depending on the date, so they' appear in order
|
||||
// if (!sections[post.startOfDay].data.length) {
|
||||
// // array is empty so nothing to compare sort, just push it
|
||||
// sections[post.startOfDay].data.push(data);
|
||||
// } else {
|
||||
// const previousTimestamp = sections[post.startOfDay].data[sections[post.startOfDay].data.length - 1].timestamp;
|
||||
// if (previousTimestamp < data.timestamp) sections[post.startOfDay].data.unshift(data);
|
||||
// else sections[post.startOfDay].data.push(data);
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// this.setState({
|
||||
// postSections: Object.values(sections).sort((a, b) => a.key > b.key).reverse(),
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// _renderSectionItem = ({ item }) => {
|
||||
// // todo your custom section item component
|
||||
// // return (
|
||||
// // <EventCell
|
||||
// // userName={item.userName}
|
||||
// // postTitle={item.postTitle}
|
||||
// // />
|
||||
// // );
|
||||
//
|
||||
// return <Text>{`${item.title} - ${item.timestamp}`}</Text>;
|
||||
// };
|
||||
//
|
||||
// _renderSectionHeader = ({ section }) => {
|
||||
// // todo your custom section header
|
||||
// return (
|
||||
// <Text style={{ backgroundColor: '#000', color: '#fff' }}>{section.title}</Text>
|
||||
// );
|
||||
// };
|
||||
//
|
||||
// render() {
|
||||
// return (
|
||||
// <SectionList
|
||||
// sections={this.state.postSections}
|
||||
// renderItem={this._renderSectionItem}
|
||||
// renderSectionHeader={this._renderSectionHeader}
|
||||
// />
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
Loading…
Reference in New Issue