Gallery with custom column for Editor.js.
Inspired from mr8bit/carousel-editorjs
- Uploading file from the device
- Preload image
- Change the image position
- Toggle the gallery style ([
standard,carousel,masonry] are included) - Column settings
- Remove Image From Server
npm i @vtchinh/gallery-editorjs
- Upload folder
distfrom repository - Add
dist/bundle.jsfile to your page.
Add a new Tool to the tools property of the Editor.js initial config.
import Carousel from 'Carousel';
// or if you inject ImageTool via standalone script
const Carousel = window.Carousel;
var editor = EditorJS({
...
tools: {
...
carousel: {
class: Carousel,
config: {
endpoints: {
byFile: "URL_FETCH",
removeImage: "URL_FETCH", //default null
},
additionalRequestHeaders: {
'authorization': 'Bearer eyJhbGciJ9...TJVA95OrM7h7HgQ',
// ...
},
field: 'image',
types: 'image/*',
additionalRequestData: { // for custom data
name: 'your custom data name',
order_data: 'your order custom data',
},
galleryCallback: 'your_prefer_callback_data' // object return is required
}
},
}
...
});
function your_prefer_callback_data() {
return {'key': 'value'};
}For removeImage configuration, all you need is providing a request for POST['image'] key.
Don't forget to put csrf-token meta as something like <meta name="csrf-token" content="{{ csrf_token }}"> to your <head>
All notable changes to this project will be documented in this file.
- Add some styles for fixing the image size.
Now we can have more custom data on upload.
- Upload data callback
Provide the ability to remove the image from Server.
- Added some note for the
csrf-token
Provide the ability to remove the image from Server.
- API to remove image from server.
We have changed the preloader.
- Image Preloader for example.
We have fixed some bugs when saving the caption.
- Bug on saving captions.
Change the way to catch caption HTML structure.
- Refactor captions.
We have fixed some bugs when saving the caption.
- Bug on saving captions
We have tested and fixed so many times from version 1.0.0
- Released.