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

Configurable nav controller anims

Browse Source
This commit is contained in:
Max Lynch
2013-10-31 22:16:29 -05:00
parent ea026b3e03
commit 7d0c075d82
7 changed files with 81 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
js/ext/angular/src/directive/ionicNav.js vendored
View File

@ -48,21 +48,7 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
// Compile the template with the new scrope, and append it to the navigation's content area
var el = $compile(templateString)(childScope, function(cloned, scope) {
var content = $element[0].querySelector('.content');
var title = $element.parent().parent().parent()[0].querySelector('.title');
var newTitle = angular.element(title.cloneNode());
$compile(newTitle)(childScope);
title.parentNode.insertBefore(newTitle[0], title.nextSibling);
console.log(newTitle);
$animate.enter(cloned, angular.element(content));
$animate.addClass(angular.element(newTitle), 'slide-in-left-fade', function() {
$animate.removeClass(angular.element(newTitle), 'slide-in-left-fade', function() {
newTitle.scope().$destroy();
newTitle.remove();
});
});
});
});
};
@ -110,7 +96,7 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
};
})
.directive('navContent', ['Gesture', '$animate', function(Gesture, $animate) {
.directive('navContent', ['Gesture', '$animate', '$compile', function(Gesture, $animate, $compile) {
return {
restrict: 'ECA',
require: '^navs',
@ -121,6 +107,8 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
var lastParent, lastIndex, childScope, childElement;
$scope.title = $attr.title;
$scope.slideAnimation = $attr.slideAnimation || '';
$scope.slideTitleAnimation = $attr.slideTitleAnimation || '';
if($attr.navBar === "false") {
navCtrl.hideNavBar();
@ -130,20 +118,31 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
$scope.pushController($scope, $element);
var title = angular.element($element.parent().parent().parent()[0].querySelector('.title'));
var newTitle = angular.element(title.clone());
$compile(newTitle)($scope);
title.after(newTitle);
console.log(newTitle);
$animate.addClass(newTitle, $scope.slideTitleAnimation, function() {
$animate.removeClass(newTitle, $scope.slideTitleAnimation, function() {
newTitle.scope().$destroy();
newTitle.remove();
});
});
$scope.$watch('isVisible', function(value) {
if(childElement) {
$animate.leave(childElement);
childElement = undefined;
}
if(childScope) {
childScope.$destroy();
childScope = undefined;
}
if(value) {
childScope = $scope.$new();
transclude(childScope, function(clone) {
childElement = clone;
clone.addClass($scope.slideAnimation);
/*
Gesture.on('drag', function(e) {
//navCtrl.handleDrag(e);
console.log('Content drag', e);
@ -152,14 +151,24 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
Gesture.on('release', function(e) {
//navCtrl._endDrag(e);
}, childElement[0]);
*/
var title = $element.parent().parent().parent()[0].querySelector('.title');
$animate.enter(clone, $element.parent(), $element);
$animate.addClass(angular.element(title), 'slide-left-fade', function() {
$animate.removeClass(angular.element(title), 'slide-left-fade', function() {
$animate.addClass(angular.element(title), $scope.slideTitleAnimation, function() {
$animate.removeClass(angular.element(title), $scope.slideTitleAnimation, function() {
});
});
});
} else {
if(childElement) {
$animate.leave(childElement);
childElement = undefined;
}
if(childScope) {
childScope.$destroy();
childScope = undefined;
}
}
});
}