This page provides instructions on how to use the camera widget to capture images and videos.
Upload media to S3
This guide shows you how to capture and upload an image or video to Amazon S3.
Connect to Amazon S3 datasource.
Click the + icon next to the Queries/JS and choose your S3 datasource.
Select Create a new file from the Commands list.
Specify the necessary parameters, such as the Bucket Name and File Data Type. Select the
base64option from File Data Type when uploading data from the Camera widget.
In the content box, add the data you want to upload. For instance, if you want to upload an image, use:
To upload the video, use:
- Set the onImageCapture or onVideoSave event to run the query. When you capture an image or video using the Camera widget, it gets uploaded to the S3 bucket.
Properties allow you to customize the widget, connect it to other widgets and trigger events on user actions.
These properties are present in the property pane of the widget. The following table lists all the widget properties.
|Mode||Button||Toggle between Image and Video modes.|
|Visible||Boolean||Controls the visibility of the widget on the page. When set to off, the widget is not visible in published apps. It appears translucent in Edit mode.|
|Disabled||Boolean||Disables the widget, making it inactive and preventing user interaction. It remains visible on the page.|
|Mirrored||Boolean||Enables mirroring of the captured image. Only applicable to image capture mode.|
These properties can be referenced in other widgets, queries, or JS functions using the dot operator. For instance, to get the visibility status, you can use
|imageBlobURL||String||Blob URL of the image, allowing the image to be stored for future use.|
|imageDataURL||String||Data URL format of the image, enabling it to be embedded inline in various applications.|
|imageRawBinary||String||Binary file format of the image, providing a means to store the image for future use.|
|videoBlobURL||String||Blob URL of the video to store the image for future use.|
|videoDataURL||String||Data URL format of the video, allowing it to be embedded inline in different applications.|
|videoRawBinary||String||Binary file format of the image to store the image for future use.|
Style properties allow you to change the look and feel of the widget. All of these properties are present in the property pane of the widget.
|Border Radius||String||Rounds the corners of the widget's outer edge. With JS enabled, this accepts valid CSS |
|Box Shadow||String||Casts a drop shadow from the frame of the widget. With JS enabled, this accepts valid CSS |
When the event is triggered, these event handlers can run queries, JS code, or other supported actions.
|onImageSave||Specifies the action to be performed when the user saves an image.|
|onVideoSave||Specifies the action to be performed when the user saves a video.|