From 7cbfcc18d81096d8ab3379681bb55bb6ed24a611 Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Fri, 10 Jan 2014 15:08:23 -0600 Subject: [PATCH] view-state fixes --- dist/js/ionic-angular.js | 62 +++++++++++-------- .../angular/src/directive/ionicViewState.js | 37 ++++++----- js/ext/angular/src/service/ionicView.js | 25 ++++++-- js/ext/angular/test/service/ionicView.unit.js | 44 +++++++++++++ 4 files changed, 118 insertions(+), 50 deletions(-) diff --git a/dist/js/ionic-angular.js b/dist/js/ionic-angular.js index 1c855131d4..c9c4fded52 100644 --- a/dist/js/ionic-angular.js +++ b/dist/js/ionic-angular.js @@ -620,7 +620,12 @@ angular.module('ionic.service.view', ['ui.router']) return null; }; View.prototype.go = function(opts) { - if(this.url && this.url !== $location.url() && (!opts || opts.enableUrlChange !== false)) { + + if(this.stateName) { + return $state.go(this.stateName, this.stateParams); + } + + if(this.url && this.url !== $location.url()) { if($rootScope.$viewHistory.backView === this) { return $window.history.go(-1); @@ -628,11 +633,8 @@ angular.module('ionic.service.view', ['ui.router']) return $window.history.go(1); } - return $location.url(this.url); - } - - if(this.stateName) { - return $state.go(this.stateName, this.stateParams); + $location.url(this.url); + return; } return null; @@ -696,6 +698,13 @@ angular.module('ionic.service.view', ['ui.router']) rsp.historyId = forwardView.historyId; } + } else if(currentView && currentView.historyId !== hist.historyId && + hist.cursor > -1 && hist.stack.length > 0 && hist.cursor < hist.stack.length && + hist.stack[hist.cursor].stateId === currentStateId) { + // they just changed to a different history and the history already has views in it + rsp.viewId = hist.stack[hist.cursor].viewId; + rsp.navAction = 'moveBack'; + } else { // set a new unique viewId @@ -754,6 +763,10 @@ angular.module('ionic.service.view', ['ui.router']) hist.cursor = viewHistory.currentView.index; + $rootScope.$broadcast('$viewHistory.historyChange', { + showBack: (viewHistory.backView && viewHistory.backView.historyId === viewHistory.currentView.historyId) + }); + return rsp; }, @@ -2881,7 +2894,7 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu }, template: '
'+//' ng-class="{invisible: !navController.navBar.isVisible}">' + '
' + - '' + + '' + '' + '
' + '

' + @@ -2898,21 +2911,6 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu $scope.backButtonClass += ' icon ' + $attr.backButtonIcon; } - // Listen for changes in the stack cursor position to indicate whether a back - // button should be shown (this can still be disabled by the $scope.enableBackButton - $rootScope.$watch('$viewHistory.backView', function(backView) { - if(backView) { - var currentView = ViewService.getCurrentView(); - if(currentView) { - if(backView.historyId === currentView.historyId) { - $scope.showBackButton = true; - return; - } - } - } - $scope.showBackButton = false; - }); - // Store a reference to our nav controller $scope.navController = navCtrl; @@ -3025,7 +3023,7 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu }]) -.directive('viewBack', ['ViewService', function(ViewService) { +.directive('viewBack', ['ViewService', '$rootScope', function(ViewService, $rootScope) { var goBack = function(e) { var backView = ViewService.getBackView(); backView && backView.go(); @@ -3035,9 +3033,23 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu return { restrict: 'AC', - link: function($scope, $element) { - $element.bind('click', goBack); + compile: function(tElement) { + tElement.addClass('hide'); + + return function link($scope, $element) { + $element.bind('click', goBack); + + $rootScope.$on('$viewHistory.historyChange', function(e, data) { + if(data.showBack) { + $element[0].classList.remove('hide'); + } else { + $element[0].classList.add('hide'); + } + }); + + } } + }; }]) diff --git a/js/ext/angular/src/directive/ionicViewState.js b/js/ext/angular/src/directive/ionicViewState.js index a4d4eeb33e..9405ab2c10 100644 --- a/js/ext/angular/src/directive/ionicViewState.js +++ b/js/ext/angular/src/directive/ionicViewState.js @@ -69,7 +69,7 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu }, template: '
'+//' ng-class="{invisible: !navController.navBar.isVisible}">' + '
' + - '' + + '' + '' + '
' + '

' + @@ -86,21 +86,6 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu $scope.backButtonClass += ' icon ' + $attr.backButtonIcon; } - // Listen for changes in the stack cursor position to indicate whether a back - // button should be shown (this can still be disabled by the $scope.enableBackButton - $rootScope.$watch('$viewHistory.backView', function(backView) { - if(backView) { - var currentView = ViewService.getCurrentView(); - if(currentView) { - if(backView.historyId === currentView.historyId) { - $scope.showBackButton = true; - return; - } - } - } - $scope.showBackButton = false; - }); - // Store a reference to our nav controller $scope.navController = navCtrl; @@ -213,7 +198,7 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu }]) -.directive('viewBack', ['ViewService', function(ViewService) { +.directive('viewBack', ['ViewService', '$rootScope', function(ViewService, $rootScope) { var goBack = function(e) { var backView = ViewService.getBackView(); backView && backView.go(); @@ -223,9 +208,23 @@ angular.module('ionic.ui.viewState', ['ionic.service.view', 'ionic.service.gestu return { restrict: 'AC', - link: function($scope, $element) { - $element.bind('click', goBack); + compile: function(tElement) { + tElement.addClass('hide'); + + return function link($scope, $element) { + $element.bind('click', goBack); + + $rootScope.$on('$viewHistory.historyChange', function(e, data) { + if(data.showBack) { + $element[0].classList.remove('hide'); + } else { + $element[0].classList.add('hide'); + } + }); + + } } + }; }]) diff --git a/js/ext/angular/src/service/ionicView.js b/js/ext/angular/src/service/ionicView.js index c2069dde61..7368bf8425 100644 --- a/js/ext/angular/src/service/ionicView.js +++ b/js/ext/angular/src/service/ionicView.js @@ -63,7 +63,12 @@ angular.module('ionic.service.view', ['ui.router']) return null; }; View.prototype.go = function(opts) { - if(this.url && this.url !== $location.url() && (!opts || opts.enableUrlChange !== false)) { + + if(this.stateName) { + return $state.go(this.stateName, this.stateParams); + } + + if(this.url && this.url !== $location.url()) { if($rootScope.$viewHistory.backView === this) { return $window.history.go(-1); @@ -71,11 +76,8 @@ angular.module('ionic.service.view', ['ui.router']) return $window.history.go(1); } - return $location.url(this.url); - } - - if(this.stateName) { - return $state.go(this.stateName, this.stateParams); + $location.url(this.url); + return; } return null; @@ -139,6 +141,13 @@ angular.module('ionic.service.view', ['ui.router']) rsp.historyId = forwardView.historyId; } + } else if(currentView && currentView.historyId !== hist.historyId && + hist.cursor > -1 && hist.stack.length > 0 && hist.cursor < hist.stack.length && + hist.stack[hist.cursor].stateId === currentStateId) { + // they just changed to a different history and the history already has views in it + rsp.viewId = hist.stack[hist.cursor].viewId; + rsp.navAction = 'moveBack'; + } else { // set a new unique viewId @@ -197,6 +206,10 @@ angular.module('ionic.service.view', ['ui.router']) hist.cursor = viewHistory.currentView.index; + $rootScope.$broadcast('$viewHistory.historyChange', { + showBack: (viewHistory.backView && viewHistory.backView.historyId === viewHistory.currentView.historyId) + }); + return rsp; }, diff --git a/js/ext/angular/test/service/ionicView.unit.js b/js/ext/angular/test/service/ionicView.unit.js index 3a7f18eb2c..0242092757 100644 --- a/js/ext/angular/test/service/ionicView.unit.js +++ b/js/ext/angular/test/service/ionicView.unit.js @@ -190,6 +190,7 @@ describe('Ionic View Service', function() { $state.go('home'); rootScope.$apply(); var homeReg = viewService.register(homeViewScope); + expect(homeReg.navAction).toEqual('initialView'); expect(viewService.getCurrentStateName()).toEqual('home'); expect(viewService.getCurrentView().stateName).toEqual('home'); expect(viewService.getBackView()).toEqual(null); @@ -204,6 +205,7 @@ describe('Ionic View Service', function() { var currentView = viewService.getCurrentView(); var backView = viewService.getBackView(); var forwardView = viewService.getForwardView(); + expect(aboutReg.navAction).toEqual('newView'); expect(currentView.viewId).toEqual(aboutReg.viewId); expect(currentView.backViewId).toEqual(homeReg.viewId); expect(currentView.forwardViewId).toEqual(null); @@ -219,6 +221,7 @@ describe('Ionic View Service', function() { $state.go('tabs.tab1view1'); rootScope.$apply(); var tab1view1Reg = viewService.register(tab1view1Scope); + expect(tab1view1Reg.navAction).toEqual('newView'); expect(rootScope.$viewHistory.histories[tab1Scope.$historyId].historyId).toEqual(tab1Scope.$historyId); expect(rootScope.$viewHistory.histories[tab1Scope.$historyId].stack[0].viewId).toEqual(tab1view1Reg.viewId); @@ -241,6 +244,7 @@ describe('Ionic View Service', function() { $state.go('home'); rootScope.$apply(); var home2reg = viewService.register({}); + expect(home2reg.navAction).toEqual('newView'); currentView = viewService.getCurrentView(); backView = viewService.getBackView(); forwardView = viewService.getForwardView(); @@ -633,6 +637,46 @@ describe('Ionic View Service', function() { expect(rootScope.$viewHistory.histories[tab1Scope.$historyId].cursor).toEqual(1); })); + it('should go one level in tab1, vist tab2 and tab3, come back to tab1 and still be at spot', inject(function($location, $state) { + var tab1Container = {}; + var tab2Container = {}; + var tab3Container = {}; + viewService.registerHistory(tab1Container); + viewService.registerHistory(tab2Container); + viewService.registerHistory(tab3Container); + + // register tab1, view1 + $state.go('tabs.tab1view1'); + rootScope.$apply(); + var tab1view1Reg = viewService.register(tab1Container); + expect(rootScope.$viewHistory.histories[tab1Container.$historyId].cursor).toEqual(0); + + // register tab1, view2 + $state.go('tabs.tab1view2'); + rootScope.$apply(); + var tab1view2Reg = viewService.register(tab1Container); + expect(rootScope.$viewHistory.histories[tab1Container.$historyId].cursor).toEqual(1); + currentView = viewService.getCurrentView(); + expect(currentView.backViewId).toEqual(tab1view1Reg.viewId); + + // register tab2, view1 + $state.go('tabs.tab2view1'); + rootScope.$apply(); + var tab2view1Reg = viewService.register(tab2Container); + + // register tab3, view1 + $state.go('tabs.tab3view1'); + rootScope.$apply(); + var tab3view1Reg = viewService.register(tab3Container); + + // register tab 1, view 2 again + $state.go('tabs.tab1view2'); + rootScope.$apply(); + var tab1view2Reg2 = viewService.register(tab1Container); + expect(tab1view2Reg2.navAction).toEqual('moveBack'); + expect(tab1view2Reg2.viewId).toEqual(tab1view2Reg.viewId); + })); + it('should init root viewHistory data', inject(function() { expect(rootScope.$viewHistory.backView).toEqual(null); expect(rootScope.$viewHistory.currentView).toEqual(null);