Demo

demo/.gitignore

@@ -0,0 +1,31 @@
+# Specifies intentionally untracked files to ignore when using Git
+# http://git-scm.com/docs/gitignore
+
+*~
+*.sw[mnpcod]
+*.log
+*.tmp
+*.tmp.*
+log.txt
+*.sublime-project
+*.sublime-workspace
+
+.idea/
+.sass-cache/
+.versions/
+coverage/
+dist/
+node_modules/
+tmp/
+temp/
+hooks/
+platforms/
+plugins/
+plugins/android.json
+plugins/ios.json
+www/build/
+$RECYCLE.BIN/
+
+.DS_Store
+Thumbs.db
+UserInterfaceState.xcuserstate

demo/README.md

@@ -0,0 +1,72 @@
+## Getting Started
+
+`ionic serve`
+
+The `ionic serve` command compiles your ES6 files to ES5, your Sass files to CSS, bundles it all up for you, opens up a browser window and serves your app locally.  After the initial build it will watch for changes and automatically rebuild and reload.  The build output can be configured in your `ionic.config.js` file (which will be autogenerated by `ionic serve` if it doesn't exist yet).
+
+#### Updating Ionic
+When you start your project with `ionic start`, the latest version of `ionic-framework` is installed automatically. To update your ionic version in an existing project, run `npm install --save ionic-framework@latest`. This will install the latest version of `ionic-framework` published to npm, and save it in your `package.json` file so if you are checking your project in to version control the correct version of the framework will be installed by [`npm install`](https://docs.npmjs.com/cli/install).
+
+#### Developing Against Unstable Master
+- THIS IS NOT UPDATING YOUR APP. THIS IS FOR DEVELOPING AGAINST THE UNSTABLE MASTER BRANCH, WHICH WE DO NOT RECOMMEND. SEE [Updating Ionic](#updating-ionic) FOR INSTRUCTIONS ON UPDATING TO THE LATEST VERSION OF THE FRAMEWORK. To develop against a local version of ionic-framework (master) you'll need to do the following:
+```bash
+# if you haven't already, clone the ionic2 repo:
+$ git clone https://github.com/driftyco/ionic2.git
+$ cd ionic2
+$ npm install
+$ gulp src # build the source files
+$ npm link
+
+# now go to your app directory
+$ cd /Users/Ionitron/git/MyIonic2App
+$ npm link ionic-framework
+```
+And then update your [`webpack.config.js`](https://github.com/driftyco/ionic2-app-base/blob/master/webpack.config.js#L68) file by uncommenting the lines for local development:
+```js
+resolve: {
+  modulesDirectories: [
+    "node_modules",
+    "node_modules/ionic-framework/node_modules", 
+    "node_modules/ionic-framework/dist/src/es5/common", 
+    "node_modules/ionic-framework/dist/js", 
+
+    "dist/src/es5/common" // <--- Uncomment me  
+  ],
+}
+```
+Update the ionic2 [`gulpfile.js #L141`](https://github.com/driftyco/ionic2/blob/master/gulpfile.js#L141) to this in order to use `gulp watch` and make changes to the ionic2 repo:
+```js
+gulp.start('transpile.common');
+```
+
+
+### Missing Ionic 1 features
+
+We are currently working on completing a few core Ionic 1 features:
+
+- Collection repeat (known as Virtual Scrolling in v2) is not quite ready
+
+### Current Angular 2 known issues:
+
+- Angular 2 is still in alpha and is not production ready
+- Angular team has first focused on developing what the core of Angular 2 "is"
+- Angular 2 filesize has not been optimized for minification yet
+- Angular 2 bootstrap time has not been optimized yet
+- As Angular 2 reaches beta there will be significant performance improvements
+
+
+### ES6/Typescript
+
+- Ionic's source is written using [Typescript](http://www.typescriptlang.org/)
+- Ionic apps can be written in ES6 or TypeScript
+- Typescript is an optional feature to be used at the developers discretion
+- Ionic 2 starters come with the necessary build tools to transpile both ES6 and Typescript
+
+
+### CSS Attribute Selectors:
+
+- Simple
+- Smaller markup
+- Easier to read and understand
+- [Not an issue](https://twitter.com/paul_irish/status/311610425617838081) for today's mobile browsers
+- No performance impacts have been found

demo/config.xml

@@ -0,0 +1,29 @@
+<?xml version='1.0' encoding='utf-8'?>
+<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+    <name>V2 Test</name>
+    <description>An Ionic Framework and Cordova project.</description>
+    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
+    <content src="index.html" />
+    <access origin="*" />
+    <allow-intent href="http://*/*" />
+    <allow-intent href="https://*/*" />
+    <allow-intent href="tel:*" />
+    <allow-intent href="sms:*" />
+    <allow-intent href="mailto:*" />
+    <allow-intent href="geo:*" />
+    <platform name="android">
+        <allow-intent href="market:*" />
+    </platform>
+    <platform name="ios">
+        <allow-intent href="itms:*" />
+        <allow-intent href="itms-apps:*" />
+    </platform>
+    <preference name="webviewbounce" value="false" />
+    <preference name="UIWebViewBounce" value="false" />
+    <preference name="DisallowOverscroll" value="true" />
+    <preference name="android-minSdkVersion" value="16" />
+    <preference name="BackupWebStorage" value="none" />
+    <feature name="StatusBar">
+        <param name="ios-package" onload="true" value="CDVStatusBar" />
+    </feature>
+</widget>

demo/ionic.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+  name: 'demo',
+  proxies: null,
+
+  // hooks execute before or after all project-related Ionic commands
+  // (so not for start, docs, but serve, run, etc.) and take in the arguments
+  // passed to the command as a parameter
+  //
+  // The format is 'before' or 'after' + commandName (uppercased)
+  // ex: beforeServe, afterRun, beforePrepare, etc.
+  hooks: {
+    // beforeServe: function(argv) {
+    //   console.log('Arguments to ionic serve: "' + argv._ + '"');
+    // }
+  }
+}

demo/package.json

@@ -0,0 +1,21 @@
+{
+  "devDependencies": {
+    "autoprefixer-loader": "^3.1.0",
+    "awesome-typescript-loader": "0.12.0-rc.2",
+    "css-loader": "^0.22.0",
+    "file-loader": "^0.8.4",
+    "node-sass": "^3.4.2",
+    "resolve-url-loader": "^1.4.2",
+    "sass-loader": "^3.1.1",
+    "style-loader": "^0.13.0",
+    "typescript": "1.5.3",
+    "url-loader": "^0.5.6",
+    "webpack": "^1.12.4"
+  },
+  "dependencies": {
+    "ionic-framework": "2.0.0-alpha.35",
+    "ionic-native": "^1.0.7"
+  },
+  "name": "demo",
+  "description": "demo: An Ionic project"
+}

demo/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES5",
+    "allowNonTsExtensions": true,
+    "module": "commonjs",
+    "sourceMap": true,
+    "isolatedModules": true,
+    "noEmitOnError": false,
+    "rootDir": ".",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true
+  },
+  "compileOnSave": false
+}

demo/webpack.config.js

@@ -0,0 +1,80 @@
+var path = require('path');
+
+var autoprefixerOptions = {
+    browsers: [
+      'last 2 versions',
+      'iOS >= 7',
+      'Android >= 4',
+      'Explorer >= 10',
+      'ExplorerMobile >= 11'
+    ],
+    cascade: false
+  }
+
+module.exports = {
+  entry: [
+    "es6-shim",
+    "reflect-metadata",
+    "web-animations.min",
+    "zone.js",
+    path.join(__dirname, 'www', 'app', 'app.js')
+  ],
+  output: {
+    path: path.join(__dirname, 'www', 'build', 'js'),
+    filename: 'app.bundle.js',
+    publicPath: 'build/js/'
+    //pathinfo: true // show module paths in the bundle, handy for debugging
+  },
+  module: {
+    loaders: [
+      {
+        test: /\.js$/,
+        loader: "awesome-typescript-loader?doTypeCheck=false&useWebpackText=true",
+        include: [path.join(__dirname, 'www')],
+        exclude: /node_modules/
+      },
+      {
+        test: /\.ts$/,
+        loader: "awesome-typescript-loader",
+        include: [path.join(__dirname, 'www')],
+        exclude: /node_modules/
+      },
+      { 
+        // Loader to compile all of our SASS down. 
+        // Use the `resolve-url` pipe to convert the relative url paths to something this loader
+        // can work with, e.g.: url('../my-file.png') => url('/path/to/my-file.png')
+        // https://github.com/bholloway/resolve-url-loader
+        test: /\.scss$/,
+        loaders: [
+          "style",
+          "css",
+          "autoprefixer?" + JSON.stringify(autoprefixerOptions),
+          "resolve-url",
+          "sass?sourceMap"
+        ]
+      },
+      // Any png-image or woff-font below or equal to 100K will be converted 
+      // to inline base64 instead
+      { test: /\.(png|woff|ttf)$/, loader: 'url-loader?limit=100000' }
+    ]
+  },
+  resolve: {
+    modulesDirectories: [
+      "node_modules",
+      "node_modules/ionic-framework/node_modules", // angular is a dependency of ionic
+      "node_modules/ionic-framework/dist/js", // for web-animations polyfill
+      "node_modules/ionic-framework/dist/src/es5/common" // ionic-framework npm package (stable)
+      // See README for steps on developing against ionic-framework locally
+      // "dist/src/es5/common" // when developing against locally linked ionic-framework (master)
+    ],
+    extensions: ["", ".js", ".ts"]
+  },
+  // Sass loader configuration to tell webpack where to find the additional SASS files
+  // it needs for `ionic`, located in the ionic-framework node module folder.
+  // https://github.com/jtangelder/sass-loader#sass-options
+  sassLoader: {
+    includePaths: [
+      path.resolve(__dirname, "node_modules", 'ionic-framework', 'dist', 'src', 'scss')
+    ]
+  }
+};

demo/www/app/app.js

@@ -0,0 +1,24 @@
+import {App, Platform} from 'ionic/ionic';
+import {HomePage} from './home/home';
+import './app.scss';
+
+@App({
+  template: `
+    <ion-nav [root]="root"></ion-nav>
+    <ion-overlay></ion-overlay>
+  `,
+})
+export class MyApp {
+  constructor(platform: Platform) {
+    this.platform = platform;
+    this.initializeApp();
+    this.root = HomePage;
+
+  }
+
+  initializeApp() {
+    this.platform.ready().then(() => {
+      console.log('Platform ready');
+    });
+  }
+}

demo/www/app/app.scss

@@ -0,0 +1,24 @@
+// To customize the look and feel of Ionic, you can override
+// the Sass variables found in Ionic's source scss files.
+
+// App Color Variables
+// ---------------------------------
+// It's highly recommended to change the default colors
+// to match your app's branding. Ionic uses a Sass map of
+// colors so you can add, rename and remove colors as needed.
+// The "primary" color is the only required color in the map.
+
+$colors: (primary: #387ef5, secondary: #32db64, danger: #f53d3d, light: #f4f4f4, dark: #222222);
+
+// Ionic Sass
+// ---------------------------------
+@import "ionic";
+
+// App Sass
+// ---------------------------------
+// It is recommended to do all of your imports in your files to let webpack build them
+// in a module like manner.
+// For example - instead of adding the @imports here, create a sass file 
+// in ./tabs/tabs.scss - then @import your variables there, along with any custom styles.
+// Webpack only rebuilds that specific sass file on changes, 
+// and not the entire bundle, making rebuild times much faster for sass changes

demo/www/app/home/home.html

@@ -0,0 +1,13 @@
+<ion-navbar *navbar>
+  <ion-title>
+    Ionic Native
+  </ion-title>
+</ion-navbar>
+
+<ion-content>
+  <ion-list>
+    <ion-item *ng-for="#plugin of plugins" (click)="choosePlugin(plugin)">
+      {{plugin.name}}
+    </ion-item>
+  </ion-list>
+</ion-content>

demo/www/app/home/home.js

@@ -0,0 +1,26 @@
+import {Page, NavController} from 'ionic/ionic'
+
+import {Camera, StatusBar} from 'ionic-native';
+
+import {Plugin} from '../plugin/plugin';
+
+@Page({
+  templateUrl: 'app/home/home.html',
+})
+export class HomePage {
+  constructor(nav: NavController) {
+    this.nav = nav;
+
+    this.plugins = [
+      Camera,
+      StatusBar
+    ];
+    console.log('PLUGINS', this.plugins);
+  }
+
+  choosePlugin(plugin) {
+    this.nav.push(Plugin, {
+      plugin: plugin
+    });
+  }
+}

demo/www/app/plugin/plugin.html

@@ -0,0 +1,13 @@
+<ion-navbar *navbar>
+  <ion-title>
+    {{plugin.name}}
+  </ion-title>
+</ion-navbar>
+
+<ion-content>
+  <ion-list>
+    <ion-item *ng-for="#method of methods" (click)="doMethod(method)">
+      {{method}}()
+    </ion-item>
+  </ion-list>
+</ion-content>

demo/www/app/plugin/plugin.js

@@ -0,0 +1,24 @@
+import {Page, NavParams} from 'ionic/ionic';
+
+@Page({
+  templateUrl: 'app/plugin/plugin.html',
+})
+export class Plugin {
+  constructor(params: NavParams) {
+
+    this.plugin = params.get('plugin');
+    console.log('Plugin', this.plugin);
+
+    this.methods = Object.keys(this.plugin).filter((k) => {
+      if(typeof this.plugin[k] === 'function') {
+        return true;
+      }
+      return false;
+    });
+  }
+
+  doMethod(method) {
+    console.log('Doing method', method, 'on Plugin', this.plugin);
+  }
+
+}

demo/www/index.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <title>Ionic</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
+  <meta name="format-detection" content="telephone=no">
+  <meta name="msapplication-tap-highlight" content="no">
+  <!-- 
+  Looking for a style sheet? 
+  Webpack loads styles as dependencies in your javascript
+  See www/app/app.js as an example 
+  -->
+</head>
+
+<body>
+  <ion-app></ion-app>
+  <script src="cordova.js"></script>
+  <script src="build/js/app.bundle.js"></script>
+</body>
+
+</html>

dist/cordova.d.ts

@@ -1,2 +1,5 @@
-declare const promisifyCordova: (pluginObj: any, pluginName: any, methodName: any) => (...args: any[]) => any;
+export declare class Cordova {
-export { promisifyCordova };
+    static hasPlugin(pluginRef: string): boolean;
+    static plugin(pluginRef: string): any;
+    static promisify(pluginRef: any, pluginName: any, methodName: any, successIndex: any, errorIndex: any): (...args: any[]) => any;
+}

dist/cordova.js

@@ -1,27 +1,42 @@
-var promisifyCordova = function (pluginObj, pluginName, methodName) {
+var util_1 = require('./util');
-    return function () {
+var Cordova = (function () {
-        var args = [];
+    function Cordova() {
-        for (var _i = 0; _i < arguments.length; _i++) {
+    }
-            args[_i - 0] = arguments[_i];
+    Cordova.hasPlugin = function (pluginRef) {
-        }
+        return !!this.plugin(pluginRef);
-        return new Promise(function (resolve, reject) {
-            if (!cordova) {
-                console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but Cordova is not defined. Please make sure you have cordova.js included in your index.html file and you are running in a proper cordova environment');
-                reject({
-                    error: 'cordova_not_available'
-                });
-                return;
-            }
-            if (!pluginObj.installed()) {
-                console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but the ' + pluginObj.plugin + ' plugin is not installed.');
-                reject({
-                    error: 'plugin_not_installed'
-                });
-                return;
-            }
-            console.log('Cordova: exec(' + pluginName + ', ' + methodName + ')');
-            cordova.exec(resolve, reject, pluginName, methodName, args);
-        });
     };
-};
+    Cordova.plugin = function (pluginRef) {
-exports.promisifyCordova = promisifyCordova;
+        return util_1.get(window, pluginRef);
+    };
+    Cordova.promisify = function (pluginRef, pluginName, methodName, successIndex, errorIndex) {
+        var _this = this;
+        return function () {
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i - 0] = arguments[_i];
+            }
+            return new Promise(function (resolve, reject) {
+                if (!window.cordova) {
+                    console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but Cordova is not defined. Please make sure you have cordova.js included in your index.html file and you are running in a proper cordova environment');
+                    reject({
+                        error: 'cordova_not_available'
+                    });
+                    return;
+                }
+                if (!_this.hasPlugin(pluginRef)) {
+                    console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but the ' + pluginName + ' plugin is not installed.');
+                    reject({
+                        error: 'plugin_not_installed'
+                    });
+                    return;
+                }
+                console.log('Cordova: exec(' + pluginName + ', ' + methodName + ')');
+                args[successIndex] = resolve;
+                args[errorIndex] = reject;
+                util_1.get(window, pluginRef)[methodName].apply(_this, args);
+            });
+        };
+    };
+    return Cordova;
+})();
+exports.Cordova = Cordova;

dist/index.d.ts

@@ -1 +1,2 @@
 export * from './plugins/camera';
+export * from './plugins/statusbar';

dist/index.js

@@ -2,6 +2,7 @@ function __export(m) {
     for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
 }
 __export(require('./plugins/camera'));
+__export(require('./plugins/statusbar'));
 /*
 let wrappedPlugins = {}
 

dist/plugins/camera.d.ts

@@ -1,3 +1,6 @@
-export declare class Camera {
+export declare var Camera: {
-    static getPicture: (...args: any[]) => any;
+    name: string;
-}
+    plugin: string;
+    getPicture: (...args: any[]) => any;
+    cleanup: (...args: any[]) => any;
+};

dist/plugins/camera.js

@@ -1,9 +1,10 @@
 var util_1 = require('../util');
 var PLUGIN_REF = 'navigator.camera';
-var Camera = (function () {
+exports.Camera = {
-    function Camera() {
+    // Metadata
-    }
+    name: 'Camera',
-    Camera.getPicture = util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1);
+    plugin: 'cordova-plugin-camera',
-    return Camera;
+    // Methods
-})();
+    getPicture: util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1),
-exports.Camera = Camera;
+    cleanup: util_1.promisify(PLUGIN_REF, 'cleanup', 0, 1)
+};

dist/plugins/statusbar.d.ts

@@ -0,0 +1,13 @@
+export declare var StatusBar: {
+    name: string;
+    plugin: string;
+    overlaysWebView: (...args: any[]) => any;
+    styleDefault: (...args: any[]) => any;
+    styleLightContent: (...args: any[]) => any;
+    styleBlackTranslucent: (...args: any[]) => any;
+    styleBlackOpaque: (...args: any[]) => any;
+    backgroundColorByName: (...args: any[]) => any;
+    backgroundColorByHexString: (...args: any[]) => any;
+    hide: (...args: any[]) => any;
+    show: (...args: any[]) => any;
+};

dist/plugins/statusbar.js

@@ -0,0 +1,17 @@
+var util_1 = require('../util');
+var PLUGIN_REF = 'StatusBar';
+exports.StatusBar = {
+    // Metadata
+    name: 'StatusBar',
+    plugin: 'cordova-plugin-statusbar',
+    // Methods
+    overlaysWebView: util_1.wrap(PLUGIN_REF, 'overlaysWebView'),
+    styleDefault: util_1.wrap(PLUGIN_REF, 'styleDefault'),
+    styleLightContent: util_1.wrap(PLUGIN_REF, 'styleLightContent'),
+    styleBlackTranslucent: util_1.wrap(PLUGIN_REF, 'styleBlackTranslucent'),
+    styleBlackOpaque: util_1.wrap(PLUGIN_REF, 'styleBlackOpaque'),
+    backgroundColorByName: util_1.wrap(PLUGIN_REF, 'backgroundColorByName'),
+    backgroundColorByHexString: util_1.wrap(PLUGIN_REF, 'backgroundColorByHexString'),
+    hide: util_1.wrap(PLUGIN_REF, 'hide'),
+    show: util_1.wrap(PLUGIN_REF, 'show')
+};

dist/src/cordova.d.ts

@@ -0,0 +1,5 @@
+export declare class Cordova {
+    static hasPlugin(pluginRef: string): boolean;
+    static plugin(pluginRef: string): any;
+    static promisify(pluginRef: any, pluginName: any, methodName: any, successIndex: any, errorIndex: any): (...args: any[]) => any;
+}

dist/src/cordova.js

@@ -0,0 +1,42 @@
+var util_1 = require('./util');
+var Cordova = (function () {
+    function Cordova() {
+    }
+    Cordova.hasPlugin = function (pluginRef) {
+        return !!this.plugin(pluginRef);
+    };
+    Cordova.plugin = function (pluginRef) {
+        return util_1.get(window, pluginRef);
+    };
+    Cordova.promisify = function (pluginRef, pluginName, methodName, successIndex, errorIndex) {
+        var _this = this;
+        return function () {
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i - 0] = arguments[_i];
+            }
+            return new Promise(function (resolve, reject) {
+                if (!window.cordova) {
+                    console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but Cordova is not defined. Please make sure you have cordova.js included in your index.html file and you are running in a proper cordova environment');
+                    reject({
+                        error: 'cordova_not_available'
+                    });
+                    return;
+                }
+                if (!_this.hasPlugin(pluginRef)) {
+                    console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but the ' + pluginName + ' plugin is not installed.');
+                    reject({
+                        error: 'plugin_not_installed'
+                    });
+                    return;
+                }
+                console.log('Cordova: exec(' + pluginName + ', ' + methodName + ')');
+                args[successIndex] = resolve;
+                args[errorIndex] = reject;
+                util_1.get(window, pluginRef)[methodName].apply(_this, args);
+            });
+        };
+    };
+    return Cordova;
+})();
+exports.Cordova = Cordova;

dist/src/index.d.ts

@@ -0,0 +1,2 @@
+export * from './plugins/camera';
+export * from './plugins/statusbar';

dist/src/index.js

@@ -0,0 +1,5 @@
+function __export(m) {
+    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
+}
+__export(require('./plugins/camera'));
+__export(require('./plugins/statusbar'));

dist/src/plugins/camera.d.ts

@@ -1,3 +1,6 @@
-export declare class Camera {
+export declare var Camera: {
-    static getPicture: (...args: any[]) => any;
+    name: string;
-}
+    plugin: string;
+    getPicture: (...args: any[]) => any;
+    cleanup: (...args: any[]) => any;
+};

dist/src/plugins/camera.js

@@ -1,9 +1,8 @@
 var util_1 = require('../util');
 var PLUGIN_REF = 'navigator.camera';
-var Camera = (function () {
+exports.Camera = {
-    function Camera() {
+    name: 'Camera',
-    }
+    plugin: 'cordova-plugin-camera',
-    Camera.getPicture = util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1);
+    getPicture: util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1),
-    return Camera;
+    cleanup: util_1.promisify(PLUGIN_REF, 'cleanup', 0, 1)
-})();
+};
-exports.Camera = Camera;

dist/src/util.d.ts

@@ -1,2 +1,3 @@
 export declare function get(obj: any, path: any): any;
 export declare const promisify: (pluginRef: any, methodName: any, successIndex: any, errorIndex: any) => (...args: any[]) => any;
+export declare const wrap: (pluginRef: any, methodName: any, successIndex?: any, errorIndex?: any) => (...args: any[]) => any;

dist/src/util.js

@@ -20,3 +20,22 @@ exports.promisify = function (pluginRef, methodName, successIndex, errorIndex) {
         });
     };
 };
+exports.wrap = function (pluginRef, methodName, successIndex, errorIndex) {
+    if (successIndex === void 0) { successIndex = null; }
+    if (errorIndex === void 0) { errorIndex = null; }
+    return function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i - 0] = arguments[_i];
+        }
+        return new Promise(function (resolve, reject) {
+            if (successIndex) {
+                args[successIndex] = resolve;
+            }
+            if (errorIndex) {
+                args[errorIndex] = reject;
+            }
+            get(window, pluginRef)[methodName].apply(_this, args);
+        });
+    };
+};

dist/util.d.ts

@@ -1,2 +1,3 @@
 export declare function get(obj: any, path: any): any;
 export declare const promisify: (pluginRef: any, methodName: any, successIndex: any, errorIndex: any) => (...args: any[]) => any;
+export declare const wrap: (pluginRef: any, methodName: any, successIndex?: any, errorIndex?: any) => (...args: any[]) => any;

dist/util.js

@@ -20,3 +20,22 @@ exports.promisify = function (pluginRef, methodName, successIndex, errorIndex) {
         });
     };
 };
+exports.wrap = function (pluginRef, methodName, successIndex, errorIndex) {
+    if (successIndex === void 0) { successIndex = null; }
+    if (errorIndex === void 0) { errorIndex = null; }
+    return function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i - 0] = arguments[_i];
+        }
+        return new Promise(function (resolve, reject) {
+            if (successIndex) {
+                args[successIndex] = resolve;
+            }
+            if (errorIndex) {
+                args[errorIndex] = reject;
+            }
+            get(window, pluginRef)[methodName].apply(_this, args);
+        });
+    };
+};

src/cordova.ts

@@ -1,29 +1,43 @@
 //patch the window definition
 declare var Promise;
 declare var cordova;
+declare var window;
 
-const promisifyCordova = (pluginObj, pluginName, methodName) => {
+import {get} from './util';
-  return (...args) => {
-    return new Promise((resolve, reject) => {
-      if(!cordova) {
-        console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but Cordova is not defined. Please make sure you have cordova.js included in your index.html file and you are running in a proper cordova environment');
-        reject({
-          error: 'cordova_not_available'
-        });
-        return;
-      }
 
-      if(!pluginObj.installed()) {
+export class Cordova {
-        console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but the ' + pluginObj.plugin + ' plugin is not installed.');
+  static hasPlugin(pluginRef: string) {
-        reject({
+    return !!this.plugin(pluginRef);
-          error: 'plugin_not_installed'
+  }
-        });
+  static plugin(pluginRef: string) {
-        return;
+    return get(window, pluginRef);
-      }
+  }
-      console.log('Cordova: exec(' + pluginName + ', ' + methodName +')');
+
-      cordova.exec(resolve, reject, pluginName, methodName, args);
+  static promisify(pluginRef, pluginName, methodName, successIndex, errorIndex) {
-    })
+    return (...args) => {
+      return new Promise((resolve, reject) => {
+        if(!window.cordova) {
+          console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but Cordova is not defined. Please make sure you have cordova.js included in your index.html file and you are running in a proper cordova environment');
+          reject({
+            error: 'cordova_not_available'
+          });
+          return;
+        }
+
+        if(!this.hasPlugin(pluginRef)) {
+          console.warn('Cordova: tried calling', '"' + pluginName + '.' + methodName + '"', 'but the ' + pluginName + ' plugin is not installed.');
+          reject({
+            error: 'plugin_not_installed'
+          });
+          return;
+        }
+        console.log('Cordova: exec(' + pluginName + ', ' + methodName +')');
+
+        args[successIndex] = resolve;
+        args[errorIndex] = reject;
+
+        get(window, pluginRef)[methodName].apply(this, args);
+      })
+    }
   }
 }
-
-export {promisifyCordova};

src/index.ts

@@ -1,11 +1,5 @@
-interface Window { Native: any }
-
-import {PluginConfig} from './plugin-config'
-import {promisifyCordova} from './cordova';
-
-import {get} from './util';
-
 export * from './plugins/camera';
+export * from './plugins/statusbar';
 
 /*
 let wrappedPlugins = {}

src/plugins/camera.ts

@@ -1,8 +1,13 @@
-
 import {promisify} from '../util';
 
 let PLUGIN_REF = 'navigator.camera';
 
-export class Camera {
+export var Camera = {
-  static getPicture = promisify(PLUGIN_REF, 'getPicture', 0, 1)
+  // Metadata
+  name: 'Camera',
+  plugin: 'cordova-plugin-camera',
+
+  // Methods
+  getPicture: promisify(PLUGIN_REF, 'getPicture', 0, 1),
+  cleanup: promisify(PLUGIN_REF, 'cleanup', 0, 1)
 }

src/plugins/statusbar.ts

@@ -0,0 +1,20 @@
+import {wrap} from '../util';
+
+let PLUGIN_REF = 'StatusBar';
+
+export var StatusBar = {
+  // Metadata
+  name: 'StatusBar',
+  plugin: 'cordova-plugin-statusbar',
+
+  // Methods
+  overlaysWebView: wrap(PLUGIN_REF, 'overlaysWebView'),
+  styleDefault: wrap(PLUGIN_REF, 'styleDefault'),
+  styleLightContent: wrap(PLUGIN_REF, 'styleLightContent'),
+  styleBlackTranslucent: wrap(PLUGIN_REF, 'styleBlackTranslucent'),
+  styleBlackOpaque: wrap(PLUGIN_REF, 'styleBlackOpaque'),
+  backgroundColorByName: wrap(PLUGIN_REF, 'backgroundColorByName'),
+  backgroundColorByHexString: wrap(PLUGIN_REF, 'backgroundColorByHexString'),
+  hide: wrap(PLUGIN_REF, 'hide'),
+  show: wrap(PLUGIN_REF, 'show')
+}

src/util.ts

@@ -20,3 +20,19 @@ export const promisify = (pluginRef, methodName, successIndex, errorIndex) => {
     })
   }
 }
+
+export const wrap = (pluginRef, methodName, successIndex=null, errorIndex=null) => {
+  return (...args) => {
+    return new Promise((resolve, reject) => {
+
+      if(successIndex) {
+        args[successIndex] = resolve;
+      }
+      if(errorIndex) {
+        args[errorIndex] = reject;
+      }
+
+      get(window, pluginRef)[methodName].apply(this, args);
+    })
+  }
+}

tsconfig.json

@@ -19,6 +19,7 @@
         "src/index.ts",
         "src/plugin-config.ts",
         "src/plugins/camera.ts",
+        "src/plugins/statusbar.ts",
         "src/util.ts"
     ],
     "atom": {