0

I'm trying to display a grid of 9 tiles that display client logos these change randomly to show other client logos in the array (there are 72 client logos). However, I don't want the same logo to ever show twice in the grid of nine. I have tried a thousand different ways to do this but I always end up seeing duplicated logos in the grid.

Can anyone suggest a solution?

This is my code.

` <?php
    $clients = $_w->page->get_field('clients');

    // Shuffle the clients array randomly
    shuffle($clients);
?>

<?php if ($clients): ?>
    <section class="image-grid-container">
        <script id="hd_client_gallery" type="text/json">
            [<?php 
            $total = count($clients);    
            $count = 0;
            foreach ($clients as $c): 
                echo "{";
                    echo '"url": "' . $c->image->url . '",';
                    echo '"href": "' . $c->link. '"';
                echo "}";
                if(++$count !== $total) {
                    echo ", ";
                }
            endforeach;
        ?>]          
    </script>
    <?php 
        $imageCounter = 0; 
        $usedImages = array();
    ?>
    <ul class="object image-grid gallery">
        <?php 
            // Loop through the $clients array until all logos have been displayed
            while ($imageCounter < 9 && count($usedImages) < count($clients)):
                // Get a random client from the $clients array
                $c = $clients[array_rand($clients)];

                // Skip this client if its logo has already been displayed
                if (in_array($c->image->url, $usedImages)) {
                    continue;
                }

                // Display the logo and mark it as used
                $usedImages[] = $c->image->url;
                $imageCounter++; 
        ?>
            <li>
                <a <?= ($c->link ? 'href="'.$c->link.'"' : '' ); ?>>                    
                    <img class="img-fluid" src="<?= $c->image->url; ?>" />
                    <img style="display:none;" class="img-fluid" src="" />
                </a>
            </li>
        <?php endwhile; ?>
    </ul>
        <?php 
        // Reset the $usedImages array and shuffle the $clients array again
        $usedImages = array();
        shuffle($clients);
        ?>
    </section>
<?php endif; ?>`
Mediaweeze
  • 1
  • 1
  • You have 72 clients. Number each logo 0 to 71. Randomly select one number and add it to an array. Then loop to add more random numbers to the array, checking if the number is already in there. If yes, ignore it. When your array has 9 unique numbers, use these indexes to select the 9 logos you will display. So you need to check how to add unique numbers into an array. And loop on the array once full. – Nic3500 Apr 28 '23 at 08:29
  • 2
    We need to see `$clients` as part of your [mcve]. Do you have duplicates in your `$clients` array? If so, filter them first. If you are `shuffle()`ing at the start then all you need to do is `array_slice()` the first 9 entries, then chunk them into rows of 3, right? You definitely, definitely should NOT be manually crafting a json string via concatenation -- a recipe for headaches / code breakage. – mickmackusa Apr 28 '23 at 08:29
  • Wait that's almost already what you do. What does debug give you? Add a bunch of prints to show your indexes and arrays to figure out what is going on... – Nic3500 Apr 28 '23 at 08:30
  • Just get 9 (or whatever number you want) random UNIQUE indexes from 0 to 71, then display the images: https://stackoverflow.com/questions/10824770/generate-array-of-random-unique-numbers-in-php – mitkosoft Apr 28 '23 at 08:47
  • 1
    `echo json_encode(array_map(fn($obj) => ['url' => $obj->image->url, 'href' => $obj->link], $clients));` will at least get that upper part cleaned up. I am still trying to figure out the rest of it. – mickmackusa Apr 28 '23 at 08:48

0 Answers0