Getting thumbnail count

I need to find out the count() of thumbnails for each project and echo in it data-thumbnails="" - as you can see in the code below. The problem is that the thumbnail logic comes after where I need to echo it, I guess the solution would be to move the logic to a controller but I can’t figure out how the foreach loop translates into the controller to
set the $thumbnail variable. Any pointers would be greatly appreciated.

template

<div id="projects-cnt">
   <?php foreach($projects as $project): ?>
   <div class="project" data-project="<?= $project->uid() ?>" data-thumbnails="<?=  // number of thumbnails ?>">
       <?php foreach($project->thumbnails()->yaml() as $thumbnail): ?>   
            <?php if($thumbnail = $project->image($thumbnail)): ?>
                 <?= $thumbnail->imageset([
                    '160-1280,6', 
                    'sizes' => '(min-width: 640px) 100vw, 50vw'
                 ], [
                    'class'      => 'project-thumbnail',
                    'placeholder' => 'color',
                 ])->html() ?>  	    
            <?php endif ?>
       <?php endforeach; ?>
   </div>
   <?php endforeach; ?>
</div>

controller

<?php

return function($site, $pages, $page) {
    $projects = page('projects')->children()->visible();

    return compact('projects');
};

Something like this should work:

<div id="projects-cnt">
  <?php foreach($projects as $project): ?>
  <?php 
  $thumbnails = $project->thumbnails()->yaml(); // you could just count these thumbnails, but it wouldn't be precise in case an image was deleted
  $files = new Files($page);
  foreach($thumbsnails as $thumbnail) {
    if($image = $project->image($thumbnail)) {
      $files->add($image);
   }
  }
$count = $files->count();
?>
   <div class="project" data-project="<?= $project->uid() ?>" data-thumbnails="<?=  $count ?>">
       <?php foreach($files as $thumbnail): ?>   
         
                 <?= $thumbnail->imageset([
                    '160-1280,6', 
                    'sizes' => '(min-width: 640px) 100vw, 50vw'
                 ], [
                    'class'      => 'project-thumbnail',
                    'placeholder' => 'color',
                 ])->html() ?>  	    

       <?php endforeach; ?>
   </div>
   <?php endforeach; ?>
</div>

Thanks for the swift reply! I tried this, correcting the typo but none of the images output and the count is at 0.

<div id="projects-cnt">
    <?php foreach($projects as $project): ?>
    <?php 
        $thumbnails = $project->thumbnails()->yaml(); 
        $files = new Files($page);
        foreach($thumbnails as $thumbnail) {
            if($image = $project->image($thumbnail)) {
                $files->add($image);
            }
        }
        $count = $files->count();
    ?>
    <div class="project" data-project="<?= $project->uid() ?>" data-thumbnails="<?=  $count ?>">
        <?php foreach($files as $thumbnail): ?>   
            <?= $thumbnail->imageset([
                '160-1280,6', 
                'sizes' => '(min-width: 640px) 100vw, 50vw'
            ], [
                'class'      => 'project-thumbnail',
                'placeholder' => 'color',
            ])->html() ?>  	    
        <?php endforeach; ?>
    </div>
    <?php endforeach; ?>
</div>

Sorry, this line should probably be

$files = new Files($project);

I did try that and got the error ‘Unsupported image format’. Not really sure how to debug it.

Weird, I tested this and works for me…

But what sort of images are you using? What line of your code throws the error? Looks like the error is thrown in the imageset plugin

I’m using .jpgs with the kirby-images and imageset plugins. I’m not sure how to determine which line it is on but this is a screenshot of the debugger.

And the error didn’t happen with your original code?

It didn’t, the images were fine before

Then lets try with a simple array instead of the files object:

// foreach loop
  $files = [];
  $thumbnails = $project->thumbnails()->yaml();

  foreach($thumbnails as $thumbnail):
    if($image = $project->image($thumbnail)) {
      $files[] = $image;
    }
  endforeach;
  
  $count = count($files);
  
  foreach($files as $thumbnail): ?>
  // rest of your code
1 Like

Thanks @texnixe that works great