Fileupload resize doesn't seem to work, what am I missing?

The field on the resource is configured as follows:

Forms\Components\FileUpload::make('image')
    ->image()
    ->imageResizeMode('contain')
    ->imageCropAspectRatio('4:3')
    ->imageResizeTargetWidth(400)
    ->imageResizeTargetWidth(300)

Forms\Components\FileUpload::make('image')
    ->image()
    ->imageResizeMode('contain')
    ->imageCropAspectRatio('4:3')
    ->imageResizeTargetWidth(400)
    ->imageResizeTargetWidth(300)

With the above settings, cropping definitely works, as the preview saved image has the define dimensions and aspect ratio. But if the uploaded file has an aspect ratio that is not 4:3, then the image is simply cropped before resize. eg. before and after images here: https://imgur.com/a/KeztyX0

Imgur

Filepond upload issue.

1 Reply

rominronin•8mo ago

Bump Just some additonal information: the 'contain', 'cover' and 'force' modes all do the same thing in my application. I have followed the cache/rebuild steps in the 'READ BEFORE POSTING' guide. As far as I understood it, Filepond is already included in the filament/filament, so I don't need to add any additional npm plugins or composer libraries. I've followed the instructions, added filepond and the image resize plugin to app.js, imported it. I'm not quite sure how to make progress here, any ideas?

import * as FilePond from "filepond";
import 'filepond/dist/filepond.min.css'
import FilePondPluginImageResize from 'filepond-plugin-image-resize';

Alpine.plugin(FilePond)
Alpine.plugin(FilePondPluginImageResize)

import * as FilePond from "filepond";
import 'filepond/dist/filepond.min.css'
import FilePondPluginImageResize from 'filepond-plugin-image-resize';

Alpine.plugin(FilePond)
Alpine.plugin(FilePondPluginImageResize)

The thing is, the above doesn't have any impact on the display or the functionality of the fileupload input. javascript and npm is not my strongest point, but I struggle to see anything obvious that I'm doing wrong, particularly as far as the documentation is concerned.

Gaming

Programming

Fileupload resize doesn't seem to work, what am I missing?