Register/login

Jeff Atwood wrote a great post on creating the simplest login page. Read it!

Let`s use JQueryMobile for the widgests and Parse for the backed.

Insert this html to the JQueryMobile page:

<h3>Login/Register</h3>

<label for="usrnm" class="ui-hidden-accessible">Email:</label>

<input type="text" name="user" id="loginEmail" placeholder="Email">

<label for="pswd" class="ui-hidden-accessible">Password:</label>

<input type="password" data-inline="true" name="passw" id="loginPassword" placeholder="Password">

<input type="submit" data-inline="true" onclick="myForgotPassword();" value="reset pass"> 

<label id="loginMessage" style="color:red"></label>

<input type="submit" data-inline="true" onclick="myLogin();"       value="Log in">

<input type="submit" data-inline="true" onclick="myRegister();"    value="Create new account">

Use JQuery to extract user values and fill login message ($("#input_id".val() , or $(#message_id").text("new text")

We will use Parse user.signUp , Parse.User.logIn and Parse.User.requestUserPassword methods for the backend.

function myRegister() {

    console.log("myRegister");

    $('#loginMessage').text(""); //clean

    var email = $('#loginEmail').val();

    var password= $('#loginPassword').val();

    

    var user= new Parse.User();

    user.set("username",email);

    user.set("email" , email);

    user.set("password", password);    

    user.signUp(null, {

       success: function(user)  {

           console.log("register success");

           $('#loginMessage').text("success");

       },

       error: function(user,error) {

           console.log("register failed "+ error.code +" " +error.message );

           $('#loginMessage').text("failed "+error.message);

       }

       

    });

}

function myLogin() {

    console.log("myLogin");

    $('#loginMessage').text(""); //clean

    var email = $('#loginEmail').val();

    var password= $('#loginPassword').val();

    Parse.User.logIn(email, password, {

       success: function(user)  {

           $('#loginMessage').text("login success");

       },

       error: function(user,error) {

           $('#loginMessage').text("login failed "+error.message);

       }

    });

    

}

function myForgotPassword() {

    console.log("myLogin");

    var email = $('#loginEmail').val();

    

    Parse.User.requestPasswordReset(email , {

       success: function() {

           $('#loginMessage').text("password reset sent");

       },

       error: function(error) {

           $('#loginMessage').text("failed to reset password "+ error.message);

       }

    });

}