Prerequisites

Before using this action, ensure that your Cloudinary account is properly configured and that you have the required upload settings available:

• A Cloudinary account
• The Cloudinary cloud name
• An unsigned upload preset created in Cloudinary
• The name of the unsigned upload preset

Uploading Files

UploadImage_UnsignedPreset uploads image binary data directly to Cloudinary using an unsigned upload preset.

Inputs

• CloudName: Cloudinary cloud name
• PresetName: Unsigned upload preset name
• Image: Image binary content
• FileType: MIME type of the image
• MetadataAttributes: Optional metadata key/value list
• ProgressHandler: Optional progress callback
• FileName: File name override sent to Cloudinary

Outputs

• SecureURL: Secure URL of the uploaded image
• ErrorMessage: Error message when upload fails

Notes

• Requires a valid unsigned Cloudinary preset
• Supports optional metadata
• Can report upload progress to the UI
• Returns an empty ErrorMessage on success

Setting up a progress bar

UploadImage_UnsignedPreset accepts an optional object input parameter that can be used to report upload progress.

To show that progress in your screen or block, follow these steps:

1. Create a local variable to store the progress
   • Add an Integer screen or block variable, for example ProgressValue.
   • This variable will hold the current upload percentage.
2. Create an action to update the progress
   • Add an action such as UpdateProgress.
   • Give it one Integer input parameter, for example NewValue.
   • In the action, assign NewValue to ProgressValue.
3. Create an object variable to store the handler
   • Add a screen or block variable of type Object.
   • This variable will store the action reference that is passed to the upload action.
4. Create the handler object in OnInitialize
   • In the OnInitialize action, add a JavaScript node with one output parameter of type Object.
   • Use this code: $parameters.HandlerObject = $actions.UpdateProgress;
   • HandlerObject is the JavaScript node output parameter.
   • UpdateProgress is the action created in step 2.

These names are examples only. You can use different names in your implementation.

5. Store the handler object in the local object variable
   • Still in OnInitialize, assign the JavaScript node output to the Object variable created in step 3.
6. Bind your progress widget to the progress variable
   • Bind your progress bar or progress indicator to ProgressValue.
   • This allows the UI to update as the upload progresses.
7. Pass the handler object to the upload action
   • When calling UploadImage_UnsignedPreset, pass the object variable to the ProgressHandler input parameter.