Can't get Admin CP Thumbnails generating/showing

[zawilliams]

Howdy!

Got ffmpeg and ffprobe installed. I actually am able to generate a thumbnail but I only see 2 generated in the @webroot/transcoder/thumbnail/ directory and I can't figure out how to trigger the generation. The 2 generated thumbnails also are not showing as thumbnails in the CP Assets section. Just a file icon that says .mp4.

So, a couple of questions:

1. Is there a consistent way to trigger thumbnail generation?
2. Can I trigger thumbnail generation for all video assets in the asset index?
3. How do I get the thumbnails to show up and replace the file icon in the Admin CP Assets section?

Thanks!

[zawilliams]

Ok, some updates here.

Discovered Table view does not generate thumbnails, but Thumbnail view does. I had the view defaulting to Table view.

I assume to build all of the thumbnails, I need to write a script to basically call up all of the videos to generate the thumbnails?

[zawilliams]

Also discovered that when you double click on the asset or go to the asset, it doesn't show the thumbnail anymore.

If I'm wrong in assuming that's how it should function, let me know @khalwat. Thanks!

[zawilliams]

Ok, more info.

When you search for something like ".mp4" - the thumbnail generation doesn't seem to be triggered (table or thumbnail view). But when you click on folders on the left hand side of the Assets (not search), it does generate thumbnails.

[khalwat]

What version of Transcoder, and what version of Craft CMS are we discussing here?

[zawilliams]

@khalwat Craft CMS 3.7.40.1 and Transcoder 1.2.22.

I'm also running ImageOptimize with AWS Serverless Image Handler and Sharp. Not sure if that would interfere.

[zawilliams]

For existing assets, since they don't seem to be consistently loading after a page refresh (first load triggering the transform and second load should show), I am attempting to just run a script that will generate the thumbnails.

If I manually generate the thumbnails with the dimensions that are being called in the admin (via the urls like /admin/actions/assets/thumb?uid=UID123&width=34&height=34&v=123456), the thumbnails seem to show up now, but I'm manually calling the getVideoThumbnailUrl() 6 times to generate the thumbnails (1x and 2x srcsets).

Not sure if there is a more efficient way of doing this. Basically running the following code for each of 500 existing video assets:

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '240',
    'height' => '240',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '120',
    'height' => '120',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '34',
    'height' => '34',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '68',
    'height' => '68',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '350',
    'height' => '190',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

Transcoder::$plugin->transcode->getVideoThumbnailUrl($this->path, [
    'fileSuffix' => '.jpg',
    'timeInSecs' => 2,
    'width' => '700',
    'height' => '380',
    'sharpen' => true,
    'aspectRatio' => 'letterbox',
    'letterboxColor' => '',
]);

[zawilliams]

Another interesting thing is that once I create the 6 sizes of the thumbnails, some of the thumbnails seem to show up but others don't until I try to hit the thumb URL again (e.g. /admin/actions/assets/thumb?uid=UID123&width=34&height=34&v=123456). It's like they need to be cache busted or something so they pull in the file that now exists vs the file icon.

Does that sound right? Is there any revving or cache busting that needs to occur in order for Craft to know there are now thumbnail files that exist an asset? I assume the v=123456 has something to do with timestamp versioning.

[zawilliams]

Also wanted to specify that even though I've generated the thumbnail, once I hit the /admin/actions/assets/thumb URL directly, it does not generate a new thumbnail, it just first shows the file icon upon first load, then upon refreshing, shows the thumbnail that I generated using the Transcoder::$plugin->transcode->getVideoThumbnailUrl() method.

After that the thumbnail will show in the Assets for the video that isn't showing a thumbnail. Again, it doesn't seem to be very consistent. Upon generating all of the thumbnails, a majority seem to now have thumbnails but a portion of them don't show the thumbnails.

[zawilliams]

@khalwat any thoughts here that you might be able to share or direct me in the right direction with?

[zawilliams]

I think the main thing now is just figuring out how the cache busting works so I can make sure I don't have to hit the individual URLs to make them refresh the image.

[khalwat]

I'm also running ImageOptimize with AWS Serverless Image Handler and Sharp. Not sure if that would interfere.

Are you able to temporarily set ImageOptimize to use regular old Craft transforms temporarily, to see if that is interfering at all here?

[zawilliams]

@khalwat sorry for the delay. Had to switch to other client todos.

Ok, so I temporarily set ImageOptimize to use Craft transforms.

With Craft transforms set, it seems to work as expected.

Here's the process I went through:

1. Load Assets page which has 9 videos on it and a bunch of photos
2. Only videos in view will trigger the thumbnail generation for video
3. Three .mp4 files are visible
4. Three .mp4 thumbnails are generated
5. Refresh page
6. Three .mp4 files now have thumbnails
7. Double click on one of the videos with a thumbnail to show slide out preview
8. The preview thumbnail is generated
9. Click out of the preview slide out
10. Double click on the the same previous video to open the slide out preview
11. Video now has generated thumbnail showing in the preview section

When going through the same process with Sharp transforms set and using AWS Serverless Image Handler with the CloudFront URL, I have to do a hard refresh for the Asset thumbnails to show up in step 5, instead of a regular refresh. I cannot, however, get the preview thumbnail in the slide over preview to show or generate (steps 7 through 11) unless I right click on the preview thumbnail file icon, and then click "Open image in new tab" and refresh, close the tab and then refresh the Assets page and then repeat steps 7 through 11.

So it does seem that setting ImageOptimize to Sharp does interfere in some way - it's like it keeps things cached and you have to force it in some way to either generate thumbnails, or if thumbnails are generated, you have to force the browser cache to refresh the thumbnail.

[zawilliams]

@khalwat is there a way to force Craft to bust the cache and generate the thumbnail?

[khalwat]

If the generated thumbnail exists on disk, Craft won't recreate it. So you'd need to delete the transformed images on disk.

[zawilliams]

Got it. I deleted the transformed images on disk in order to test everything, so I think we're good there. I suppose the issue is that ImageOptimize using Sharp somehow is causing the issue.

[zawilliams]

@khalwat wanted to clarify that there is an issue here with ImageOptimize interfering when set to Sharp and not Craft. i.e. needing to force the generation as I mentioned in the process above. Anything else I can do to help get this bug worked out? I have looked through the code but I am at a loss for where the problem stems. I will take a look again within the week.

[khalwat]

Do me a favor, give this a whirl: https://github.com/nystudio107/craft-imageoptimize/issues/349#issuecomment-1176589874

It may fix it for you.

[zawilliams]

@khalwat just tried it - this does seem to fix it!

[zawilliams]

This is fixed with the update you mentioned, so going to close. Thanks!