get HTML

example/index.ios.js

@@ -9,16 +9,34 @@ import RichTextEditor from 'react-native-ZSSRichTextEditor'
 
 class RichTextExample extends Component {
 
+  constructor(props) {
+    super(props);
+    this.getHTML = this.getHTML.bind(this);
+  }
+
   render() {
     return (
       <View style={styles.container}>
         <RichTextEditor
+          ref={(r)=>this.richtext = r}
           style={styles.richText}
           initialHTML={'Hello <b>World</b> <p>this is a new paragraph</p>'}
         />
       </View>
     );
   }
+
+  async getHTML() {
+    const html = await this.richtext.getHtml();
+    alert(html);
+  }
+
+  componentDidMount() {
+
+    setTimeout(()=>{
+      this.getHTML();
+    }, 3000);
+  }
 }
 
 const styles = StyleSheet.create({

src/RichTextEditor.js

@@ -2,6 +2,7 @@ import React, {Component, PropTypes} from 'react';
 import WebViewBridge from 'react-native-webview-bridge-updated';
 import {InjectedMessageHandler} from './WebviewMessageHandler';
 import {actions} from './const';
+import * as consts from './const';
 
 const injectScript = `
   (function () {
@@ -26,7 +27,19 @@ export default class RichTextEditor extends Component {
   }
 
   onBridgeMessage(message){
-    console.log('RichTextEditor', 'bridge message: ', message);
+    // handle other callbacks
+    const json = JSON.parse(message);
+    if (json && json.type && json.type === consts.HTML_RESPONSE) {
+      if (this.resolve) {
+        this.resolve(json.data);
+        this.resolve = undefined;
+        this.reject = undefined;
+        if (this.pendingHtml) {
+          clearTimeout(this.pendingHtml);
+          this.pendingHtml = undefined;
+        }
+      }
+    }
   }
 
   onShouldStartLoadRequest(event) {
@@ -54,7 +67,7 @@ export default class RichTextEditor extends Component {
 
   //-------------------------------------------------------------------------------
   //--------------- Public API
-  
+
   setHTML(html) {
     this._sendAction(actions.setHtml, html);
   }
@@ -154,4 +167,23 @@ export default class RichTextEditor extends Component {
   setOutdent() {
     this._sendAction(actions.setOutdent);
   }
+
+  setPlaceholder() {
+    this._sendAction(actions.setPlaceholder);
+  }
+
+  async getHtml() {
+    return new Promise((resolve, reject) => {
+      this.resolve = resolve;
+      this.reject = reject;
+      this._sendAction(actions.getHtml);
+
+      this.pendingHtml = setTimeout(() => {
+        if (this.reject) {
+          this.reject('timeout')
+        }
+      }, 5000);
+    });
+  }
+
 }

src/WebviewMessageHandler.js

@@ -1,4 +1,5 @@
 import {actions} from './const';
+import * as consts from './const';
 
 export const InjectedMessageHandler = `
   if (WebViewBridge) {
@@ -80,6 +81,13 @@ export const InjectedMessageHandler = `
         case '${actions.setOutdent}':
           zss_editor.setOutdent();
           break;
+        case '${actions.setPlaceholder}':
+          zss_editor.setPlaceholder();
+          break;
+        case '${actions.getHtml}':
+          const html = zss_editor.getHTML();
+          WebViewBridge.send(JSON.stringify({type: '${consts.HTML_RESPONSE}', data: html}));
+          break;
       }
     };
   }

src/const.js

@@ -1,5 +1,6 @@
 export const actions = {
   setHtml: 'SET_HTML',
+  getHtml: 'GET_HTML',
   blurEditor: 'BLUR_EDITOR',
   setBold: 'SET_BOLD',
   setItalic: 'SET_ITALIC',
@@ -23,5 +24,8 @@ export const actions = {
   setStrikethrough: 'SET_STRIKETHRU',
   setHR: 'SET_HR',
   setIndent: 'SET_INDENT',
-  setOutdent: 'SET_OUTDENT'
+  setOutdent: 'SET_OUTDENT',
+  setPlaceholder: 'SET_PLACEHOLDER'
 };
+
+export const HTML_RESPONSE = 'HTML_RESPONSE';