From 4b8ab4a00f92aae9a476fc66597588d3a36faa8e Mon Sep 17 00:00:00 2001 From: Ibrahim Hadeed Date: Thu, 11 Aug 2016 07:26:39 -0400 Subject: [PATCH] feat(inappbrowser): implement instance based wrapper (#305) * feat(inappbrowser): the inAppBrowser class is no longer static * feat(inappbrowser): fallback on window.open if plugin not available * change warning text to match expected release version --- src/plugins/inappbrowser.ts | 152 ++++++++++++++++++------------------ 1 file changed, 75 insertions(+), 77 deletions(-) diff --git a/src/plugins/inappbrowser.ts b/src/plugins/inappbrowser.ts index 6540bceb..65bfe868 100644 --- a/src/plugins/inappbrowser.ts +++ b/src/plugins/inappbrowser.ts @@ -1,5 +1,6 @@ -import { Cordova, Plugin } from './plugin'; - +import { Plugin, CordovaInstance } from './plugin'; +import { Observable } from 'rxjs/Observable'; +declare var cordova: any; export interface InAppBrowserEvent extends Event { /** the eventname, either loadstart, loadstop, loaderror, or exit. */ @@ -11,68 +12,35 @@ export interface InAppBrowserEvent extends Event { /** the error message, only in the case of loaderror. */ message: string; } - -export interface InAppBrowserRef { - /** - * Adds a listener for an event from the InAppBrowser. - * @param type the event to listen for - * loadstart: event fires when the InAppBrowser starts to load a URL. - * loadstop: event fires when the InAppBrowser finishes loading a URL. - * loaderror: event fires when the InAppBrowser encounters an error when loading a URL. - * exit: event fires when the InAppBrowser window is closed. - * @param callback the function that executes when the event fires. The function is - * passed an InAppBrowserEvent object as a parameter. - */ - addEventListener(type: string, callback: (event: InAppBrowserEvent) => void); - - /** - * Removes a listener for an event from the InAppBrowser. - * @param type The event to stop listening for. - * loadstart: event fires when the InAppBrowser starts to load a URL. - * loadstop: event fires when the InAppBrowser finishes loading a URL. - * loaderror: event fires when the InAppBrowser encounters an error when loading a URL. - * exit: event fires when the InAppBrowser window is closed. - * @param callback the function that executes when the event fires. The function is - * passed an InAppBrowserEvent object as a parameter. - */ - removeEventListener(type: string, callback: (event: InAppBrowserEvent) => void); - - /** Closes the InAppBrowser window. */ - close(); - - /** - * Displays an InAppBrowser window that was opened hidden. Calling this has no effect - * if the InAppBrowser was already visible. - */ - show(); - - /** - * Injects JavaScript code into the InAppBrowser window. - * @param script Details of the script to run, specifying either a file or code key. - * @param callback The function that executes after the JavaScript code is injected. - * If the injected script is of type code, the callback executes with - * a single parameter, which is the return value of the script, wrapped in an Array. - * For multi-line scripts, this is the return value of the last statement, - * or the last expression evaluated. - */ - executeScript(script: { file?: string, code?: string }, callback?: (result?: any) => void); - - /** - * Injects CSS into the InAppBrowser window. - * @param css Details of the script to run, specifying either a file or code key. - * @param callback The function that executes after the CSS is injected. - */ - insertCSS(css: { file?: string, code?: string }, callback?: () => void); -} - +/** + * @name InAppBrowser + * @description Launches in app Browser + * @usage + * ```typescript + * import {InAppBrowser} from 'ionic-native'; + * + * + * ... + * + * + * let browser = new InAppBrowser('https://ionic.io', '_system'); + * browser.executeScript(...); + * browser.insertCSS(...); + * browser.close(); + * ``` + */ @Plugin({ plugin: 'cordova-plugin-inappbrowser', - pluginRef: 'cordova.InAppBrowser' + pluginRef: 'cordova.InAppBrowser', + repo: 'https://github.com/apache/cordova-plugin-inappbrowser' }) export class InAppBrowser { + static open(url: string, target?: string, options?: string): void { + console.warn('Native: Your current usage of the InAppBrowser plugin is depreciated as of ionic-native@1.3.8. Please check the Ionic Native docs for the latest usage details.'); + } - + private _objectInstance: any; /** * Opens a URL in a new InAppBrowser instance, the current browser instance, or the system browser. @@ -82,24 +50,54 @@ export class InAppBrowser { * The options string must not contain any blank space, and each feature's * name/value pairs must be separated by a comma. Feature names are case insensitive. */ - - /** - * @name InAppBrowser - * @description - * @usage - * ```typescript - * import { InAppBrowser } from 'ionic-native'; - * - * - * - * InAppBrowser.open(url, target, options); - * - * - * ``` - */ - @Cordova({ - sync: true - }) - static open(url: string, target?: string, options?: string): InAppBrowserRef { return; } + constructor(url: string, target?: string, options?: string) { + try { + this._objectInstance = cordova.InAppBrowser.open(url, target, options); + } catch (e) { + window.open(url); + console.warn('Native: InAppBrowser is not installed or you are running on a browser. Falling back to window.open, all instance methods will NOT work.'); + } + } + /** + * Displays an InAppBrowser window that was opened hidden. Calling this has no effect + * if the InAppBrowser was already visible. + */ + @CordovaInstance({sync: true}) + show(): void { } + + /** + * Closes the InAppBrowser window. + */ + @CordovaInstance({sync: true}) + close(): void { } + + /** + * Injects JavaScript code into the InAppBrowser window. + * @param script Details of the script to run, specifying either a file or code key. + */ + @CordovaInstance() + executeScript(script: {file?: string, code?: string}): Promise {return; } + + /** + * Injects CSS into the InAppBrowser window. + * @param css Details of the script to run, specifying either a file or code key. + */ + @CordovaInstance() + insertCss(css: {file?: string, code?: string}): Promise {return; } + + + + + /** + * A method that allows you to listen to events happening in the browser. + * @param event Event name + * @returns {Observable} Returns back an observable that will listen to the event on subscribe, and will stop listening to the event on unsubscribe. + */ + on(event: string): Observable { + return new Observable((observer) => { + this._objectInstance.addEventListener(event, observer.next.bind); + return () => this._objectInstance.removeEventListener(event, observer.next.bind); + }); + } }