bryanlarsen/index.ios.js

## index.ios.js
/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 */
'use strict';

var React = require('react-native');
var { AppRegistry } = React;
var WebViewBridge = require('react-native-webview-bridge');

var ap = React.createClass({
  componentDidMount() {
    var ref = this.refs.webview;
    ref.onMessage((message) => {
      console.log('message from webview', message);
      ref.send('response from native');
    });

    console.log('injecting');
    ref.injectBridgeScript();
    setTimeout(() => { ref.send('ho'); console.log('ho'); }, 2000);
  },

  render: function() {
return <WebViewBridge ref="webview" style={{flex:1}} html={`
<html>
  <head><script>
function WebViewBridgeReady(cb) {
  //checks whether WebViewBirdge exists in global scope.
  if (window.WebViewBridge) {
    cb(window.WebViewBridge);
    return;
  }

  function handler() {
    //remove the handler from listener since we don't need it anymore
    document.removeEventListener('WebViewBridge', handler, false);
    //pass the WebViewBridge object to the callback
    cb(window.WebViewBridge);
  }

  //if WebViewBridge doesn't exist in global scope attach itself to document
  //event system. Once the code is being injected by extension, the handler will
  //be called.
  document.addEventListener('WebViewBridge', handler, false);
}
document.addEventListener("DOMContentLoaded", function(ev) {
  var h1 = document.getElementById('h1');
  h1.innerHTML = 'ready1';

  WebViewBridgeReady(function(bridge) {
    h1.innerHTML = 'ready2';

    bridge.onMessage = function(msg) {
      h1.innerHTML = msg;
    };

    bridge.send('yo');
  });
});
  </script></head>
  <body><h1 id='h1'>Hello</h1></body>
</html>`} />;
  }
});

AppRegistry.registerComponent('ap', () => ap);
	/**
	* Sample React Native App
	* https://github.com/facebook/react-native
	*/
	'use strict';

	var React = require('react-native');
	var { AppRegistry } = React;
	var WebViewBridge = require('react-native-webview-bridge');

	var ap = React.createClass({
	componentDidMount() {
	var ref = this.refs.webview;
	ref.onMessage((message) => {
	console.log('message from webview', message);
	ref.send('response from native');
	});

	console.log('injecting');
	ref.injectBridgeScript();
	setTimeout(() => { ref.send('ho'); console.log('ho'); }, 2000);
	},

	render: function() {
	return <WebViewBridge ref="webview" style={{flex:1}} html={`
	<html>
	<head><script>
	function WebViewBridgeReady(cb) {
	//checks whether WebViewBirdge exists in global scope.
	if (window.WebViewBridge) {
	cb(window.WebViewBridge);
	return;
	}

	function handler() {
	//remove the handler from listener since we don't need it anymore
	document.removeEventListener('WebViewBridge', handler, false);
	//pass the WebViewBridge object to the callback
	cb(window.WebViewBridge);
	}

	//if WebViewBridge doesn't exist in global scope attach itself to document
	//event system. Once the code is being injected by extension, the handler will
	//be called.
	document.addEventListener('WebViewBridge', handler, false);
	}
	document.addEventListener("DOMContentLoaded", function(ev) {
	var h1 = document.getElementById('h1');
	h1.innerHTML = 'ready1';

	WebViewBridgeReady(function(bridge) {
	h1.innerHTML = 'ready2';

	bridge.onMessage = function(msg) {
	h1.innerHTML = msg;
	};

	bridge.send('yo');
	});
	});
	</script></head>
	<body><h1 id='h1'>Hello</h1></body>
	</html>`} />;
	}
	});

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