Latest
Introduction
User Guide
Admin Guide
Developer guide
API Reference
8.0 - Image/PDF upload changes
Naviga Writer 8.0 included breaking changes for plugins which create content object Nodes containing image or pdf files. Plugins with image drag-and-drop functionality for example could be affected.
Is my plugin affected?
Your plugin is affected if any of the following is true:
- There is a
CommandorDropHandlerin your plugin which creates BlockNodes with the types'ximimage'or'ximpdf' - There is a
CommandorDropHandlerin your plugin which calls the functionapi.editorSession.fileManager.sync - Your plugin registers a Node with custom image/pdf upload capabilities
- e.g. a custom image gallery, or other custom content object handling images
Fixing creating BlockNodes with image and pdf types
If there is no image/pdf created when your command/drophandler runs and you get an error similar to the following in the console:
Uncaught Error: Property fileNodeId is mandatory for node type ximimage
Find the place in your plugin where the method
tx.insertBlockNode is called and replace the following property, depending on the node type:ximimage Node
Replace
imageFile: <your value> with fileNodeId: <your value>. ximpdf Node
Replace
pdfFile: <your value> with fileNodeId: <your value>. Fixing api.editorSession.fileManager.sync
api.editorSession.fileManager.syncIf the image/pdf node is created but it just seems to spin and never upload correctly, and the following error is printed in the console:
fileManager.sync is deprecated, please refer to the Naviga Writer 8.0 release overview for upgrade guide and fix
It is used mainly in commands/drophandlers which create FileNodes and BlockNodes with the type
'ximimage' or 'ximpdf'.The sync method has been deprecated completely and will throw an error if called. To fix this, a new method called
fileManager.upload has been created. This method takes an array of node Ids, and if the nodes created are image or pdf types, it should be as simple as replacing the function called:1
​
2
// Creating nodes and storing the created node ids
3
​
4
setTimeout(() => {
5
api.editorSession.fileManager.sync()
6
.then(...)
7
.catch(...)
8
}, 0)
9
​
10
// Replace the sync call above with the following call to upload
11
​
12
setTimeout(() => {
13
api.editorSession.fileManager.upload([nodeId])
14
}, 0)
15
​
Copied!
Fixing Nodes with custom image/pdf capabilities
Sometimes Nodes can store its own image/pdf data and in those cases the registered Node will need to be "uploadable". This can be accomplished by using the
fileTrait imported from the writer module. If your plugin is fairly new it should already be using at least the
imageNodeTrait and imageCropTrait to add utility functions used by images. Add the
fileTrait as a parameter to withTraits function and rename the Node property defined as {type: 'file'} to fileNodeId.When the
fileManager.upload([nodeId]) function is called and the file upload completes/fails an event will be emitted on the Node. Add onFailedUpload and onUploaded functions to your Node class to handle the response.Example below.
1
import {api, withTraits, traitBundle, BlockNode} from 'writer'
2
​
3
const {imageNodeTrait, imageCropTrait, authorNodeTrait, fileTrait} = traitBundle
4
​
5
class ExampleImageNode extends withTraits(BlockNode, imageNodeTrait, imageCropTrait, fileTrait) {
6
​
7
onFailedUpload({message, status, silent}) {
8
// Do cleanup as needed
9
}
10
​
11
onUploaded(navigaDoc) {
12
// Triggers after an image has finished uploading
13
}
14
​
15
}
16
​
17
ExampleImageNode.define({
18
...
19
fileNodeId: {type: 'file'}
20
...
21
})
22
​
Copied!
​
​
​
Last modified 4mo ago