Learn: User Name & Passwords

Home Food Mates • Members Tutorials Forum Buy Templates Contact Us 

 


Flash Tutorials

   

Flash Tutorial - User Name and Password - Advanced Features

 

Free Tutorial


Step 5    <<   Previous      Intro   1   2   3   4   5   6     Next   >>       >>   Webwasp Mates

 

Step Five: The ActionScript in Frame 1

  1. On the layer ActionScript use this code instead of the code used in the previous tutorial (skip the gray comments if you like):

    /*  Create an array to hold all the possible usernames. You can add or remove usernames to the array.
    Add myUserNameArray[x] where x is the next number up from the last number in the array i.e. the next number up in the array would be 3 so you would add:

    myUserNameArray[3] = "MyUserName"; You can edit the word(s) in the inverted comas below to change them to whatever possible usernames you want.

    The user names below match their corresponding password. So the username 'web' matches the password 'wasp'. Here is an example:

    var myUserNameArray = new Array();
    myUserNameArray[0] = "my first possible username";
    myUserNameArray[1] = "my second possible username";
    myUserNameArray[2] = "my third possible username";

    var myPasswordArray = new Array();
    myPasswordArray[0] = "my first possible password";
    myPasswordArray[1] = "my second possible password";
    myPasswordArray[2] = "my third possible password";

    Notice how the usernames don't match the passwords. The username 'my first possible username' would still have to match its corresponding password: 'my first possible password'. Although they are named differently the first array values must match each other so myUserNameArray[0] matches myPasswordArray[0]. It is important that you have the same number of possible password to usernames.

    All usernames and passwords are case sensitive. If the username or password has any capital letters in it, then the user must enter the username and password with the same capital letters. The same is true of spaces.  */
    var myUserNameArray = new Array();
    myUserNameArray[0] = "web";
    myUserNameArray[1] = "web1";
    myUserNameArray[2] = "web2";
    var myPasswordArray = new Array();
    myPasswordArray[0] = "wasp";
    myPasswordArray[1] = "wasp1";
    myPasswordArray[2] = "wasp2";

    /*  This is a global function that checks the input. In this case it checks that the User Name or Password isn't just all spaces.  */
    String.prototype.isWhiteSpace = function() {
    return ((this != undefined && this.length>0) ? (this.split(" ").join("").length == 0 ? b=true : b=false) : (b=false));
    };

    /*  This clears the User Name And Password Input Boxes, if the user returns back to the log in box.  */
    var UserName = "";
    var Password = "";

    //  Set up all the variables used in the code below.
    var t;
    var z = 0;
    var y;
    var q;
    var x;
    var i = 0;

    //  This sets the default start message when the Movie first loads
    var Guide = "Please Enter Your User Name And Password";

    //  Declares a global function, which is the first function to be called when the user presses the Enter button.
    _global.InputCheck = function() {

    /*  Resets and clears all the variables. Basically resets all the variables back to their default settings. This is so that when the code below is being re-run, all the variables are set to their default settings and values.  */
    t = "";
    z = 0;
    y = "";
    q = "";
    x = "";
    i = 0;

    /*  This sets the cursor in the User Name input box. It sets the variable 'a' to '1' so that if the Tab button is pressed, the Movie knows which text box currently has focus.  */
    Selection.setFocus("_root.UserName");
    Selection.setSelection(length(/:UserName), length(/:UserName));
    _root.a = 1;

    /*  Checks the User Name to see if anything has been typed and also checks to see if the User Name input box is just full of spaces.  */
    if (_root.UserName.isWhiteSpace() | _root.UserName.length == 0 | _root.UserName == "" | _root.UserName eq "") {


    //  Tells the user that the User Name is incorrect.
    _root.Guide = "No User Name Entered Please Try Again!";

    /*  If the User Name is empty or incorrect, then it tells the UserNameRequired Movie Clip to go to the first frame. This essentially tells the user that user name input box is incorrect or empty.  */
    _root.UserNameInputRequired.gotoAndStop(1);

    /*  This sets the cursor back to User Name input box and sets the variable 'a' to 1 so that if the Tab button is pressed the Movie knows which text box currently has focus.  */
    Selection.setFocus("_root.UserName");
    Selection.setSelection(length(/:UserName), length(/:UserName));
    _root.a = 1;

    //  Stops the Movie from going to the next frame
    stop();

    //  If the User Name isn't empty (or is full of spaces) run the next function check
    } else {
    UserNameCheck();
    }
    };

    /*  Declares the next global function that will check that the User Name matches one of the possible usernames from the array.  */
    _global.UserNameCheck = function() {

    /*  Sets the variable 'x' to the length of the array, and minuses one away from the array length because the array length is always one number higher than it actually is. This is because the array starts at 0 not 1 and computers count 0 as 1   */
    x = myUserNameArray.length-1;

    /*  While the value 'i' is less than the variable 'x' value, run the code below once and then add 1 to the value 'i', then check to see if it is still less than the variable 'x'.  */
    for (i=0; i<=x; i++) {

    /*  Check’s to see if the User Name entered is the same as any of the possible User Names in the array 'myUserNameArray'.  */
    if (myUserNameArray[i] == _root.UserName) {

    /*  Set the variable 'q' to the variable 'i'. This will be used later to check to see if the User Name matches the right password.  */
    q = Number(i);

    // Stops the loop:
    i = x;

    /*  This sets the cursor in the Password input box and the variable 'a' to 0, so that if the Tab button is pressed the Movie knows which text box currently has focus.  */
    Selection.setFocus("_root.Password");
    Selection.setSelection(length(/:Password), length(/:Password));
    _root.a = 0;

    /*  If the User Name is correct, this tells the UserNameRequired Movie Clip to go to the second frame. This essentially tells the user that user name input box is now correct.  */
    _root.UserNameInputRequired.gotoAndStop(2);

    //  Run the next function check.
    PasswordCheck();
    } else if (i == x) {

    /*  If the loop runs and the User Name entered doesn't match any of the possible array usernames then the following alert is displayed. */
    _root.Guide = "Sorry That User Name Is Incorrect. Please Try Again!";

    /*  If the user name is empty or incorrect, then this tells the UserNameInputRequired Movie Clip to go to the first frame. This essentially tells the user that user name input box is incorrect or empty. */
    _root.UserNameInputRequired.gotoAndStop(1);

    /*  This sets the cursor to the User Name input box and sets the variable 'a' to 1 so that if the Tab button is pressed, the Movie knows which text box currently has focus. */
    Selection.setFocus("_root.UserName");
    Selection.setSelection(length(/:UserName), length(/:UserName));
    _root.a = 1;

    //  Stops the Movie from going to the next frame:
    stop();
    }
    }
    };

    //  Declares a global function which will check the password input:
    _global.PasswordCheck = function() {

    /*  Ensures that when the User Name is correct, the password field has the cursor in it. Again makes sure that the variable 'a' is set to 0, so the Tab button knows where to set the cursor if the user presses the Tab button. */
    Selection.setFocus("_root.Password");
    Selection.setSelection(length(/:Password), length(/:Password));
    _root.a = 0;

    //  Checks the password to see if anything has been typed or if it is empty:
    if (_root.Password.length == 0 | _root.Password.length == "" | _root.Password eq "") {
    stop();


    //  Tell’s the user that the password is incorrect:
    _root.Guide = "No Password Entered Please Try Again!";

    /*  Ensures that when the User Name is correct, the Password field has the cursor in it . Again makes sure that the variable 'a' is set to 0, so that the Tab button knows where to set the cursor if the user presses the Tab button. */
    Selection.setFocus("_root.Password");
    Selection.setSelection(length(/:Password), length(/:Password));
    _root.a = 0;

    /*  If the Password is empty or incorrect, then this tells the PasswordInputRequired Movie Clip to got the first frame. This tells the user that password input box is incorrect or empty. */
    _root.PasswordInputRequired.gotoAndStop(1);

    //  Stops the Movie from going to the next frame:
    stop();

    //  Checks to see if the password is only full of spaces.
    } else if (_root.Password.isWhiteSpace()) {

    //  Tells the user that the password is incorrect.
    _root.Guide = "Sorry Incorrect Password Entered Please Try Again!";

    /*  Ensures when the User Name is correct, the password field has the cursor in it. Again it also makes sure that the variable 'a' is set to 0, so that the Tab button knows where to set cursor if the user presses the Tab button. */
    Selection.setFocus("_root.Password");
    Selection.setSelection(length(/:Password), length(/:Password));
    _root.a = 0;

    /*  If the Password is empty or incorrect, this tells the PasswordInputRequired Movie Clip to go to the first frame. This essentially tells the user that password input box is incorrect or empty. */
    _root.PasswordInputRequired.gotoAndStop(1);

    //  Stops the Movie from going to the next frame:
    stop();

    //  If the password is empty or full of spaces run the next function check:
    } else {
    PasswordValidationCheck();
    }
    };

    /*  This function will check to see if the password entered matches any of the possible array passwords. */
    _global.PasswordValidationCheck = function() {


    /*  Sets the variable 'y' to the length of the array and minuses one away from the array length. This is because the array length is always number higher than it actually is. This is because the array starts at 0 not 1 and computers count 0 as 1
    . */
    y = myPasswordArray.length-1;

    /*  While the value 'z' is less than the variable value, run the code below once and then add 1 to the value 'z' and check to see if it’s still less than the variable 'z' value. */
    for (z=0; z<=y; z++) {

    /*  Checks to see if the password entered is the same as any of the possible passwords in the array 'myPasswordArray'. */
    if (myPasswordArray[z] == _root.Password) {

    /*  Set the variable 't' to the variable 'z' this will be used later on to check to see if the password matches the right User Name. */
    t = Number(z);

    //  Stop the loop.
    z = y;

    //  Run the last global function check.
    FinalyCheck();
    } else if (z == y) {

    /*  If the loop runs and the username entered doesn't match any of the possible array usernames, then this alerts the user that their User Name is incorrect. */
    _root.Guide = "Sorry Incorrect Password Entered Please Try Again!";

    /*  If the User Name is empty or incorrect then this tells the UserNameInputRequired Movie Clip to go to the first frame. This essentially tells the user that user name input box is incorrect or empty. */
    _root.UserNameInputRequired.gotoAndStop(2);

    /*  This sets the cursor back to the User Name input box and sets the variable 'a' to 0 so that if the Tab button is pressed the Movie knows which text box currently has focus. */
    Selection.setFocus("_root.Password");
    Selection.setSelection(length(/:Password), length(/:Password));
    _root.a = 0;

    //  Stops the Movie from going to the next frame.
    stop();
    }
    }
    };

    /*  If the User Name matches the right password allow user to proceed. The User Name has to match the exact corresponding password. So the User Name 'web' must match the corresponding password 'wasp' etc. */
    _global.FinalyCheck = function() {
    if (q == t) {
    nextFrame();


    /*  If the loop runs and the username entered doesn't match any of the possible array User Names then this alerts the user that their User Name is incorrect. */
    } else {
    _root.Guide = "Sorry That Username Doesn't Match That Password. Please Try Again!";

    /*  If the User Name is empty or incorrect then this tells the UserNameInputRequired Movie Clip to go to the first frame. This tells the user that the User Name input box is incorrect or empty. */
    _root.UserNameInputRequired.gotoAndStop(1);

    /*  This sets the cursor back in the User Name input box and sets the variable a to 1, so that if the Tab button is pressed the Movie knows which text box currently has the focus. */
    Selection.setFocus("_root.UserName");
    Selection.setSelection(length(/:UserName), length(/:UserName));
    _root.a = 1;

    //  Stops the Movie from going to the next frame.
    stop();
    }
    };

    //  Declares 'a' as a variable. When the user presses the Tab button it checks this value.
    var a = 1;

    //  Set focus on the User Name input box when Movie first loads.
    Selection.setFocus("_root.UserName");
    Selection.setSelection(length(/:UserName), length(/:UserName));

    //  Stop Movie at current frame.
    stop();

Your Flash Movie should now be ready!! The next section covers some additional info on: Browser Compatibility & Setting the Cursor's Focus.

         

Step 5    <<   Previous      Intro   1   2   3   4   5   6     Next   >>       >>   Webwasp Mates


Webwasp Community: Webwasp Mates & Dates

Why not try out webwasp's new community. Meet new people, find friends in your area: Webwasp Mates & Dates

 Top of Page Home Food Mates Members Tutorials Forum Buy Templates Contact Us 
 All material on this site is protected under international copyright © law. DO NOT reproduce any material from this site without written permission. Please ask as permission is often granted.