featured image thumbnails

[MicahDavid]

I'm sure this has been thought of, but has there been any interest in creating thumbnail images of the Featured Image to use for the Post Lists and Featured Post Lists to help with page load efficiency?

[austintoddj]

Haven't put any thought into that particular item. If you wanted to try it out and submit a PR for it, I'd be more than happy to review it!

[MicahDavid]

I was working on this, and got it half baked, but I wasn't able to quite figure out how to work with the File Pond plugin to send along meta data to tell it yes or no on creating a thumbnail.

My goal is to set up a max image size for any image uploads, and then also create a thumbnail with a max thumbnail size for featured images.

I created 2 new configs locally:

    'max_file_width' => env('CANVAS_MAX_FILE_WIDTH', 2000),

    'max_thumbnail_width' => env('CANVAS_MAX_THUMBNAIL_WIDTH', 600),

Added the methods for the new configs in Canvas.php:

    /**
     * Return the configured base path url.
     *
     * @return string
     */
    public static function maxFileWidth(): string
    {
        return sprintf('%s', config('canvas.max_file_width'));
    }

    /**
     * Return the configured base path url.
     *
     * @return string
     */
    public static function maxThumbnailWidth(): string
    {
        return sprintf('%s', config('canvas.max_thumbnail_width'));
    }

I installed the Intervention\Image library to use the Image class to easily resize. And, in the UploadsController I modified the store method to the following:

public function store()
    {
        $payload = request()->file();

        if (! $payload) {
            return response()->json(null, 400);
        }

        // Only grab the first element because single file uploads
        // are not supported at this time
        $file = reset($payload);

        $file_size = getimagesize($file->path());

        $image = Image::make($file->path());
        if ($file_size[0] > Canvas::maxFileWidth()) {
            $image->resize(Canvas::maxFileWidth(), null, function ($constraint) {
                $constraint->aspectRatio();
            });
        }
        $root_filename = date('mdYHis') . uniqid();

        $image_filename = $root_filename . '.' . $file->extension();
        $saved_image = base_path() .'/'. Canvas::baseStoragePath().'/'.$image_filename;
        $image->save($saved_image);
        
        if (request()->thumbnail) {
            $thumbnail = Image::make($file->path());
            if ($file_size[0] > Canvas::maxThumbnailWidth()) {
                $thumbnail->resize(Canvas::maxThumbnailWidth(), null, function ($constraint) {
                    $constraint->aspectRatio();
                });
            }

            $thumbnail_filename = $root_filename . '_thumb.' . $file->extension();
            $saved_image = base_path() . '/' . Canvas::baseStoragePath() . '/' . $thumbnail_filename;
            $thumbnail->save($saved_image);
        }

        return '/storage/canvas/images/'.$image_filename;
    }

I had a little trouble working with the directories, that is why you see the manually added directory at the end.

Also, ideally, there would be a thumbnail field in the canvas_posts table, but again, I couldn't figure out how to play with File Pond.

I couldn't really get it fully cooked, but if you'd like to take a look at it I can send a pull request. But, all code changes are listed above.

[austintoddj]

Thanks for doing that @MicahDavid. I'll see if I can play with this and I'll let you know what changes I'd make.