From 33be245403ae1aba412669dd0d1e6cd054f42abb Mon Sep 17 00:00:00 2001 From: Ali Najafizadeh Date: Tue, 14 Jul 2015 13:53:03 -0400 Subject: [PATCH] adding reacttag into script loader --- example/Sample2/RCTWebView+WebViewExBridge.h | 10 ++++---- example/Sample2/RCTWebView+WebViewExBridge.m | 23 +++++++++++++------ .../RCTWebViewManager+WebViewExManager.m | 14 ++++++++++- example/Sample2/WebViewBridge.js | 19 ++++++++++++--- example/Sample2/index.ios.js | 5 ++++ example/Sample2/webview-bridge-script.js | 6 ++++- 6 files changed, 61 insertions(+), 16 deletions(-) diff --git a/example/Sample2/RCTWebView+WebViewExBridge.h b/example/Sample2/RCTWebView+WebViewExBridge.h index 6427208..443032d 100644 --- a/example/Sample2/RCTWebView+WebViewExBridge.h +++ b/example/Sample2/RCTWebView+WebViewExBridge.h @@ -10,11 +10,13 @@ #import "RCTBridgeModule.h" @interface RCTWebView (WebViewExBridge) -- (void)eval:(NSString *) value; -- (void)injectBridgeScript; -- (void) bridgeSetup; -- (void) callbackCleanup:(NSNumber *)reactTag; +- (void)injectBridgeScript:(NSNumber*)reactTag; + +- (void)eval:(NSString *) value; +- (void)bridgeSetup; +- (void)send:(NSString*)message; +- (void)callbackCleanup:(NSNumber *)reactTag; - (void)onMessageCallback:(RCTResponseSenderBlock)callback withReactTag:(NSNumber *)reactTag; //in this category I'm going to make this mothod visible. diff --git a/example/Sample2/RCTWebView+WebViewExBridge.m b/example/Sample2/RCTWebView+WebViewExBridge.m index 0ece4da..a52d07a 100644 --- a/example/Sample2/RCTWebView+WebViewExBridge.m +++ b/example/Sample2/RCTWebView+WebViewExBridge.m @@ -21,13 +21,19 @@ static dispatch_queue_t serialQueue; - (void) bridgeSetup { static dispatch_once_t onceQueue; - + dispatch_once(&onceQueue, ^{ callbackMap = [[NSMutableDictionary alloc] init]; serialQueue = dispatch_queue_create("react-native-webview-bridge", NULL); }); } +- (void)send:(NSString*)message { + UIWebView* _webView = [self valueForKey:@"_webView"]; + NSString *command = [NSString stringWithFormat: @"WebViewBridge.onMessage('%@');", message]; + [_webView stringByEvaluatingJavaScriptFromString:command]; +} + - (void) callbackCleanup:(NSNumber *)reactTag { [callbackMap removeObjectForKey:reactTag]; } @@ -49,14 +55,14 @@ static dispatch_queue_t serialQueue; NSURL *URL = [request URL]; if ([[URL scheme] isEqualToString:RNWBSchema]) { // parse the rest of the URL object and execute functions - + NSString* message = [webView stringByEvaluatingJavaScriptFromString:@"WebViewBridge._fetch()"]; - + NSLog(@"%@", message); - + return YES; } - + return NO; } @@ -89,13 +95,16 @@ static dispatch_queue_t serialQueue; return [[webView stringByEvaluatingJavaScriptFromString:@"typeof WebViewBridge == 'object'"] isEqualToString:@"true"]; } -- (void)injectBridgeScript { +- (void)injectBridgeScript:(NSNumber*)reactTag { UIWebView* _webView = [self valueForKey:@"_webView"]; - + if (![self isWebViewBridgeInstantiated:_webView]) { NSBundle *bundle = [NSBundle mainBundle]; NSString *filePath = [bundle pathForResource:@"webview-bridge-script" ofType:@"js"]; + NSString *handlerId = [NSString stringWithFormat: @"var webViewBridgeHandlerId = %@;", reactTag]; NSString *js = [NSString stringWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil]; + js = [js stringByReplacingOccurrencesOfString:@"var webViewBridgeHandlerId = 0;" + withString:handlerId]; [_webView stringByEvaluatingJavaScriptFromString:js]; } } diff --git a/example/Sample2/RCTWebViewManager+WebViewExManager.m b/example/Sample2/RCTWebViewManager+WebViewExManager.m index 291683c..9d8c4da 100644 --- a/example/Sample2/RCTWebViewManager+WebViewExManager.m +++ b/example/Sample2/RCTWebViewManager+WebViewExManager.m @@ -59,6 +59,18 @@ RCT_EXPORT_METHOD(onMessage:(NSNumber *)reactTag }]; } +RCT_EXPORT_METHOD(send:(NSNumber *)reactTag + value:(NSString*)message) +{ + [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, RCTSparseArray *viewRegistry) { + RCTWebView *view = viewRegistry[reactTag]; + if (![view isKindOfClass:[RCTWebView class]]) { + RCTLogMustFix(@"Invalid view returned from registry, expecting RKWebView, got: %@", view); + } + [view send:message]; + }]; +} + RCT_EXPORT_METHOD(eval:(NSNumber *)reactTag value:(NSString*)value) { @@ -78,7 +90,7 @@ RCT_EXPORT_METHOD(injectBridgeScript:(NSNumber *)reactTag) if (![view isKindOfClass:[RCTWebView class]]) { RCTLogMustFix(@"Invalid view returned from registry, expecting RKWebView, got: %@", view); } - [view injectBridgeScript]; + [view injectBridgeScript: reactTag]; }]; } diff --git a/example/Sample2/WebViewBridge.js b/example/Sample2/WebViewBridge.js index 0cabb0b..0da1cf3 100644 --- a/example/Sample2/WebViewBridge.js +++ b/example/Sample2/WebViewBridge.js @@ -17,11 +17,26 @@ class WebViewBridge extends Component { super(props); } + onMessage(cb) { + var ref = this.refs[WEB_VIEW_BRIDGE_REF]; + WebViewManager.onMessage(ref.getWebWiewHandle(), cb); + } + evalScript(value) { var ref = this.refs[WEB_VIEW_BRIDGE_REF]; WebViewManager.eval(ref.getWebWiewHandle(), value); } + send(message) { + var ref = this.refs[WEB_VIEW_BRIDGE_REF]; + + if (typeof message !== 'string') { + message = JSON.stringify(message); + } + + WebViewManager.send(ref.getWebWiewHandle(), message); + } + componentDidMount() { //setup the internal variables of webview bridge var ref = this.refs[WEB_VIEW_BRIDGE_REF]; @@ -33,9 +48,7 @@ class WebViewBridge extends Component { componentWillUnmount() { var ref = this.refs[WEB_VIEW_BRIDGE_REF]; - WebViewManager.bridgeSetup(ref.getWebWiewHandle()); - - + WebViewManager.callbackCleanup(ref.getWebWiewHandle()); } render() { diff --git a/example/Sample2/index.ios.js b/example/Sample2/index.ios.js index 808186d..d3a4621 100644 --- a/example/Sample2/index.ios.js +++ b/example/Sample2/index.ios.js @@ -18,6 +18,11 @@ var Sample2 = React.createClass({ onNavigationStateChange: function () { console.log('onNavigationStateChange is called'); }, + componentDidMount: function () { + this.refs.ali.onMessage(function () { + console.log('hello world!'); + }); + }, render: function() { var timeStamp = new Date().getTime(); var url = "http://192.168.1.112:8080?" + timeStamp;//"http://ali.local:8080"; diff --git a/example/Sample2/webview-bridge-script.js b/example/Sample2/webview-bridge-script.js index 666c49c..580e47c 100644 --- a/example/Sample2/webview-bridge-script.js +++ b/example/Sample2/webview-bridge-script.js @@ -1,6 +1,8 @@ (function() { 'use strict'; + var webViewBridgeHandlerId = 0; + var doc = document; var WebViewBridge = {}; var RNWBSchema = "rnwb"; @@ -13,7 +15,9 @@ WebViewBridge = { //do not call _fetch directly. this is for internal use _fetch: function () { - var message = JSON.stringify(queue); + var message; + queue.unshift(webViewBridgeHandlerId); + message = JSON.stringify(queue); queue = []; inProcess = false; return message;