0

The shuffle function I have below isn't working correctly. I have an array of 100+ pages that need to be shuffled and then shown in an iframe for a certain time. Somehow it doesn't show me the entire array of 100+ pages, but after about 25 pages it seems to start over. Can anyone help? I need to make sure the entire array is always being played in it's entirety and always in a new random order (so a shuffle everytime the page is visited and a shuffle after the entire array is played.

Here is the code, can anyone see where it's going wrong?

<script type="text/javascript">
var pages=new Array();
pages[0]="01.html";
pages[1]="02.html";
pages[2]="03.html";
....etc
pages[100] ="100.html";

 var shuffle = function(){
         var shuffledPages = [];

         /*The first time rand is used, it will not allow you to pick the last value used last time.*/
         var rand = Math.floor((pages.length - 1) * Math.random());

         while(pages.length > 0){
             shuffledPages.push( pages.splice( rand, 1)[0] );  
             rand = Math.floor(pages.length * Math.random());
         }

         return shuffledPages;
 }




var time=33000; 
var currentIndex = 0; 

function pageChange() { 
    if(currentIndex == pages.length - 1){ 
        pages = shuffle(); 
        currentIndex = 0; 
    } 
    else{ 
        currentIndex++; 
    } 

    document.getElementById("frame").src=pages[currentIndex]; 
    setTimeout("pageChange()",time); 
}

onload=pages = shuffle();
onload=pageChange;

</script>

<iframe id="frame" src="" width="1555px" height="872px" hspace="0" vspace="0" frameborder="2" scrolling="no" ></iframe><br />
TVB
  • 5
  • 4
  • Shuffle using this method. http://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array-in-javascript. – Deshan Dec 15 '14 at 12:07
  • How would I implement this in my code? I don't know how to combine the shuffle and the pageChange function. – TVB Dec 15 '14 at 12:52

1 Answers1

0

Edit : Working code : 

var pages=[];
pages[0]="http://example.com/";
pages[1]="http://www.iana.org/domains/reserved";
pages[2]="http://en.wikipedia.org/wiki/Main_Page";
pages[3]="http://en.wikipedia.org/wiki/Randomness";

 var shuffle = function(array){
     var shuffledPages = [];
     while(array.length){
         shuffledPages.push(array.splice(Math.floor(array.length*Math.random()),1));
     }
     return shuffledPages;
}


var time = 3300; 
var currentIndex = 0; 

function pageChange() { 
    if(currentIndex == 0){ 
        pages = shuffle(pages); 
        console.log(pages);
        currentIndex = pages.length; 
    }
    currentIndex--; 
    document.getElementById("frame").src=pages[currentIndex]; 
    console.log(currentIndex);
    setTimeout(function() { pageChange(); }, time);
};

pageChange();

Fiddle : http://jsfiddle.net/xaa1qccm/

nobe4
  • 2,802
  • 3
  • 28
  • 54
  • Thank you. I replace my shuffle section with your code, but now nothing happens in the iframe. – TVB Dec 15 '14 at 12:29
  • Yes! In the fiddle it works great, but in my own code I need to change `pageChange();` to `onload=pageChange;` for it to even start and when it does, the first page is always an error/non-existing page. From the second page on it seems to be playing a shuffle... – TVB Dec 15 '14 at 13:11
  • I see in the fiddle it catches a 404 too in each array. – TVB Dec 15 '14 at 13:12
  • I clearly see "Error 404 We're truly sorry, but there is no such page." on the first pageload and once every next shuffle. I think the math creates a value outside the array (zero minus one -> refering to pages[-1], which doens't exist. Does it just play the 4 pages in a shuffled loop on your side? – TVB Dec 15 '14 at 14:13
  • and now ? http://jsfiddle.net/xaa1qccm/ I found that the first value was always 4 as the array length so this version should work. – nobe4 Dec 15 '14 at 16:10
  • This code works great. Exactly what I was looking for, thanks. – TVB Dec 16 '14 at 12:16