#Instructions

1. Download this template.
2. Execute the command npm install
3. Execute the command gulp
4. Run Ionic:
   • ionic serve to test on the browser (Gulp is running).
   • ionic run android to test on the device.
5. Modify this template and create your hybrid mobile app.

#Template Structure

#Using bower to download libraries (npm preen included)

• Download the script. Eg: bower install ionic-datepicker --save
• Add the path of the files that you will use in bower.json from www/lib. Eg:

"preen": {
	//... More libraries
	"ionic-datepicker": [
		"dist/*.js"
		//Other files and folders will be deleted to reduce the size of your app
	]
}

• Run gulp in the CLI. Eg: gulp or gulp lib
• That's all, folks!!

#Animate elements using **[Animate.css] //Using the Modals service in this template Modals.openModal($scope, 'templates/modals/users.html', 'animated rotateInDownLeft');

* Do you want to animate Popups and other elements? See an example:
```javascript
$ionicPopup.alert({
	title: 'Hello World',
	template: 'This is the best template to start with Ionic Framework!',
	cssClass: 'animated bounceInDown'
});


#Ionic Tips

```javascript
$scope.$on('$ionicView.beforeEnter', function(){
  alert("Before to enter to the view");
});
$scope.$on('$ionicView.afterEnter', function(){
  alert("After to enter to the view");
});

• Reload the current state:

$state.go($state.current, {}, {reload: true});

• Disable the back option before to navigate to other state:

$ionicHistory.nextViewOptions({
    disableBack: true,
    disableAnimate : true,
    historyRoot  : true
});

• Clear the cache:

$ionicHistory.clearCache();

• Clear the history:

$ionicHistory.clearHistory();

• Change the direction before to navigate to other state:

$ionicViewSwitcher.nextDirection('back');

• Navigate to other state:

$state.go("app.login");

• Disable the drag to open the side menu:

$ionicSideMenuDelegate.canDragContent(false);

###Global configuration:

• Enable the native scrolling (Enable or Disable jsScrolling):

$ionicConfigProvider.scrolling.jsScrolling(false);

• Set the Maximum number of view elements to cache in the DOM:

$ionicConfigProvider.views.maxCache(5);

• Center align the title in the navBar:

$ionicConfigProvider.navBar.alignTitle('center');

• Disable swipeback on iOS:

$ionicConfigProvider.views.swipeBackEnabled(false);

• Set the back button text to empty:

$ionicConfigProvider.backButton.previousTitleText(false).text('');

#Crosswalk Improve the performance of your HTML, CSS, and JavaScript if is required.

#npm commands

#Ionic commands

#Cordova commands

#Tools

#Visual Studio Code commands and shortcuts

#Sign to Android (Commands)

1. cordova build --release android
2. keytool -genkey -v -keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000
3. jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore my-release-key.keystore HelloWorld-release-unsigned.apk alias_name
4. zipalign -v 4 HelloWorld-release-unsigned.apk HelloWorld.apk

#Links

#Personal comments

• Ionic, seriously? The cache is the best... but, How is possible to know if a specific view is cached? (From a directive)

• Microsoft, seriously? Help to improve existing cordova plugins instead of create new plugins only for Windows platform!

• Apple, seriously? Thanks for nothing! I need a MAC or the help of a friend to build for iOS... Are we playing Who Wants to be a Millionaire?

Made with <3