Pull images from folder for Backstretch

Question

since I could not find the answer anywhere maybe someone else is troubled by this too. I would like to use random images from a folder in backstretch without specifing the images before. I am not good at php, so could someone tell me how to do this, I believe it would be sth. similar to this solution, which is for supersized (How to use the Supersized! plugin with image folders)

Furthermore I'd need the slideshow to start with a different image when the page is reloaded/revisited.

Thanks a lot for helping me!!

Answer 1

I've put together a simple php script. It gets all .jpg's from $image_dir and returns them in a random order.

The first image is saved as a session variable, and after a refresh a new image gets picked and added to the start of the array.

The code is pretty basic, if you have subfolders you'd have to customize it:

PHP:

<?php
//Start Session
session_start();


function GetRandomImagesFromDir( $image_dir ) {
//Create image array
$images = glob($image_dir . '*.jpg');


//Get first image
    //Get one random image from array
    $rand_key = array_rand($images, 1);

    //Same image as before?
    if ( $rand_key == $_SESSION['last_image'] ) {
        if ( $rand_key > 1 ) {
            $rand_key--;
        } else {
            $rand_key++;
        }
    }

    //Save Key to Session
    $_SESSION['last_image'] = $rand_key;

    //Save image to var
    $first_image = $images[ $rand_key ];


//Get next images
    //Remove first-image from array
    unset( $images[ $rand_key ] );

    //Shuffle
    shuffle( $images );

    //Add first image
    $images[] = $first_image;

    //Reverse array
    $images = array_reverse($images);


//Array to string
    $return_str = implode('","', $images);
    $return_str = '"'.$return_str.'"';


//Return string
return $return_str;
}
?>

JS:

<script>
    $.backstretch([<?=GetRandomImagesFromDir('backstretch_images/')?>]);
</script>