# Camera

* [Bubble.io Plugin](#bubble.io-plugin)
* [JavaScript SDK](#javascript-sdk)

### 🧋 Bubble.io Plugin

#### \[Element] Natively - Camera

#### Events:

* **Camera Result Updated** - get called after
* **File Uploaded** - get called after the file was successfully uploaded on S3 (You can find a file URL in element's state)
* **File Size over limit** - Triggered when file size is more then File Size Limit param

#### States:

* **Camera Result (Base64)** - Base64 string representation of a file, can be used for custom uploading
* **Camera Result (Content Type)** - image/png, image/jpeg or video/mp4
* **Uploaded File URL** - Amazon S3 file URL
* **File Size** - size of latest camera result file in KB

#### Actions:

* **Show Camera**
  * **Content Type** - Photo or Video
  * **Quality** - Low, Medium, or High
  * **Upload File** - checkbox (Upload file to Amazon S3)
  * **File Name** - will be used if **Upload File** is checked
  * **Camera Type** - FRONT / BACK
  * **File Size Limit** - (in KB) prevent uploading big files to Bubble's amazon S3

### 🛠 JavaScript SDK

#### NativelyCamera

{% code overflow="wrap" lineNumbers="true" %}

```javascript
const camera = new NativelyCamera()
const open_camera_callback = function (resp) {
    console.log(resp.base64); // base64 string of media file
    console.log(resp.content_type); // "image/png"
    console.log(resp.size); // "1024" <- file size in KB
};
const type = "photo" // "photo"/"video"
const quality = "high" // "high"/"medium"/"low"
const cameraType = "FRONT" // "FRONT"/"BACK"
camera.showCamera(type, quality, cameraType, open_camera_callback);
```

{% endcode %}