Nice stuff, thanks. Well, actually all the user management is done by https://www.userapp.io/ which has built-in angular library. So I decided to give it a try instead of write my own.
On Saturday, April 26, 2014 12:17:03 AM UTC-3, Billy Figueroa wrote: > > Checkout this link > > https://github.com/jmcunningham/AngularJS-Learning > > and read through the authentication tutorials. It will give you a better > idea than anything I can describe here. > > also look for examples of Dan Wahlin's sample app. Here it is... > > > https://github.com/DanWahlin/CustomerManagerStandard/tree/master/CustomerManager/app/customersApp > > look through his AuthService and inspect the app.js file to see how he > uses a service to keep track of if users are signed in > > There are a few things to keep track off. You will most likely need to do > your handling of the data on the back end for sessions etc. You could do it > on the front end but its not as secure. So you will need some service to > create some sort of session or cookie with (i.e. php) or some other way > (node etc). Then you will have to write logic to restrict which routes an > authenticated user vs non authenticated user can view. > > Next you have to understand that angular will not persist data by default. > If someone reloads or refreshes their page while they are "signed in" their > data will disapear so you will have to keep track of this your self on the > sever side or use some sort of library to persist the data on the front end > (i.e. localStorage, webStorage, breeze.js, persistence.js etc) > > overall, I m not sure how "fast" you need to get this done but angular > forces you to think differently than you are probably used to when writing > apps. Take some time to read through some of those links in the github > learning angularjs or go to egghead.io and watch their screencast > tutorials. > > You can also watch David Mosher's videos on youtube > > https://www.youtube.com/user/vidjadavemo/videos > > or this introduction video by Dan Wahlin > > https://www.youtube.com/watch?v=i9MHigUZKEM > > its prob the best video to start > > > > https://github.com/DanWahlin/CustomerManagerStandard/tree/master/CustomerManager/app/customersApp > > On Friday, April 25, 2014 8:47:20 PM UTC-4, Joberto Diniz wrote: >> >> How do you guys handle this public site -> login -> logged site steps in >> a SPA application? >> Am I in the wrong direction here? >> >> On Friday, April 25, 2014 2:36:38 PM UTC-3, Joberto Diniz wrote: >>> >>> Hi. My question is quite simple, and what I found out so far didn't >>> delight me. >>> I have an Index.html that is the main page for logged users. Inside it >>> there is a menu and ng-view directive that handles the partials. That's >>> fine. >>> However, when the user Is not logged, I show the Home.html partial, but >>> this html is completely different from Index.html. It shouldn't be rendered >>> in the ng-view. It should be rendered like a normal page. The same applies >>> for the Login.html. It's completely different, that is, there are no nav >>> bar. The structure is different, and use ng-hide/show seems awkward. >>> >>> What should I do? >>> >>> *app.js* >>> var scoreApp = angular.module('scoreApp', ['ngRoute', 'angularMoment', >>> 'UserApp', 'UserApp.facebook-picture', 'ui.bootstrap', 'underscore']) >>> .config(['$routeProvider', '$locationProvider', function >>> ($routeProvider, $locationProvider) { >>> $routeProvider.when('/', { templateUrl: >>> '/app/partials/Home.html', public: true }); >>> $routeProvider.when('/Votacao', { templateUrl: >>> '/app/partials/Voting.html', controller: 'VotingController' }); >>> $routeProvider.when('/Login', { templateUrl: >>> '/app/partials/Login.html', login: true }); >>> $routeProvider.otherwise({ redirectTo: '/' }); >>> $locationProvider.html5Mode(true); >>> }]) >>> >>> *Index.html* >>> <!DOCTYPE html> >>> <html lang="pt-br" ng-app="scoreApp"> >>> <head> >>> <meta charset="utf-8" /> >>> <title>Awesome Score App</title> >>> <meta name="viewport" content="width=device-width, >>> initial-scale=1.0" /> >>> >>> <link href="// >>> netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" >>> rel="stylesheet" /> >>> <link href="// >>> netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" >>> rel="stylesheet" /> >>> <link href="//fonts.googleapis.com/css?family=Open+Sans:400,300" >>> rel="stylesheet" /> >>> <link href="app/css/bootstrap-social.css" rel="stylesheet" /> >>> <link href="app/css/app.css" rel="stylesheet" /> >>> </head> >>> <body> >>> <div class="container"> >>> <nav class="navbar navbar-default navbar-fixed-top ng-cloak" >>> role="navigation" ng-cloak ng-controller="MenuController"> >>> <div class="navbar-header"> >>> <a class="navbar-brand" href="/">Score App</a> >>> </div> >>> <div class="navbar-collapse collapse"> >>> <ul class="nav navbar-nav" ng-show="user.authenticated"> >>> <li><a href="/Votacao">Votação <span class="badge" >>> ng-hide="scoresToVote == 0">{{scoresToVote}}</span></a></li> >>> </ul> >>> <ul class="nav pull-right" style="margin-right:10px;" >>> ng-show="user.authenticated"> >>> <li class="dropdown"> >>> <a class="dropdown-toggle" >>> data-toggle="dropdown" href="#"> >>> <img class="nav-user-photo" >>> ua-facebook-picture /> >>> <span class="user-info"> >>> {{user.first_name}} >>> </span> >>> <i class="fa fa-caret-down"></i> >>> </a> >>> <ul class="dropdown-menu"> >>> <li><a href="#" ua-logout><i class="fa >>> fa-power-off"></i>Logout</a></li> >>> </ul> >>> </li> >>> </ul> >>> </div> >>> </nav> >>> >>> <ng-view></ng-view> >>> >>> </div> >>> >> -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
