3
votes

i need a help in passport.js authentication. passort.js authentiction working fine. but i dont know how can i create authentication login in popup window. all the authentication process functions in backend.

please help me.

   'linkedin': function(req, res) {


           passport.authenticate('linkedin', {failureRedirect: '/login', scope: ['r_basicprofile', 'r_emailaddress']},
function(err, user) {
            req.logIn(user, function(err) {
        if (err) {
            // console.log(err);
            res.view('500');
            return;
        }
        req.session.user = user;
        return res.redirect('/user');
    });
})(req, res);

}, 'facebook': function(req, res) { passport.authenticate('facebook', {failureRedirect: '/login', scope: ['email','publish_stream'],display:'popup' }, function(err, user) {

    req.logIn(user, function(err) {
        if (err) {
            throw err;
            res.view('500');
            return;
        }
        req.session.user = user;
        if (p) {

            //write the post project function
        }

        return res.redirect('/user');
    });
})(req, res);

},

this is my login page

     <form  action ="/auth/linkedin" method = "POST" class="columns small-12 iconized" >
         <input type="hidden" value="test messge" name="title">    
           <button type="submit"  class="icon-linkedin">Linkedin</button>
      </form>

please help how can i resize the window .

1

1 Answers

0
votes

One solution is jquery.lightbox_me.js found here http://www.freshdesignweb.com/demo/index.php?p=1379320109

Just follow the steps:

1) download the source code, and copy the .js file to assets/js, and copy the .css file to assets/style

2) change your html code to

 <button id="loginBtn" class="btn btn-success btn-med">Login</button>

 <form  id="loginForm" action ="/auth/linkedin" method = "POST" class="columns small-12 iconized" display: none; >
     <input type="text" value="test messge" name="title">    
       <button type="submit"  class="icon-linkedin">Linkedin</button>
  </form>

  <script>
$('#loginBtn').click(function(e) {
    $('#loginForm').lightbox_me({
        centered: true, 
        onLoad: function() { 
            $('#loginForm').find('input:first').focus()
        }
    });
    e.preventDefault();
});
  </script>

3) This should do the trick. However eventually it will best if you keep your js scripts out of the html/ejs files, so things are more tidy.

Since Sails comes with ejs-locals, I would put the content within the tags in a separate file and make a call to <% block ... %> instead. Check this page for more info: Sails.js - How to inject a js file to a specific route?