Pages

Thursday, December 15, 2016

Building a Shared Calendar [Part 5]: Change the UI if the user is logged in

Now that a user can authenticate we can change the UI depending on the user's logged in status. The passport.js middleware will automatically extracts the user object from session and makes it available on the request object. So the first thing is to pass the user from the route to the vash view:
router.get('/', function(req, res, next) {
    res.render('index', {
        username: req.user && req.user.name
      });
});

Note that when rendering the 'index' view we construct the model with a username if it exists. Now this can be used on the view to change the rendering:
@html.block('content', function(model) {
      @if(!model.username) {
            <div class="u-center-block instructions">
              <div class="u-center-block__content">You must log in to create events.</div>
            </div>
      } else {
           ...
      }
})

Source code is available at bitbucket or you can play with the live test site.




No comments:

Post a Comment

Note: Only a member of this blog may post a comment.