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

Back button stuff kind of working

Browse Source
This commit is contained in:
Max Lynch
2013-11-19 08:58:57 -06:00
parent feb44cc6d0
commit 26371a0c85
7 changed files with 269 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
js/ext/angular/src/directive/ionicNavRouter.js vendored
View File

@ -28,6 +28,14 @@ angular.module('ionic.ui.navRouter', [])
.directive('navRouter', ['$rootScope', '$timeout', '$location', '$window', '$route', function($rootScope, $timeout, $location, $window, $route) {
return {
restrict: 'AC',
// So you can require being under this
controller: ['$scope', '$element', function($scope, $element) {
this.navBar = {
isVisible: true
};
$scope.navController = this;
}],
link: function($scope, $element, $attr) {
$scope.animation = $attr.animation;
@ -119,13 +127,90 @@ angular.module('ionic.ui.navRouter', [])
}
}])
.directive('navBack', ['$window', function($window) {
/**
* Our Nav Bar directive which updates as the controller state changes.
*/
.directive('navBar', ['$rootScope', function($rootScope) {
return {
restrict: 'E',
require: '^navRouter',
replace: true,
scope: {
type: '@',
backButtonType: '@',
backButtonLabel: '@',
backButtonIcon: '@',
alignTitle: '@',
},
template: '<header class="bar bar-header nav-bar" ng-class="{hidden: !navController.navBar.isVisible}">' +
'<button ng-click="goBack()" class="button" ng-if="enableBackButton && showBackButton" ng-class="backButtonType" ng-bind-html="backButtonContent"></button>' +
'<h1 class="title">{{navController.getTopController().scope.title}}</h1>' +
'</header>',
link: function($scope, $element, $attr, navCtrl) {
var backButton;
$scope.enableBackButton = true;
$scope.backButtonContent = '';
if($scope.backButtonIcon) {
$scope.backButtonContent += '<i class="icon ' + $scope.backButtonIcon + '"></i>';
}
if($scope.backButtonLabel) {
$scope.backButtonContent += ' ' + $scope.backButtonLabel
}
$rootScope.$watch('stackCursorPosition', function(value) {
if(value > 0) {
$scope.showBackButton = true;
} else {
$scope.showBackButton = false;
}
console.log('Stack cursor change', value);
});
$scope.navController = navCtrl;
$scope.goBack = function() {
navCtrl.popController();
};
var hb = new ionic.views.HeaderBar({
el: $element[0],
alignTitle: $scope.alignTitle || 'center'
});
$element.addClass($scope.type);
$scope.headerBarView = hb;
$scope.$parent.$on('navigation.push', function() {
backButton = angular.element($element[0].querySelector('.button'));
backButton.addClass($scope.backButtonType);
hb.align();
});
$scope.$parent.$on('navigation.pop', function() {
hb.align();
});
$scope.$on('$destroy', function() {
//
});
}
};
}])
.directive('navBack', ['$window', '$rootScope', function($window, $rootScope) {
return {
restrict: 'AC',
require: '^?navRouter',
link: function($scope, $element, $attr, navCtrl) {
var goBack = function() {
$window.history.back();
// Only trigger back if the stack is greater than zero
if($rootScope.stackCursorPosition > 0) {
$window.history.back();
}
};
$element.bind('tap', goBack);
$element.bind('click', goBack);

1
js/ext/angular/src/ionicAngular.js vendored
View File

@ -15,7 +15,6 @@ angular.module('ionic.service', [
angular.module('ionic.ui', [
'ionic.ui.content',
'ionic.ui.tabs',
'ionic.ui.nav',
'ionic.ui.navRouter',
'ionic.ui.header',
'ionic.ui.sideMenu',

1
js/ext/angular/test/navRouter.html
View File

@ -12,6 +12,7 @@
</head>
<body>
<pane nav-router animation="slide-left-right">
<nav-bar back-button-type="button-icon" back-button-icon="icon ion-arrow-left-c"></nav-bar>
<ng-view></ng-view>
</pane>