React Native

Setup #

Please ensure that you have added these permissions to your app.

Download and save this HTML file to the assets directory of your app. Right click on the below link and "Save target as".

clanmeeting.html

Install React Native WebView #

https://github.com/react-native-webview/react-native-webview/blob/master/docs/Getting-Started.md

React Native Specific Permissions #

Add support for uploading files for sharing.

Add support for shared file download within your app. Mobile browser is used for the file download otherwise.

Sample Code #

For more URL Parameters please check the Properties page.

xxxxxxxxxx
25
1
import React, { Component } from 'react';
2
import { WebView } from 'react-native-webview';
3

4
// TODO: edit these
5
const meetingHtml = 'file:///android_asset/clanmeeting.html';
6
const urlParameters = '?domain=try.clanmeeting.com&consumerId=your-consumer-id&roomName=uniqueRoomName&displayName=John+Doe';
7

8
class MyWeb extends Component {
9
  render() {
10
    return (
11
      <WebView 
12
        source={{ uri: meetingHtml + urlParameters }}
13
        originWhitelist={['*']}
14
        mediaPlaybackRequiresUserAction={false} // important
15
        domStorageEnabled={true}
16
        allowsInlineMediaPlayback={true} // important
17
        startInLoadingState={true}
18
        allowUniversalAccessFromFileURLs={true}
19
        javaScriptEnabled={true}
20
        clearCache={true}
21
        javaScriptCanOpenWindowsAutomatically={true}
22
      />
23
    );
24
  }
25
}

Adding custom events and methods (optional) #

Please see Communicating between JavaScript and Native to make use of available JavaScript Events to trigger different actions within the app and vice versa.