Random Image Generator [Randomize instead of Order]

[Cravver]

I have this code here and I need to know how to make it randomize the amoutn of images there are:
Currently it shows the images, and uses a cookie so the image doesnt show up more than it needs to, but i need to randomize the image order instead of it show up by order.

            function showImage() {
                //get image object
                var myImg = document.getElementById('showImage');

                //declare image directory path and image array
                var thePath = "images/";
                var theImages = new Array();
                theImages[0] = "01.png";
                theImages[1] = "02.png";
                theImages[2] = "03.png";
                theImages[3] = "04.png";
                theImages[4] = "05.png";
                theImages[5] = "06.png";
                theImages[6] = "07.png";
                theImages[7] = "08.png";
                theImages[8] = "09.png";
                theImages[9] = "10.png";
                theImages[10] = "11.png";
                theImages[11] = "12.png";
                theImages[12] = "13.png";
                theImages[13] = "14.png";
                theImages[14] = "15.png";
                theImages[15] = "16.png";
                theImages[16] = "17.png";
                theImages[17] = "18.png";
                theImages[18] = "19.png";
                theImages[19] = "20.png";
                theImages[20] = "21.png";
                theImages[21] = "22.png";
                theImages[22] = "23.png";
                theImages[23] = "24.png";
                theImages[24] = "25.png";
                theImages[25] = "26.png";
                theImages[26] = "27.png";
                theImages[27] = "28.png";
                theImages[28] = "29.png";
                theImages[29] = "30.png";
                theImages[30] = "31.png";
                theImages[31] = "32.png";
                theImages[32] = "33.png";

                //get current cookie value
                var currentIndex = parseInt(getCookie());
                var imgPath = thePath + theImages[currentIndex];
                myImg.src = imgPath;
                myImg.alt = theImages[currentIndex];
                myImg.title = theImages[currentIndex];

                //set next cookie index
                currentIndex += 1;
                if(currentIndex > (theImages.length - 1)) {
                    currentIndex = 0;
                }
                setCookie(currentIndex);
            }

            function setCookie(someint) {
                var now = new Date();
                var addDays = now.getDate() + 7
                now.setDate(addDays); // cookie expires in 7 days
                var theString = 'imgID=' + escape(someint) + ';expires=' + now.toUTCString();
                document.cookie = theString;
            }

            function getCookie() {
                var output = "0";
                if(document.cookie.length > 0) {
                    var temp = unescape(document.cookie);
                    temp = temp.split(';');
                    for(var i = 0; i < temp.length; i++) {
                        if(temp[i].indexOf('imgID') != -1) {
                            temp = temp[i].split('=');
                            output = temp.pop();
                            break;
                        }
                    }
                }
                return output;
            }

I use this to show the image:

<img id="showImage" style="margin: auto;margin-top: -234px;width: 100%;" width="100%" height="216px" />
<script language="JavaScript">
jQuery(document).ready(function(){ showImage(); })
</script>

[paulkd]

Script to produce a list of random numbers in an array that you can then iterate.

    var ubound = 32;
    var sequence = [];
    var slotAvailable;
    var i;

    for(i=0; i<ubound; i++) {
        sequence.push(0);
    }
    for(i=0; i<ubound; i++) {
        slotAvailable = true;
        while(slotAvailable) {
            randomSlot = Math.floor((Math.random()*ubound));
            if(sequence[randomSlot]===0) {
                sequence[randomSlot] = i;
                slotAvailable = false;
            }
        }
    }
    //just to show the finished sequence
    document.write( sequence.join('|') ); 

[Cravver]

-_- i dont know how to work with that.

[paulkd]

I don't understand why you have asked for a random sequence.
If you want to display a different image per page refresh, then a session variable is all that is needed with a math MOD function to continuallly iterate through your images.

Can you explain what you want to happen each time a user visits the page, each time a user refreshes a page?

[Cravver]

I mean I can see how you method works, but i don't know how to implement it.