Tim Marshall
Tim Marshall

Reputation: 360

While loop inside of while loop

I'm running a while loop to display all images under a path;

<?php
    $files = glob("../Desktop/IMG/BananzaNews/Thumbs/*.*");
    for ($i=0; $i<count($files); $i++)
    {
        $root = "http://www.rafflebananza.com/";
        $imagePath = $files[$i];
        $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $imagePath);
        $imageName = str_replace("../Desktop/IMG/BananzaNews/Thumbs/", "", $withoutExt);
        echo '<div class="UploadedImgs">
                <div class="ImgName">'.$imageName.'</div>
                <div class="IMG">
                    <img src="'.$root.$imagePath.'" alt="Random image" />
                </div>
            </div>';
    }
?>

What I'd like to now happen is a maximum of 8 images to show and add a button at the bottom going from 1 to X, wrapping each 8 in a div I'll set to be hidden and set the links at the bottom as the tab switchers.

How do I run an additional while loop passing vars back and forth?

Almost there!

<?php
    $files = glob("../Desktop/IMG/BananzaNews/Thumbs/*.*");
    echo '<div class="Wrapper">'; //First tab
    $t = 0;
    for ($i=0; $i<count($files); $i++)
    {
        $root = "http://www.rafflebananza.com/";
        $imagePath = $files[$i];
        $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $imagePath);
        $imageName = str_replace("../Desktop/IMG/BananzaNews/Thumbs/", "", $withoutExt);

        if( $i % 8 == 0 ) {
            $t = $t + 1;
            echo '<div id="Tab_'.$t.'" class="Tabs"><h1>Tab_'.$t.'</h1>'; //hidden class
        }

        echo '<div class="UploadedImgs">
                <div class="ImgName">'.$imageName.'</div>
                <div class="IMG">
                    <img src="'.$root.$imagePath.'" alt="'.$imageName.'" />
                </div>
            </div>';

        if( $i > 0 && $i % 7 == 0 ) {
            echo '</div>';
        }
        if( $i % 8 == 0 ) {
            echo '<a href="'.$t.'" class="tab-switcher">'.$t.'</a>';
        }
    }

    echo '</div>'; //closes last div
?>

The CSS

.Wrapper .Tabs:nth-child(n+2) {
    display:none;
}

Upvotes: 0

Views: 107

Answers (1)

Skatox
Skatox

Reputation: 4284

You can resolve it with mod operator: %, if a number is divisible by 8, then you have 8 images. So you can do it like this:

<?php
    $files = glob("../Desktop/IMG/BananzaNews/Thumbs/*.*");

    echo '<div class="UploadedImgs">'; //First tab
    for ($i=0; $i<count($files); $i++)
    {
        $root = "http://www.rafflebananza.com/";
        $imagePath = $files[$i];
        $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $imagePath);
        $imageName = str_replace("../Desktop/IMG/BananzaNews/Thumbs/", "", $withoutExt);

        if( $i % 8 == 0 )
            echo '</div><div class="UploadedImgs hidden">'; //hidden class

        echo '<div class="ImgName">'.$imageName.'</div>
                <div class="IMG">
                    <img src="'.$root.$imagePath.'" alt="Random image" />
                </div>
            </div>';

        if($i % 8 == 0)
            echo '<a href="#" class="tab-switcher">Change tab</a>'; //link to change tab
    }

    echo '</div>'; //closes last div
?>

Upvotes: 2

Related Questions