javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 23:16:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

Better animation naming and control system.

Browse Source
This commit is contained in:
Max Lynch
2013-11-01 18:33:13 -05:00
parent 40b5a83cb8
commit 01f689e58f
9 changed files with 270 additions and 310 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
dist/js/ionic-angular.js vendored
View File

@ -643,15 +643,29 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
.directive('navContent', ['Gesture', '$animate', '$compile', function(Gesture, $animate, $compile) {
// We need to animate the new controller into view.
var animatePushedController = function(childScope, clone, $element) {
var title = angular.element($element.parent().parent().parent()[0].querySelector('.title'));
var parent = angular.element($element.parent().parent().parent());
var title = angular.element(parent[0].querySelector('.title'));
// Clone the old title and insert it so we can animate it back into place for the new controller
var newTitle = angular.element(title.clone());
$compile(newTitle)(childScope);
title.after(newTitle);
clone.addClass(childScope.slideAnimation);
// Grab the button so we can slide it in
var button = angular.element(parent[0].querySelector('.button'));
clone.addClass(childScope.slideInAnimation);
// Slide the button in
$animate.addClass(button, childScope.slideButtonInAnimation, function() {
$animate.removeClass(button, childScope.slideButtonInAnimation, function() {});
})
// Slide the new title in
$animate.addClass(newTitle, childScope.slideTitleInAnimation, function() {
$animate.removeClass(newTitle, childScope.slideTitleInAnimation, function() {
newTitle.scope().$destroy();
@ -659,10 +673,11 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
});
});
// Grab the old title and slide it out
var title = $element.parent().parent().parent()[0].querySelector('.title');
$animate.enter(clone, $element.parent(), $element);
$animate.addClass(angular.element(title), childScope.slideTitleAnimation, function() {
$animate.removeClass(angular.element(title), childScope.slideTitleAnimation, function() {
$animate.addClass(angular.element(title), childScope.slideTitleOutAnimation, function() {
$animate.removeClass(angular.element(title), childScope.slideTitleOutAnimation, function() {
});
});
};
@ -677,9 +692,11 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
$scope.title = $attr.title;
$scope.slideAnimation = $attr.slideAnimation || '';
$scope.slideTitleAnimation = $attr.slideTitleAnimation || '';
$scope.slideTitleInAnimation = $attr.slideTitleInAnimation || '';
$scope.slideInAnimation = $attr.slideAnimation || 'content-slide-in';
$scope.slideTitleInAnimation = $attr.slideTitleInAnimation || 'bar-title-in';
$scope.slideTitleOutAnimation = $attr.slideTitleOutAnimation || 'bar-title-out';
$scope.slideButtonInAnimation = $attr.slideButtonInAnimation || 'bar-button-in';
$scope.slideButtonOutAnimation = $attr.slideButtonOutAnimation || 'bar-button-out';
if($attr.navBar === "false") {
navCtrl.hideNavBar();