Two types of state bug in app.js

This piece of code comes from my app.js. The bug comes from the tab states. I think the problem lies in AngularJS, but I am new to it, and I am new to Ionic as well. Is it because AngularJS does not allow two types of state (app and tab)?

 angular.module('sociogram', ['ionic', 'openfb', 'sociogram.controllers'])

    .run(function ($rootScope, $state, $ionicPlatform, $window, OpenFB) {
    
    	OpenFB.init('338008289690870');

        $ionicPlatform.ready(function () {
            if (window.StatusBar) {
                StatusBar.styleDefault();
            }
        });

        $rootScope.$on('$stateChangeStart', function(event, toState) {
            if (toState.name !== "app.login" && toState.name !== "app.logout" && !$window.sessionStorage['fbtoken']) {
                $state.go('app.login');
                event.preventDefault();
            }
        });

        $rootScope.$on('OAuthException', function() {
            $state.go('app.login');
        });

    })

	.config(function ($stateProvider, $urlRouterProvider) {
		    $stateProvider

		.state('app', {
		    url: "/app",
		    abstract: true,
		    templateUrl: "templates/menu.html",
		    controller: "AppCtrl"
		})
		
		.state('tab', {
			  url: "/tab",
			  abstract: true,
			  templateUrl: "templates/tabs.html"
		})

		
		.state('tab.event', {
		  url: '/event',
		  views: {
		    'tab-event': {
		      templateUrl: 'templates/tab-event.html',
		      controller: 'EventCtrl'
		    }
		  }
		})

		.state('tab.capture', {
		  url: '/capture',
		  views: {
		    'tab-capture': {
		      templateUrl: 'templates/tab-capture.html',
		      controller: 'CaptureCtrl'
		    }
		  }
		})
		
		/*.state('tab.friend-detail', {
		  url: '/friend/:friendId',
		  views: {
		    'tab-friends': {
		      templateUrl: 'templates/friend-detail.html',
		      controller: 'FriendDetailCtrl'
		    }
		  }
		})*/

		.state('tab.overview', {
		  url: '/overview',
		  views: {
		    'tab-overview': {
		      templateUrl: 'templates/tab-overview.html',
		      controller: 'OverviewCtrl'
		    }
		  }


		.state('app.login', {
		    url: "/login",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/login.html",
		            controller: "LoginCtrl"
		        }
		    }
		})

		.state('app.logout', {
		    url: "/logout",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/logout.html",
		            controller: "LogoutCtrl"
		        }
		    }
		})

		.state('app.profile', {
		    url: "/profile",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/profile.html",
		            controller: "ProfileCtrl"
		        }
		    }
		})

		.state('app.share', {
		    url: "/share",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/share.html",
		            controller: "ShareCtrl"
		        }
		    }
		})

		.state('app.friends', {
		    url: "/person/:personId/friends",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/friend-list.html",
		            controller: "FriendsCtrl"
		        }
		    }
		})
		
		.state('app.mutualfriends', {
		    url: "/person/:personId/mutualfriends",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/mutual-friend-list.html",
		            controller: "MutualFriendsCtrl"
		        }
		    }
		})
		
		.state('app.person', {
		    url: "/person/:personId",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/person.html",
		            controller: "PersonCtrl"
		        }
		    }
		})
		
		.state('app.feed', {
		    url: "/person/:personId/feed",
		    views: {
		        'menuContent': {
		            templateUrl: "templates/feed.html",
		            controller: "FeedCtrl"
		        }
		    }
		});

		// fallback route
		$urlRouterProvider.otherwise('/app/person/me/feed');
	});

Oh my bad. Just missing JS tag. :frowning:

1 Like

Glad to see you got this resolve :smile:

1 Like

Hello. Glad to find you, I am very new to Ionic, I want to have more information of pages : app.js, controller.js and template folder, would you plz guide me through a good reference.
Thanks in advance.