README

A Nova field for uploading File, Image and Video using Filepond.

Installation

You can install the package via composer:

composer require digital-creative/nova-filepond

Features

Single/Multiple files upload
Sortable files
Preview images, videos and audio
Enable / Disable preview
Extends the original Laravel Nova File field giving you access to all the methods/functionality of the default file upload.
Drag and drop files
Paste files directly from the clipboard
Store custom attributes (original file name, size, etc)
Prunable files (Auto delete files when the model is deleted)
Dark mode support

Usage

The field extends the original Laravel Nova File field, so you can use all the methods available in the original field.

Basic usage:

use DigitalCreative\Filepond\Filepond;

class Post extends Resource
{
    public function fields(NovaRequest $request): array
    {
        return [
            Filepond::make('Images', 'images')
                ->rules('required')
                ->prunable()
                ->disablePreview()
                ->multiple() 
                ->limit(4),
        ];
    }
}

When uploading multiple files you will need to cast the attribute to an array in your model class

class Post extends Model {
 
    protected $casts = [
        'images' => 'array'
    ];

}

You can also store original file name / size by using storeOriginalName and storeOriginalSize methods.

use DigitalCreative\Filepond\Filepond;

class Post extends Resource
{
    public function fields(NovaRequest $request): array
    {
        return [
            Filepond::make('Images', 'images')
                ->storeOriginalName('name')
                ->storeSize('size')
                ->multiple(),
            
            // or you can manually decide how to store the data
            // Note: the store method will be called for each file uploaded and the output will be stored into a single json column
            Filepond::make('Images', 'images')
                ->multiple()
                ->store(function (NovaRequest $request, Model $model, string $attribute): array {
                    return [
                        $attribute => $request->images->store('/', 's3'),
                        'name' => $request->images->getClientOriginalName(),
                        'size' => $request->images->getSize(),
                        'metadata' => '...'
                    ];
                })
        ];
    }
}

Note when using storeOriginalName and storeSize methods, you will need to add the columns to your database table if you are in "single" file mode.

⭐️ Show Your Support

Please give a ⭐️ if this project helped you!

Other Packages You Might Like

Nova Dashboard - The missing dashboard for Laravel Nova!
Nova Welcome Card - A configurable version of the Help card that comes with Nova.
Icon Action Toolbar - Replaces the default boring action menu with an inline row of icon-based actions.
Expandable Table Row - Provides an easy way to append extra data to each row of your resource tables.
Collapsible Resource Manager - Provides an easy way to order and group your resources on the sidebar.
Resource Navigation Tab - Organize your resource fields into tabs.
Resource Navigation Link - Create links to internal or external resources.
Nova Mega Filter - Display all your filters in a card instead of a tiny dropdown!
Nova Pill Filter - A Laravel Nova filter that renders into clickable pills.
Nova Slider Filter - A Laravel Nova filter for picking range between a min/max value.
Nova Range Input Filter - A Laravel Nova range input filter.
Nova FilePond - A Nova field for uploading File, Image and Video using Filepond.
Custom Relationship Field - Emulate HasMany relationship without having a real relationship set between resources.
Column Toggler - A Laravel Nova package that allows you to hide/show columns in the index view.
Batch Edit Toolbar - Allows you to update a single column of a resource all at once directly from the index page.

License

The MIT License (MIT). Please see License File for more information.

digital-creative / nova-filepond

Maintainers

Details