mirror of
https://github.com/getgrav/grav-plugin-admin.git
synced 2026-09-11 00:58:23 +02:00
8a39b36603
# What this PR introduces
This PR introduces a `filepicker` field which is a replacement for the `pagemediaselect` field.
This field loads the files list via AJAX each time it's triggered. This means you can now upload a file via FTP or via Admin and the new file is immediately available to be selected.
Previously, `pagemediaselect` required a page reload to see the newly added files.
--
### Options
#### `accept`
`accept` allows file extensions. For example, to only allow `yaml` and `json` files:
```yaml
accept:
- .yaml
- .json
```
By default, any file is listed.
#### `folder`
```yaml
folder: 'user/plugins/testing`
```
folder has been enhanced to allow `self@` as well as `page@:` and `theme@:` prefixes.
Example of usage, assuming we have a blog item at the route `/blog/ajax-upload` (physical location being `user/pages/02.blog/ajax-upload`), with the `page@:` prefix the folder would be:
```yaml
folder: 'page@:/blog/ajax-upload'
```
#### `preview_images`
```yaml
preview_images: true
```
If enabled, shows a preview for the images file types
> ### NOTE: `self@` is not allowed outside of the Pages scope, an error will be thrown.
## Example usage
```
header.a_file:
type: filepicker
folder: 'user/plugins/admin'
label: Select a file
```
45 lines
1.4 KiB
JavaScript
45 lines
1.4 KiB
JavaScript
import FilepickerField, { Instance as FilepickerFieldInstance } from './filepicker';
|
|
import SelectizeField, { Instance as SelectizeFieldInstance } from './selectize';
|
|
import ArrayField, { Instance as ArrayFieldInstance } from './array';
|
|
import CollectionsField, { Instance as CollectionsFieldInstance } from './collections';
|
|
import DateTimeField, { Instance as DateTimeFieldInstance } from './datetime';
|
|
import EditorField, { Instance as EditorFieldInstance } from './editor';
|
|
import ColorpickerField, { Instance as ColorpickerFieldInstance } from './colorpicker';
|
|
import FilesField, { Instance as FilesFieldInstance } from './files';
|
|
|
|
export default {
|
|
FilepickerField: {
|
|
FilepickerField,
|
|
Instance: FilepickerFieldInstance
|
|
},
|
|
SelectizeField: {
|
|
SelectizeField,
|
|
Instance: SelectizeFieldInstance
|
|
},
|
|
ArrayField: {
|
|
ArrayField,
|
|
Instance: ArrayFieldInstance
|
|
},
|
|
CollectionsField: {
|
|
CollectionsField,
|
|
Instance: CollectionsFieldInstance
|
|
},
|
|
DateTimeField: {
|
|
DateTimeField,
|
|
Instance: DateTimeFieldInstance
|
|
},
|
|
EditorField: {
|
|
EditorField,
|
|
Instance: EditorFieldInstance
|
|
},
|
|
ColorpickerField: {
|
|
ColorpickerField,
|
|
Instance: ColorpickerFieldInstance
|
|
},
|
|
FilesField: {
|
|
FilesField,
|
|
Instance: FilesFieldInstance
|
|
}
|
|
};
|
|
|