{"size": 2040, "ext": "js", "max_stars_repo_path": "react-native-demo.js", "max_stars_repo_name": "aneagoie/appleby-lecture", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "react-native-demo.js", "max_issues_repo_name": "aneagoie/appleby-lecture", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "react-native-demo.js", "max_forks_repo_name": "aneagoie/appleby-lecture", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 27.9452054795, "max_line_length": 131, "alphanum_fraction": 0.6166666667}
import React, { Component } from 'react';
import { Text, View, StyleSheet, Image } from 'react-native';
import { Constants, Accelerometer } from 'expo';

export default class App extends Component {
  constructor(props) {
    super(props);

    this.state = { x: 0, y: 0, z: 1, roars: [] };
  }

  componentWillUnmount() {
    this._unsubscribeFromAccelerometer();
  }

  componentDidMount() {
    this._subscribeToAccelerometer();
  }

  _subscribeToAccelerometer = () => {
    this._acceleroMeterSubscription = Accelerometer.addListener(accelerometerData => {
      const { x, y, z } = accelerometerData;

      const prevAccel = Math.abs(this.state.x) + Math.abs(this.state.y) + Math.abs(this.state.z);
      const currAccel = Math.abs(x) + Math.abs(y) + Math.abs(z);

      if (Math.abs(currAccel - prevAccel) > 0.9) {
        let roars = [ ...this.state.roars ];
        if (this.state.roars.length > 20) {
          roars.push(`${this.state.roars.length} times!?! Ok he's getting mad`);
        } else {
          roars.push(`${this.state.roars.length} times!?! DONT SHAKE CHEWBACCA`)
        }
        this.setState({ x, y, z, roars });
      }
    });
  };

  _unsubscribeFromAccelerometer = () => {
    this._acceleroMeterSubscription && this._acceleroMeterSubscription.remove();
    this._acceleroMeterSubscription = null;
  };

  render() {
    return (
      <View style={styles.container}>
        <Image
          source={{uri: "https://img.clipartfest.com/e44efa9cddad7581cff645eefedd239f_play-users-chewbacca-chewbacca_940-700.png"}}
          style={{width: 150, height: 150}}
        />
        {this.state.roars.map(r => <Text style={styles.paragraph}>{r}</Text>)}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
  },
  paragraph: {
    margin: 24,
    fontSize: 18,
    fontWeight: 'bold',
    textAlign: 'center',
    color: '#34495e',
  },
});
