upgrade-for-react-native-v0.50.4

react-native-webview-bridge/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+.DS_Store

react-native-webview-bridge/LICENSE

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Ali Najafizadeh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

react-native-webview-bridge/README.md

@@ -0,0 +1,181 @@
+# Looking for Maintainer(s)
+I have been really busy and I can't continue maintaing this repo alone. I would like to ask if anyone wants to help I can grant a permission both on github and npm to start merging a lot of request and dealing with issues.
+
+Please send me your github and npm id so I can add you in.
+
+Thanks!
+
+
+## Please take a look at this [issue](https://github.com/alinz/react-native-webview-bridge/issues/109) first
+
+# React Native WebView Javascript Bridge
+I have been testing and reading a lot of way to safely create a bridge between react-native and webview. I'm happy to announced that the wait is over and from **React-Native 0.20 and above**, the bridge is fully functional.
+
+
+
+## Installation
+
+In order to use this extension, you have to do the following steps:
+
+in your react-native project, run `npm install react-native-webview-bridge --save`
+
+### iOS
+
+1. go to xcode's `Project Navigator` tab
+<p align="center">
+    <img src ="https://raw.githubusercontent.com/alinz/react-native-webview-bridge/master/doc/assets/01.png" />
+</p>
+2. right click on `Libraries`
+3. select `Add Files to ...` option
+<p align="center">
+    <img src ="https://raw.githubusercontent.com/alinz/react-native-webview-bridge/master/doc/assets/02.png" />
+</p>
+4. navigate to `node_modules/react-native-webview-bridge/ios` and add `React-Native-Webview-Bridge.xcodeproj` folder
+<p align="center">
+    <img src ="https://raw.githubusercontent.com/alinz/react-native-webview-bridge/master/doc/assets/03.png" />
+</p>
+5. on project `Project Navigator` tab, click on your project's name and select Target's name and from there click on `Build Phases`
+<p align="center">
+    <img src ="https://raw.githubusercontent.com/alinz/react-native-webview-bridge/master/doc/assets/04.png" />
+</p>
+6. expand `Link Binary With Libraries` and click `+` sign to add a new one.
+7. select `libReact-Native-Webviwe-Bridge.a` and click `Add` button.
+<p align="center">
+    <img src ="https://raw.githubusercontent.com/alinz/react-native-webview-bridge/master/doc/assets/05.png" />
+</p>
+8. clean compile to make sure your project can compile and build.
+
+### Android
+
+1. add the following import to `MainApplication.java` (`MainActivity.java` if RN < 0.29) of your application
+
+```java
+import com.github.alinz.reactnativewebviewbridge.WebViewBridgePackage;
+```
+
+2. add the following code to add the package to `MainApplication.java`` (`MainActivity.java` if RN < 0.29)
+
+```java
+protected List<ReactPackage> getPackages() {
+        return Arrays.<ReactPackage>asList(
+            new MainReactPackage(),
+                new WebViewBridgePackage() //<- this
+        );
+    }
+```
+
+3. add the following codes to your `android/setting.gradle`
+
+> you might have multiple 3rd party libraries, make sure that you don't create multiple include.
+
+```
+include ':app', ':react-native-webview-bridge'
+project(':react-native-webview-bridge').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview-bridge/android')
+```
+
+4. edit `android/app/build.gradle` and add the following line inside `dependencies`
+
+```
+compile project(':react-native-webview-bridge')
+```
+
+5. run `react-native run-android` to see if everything is compilable.
+
+## Usage
+
+just import the module with one of your choices way:
+
+** CommonJS style **
+
+```js
+var WebViewBridge = require('react-native-webview-bridge');
+```
+
+** ES6/ES2015 style **
+
+```js
+import WebViewBridge from 'react-native-webview-bridge';
+```
+
+`WebViewBridge` is an extension of `WebView`. It injects special script into any pages once it loads. Also it extends the functionality of `WebView` by adding 1 new method and 1 new props.
+
+#### sendToBridge(message)
+the message must be in string. because this is the only way to send data back and forth between native and webview.
+
+
+#### onBridgeMessage
+this is a prop that needs to be a function. it will be called once a message is received from webview. The type of received message is also in string.
+
+#### allowFileAccessFromFileURLs (Android only)
+this is a prop that allows locally loaded pages via file:// to access other file:// resources.  Pass-thru to corresponding [setting](https://developer.android.com/reference/android/webkit/WebSettings.html#setAllowFileAccessFromFileURLs(boolean)) in WebView. Default is `false` for Android 4.1 and above.
+
+#### allowUniversalAccessFromFileURLs (Android only)
+this is a prop that allows locally loaded pages via file:// to access resources in any origin.  Pass-thru to corresponding [setting](https://developer.android.com/reference/android/webkit/WebSettings.html#setAllowUniversalAccessFromFileURLs(boolean)) in WebView.  Default is `false` for Android 4.1 and above.
+
+## Bridge Script
+
+bridge script is a special script which injects into all the webview. It automatically register a global variable called `WebViewBridge`. It has 2 optional methods to implement and one method to send message to native side.
+
+#### send(message)
+
+this method sends a message to native side. the message must be in string type or `onError` method will be called.
+
+#### onMessage
+
+this method needs to be implemented. it will be called once a message arrives from native side. The type of message is in string.
+
+#### onError (iOS only)
+
+this is an error reporting method. It will be called if there is an error happens during sending a message. It receives a error message in string type.
+
+## Notes
+
+> a special bridge script will be injected once the page is going to different URL. So you don't have to manage when it needs to be injected.
+
+> You can still pass your own javascript to be injected into webview. However, Bridge script will be injected first and then your custom script.
+
+
+## Simple Example
+This example can be found in `examples` folder.
+
+```js
+const injectScript = `
+  (function () {
+                    if (WebViewBridge) {
+
+                      WebViewBridge.onMessage = function (message) {
+                        if (message === "hello from react-native") {
+                          WebViewBridge.send("got the message inside webview");
+                        }
+                      };
+
+                      WebViewBridge.send("hello from webview");
+                    }
+                  }());
+`;
+
+var Sample2 = React.createClass({
+  onBridgeMessage(message){
+    const { webviewbridge } = this.refs;
+
+    switch (message) {
+      case "hello from webview":
+        webviewbridge.sendToBridge("hello from react-native");
+        break;
+      case "got the message inside webview":
+        console.log("we have got a message from webview! yeah");
+        break;
+    }
+  },
+
+  render() {
+    return (
+      <WebViewBridge
+        ref="webviewbridge"
+        onBridgeMessage={this.onBridgeMessage.bind(this)}
+        injectedJavaScript={injectScript}
+        source={{uri: "http://google.com"}}/>
+    );
+  }
+});
+```

react-native-webview-bridge/android/build.gradle

@@ -0,0 +1,34 @@
+buildscript {
+    repositories {
+        jcenter()
+    }
+
+    dependencies {
+        classpath 'com.android.tools.build:gradle:1.1.3'
+    }
+}
+
+apply plugin: 'com.android.library'
+
+android {
+    compileSdkVersion 23
+    buildToolsVersion "23.0.1"
+
+    defaultConfig {
+        minSdkVersion 16
+        targetSdkVersion 23
+        versionCode 1
+        versionName "1.0"
+    }
+    lintOptions {
+        abortOnError false
+    }
+}
+
+repositories {
+    mavenCentral()
+}
+
+dependencies {
+    compile 'com.facebook.react:react-native:0.19.+'
+}

react-native-webview-bridge/android/src/main/AndroidManifest.xml

@@ -0,0 +1,4 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    package="com.github.alinz.reactnativewebviewbridge">
+
+</manifest>

react-native-webview-bridge/android/src/main/java/com/github/alinz/reactnativewebviewbridge/JavascriptBridge.java

@@ -0,0 +1,29 @@
+package com.github.alinz.reactnativewebviewbridge;
+
+import android.webkit.JavascriptInterface;
+import android.webkit.WebView;
+
+import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.WritableMap;
+import com.facebook.react.modules.core.DeviceEventManagerModule;
+import com.facebook.react.uimanager.events.RCTEventEmitter;
+
+class JavascriptBridge {
+    private WebView webView;
+
+    public JavascriptBridge(WebView webView) {
+        this.webView = webView;
+    }
+
+    @JavascriptInterface
+    public void send(String message) {
+        WritableMap event = Arguments.createMap();
+        event.putString("message", message);
+        ReactContext reactContext = (ReactContext) this.webView.getContext();
+        reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
+                this.webView.getId(),
+                "topChange",
+                event);
+    }
+}

react-native-webview-bridge/android/src/main/java/com/github/alinz/reactnativewebviewbridge/WebViewBridgeManager.java

@@ -0,0 +1,78 @@
+package com.github.alinz.reactnativewebviewbridge;
+
+import android.webkit.WebView;
+
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.views.webview.ReactWebViewManager;
+import com.facebook.react.uimanager.annotations.ReactProp;
+
+import java.util.ArrayList;
+import java.util.Map;
+
+import javax.annotation.Nullable;
+
+public class WebViewBridgeManager extends ReactWebViewManager {
+    private static final String REACT_CLASS = "RCTWebViewBridge";
+
+    public static final int COMMAND_SEND_TO_BRIDGE = 101;
+
+    @Override
+    public String getName() {
+        return REACT_CLASS;
+    }
+
+    @Override
+    public
+    @Nullable
+    Map<String, Integer> getCommandsMap() {
+        Map<String, Integer> commandsMap = super.getCommandsMap();
+
+        commandsMap.put("sendToBridge", COMMAND_SEND_TO_BRIDGE);
+
+        return commandsMap;
+    }
+
+    @Override
+    protected WebView createViewInstance(ThemedReactContext reactContext) {
+        WebView root = super.createViewInstance(reactContext);
+        root.addJavascriptInterface(new JavascriptBridge(root), "WebViewBridge");
+        return root;
+    }
+
+    @Override
+    public void receiveCommand(WebView root, int commandId, @Nullable ReadableArray args) {
+        super.receiveCommand(root, commandId, args);
+
+        switch (commandId) {
+            case COMMAND_SEND_TO_BRIDGE:
+                sendToBridge(root, args.getString(0));
+                break;
+            default:
+                //do nothing!!!!
+        }
+    }
+
+    private void sendToBridge(WebView root, String message) {
+        String script = "WebViewBridge.onMessage('" + message + "');";
+        WebViewBridgeManager.evaluateJavascript(root, script);
+    }
+
+    static private void evaluateJavascript(WebView root, String javascript) {
+        if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.KITKAT) {
+            root.evaluateJavascript(javascript, null);
+        } else {
+            root.loadUrl("javascript:" + javascript);
+        }
+    }
+
+    @ReactProp(name = "allowFileAccessFromFileURLs")
+    public void setAllowFileAccessFromFileURLs(WebView root, boolean allows) {
+        root.getSettings().setAllowFileAccessFromFileURLs(allows);
+    }
+
+    @ReactProp(name = "allowUniversalAccessFromFileURLs")
+    public void setAllowUniversalAccessFromFileURLs(WebView root, boolean allows) {
+        root.getSettings().setAllowUniversalAccessFromFileURLs(allows);
+    }
+}

react-native-webview-bridge/android/src/main/java/com/github/alinz/reactnativewebviewbridge/WebViewBridgePackage.java

@@ -0,0 +1,30 @@
+package com.github.alinz.reactnativewebviewbridge;
+
+import com.facebook.react.ReactPackage;
+import com.facebook.react.bridge.JavaScriptModule;
+import com.facebook.react.bridge.NativeModule;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.uimanager.ViewManager;
+
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.List;
+
+public class WebViewBridgePackage implements ReactPackage {
+    @Override
+    public List<NativeModule> createNativeModules(ReactApplicationContext reactApplicationContext) {
+        return new ArrayList<>();
+    }
+
+    @Override
+    public List<ViewManager> createViewManagers(ReactApplicationContext reactApplicationContext) {
+        return Arrays.<ViewManager>asList(
+                new WebViewBridgeManager()
+        );
+    }
+
+    @Override
+    public List<Class<? extends JavaScriptModule>> createJSModules() {
+        return Arrays.asList();
+    }
+}