rclai
4/27/2016 - 11:05 PM

A test use of react-native-ble

A test use of react-native-ble

import React, {
  AppRegistry,
  Component,
  StyleSheet,
  Text,
  View
} from 'react-native';

import { Buffer } from 'buffer';
import RNBLE from 'react-native-ble';

// convenience function
function createListener(name, listener) {
  RNBLE.addListener(name, listener);
  return {
    remove: function() {
      RNBLE.removeListener(name, listener);
    },
  };
}

class RNNobleTest extends Component {

  componentDidMount() {
    // Do this because when hot reload happens,
    // scanning might still be running
    RNBLE.stopScanning();

    console.log('bluetooth state is', RNBLE.state);

    this.listeners = [
      createListener('discover', this.onDiscover),
      createListener('stateChange', this.onStateChange),
    ];

    if (RNBLE.state === 'poweredOn') {
      console.log('scanning');
      RNBLE.startScanning(null, true);
    } else {
      // Use a timer loop maybe to call RNBLE.getState()
      // in case it comes back as `unknown`
    }
  }

  componentWillUnmount() {
    this.listeners.forEach(l => l.remove());
    RNBLE.stopScanning();
  }

  onStateChange = (state) => {
    console.log('bluetooth state changed to', state);
    if (state === 'poweredOn') {
      console.log('scanning');
      RNBLE.startScanning(null, true);
    }
  };

  onDiscover = (peripheral) => {
    console.log(peripheral.id, peripheral.advertisement.localName);
    if (peripheral.state === 'disconnected' && peripheral.advertisement.localName === 'PWNITIZATION') {
      RNBLE.stopScanning();
      console.log('connecting');
      peripheral.connect((error) => {
        error && console.log(error);
        !error && console.log('connected');
        !error && peripheral.discoverAllServicesAndCharacteristics((error, services, characteristics) => {
          characteristics.forEach((characteristic) => {
            console.log('characteristic', characteristic.uuid);
            var buf = new Buffer('hello world');
            console.log('instance of Buffer', (buf instanceof Buffer));
            characteristic.write(buf, false, () => {
              console.log('wrote value to the char');
              characteristic.read((error, value) => {
                // console.log('written value is', value.readUInt8(0));
                console.log('written value is', value.toString());
              });
            });
          });
        });
      });
    }
  };

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.ios.js
        </Text>
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{'\n'}
          Cmd+D or shake for dev menu
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

AppRegistry.registerComponent('RNNobleTest', () => RNNobleTest);