Looking to randomly select, concatenate string of text stored in variable

Question

Problem

In my scripts.js the variable var fullURL = not getting the actual text to be tweeted out in the teaser1, teaser2 and teaser3 that I've stored in a variable. I basically want one of the three teasers to be randomly selected when people click fa-twitter

scripts.js

function shareTeam(){
    $(".fa-twitter").click(function(){

         // Grabs the names of all the players in the span
         // Sets a variable marking the indexOf each of the names
         // If the index doesn't find a space, it returns -1, which returns the full name
         // Otherwise it will return only what follows the space
         var lastNames = $("li span").map(function() {
           var name = $(this).text();
           var index = name.indexOf(" ");
           return index == -1 ? name : name.substring(index + 1);
         }).get();
         console.log(lastNames);

        var regularNames = lastNames.slice(0, 3); // Same as below, but no shuffling

        regularName1 = regularNames[0]; // Forward
        regularName2 = regularNames[1]; // Forward
        regularName3 = regularNames[2]; // Defenseman

        // Find me a random number between 1 and 3
        // Where 1 is the start number and 3 is the number of possible results
        var teaser = "teaser";
        var rand = Math.floor(Math.random() * 3) + 1;
        console.log(rand);

        // Concatenate the two strings together
        teaseRand = teaser.concat(rand);

        // These are the components that make up that fullURL
        var baseURI = "https://twitter.com/intent/tweet?url=";
        var twitterUsername = "stltoday";
        var interactiveURL = "http://graphics.########.com/STLblues";

        // Randomly generate one of three teasers
        var teaser1 = regularName3 + " to " + regularName2 + " back to " + regularName1 + " — GOAL! Create your own all-team #STLBlues team: ";
        var teaser2 = "I picked my #STLBlues dream team. See which players I've chosen and build your own: ";
        var teaser3 = "My #STLBlues team will skate circles around yours! Pick your team: ";

        // This is the full url that will be switched in and out
        // var fullURL = baseURI+interactiveURL+"&via="+twitterUsername+"&text="+teaseRand;
        var fullURL = baseURI+interactiveURL+"&via="+twitterUsername+"&text="+teaseRand;

        // It needs to be encoded properly as well
        var encodedURL = encodeURIComponent(fullURL)
        console.log(fullURL);
        console.log(encodedURL);



        // Change the href to the link every time the Twitter button is clicked
        var changeLink = $("link--twitter").attr("href", encodedURL);

        // if (lastNames.length === 6) {

        // } else {
        //     // Generic teaser
        //     var teaser4 = "Pick your #STLBlues dream team from 50 of the best @StLouisBlues to hit the ice: " + interactiveURL + " (via @stltoday)";
        // }
    });
}

Answer 1

Unfortunately this teaseRand value will be either "teaser1" or "teaser2" or "teaser3" and not the value of your variables teaser1 or teaser2 or teaser3 if that makes sense. For your requirement you will need to add the teasers to an array and then randomly access from it. For e.g. if the array is called teaser then you will need to do teaser[rand] and obviously you will need to calculate the rand from 0 to 2 instead 1 to 3 like you have done now.

Please check the codepen that i have created here

http://codepen.io/19sthil80/pen/VKPqkR?editors=1111

$(document).ready(function(){
var teasers = [];
     // Grabs the names of all the players in the span
     // Sets a variable marking the indexOf each of the names
     // If the index doesn't find a space, it returns -1, which returns the full name
     // Otherwise it will return only what follows the space
     var lastNames = $("li span").map(function() {
       var name = $(this).text();
       var index = name.indexOf(" ");
       return index == -1 ? name : name.substring(index + 1);
     }).get();
     console.log(lastNames);

    var regularNames = lastNames.slice(0, 3); // Same as below, but no shuffling

    regularName1 = regularNames[0]; // Forward
    regularName2 = regularNames[1]; // Forward
    regularName3 = regularNames[2]; // Defenseman

    // Find me a random number between 1 and 3
    // Where 1 is the start number and 3 is the number of possible results
    var teaser = "teaser";
    var rand = Math.floor(Math.random() * 3);
    console.log(rand);

    // Concatenate the two strings together
    teaseRand = teaser.concat(rand);

    // These are the components that make up that fullURL
    var baseURI = "https://twitter.com/intent/tweet?url=";
    var twitterUsername = "stltoday";
    var interactiveURL = "http://graphics.########.com/STLblues";

    // Randomly generate one of three teasers
    var teaser1 = regularName3 + " to " + regularName2 + " back to " + regularName1 + " — GOAL! Create your own all-team #STLBlues team: ";
    var teaser2 = "I picked my #STLBlues dream team. See which players I've chosen and build your own: ";
    var teaser3 = "My #STLBlues team will skate circles around yours! Pick your team: ";
teasers.push(teaser1);teasers.push(teaser2);teasers.push(teaser3);
    // This is the full url that will be switched in and out
    // var fullURL = baseURI+interactiveURL+"&via="+twitterUsername+"&text="+teaseRand;
    var fullURL = baseURI+interactiveURL+"&via="+twitterUsername+"&text="+teasers[rand];

    // It needs to be encoded properly as well
    var encodedURL = encodeURIComponent(fullURL)
    console.log(fullURL);
    console.log(encodedURL);



    // Change the href to the link every time the Twitter button is clicked
    var changeLink = $("link--twitter").attr("href", encodedURL);

    // if (lastNames.length === 6) {

    // } else {
    //     // Generic teaser
    //     var teaser4 = "Pick your #STLBlues dream team from 50 of the best @StLouisBlues to hit the ice: " + interactiveURL + " (via @stltoday)";
    // }
});