File upload & handling
  • 16 Sep 2024
  • 1 Minute to read
  • Contributors
  • Dark
    Light

File upload & handling

  • Dark
    Light

Article summary

General

Files that are uploaded into a Configuration are so called Configuration Files.
They can either be uploaded by the end-user via SigSlos or with Custom Code.
Afterwards they are permanently linked to the current configuration and can be accessed via Hive or viewed in the Configuration Insights.

SigSlo - End-user upload

Uploading a file is very easy to achieve:
image.png

  1. Select any Signal. E.g. Clicked of a Button
  2. As slot choose Configurator which is the top-most element of the controls
  3. Select one of the Upload slots
    • Upload image: Only images are allowed. Unsupported formats will not be uploaded
    • Upload file: Any file can be uploaded
  4. Enter a unique name for your file
  5. [Optional] Enter a Download name, which will be the filename when the user downloads it

Afterwards you can test it right away in the Preview of your configurator.

  1. Upload an image with the button
  2. Open the watches on the right
  3. Enter Configuration.getImage("myImage")
    • myImage has to be name you entered in the SigSlo parameters
  4. Afterwards you should see an JSON object below with the Url and some metadata (width, height, etc.)

Usage in Hive

Hive provides two functions to retrieve the uploaded file:

  • configuration.getImage("myImage")
  • configuration.getFile("myFile")

If there isn't an uploaded file yet (or the name is invalid) the value will be Empty. Therefore it's required to do an empty check before accessing properties like the url.

var myImage = configuration.getFile("myImage");
if myImage is empty then
  "url empty"
else
  myImage.url
end

Custom Code

Custom code allows you to upload programmatically created files like screenshots from a 2D or 3D preview, datasheets or similar.
The available functions can be found under the namespace CfgnFiles.
All functions can be awaited and will directly return the url of the uploaded file.
Besides that, they are also available in Hive like explained in the previous chapters.

Example - Upload screenshot

const uploadResult = await CfgnFiles.uploadImages({
    screenshotTopView: { file: myScreenshotFile, displayName: 'top-view-2024-09-16' },
  });

  if (uploadResult.success) {
    console.log(uploadResult.urls.screenshotTopView);
  }

Example - Upload dummy file

await CfgnFiles.uploadFiles({
    fileText: {
      file: new File(['Lorem ipsum'], 'dummy.txt'),
    },
  });

Configuration Insights

Note

Insights are only available for published or staged configurators.
Configurations of a preview can't be found under Configuration Insights.

All the uploaded files of a configuration are permanently stored and can be viewed in the Configuration Insights afterwards.
To view them, simply open the Configuration details of a Configuration and expand the Files section.
image.png


Was this article helpful?

What's Next