#358: generator questions - up until plugins

mwaylabs · Jun 7, 2016 · 6429f5c · 6429f5c
1 parent 6800339
commit 6429f5c
Show file tree

Hide file tree

Showing 6 changed files with 95 additions and 50 deletions.
diff --git a/README.md b/README.md
@@ -83,7 +83,7 @@ Yeoman, Gulp, Bower, AngularJS, Ionic & of course Cordova. All in one sexy gener
 - [Developing on Windows](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/windows.md), what you need to know.
 - [Git integration](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/git_integration.md), see how it's done.
 - [Sass integration](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/sass_integration.md) in our module concept.
-- [Bower Component Usage](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/bower_component_usage.md) in our module concept.
+- [Bower component usage](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/bower_component_usage.md) in our module concept.
 - [CORS & Proxying](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/cors_proxy.md), how to cope with CORS issues.
 - [Gulp defaults](https://github.com/mwaylabs/generator-m-ionic/tree/master/docs/guides/gulp_defaults.md), spare power users some tedious typing on the command line.
 

diff --git a/docs/guides/bower_component_usage.md b/docs/guides/bower_component_usage.md
@@ -1,10 +1,14 @@
-# Bower Component Usage
+# Bower component usage
 > Find out how we use some of our recommended bower components
 
 ## localForage
 We recommend using [mozilla/localForage](https://github.com/mozilla/localForage) as a persistence layer for your Ionic apps. There is a separate bower component called [angular-localForage](https://github.com/ocombe/angular-localForage) which provides localForage as an angular service `$localForage` which can be obtained using angular' dependency injection. However we recently started using plain localForage, since it already has a great API that doesn't need any wrapping.
 
-When you select `localforage` during the generation of your project, the generator will create your `app/.eslintrc` file accordingly and add `localforage` as an available global variable:
+When you want to install `localforage` after you've set up your project, run:
+```sh
+bower install angular-translate --save
+```
+To tell ESLint that `localforage` is a safe global modify your `app/.eslintrc` file accordingly and add `localforage` as an available global variable. If you choose `localforage` during project setup, this will be done for you.
 
 ```json
 "globals": {
@@ -13,13 +17,17 @@ When you select `localforage` during the generation of your project, the generat
   "localforage": true
 }
 ```
-Since localForage already has an [ES6 Promises API](http://mozilla.github.io/localForage/):
+`gulp watch` then notices the `localforage` bower package and injects the source file into your `index.html`:
+```html
+<script src="bower_components/localforage/dist/localforage.js"></script>
+```
+And then you can use it right away. Since localForage already has an [ES6 Promises API](http://mozilla.github.io/localForage/):
 
 ```js
 localforage.setItem('key', 'value').then(doSomethingElse);
 ```
 
-You can simply use it by transforming it into an [angular 1.x promise](https://docs.angularjs.org/api/ng/service/$q) using `$q.when()` and use it in the angular context.
+You can simply use it inside angular by transforming it into an [angular 1.x promise](https://docs.angularjs.org/api/ng/service/$q) using `$q.when()`.
 
 ```js
 $q.when(localforage.setItem('key', 'value'))

diff --git a/docs/guides/questions.md b/docs/guides/questions.md
diff --git a/docs/start/questions.md b/docs/start/questions.md
@@ -0,0 +1,74 @@
+# Questions the generator will ask
+The generator will ask the following questions in that order:
+
+## Name?
+![image](https://cloud.githubusercontent.com/assets/1370779/15828173/91abb874-2c0e-11e6-81ee-c2608a751b14.png)
+
+The name of the project will be written to the `config.xml` and thus show up below your app icon when you run the app on a device:
+```html
+<name>Adventure Island</name>
+```
+From this name the generator also derives a compatible **angular module name** for the root module of your app:
+
+`app.js`:
+```js
+angular.module('adventureIsland', [
+  // load your modules here
+  'main', // starting with the main module
+]);
+
+```
+
+Which is bootstrapped in the `index.html`:
+```html
+<body ng-app="adventureIsland">
+```
+
+## App identifier?
+![image](https://cloud.githubusercontent.com/assets/1370779/15828919/9ef7fe2c-2c11-11e6-9396-848a1a90c78f.png)
+
+A reverse-domain identifier to identify your app. If you don't know what that is, a good explanation is found in the [psdpdfkit guides](https://pspdfkit.com/guides/ios/current/faq/what-is-a-bundle-id/). For a start you can just **make one up** and change it later.
+
+`config.xml`:
+```html
+<widget id="com.company.project" ...>
+```
+
+## Ionic CSS or Sass?
+![image](https://cloud.githubusercontent.com/assets/1370779/15851768/828afdce-2c9e-11e6-9fd4-032049de2290.png)
+
+You'll be writing your own styles using Sass in any case. Your choice here is to including the Ionic styles as CSS or Sass. Choosing Sass allows you to change the basic layout of Ionic. Bar heights, colors and more. However the whole Ionic Sass needs to compile with every change you make to your Sass, which is a little slower than if you just include the compiled CSS of the Ionic styles.
+
+You can change this later, after project generation with the help of our [Ionic style source](../guides/ionic_style_source.md) guide.
+
+## Additional bower packages?
+![image](https://cloud.githubusercontent.com/assets/1370779/15853161/3d21fbec-2ca4-11e6-9d81-dcec85b4aa2e.png)
+
+The angular, ionic, angular-ui-router and ngCordova bower dependencies will be installed and included by default. Additional packages also get installed and injected into your `index.html`. Refer to their documentations for instructions on how to use them, some are covered in our [Bower component usage](../guides/bower_component_usage.md) guide.
+
+Install new ones using the [Bower CLI](http://bower.io/docs/api/):
+```sh
+bower install angular-translate --save
+```
+
+## Cordova platforms?
+![image](https://cloud.githubusercontent.com/assets/1370779/15854124/7704465e-2ca8-11e6-80e3-92a99243dffb.png)
+
+Choose the platforms you want to build for. This will only work if you have the platforms' requirements correctly set up. For more information visit [Installation and Prerequisites](./installation_prerequisites.md).
+
+You can add and remove platforms at any time using the Cordova CLI wrapper:
+```sh
+gulp --cordova 'platform add android --save'
+```
+More detailed instructions are found in the [Development Introduction](./development_intro.md). So if you're not sure, leave these empty for now. A full list of platforms supported by Cordova is found in the [Cordova Documentation](https://cordova.apache.org/docs/en/latest/guide/support/).
+
+## Cordova plugins?
+![image](https://cloud.githubusercontent.com/assets/1370779/15854446/292c5122-2caa-11e6-95df-db9227f1d8ea.png)
+
+Select the ones you want to install now. Unlike the Cordova platforms, these will not fail without the proper Cordova platform setup.
+
+Just as with the platforms you can add plugins later at any time using the [Cordova CLI wrapper](./development_intro.md):
+```sh
+gulp --cordova 'plugin add org.apache.cordova.camera --save'
+```
+Find all available plugins on the [Cordova plugins page](https://cordova.apache.org/plugins/).
diff --git a/generators/app/index.js b/generators/app/index.js
@@ -88,21 +88,21 @@ module.exports = yeoman.Base.extend({
       {
         type: 'checkbox',
         name: 'bowerPackages',
-        message: '\nChoose bower packages \nIn addition to angular, ionic, angular-ui-router, cordova and ngCordova.\n',
+        message: '\nChoose additional bower packages \nBesides angular, ionic, angular-ui-router and ngCordova.\n',
         choices: bowerConfig.optional
       },
       // select platforms
       {
         type: 'checkbox',
         name: 'platforms',
-        message: '\nSelect all Cordova platforms to set up now\n',
+        message: '\nSelect Cordova platforms \nOnly works if you have the platforms correctly set up.\n',
         choices: cordovaConfig.platforms
       },
       // select plugins
       {
         type: 'checkbox',
         name: 'plugins',
-        message: '\nSelect all Cordova plugins to install now\n',
+        message: '\nSelect Cordova plugins \nInstall more later at any time.\n',
         choices: cordovaConfig.plugins
       },
     ];

diff --git a/generators/app/sources/cordova-config.js b/generators/app/sources/cordova-config.js
@@ -11,6 +11,11 @@ module.exports = {
       value: 'android',
       name: 'Android',
       checked: true
+    },
+    {
+      value: 'windows',
+      name: 'Windows',
+      checked: false
     }
   ],
   plugins: [