diff --git a/demo/.gitignore b/demo/.gitignore new file mode 100644 index 000000000..afaf61309 --- /dev/null +++ b/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 diff --git a/demo/README.md b/demo/README.md new file mode 100644 index 000000000..c0307986c --- /dev/null +++ b/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 diff --git a/demo/config.xml b/demo/config.xml new file mode 100644 index 000000000..125eae09a --- /dev/null +++ b/demo/config.xml @@ -0,0 +1,29 @@ + + + V2 Test + An Ionic Framework and Cordova project. + Ionic Framework Team + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/demo/ionic.config.js b/demo/ionic.config.js new file mode 100644 index 000000000..edccafbda --- /dev/null +++ b/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._ + '"'); + // } + } +} diff --git a/demo/package.json b/demo/package.json new file mode 100644 index 000000000..1f22260a4 --- /dev/null +++ b/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" +} diff --git a/demo/resources/android/icon/drawable-hdpi-icon.png b/demo/resources/android/icon/drawable-hdpi-icon.png new file mode 100644 index 000000000..b9100934d Binary files /dev/null and b/demo/resources/android/icon/drawable-hdpi-icon.png differ diff --git a/demo/resources/android/icon/drawable-ldpi-icon.png b/demo/resources/android/icon/drawable-ldpi-icon.png new file mode 100644 index 000000000..16cd5dba3 Binary files /dev/null and b/demo/resources/android/icon/drawable-ldpi-icon.png differ diff --git a/demo/resources/android/icon/drawable-mdpi-icon.png b/demo/resources/android/icon/drawable-mdpi-icon.png new file mode 100644 index 000000000..64a6cbc52 Binary files /dev/null and b/demo/resources/android/icon/drawable-mdpi-icon.png differ diff --git a/demo/resources/android/icon/drawable-xhdpi-icon.png b/demo/resources/android/icon/drawable-xhdpi-icon.png new file mode 100644 index 000000000..1605f695f Binary files /dev/null and b/demo/resources/android/icon/drawable-xhdpi-icon.png differ diff --git a/demo/resources/android/icon/drawable-xxhdpi-icon.png b/demo/resources/android/icon/drawable-xxhdpi-icon.png new file mode 100644 index 000000000..56fb29e64 Binary files /dev/null and b/demo/resources/android/icon/drawable-xxhdpi-icon.png differ diff --git a/demo/resources/android/icon/drawable-xxxhdpi-icon.png b/demo/resources/android/icon/drawable-xxxhdpi-icon.png new file mode 100644 index 000000000..e4a915254 Binary files /dev/null and b/demo/resources/android/icon/drawable-xxxhdpi-icon.png differ diff --git a/demo/resources/android/splash/drawable-land-hdpi-screen.png b/demo/resources/android/splash/drawable-land-hdpi-screen.png new file mode 100644 index 000000000..66b12feae Binary files /dev/null and b/demo/resources/android/splash/drawable-land-hdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-land-ldpi-screen.png b/demo/resources/android/splash/drawable-land-ldpi-screen.png new file mode 100644 index 000000000..7dceec7b7 Binary files /dev/null and b/demo/resources/android/splash/drawable-land-ldpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-land-mdpi-screen.png b/demo/resources/android/splash/drawable-land-mdpi-screen.png new file mode 100644 index 000000000..0dc2ba75f Binary files /dev/null and b/demo/resources/android/splash/drawable-land-mdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-land-xhdpi-screen.png b/demo/resources/android/splash/drawable-land-xhdpi-screen.png new file mode 100644 index 000000000..39ae00c33 Binary files /dev/null and b/demo/resources/android/splash/drawable-land-xhdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-land-xxhdpi-screen.png b/demo/resources/android/splash/drawable-land-xxhdpi-screen.png new file mode 100644 index 000000000..3f591b1e6 Binary files /dev/null and b/demo/resources/android/splash/drawable-land-xxhdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-land-xxxhdpi-screen.png b/demo/resources/android/splash/drawable-land-xxxhdpi-screen.png new file mode 100644 index 000000000..253e6f183 Binary files /dev/null and b/demo/resources/android/splash/drawable-land-xxxhdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-hdpi-screen.png b/demo/resources/android/splash/drawable-port-hdpi-screen.png new file mode 100644 index 000000000..e0dbb62f2 Binary files /dev/null and b/demo/resources/android/splash/drawable-port-hdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-ldpi-screen.png b/demo/resources/android/splash/drawable-port-ldpi-screen.png new file mode 100644 index 000000000..8e93c2d64 Binary files /dev/null and b/demo/resources/android/splash/drawable-port-ldpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-mdpi-screen.png b/demo/resources/android/splash/drawable-port-mdpi-screen.png new file mode 100644 index 000000000..0aaad62bf Binary files /dev/null and b/demo/resources/android/splash/drawable-port-mdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-xhdpi-screen.png b/demo/resources/android/splash/drawable-port-xhdpi-screen.png new file mode 100644 index 000000000..64c27f8a6 Binary files /dev/null and b/demo/resources/android/splash/drawable-port-xhdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-xxhdpi-screen.png b/demo/resources/android/splash/drawable-port-xxhdpi-screen.png new file mode 100644 index 000000000..f605e6a3d Binary files /dev/null and b/demo/resources/android/splash/drawable-port-xxhdpi-screen.png differ diff --git a/demo/resources/android/splash/drawable-port-xxxhdpi-screen.png b/demo/resources/android/splash/drawable-port-xxxhdpi-screen.png new file mode 100644 index 000000000..2b993cff7 Binary files /dev/null and b/demo/resources/android/splash/drawable-port-xxxhdpi-screen.png differ diff --git a/demo/resources/icon.png b/demo/resources/icon.png new file mode 100644 index 000000000..bee77667f Binary files /dev/null and b/demo/resources/icon.png differ diff --git a/demo/resources/ios/icon/icon-40.png b/demo/resources/ios/icon/icon-40.png new file mode 100644 index 000000000..76cc53c34 Binary files /dev/null and b/demo/resources/ios/icon/icon-40.png differ diff --git a/demo/resources/ios/icon/icon-40@2x.png b/demo/resources/ios/icon/icon-40@2x.png new file mode 100644 index 000000000..64b490691 Binary files /dev/null and b/demo/resources/ios/icon/icon-40@2x.png differ diff --git a/demo/resources/ios/icon/icon-50.png b/demo/resources/ios/icon/icon-50.png new file mode 100644 index 000000000..8bd51dfd3 Binary files /dev/null and b/demo/resources/ios/icon/icon-50.png differ diff --git a/demo/resources/ios/icon/icon-50@2x.png b/demo/resources/ios/icon/icon-50@2x.png new file mode 100644 index 000000000..2676f8f69 Binary files /dev/null and b/demo/resources/ios/icon/icon-50@2x.png differ diff --git a/demo/resources/ios/icon/icon-60.png b/demo/resources/ios/icon/icon-60.png new file mode 100644 index 000000000..11f391244 Binary files /dev/null and b/demo/resources/ios/icon/icon-60.png differ diff --git a/demo/resources/ios/icon/icon-60@2x.png b/demo/resources/ios/icon/icon-60@2x.png new file mode 100644 index 000000000..b52104828 Binary files /dev/null and b/demo/resources/ios/icon/icon-60@2x.png differ diff --git a/demo/resources/ios/icon/icon-60@3x.png b/demo/resources/ios/icon/icon-60@3x.png new file mode 100644 index 000000000..dbc830308 Binary files /dev/null and b/demo/resources/ios/icon/icon-60@3x.png differ diff --git a/demo/resources/ios/icon/icon-72.png b/demo/resources/ios/icon/icon-72.png new file mode 100644 index 000000000..4e5a82761 Binary files /dev/null and b/demo/resources/ios/icon/icon-72.png differ diff --git a/demo/resources/ios/icon/icon-72@2x.png b/demo/resources/ios/icon/icon-72@2x.png new file mode 100644 index 000000000..56fb29e64 Binary files /dev/null and b/demo/resources/ios/icon/icon-72@2x.png differ diff --git a/demo/resources/ios/icon/icon-76.png b/demo/resources/ios/icon/icon-76.png new file mode 100644 index 000000000..e66a90ed6 Binary files /dev/null and b/demo/resources/ios/icon/icon-76.png differ diff --git a/demo/resources/ios/icon/icon-76@2x.png b/demo/resources/ios/icon/icon-76@2x.png new file mode 100644 index 000000000..3f5c942fa Binary files /dev/null and b/demo/resources/ios/icon/icon-76@2x.png differ diff --git a/demo/resources/ios/icon/icon-small.png b/demo/resources/ios/icon/icon-small.png new file mode 100644 index 000000000..de3146dc7 Binary files /dev/null and b/demo/resources/ios/icon/icon-small.png differ diff --git a/demo/resources/ios/icon/icon-small@2x.png b/demo/resources/ios/icon/icon-small@2x.png new file mode 100644 index 000000000..916a02ec4 Binary files /dev/null and b/demo/resources/ios/icon/icon-small@2x.png differ diff --git a/demo/resources/ios/icon/icon-small@3x.png b/demo/resources/ios/icon/icon-small@3x.png new file mode 100644 index 000000000..0efa99d86 Binary files /dev/null and b/demo/resources/ios/icon/icon-small@3x.png differ diff --git a/demo/resources/ios/icon/icon.png b/demo/resources/ios/icon/icon.png new file mode 100644 index 000000000..89f8c00f7 Binary files /dev/null and b/demo/resources/ios/icon/icon.png differ diff --git a/demo/resources/ios/icon/icon@2x.png b/demo/resources/ios/icon/icon@2x.png new file mode 100644 index 000000000..a6687a10c Binary files /dev/null and b/demo/resources/ios/icon/icon@2x.png differ diff --git a/demo/resources/ios/splash/Default-568h@2x~iphone.png b/demo/resources/ios/splash/Default-568h@2x~iphone.png new file mode 100644 index 000000000..d2128a63e Binary files /dev/null and b/demo/resources/ios/splash/Default-568h@2x~iphone.png differ diff --git a/demo/resources/ios/splash/Default-667h.png b/demo/resources/ios/splash/Default-667h.png new file mode 100644 index 000000000..fc23e64c0 Binary files /dev/null and b/demo/resources/ios/splash/Default-667h.png differ diff --git a/demo/resources/ios/splash/Default-736h.png b/demo/resources/ios/splash/Default-736h.png new file mode 100644 index 000000000..71b16ca4d Binary files /dev/null and b/demo/resources/ios/splash/Default-736h.png differ diff --git a/demo/resources/ios/splash/Default-Landscape-736h.png b/demo/resources/ios/splash/Default-Landscape-736h.png new file mode 100644 index 000000000..aaff74ada Binary files /dev/null and b/demo/resources/ios/splash/Default-Landscape-736h.png differ diff --git a/demo/resources/ios/splash/Default-Landscape@2x~ipad.png b/demo/resources/ios/splash/Default-Landscape@2x~ipad.png new file mode 100644 index 000000000..19770a2cf Binary files /dev/null and b/demo/resources/ios/splash/Default-Landscape@2x~ipad.png differ diff --git a/demo/resources/ios/splash/Default-Landscape~ipad.png b/demo/resources/ios/splash/Default-Landscape~ipad.png new file mode 100644 index 000000000..6fe892552 Binary files /dev/null and b/demo/resources/ios/splash/Default-Landscape~ipad.png differ diff --git a/demo/resources/ios/splash/Default-Portrait@2x~ipad.png b/demo/resources/ios/splash/Default-Portrait@2x~ipad.png new file mode 100644 index 000000000..3d06d86d8 Binary files /dev/null and b/demo/resources/ios/splash/Default-Portrait@2x~ipad.png differ diff --git a/demo/resources/ios/splash/Default-Portrait~ipad.png b/demo/resources/ios/splash/Default-Portrait~ipad.png new file mode 100644 index 000000000..53ad4c4c9 Binary files /dev/null and b/demo/resources/ios/splash/Default-Portrait~ipad.png differ diff --git a/demo/resources/ios/splash/Default@2x~iphone.png b/demo/resources/ios/splash/Default@2x~iphone.png new file mode 100644 index 000000000..6a1331684 Binary files /dev/null and b/demo/resources/ios/splash/Default@2x~iphone.png differ diff --git a/demo/resources/ios/splash/Default~iphone.png b/demo/resources/ios/splash/Default~iphone.png new file mode 100644 index 000000000..0aaad62bf Binary files /dev/null and b/demo/resources/ios/splash/Default~iphone.png differ diff --git a/demo/resources/splash.png b/demo/resources/splash.png new file mode 100644 index 000000000..cbddba06a Binary files /dev/null and b/demo/resources/splash.png differ diff --git a/demo/tsconfig.json b/demo/tsconfig.json new file mode 100644 index 000000000..669c88e88 --- /dev/null +++ b/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 +} diff --git a/demo/webpack.config.js b/demo/webpack.config.js new file mode 100644 index 000000000..239960918 --- /dev/null +++ b/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') + ] + } +}; diff --git a/demo/www/app/app.js b/demo/www/app/app.js new file mode 100644 index 000000000..21e176973 --- /dev/null +++ b/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: ` + + + `, +}) +export class MyApp { + constructor(platform: Platform) { + this.platform = platform; + this.initializeApp(); + this.root = HomePage; + + } + + initializeApp() { + this.platform.ready().then(() => { + console.log('Platform ready'); + }); + } +} diff --git a/demo/www/app/app.scss b/demo/www/app/app.scss new file mode 100644 index 000000000..2295f620d --- /dev/null +++ b/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 diff --git a/demo/www/app/home/home.html b/demo/www/app/home/home.html new file mode 100644 index 000000000..ac43d100c --- /dev/null +++ b/demo/www/app/home/home.html @@ -0,0 +1,13 @@ + + + Ionic Native + + + + + + + {{plugin.name}} + + + diff --git a/demo/www/app/home/home.js b/demo/www/app/home/home.js new file mode 100644 index 000000000..92812a258 --- /dev/null +++ b/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 + }); + } +} diff --git a/demo/www/app/plugin/plugin.html b/demo/www/app/plugin/plugin.html new file mode 100644 index 000000000..ec75da564 --- /dev/null +++ b/demo/www/app/plugin/plugin.html @@ -0,0 +1,13 @@ + + + {{plugin.name}} + + + + + + + {{method}}() + + + diff --git a/demo/www/app/plugin/plugin.js b/demo/www/app/plugin/plugin.js new file mode 100644 index 000000000..f5ca0b84c --- /dev/null +++ b/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); + } + +} diff --git a/demo/www/index.html b/demo/www/index.html new file mode 100644 index 000000000..a6826eef1 --- /dev/null +++ b/demo/www/index.html @@ -0,0 +1,24 @@ + + + + + Ionic + + + + + + + + + + + + + + + diff --git a/dist/cordova.d.ts b/dist/cordova.d.ts index c667fb995..bc833b0fd 100644 --- a/dist/cordova.d.ts +++ b/dist/cordova.d.ts @@ -1,2 +1,5 @@ -declare const promisifyCordova: (pluginObj: any, pluginName: any, methodName: any) => (...args: any[]) => any; -export { promisifyCordova }; +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; +} diff --git a/dist/cordova.js b/dist/cordova.js index fadf32a30..822d01b26 100644 --- a/dist/cordova.js +++ b/dist/cordova.js @@ -1,27 +1,42 @@ -var promisifyCordova = function (pluginObj, pluginName, methodName) { - return function () { - var args = []; - for (var _i = 0; _i < arguments.length; _i++) { - args[_i - 0] = arguments[_i]; - } - 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); - }); +var util_1 = require('./util'); +var Cordova = (function () { + function Cordova() { + } + Cordova.hasPlugin = function (pluginRef) { + return !!this.plugin(pluginRef); }; -}; -exports.promisifyCordova = promisifyCordova; + 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; diff --git a/dist/index.d.ts b/dist/index.d.ts index 3978d72d0..41ef53e09 100644 --- a/dist/index.d.ts +++ b/dist/index.d.ts @@ -1 +1,2 @@ export * from './plugins/camera'; +export * from './plugins/statusbar'; diff --git a/dist/index.js b/dist/index.js index 2af1f54f2..2566ee3e9 100644 --- a/dist/index.js +++ b/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 = {} diff --git a/dist/plugins/camera.d.ts b/dist/plugins/camera.d.ts index ed95c88bf..4db576c78 100644 --- a/dist/plugins/camera.d.ts +++ b/dist/plugins/camera.d.ts @@ -1,3 +1,6 @@ -export declare class Camera { - static getPicture: (...args: any[]) => any; -} +export declare var Camera: { + name: string; + plugin: string; + getPicture: (...args: any[]) => any; + cleanup: (...args: any[]) => any; +}; diff --git a/dist/plugins/camera.js b/dist/plugins/camera.js index 973a1671b..9f14755ed 100644 --- a/dist/plugins/camera.js +++ b/dist/plugins/camera.js @@ -1,9 +1,10 @@ var util_1 = require('../util'); var PLUGIN_REF = 'navigator.camera'; -var Camera = (function () { - function Camera() { - } - Camera.getPicture = util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1); - return Camera; -})(); -exports.Camera = Camera; +exports.Camera = { + // Metadata + name: 'Camera', + plugin: 'cordova-plugin-camera', + // Methods + getPicture: util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1), + cleanup: util_1.promisify(PLUGIN_REF, 'cleanup', 0, 1) +}; diff --git a/dist/plugins/statusbar.d.ts b/dist/plugins/statusbar.d.ts new file mode 100644 index 000000000..1b018d5a2 --- /dev/null +++ b/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; +}; diff --git a/dist/plugins/statusbar.js b/dist/plugins/statusbar.js new file mode 100644 index 000000000..75040e6b2 --- /dev/null +++ b/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') +}; diff --git a/dist/src/cordova.d.ts b/dist/src/cordova.d.ts new file mode 100644 index 000000000..ebd110ebf --- /dev/null +++ b/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; +} diff --git a/dist/src/cordova.js b/dist/src/cordova.js new file mode 100644 index 000000000..6dc6dbd3b --- /dev/null +++ b/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; diff --git a/dist/src/index.d.ts b/dist/src/index.d.ts new file mode 100644 index 000000000..20a13ac23 --- /dev/null +++ b/dist/src/index.d.ts @@ -0,0 +1,2 @@ +export * from './plugins/camera'; +export * from './plugins/statusbar'; diff --git a/dist/src/index.js b/dist/src/index.js new file mode 100644 index 000000000..505a97570 --- /dev/null +++ b/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')); diff --git a/dist/src/plugins/camera.d.ts b/dist/src/plugins/camera.d.ts index 9a7691665..3272f0d93 100644 --- a/dist/src/plugins/camera.d.ts +++ b/dist/src/plugins/camera.d.ts @@ -1,3 +1,6 @@ -export declare class Camera { - static getPicture: (...args: any[]) => any; -} +export declare var Camera: { + name: string; + plugin: string; + getPicture: (...args: any[]) => any; + cleanup: (...args: any[]) => any; +}; diff --git a/dist/src/plugins/camera.js b/dist/src/plugins/camera.js index 90c854273..262532eec 100644 --- a/dist/src/plugins/camera.js +++ b/dist/src/plugins/camera.js @@ -1,9 +1,8 @@ var util_1 = require('../util'); var PLUGIN_REF = 'navigator.camera'; -var Camera = (function () { - function Camera() { - } - Camera.getPicture = util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1); - return Camera; -})(); -exports.Camera = Camera; +exports.Camera = { + name: 'Camera', + plugin: 'cordova-plugin-camera', + getPicture: util_1.promisify(PLUGIN_REF, 'getPicture', 0, 1), + cleanup: util_1.promisify(PLUGIN_REF, 'cleanup', 0, 1) +}; diff --git a/dist/src/util.d.ts b/dist/src/util.d.ts index fb5be8011..2e16c3e4c 100644 --- a/dist/src/util.d.ts +++ b/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; diff --git a/dist/src/util.js b/dist/src/util.js index 983bf1932..282fb4fff 100644 --- a/dist/src/util.js +++ b/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); + }); + }; +}; diff --git a/dist/util.d.ts b/dist/util.d.ts index b1b29e4ce..b04695db5 100644 --- a/dist/util.d.ts +++ b/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; diff --git a/dist/util.js b/dist/util.js index d6428a90b..1f6a8ea02 100644 --- a/dist/util.js +++ b/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); + }); + }; +}; diff --git a/src/cordova.ts b/src/cordova.ts index 19bdfbccd..14064ab3b 100644 --- a/src/cordova.ts +++ b/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) => { - 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; - } +import {get} from './util'; - 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); - }) +export class Cordova { + static hasPlugin(pluginRef: string) { + return !!this.plugin(pluginRef); + } + static plugin(pluginRef: string) { + return get(window, pluginRef); + } + + 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}; diff --git a/src/index.ts b/src/index.ts index 56d4813e9..54ba51434 100644 --- a/src/index.ts +++ b/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 = {} diff --git a/src/plugins/camera.ts b/src/plugins/camera.ts index 6ce59c978..11b383668 100644 --- a/src/plugins/camera.ts +++ b/src/plugins/camera.ts @@ -1,8 +1,13 @@ - import {promisify} from '../util'; let PLUGIN_REF = 'navigator.camera'; -export class Camera { - static getPicture = promisify(PLUGIN_REF, 'getPicture', 0, 1) +export var Camera = { + // Metadata + name: 'Camera', + plugin: 'cordova-plugin-camera', + + // Methods + getPicture: promisify(PLUGIN_REF, 'getPicture', 0, 1), + cleanup: promisify(PLUGIN_REF, 'cleanup', 0, 1) } diff --git a/src/plugins/statusbar.ts b/src/plugins/statusbar.ts new file mode 100644 index 000000000..0896c8c9d --- /dev/null +++ b/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') +} diff --git a/src/util.ts b/src/util.ts index 79152509c..80dbec955 100644 --- a/src/util.ts +++ b/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); + }) + } +} diff --git a/tsconfig.json b/tsconfig.json index c818be89b..38f695bc2 100644 --- a/tsconfig.json +++ b/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": {