SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    reads the ********* Crier silver trophybronze trophy longneck's Avatar
    Join Date
    Feb 2004
    Location
    Tampa, FL (US)
    Posts
    9,854
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    slot machine style random name picker

    i need a way to visually shuffle through a bunch of names and pick one at random. i found some code for a javascript slot machine and hacked at it.

    the result is attached.

    when you click on the logo, it's supposed to display 25 names then stop on the last one. instead, it just display undefined. i'm not exactly sure why, but i think that the spinem function can't access the array of names.

    help!!
    Attached Files Attached Files
    Check out our new Industry News forum!
    Keep up-to-date with the latest SP news in the Community Crier

    I edit the SitePoint Podcast

  2. #2
    SitePoint Evangelist bals28mjk's Avatar
    Join Date
    Aug 2007
    Posts
    405
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Post what you have so far longneck.

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Here's the code that needs to be fixed:

    Code javascript:
    var r = Math.floor((Math.random() * total));
    var who = names[r].split(":", 1);
     
    ename = document.getElementById("name");
    einst = document.getElementById("inst");
     
    ename.innerHTML = who[0];
    ename.innerHTML = who[1];

    The split needs to be fixed.

    Code javascript:
    //var who = names[r].split(":", 1);
    var who = names[r].split(":");

    And the following needs to be referring to different elements, not the same element.

    Code javascript:
    //ename.innerHTML = who[0];
    //ename.innerHTML = who[1];
    ename.innerHTML = who[0];
    einst.innerHTML = who[1];

    Then it will work.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Paul,

    would it possible to ensure that the same name is not picked twice ? i.e. when a name is picked is removed from that list ?

    Many thanks !

    George

    Quote Originally Posted by pmw57 View Post
    Here's the code that needs to be fixed:

    Code javascript:
    var r = Math.floor((Math.random() * total));
    var who = names[r].split(":", 1);
     
    ename = document.getElementById("name");
    einst = document.getElementById("inst");
     
    ename.innerHTML = who[0];
    ename.innerHTML = who[1];

    The split needs to be fixed.

    Code javascript:
    //var who = names[r].split(":", 1);
    var who = names[r].split(":");

    And the following needs to be referring to different elements, not the same element.

    Code javascript:
    //ename.innerHTML = who[0];
    //ename.innerHTML = who[1];
    ename.innerHTML = who[0];
    einst.innerHTML = who[1];

    Then it will work.

  5. #5
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by george1234 View Post
    Hi Paul,

    would it possible to ensure that the same name is not picked twice ? i.e. when a name is picked is removed from that list ?

    Many thanks !

    George
    Yes it is possible. You can use the Array.splice() method to add/remove items from an array.

    The syntax is: Array.splice(index, delete, add, ...)

    So after you've picked the person, you can then delete him from the array.

    Code javascript:
    var who = names[r].split(":", 1);
    names.splice(r, 1);
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  6. #6
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi !

    thanks a lot for the immediate reply.

    I have been trying to get what you suggested to work but I am unsuccessful... (I am really novice, so I apologise in advance for any stupid questions/remarks)


    So after you've picked the person, you can then delete him from the array.

    Code javascript:
    var who = names[r].split(":", 1);
    names.splice(r, 1);
    [/QUOTE]

    I thought, based on your previous post, that this should be:

    Code javascript:
    var who = names[r].split(":");
    names.splice(r, 1);
    [/QUOTE]

    I tried both - the first prints out "undefined" whilst the latter sort of works but not always... If one attempts to select more winners it slowly comes to a halt.

    Many thanks !

    George

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by george1234 View Post
    I tried both - the first prints out "undefined" whilst the latter sort of works but not always... If one attempts to select more winners it slowly comes to a halt.
    That's because it counts the length when the page loads, whereas it need to update the length of the array (because we are deleting them) as it spins.

    Code javascript:
    var total = names.length;
    var r = Math.floor((Math.random() * total));
    var who = names[r].split(":");
    names.splice(r, 1);

    That will go through all of the names, removing names whenever they are used. With a list of 219 names as there was in the attached code, it will mean a total of 9 spins.

    If you only want the winner to be removed, then you will need to move the splice in to the winner section instead.

    Code javascript:
    if (counter<25) {
        setTimeout("spinem(counter);",50 + slow);
    } else {
        ewinner.innerHTML = "We have a winner!";
        names.splice(r, 1);
    }
    Last edited by paul_wilkins; Jul 20, 2009 at 19:44.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Got it ! Once again many thanks for the help and the immediate reply !

    Best wishes,

    George


    Quote Originally Posted by pmw57 View Post
    That's because it counts the length when the page loads, whereas it need to update the length of the array (because we are not deleting them) as it spins.

    Code javascript:
    var total = names.length;
    var r = Math.floor((Math.random() * total));
    var who = names[r].split(":");
    names.splice(r, 1);

    That will go through all of the names, removing names whenever they are used. With a list of 219 names as there was in the attached code, it will mean a total of 9 spins.

    If you only want the winner to be removed, then you will need to move the splice in to the winner section instead.

    Code javascript:
    if (counter<25) {
        setTimeout("spinem(counter);",50 + slow);
    } else {
        ewinner.innerHTML = "We have a winner!";
        names.splice(r, 1);
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •