title: How to route pages using ui-router based on role and authentication in angularjs
body: <p>I am new to javascript and angularjs. I want to have login and roles for my angular app. I have written java rest api for login. When I call login API with user credential it returns TOKEN and ROLES. I also have TOKEN verification API which will verify TOKEN is valid or expired.</p>
  
  <p>My requirements are</p>
  
  <ol>
  <li><p>When user is not logged in then page should always route to signin page (/signin). Users should not be able to go to any other page by changing the URL like '/home' etc.</p></li>
  <li><p>When user calls login API it returns TOKEN and ROLES. So each page should route based on ROLES.
  example: should route to '/home' only if User entered correct credentials AND user ROLE is 'Admin'.</p></li>
  <li><p>If user log in then user should not be able to go to '/signin' until user logs out. When user enters '/signin' it should always re-route to '/home'.</p></li>
  <li><p>When logged in user close the browser and opens it again it should route to '/home'. (TOKEN and ROLES has to be stored in localstorage or cookies after user logs in successfully. and when user opens app it should check if TOKEN and ROLES available in localstorage. If NO then redirect to '/signin' If YES Redirect to home page and should load user info stored in localstorage.).</p></li>
  <li><p>I want all the routing using UI-Router as I used it for my rest of the works</p></li>
  </ol>
  
  <p>As I am new to frontend development and javascript - angularjs, I tried out many git projects. But I could not able to implement in my project. I want all the routing should happen using "ui-router".</p>
  
  <p>Please help me and bear in mind that I am newbie in angularjs and javascript. </p>