CameraTag
Last updated April 15, 2021
Table of Contents
CameraTag is an add-on for adding video recording, transcoding and streaming (playback) to your Heroku application.
CameraTag is a client side JS library that allows you to embed <camera> tags and <video> tags to your site for dead simple video collection and playback.
Provisioning the add-on
CameraTag can be attached to a Heroku application via the CLI:
A list of all plans available can be found here.
$ heroku addons:create cameratag
-----> Adding cameratag to sharp-mountain-4005... done, v18 (free)
Once CameraTag has been added a CAMERATAG_APPLICATION_UUID setting will be available in the app configuration and will contain the UUID of a default CameraTag Application we created for you. This can be confirmed using the heroku config:get command.
$ heroku config:get CAMERATAG_APPLICATION_UUID
a-12345-678910-111213-141516
After installing CameraTag the application should be configured to fully integrate with the add-on.
Getting started (recording and uploading)
Once you have the CameraTag add-on provisioned and you’ve gotten a CameraTag Application UUID you are ready to embed your first <camera> and start collecting videos. There are two steps to embedding your first <camera>
Step 1
Add the following code to the <head> section of your HTML
<script src='//cameratag.com/v14/js/cameratag.js' type='text/javascript'></script>
<link rel='stylesheet' href='//cameratag.com/static/14/cameratag.css'>
Step 2
Add the following code wherever you would like your <camera> interface to appear.
<camera id='UNIQUE_ID_FOR_THIS_CAMERA' data-app-id='CAMERATAG_APPLICATION_UUID'></camera>
Don’t forget to replace UNIQUE_ID_FOR_THIS_CAMERA and CAMERATAG_APPLICATION_UUID in the above code (UNIQUE_ID_FOR_THIS_CAMERA can be any unique identifier of your choosing for that specific tag on the page)
Getting started (playback)
Once you have published (recorded or uploaded) a few videos you may want to embed them in your site. Luckily, CameraTag comes with an easy-to-use video player. The first thing you will need is the UUID of one (or more) of your videos. You can get this manually from the CameraTag Dashboard or programmatically using either an HTML form, our JS API or REST API.
You can learn more about getting video UUIDs programmatically here
There are two steps to embedding your first <video> player.
Step 1
Make sure the following code to the <head> section of your HTML:
<script src='//cameratag.com/v14/js/cameratag.js' type='text/javascript'></script>
<link rel='stylesheet' href='//cameratag.com/static/14/cameratag.css'>
Step 2
Add the following code wherever you would like your <video> player to appear:
<video id='UNIQUE_ID_FOR_THIS_PLAYER' data-video-id='YOUR_VIDEO_UUID'></camera>
Don’t forget to replace UNIQUE_ID_FOR_THIS_PLAYER and YOUR_VIDEO_UUID in the code above.
Dashboard
The CameraTag dashboard allows you to manage all your published (recorded / uploaded) videos, as well as change application settings like video output formats and processing settings (adding watermarks, adjusting image and audio etc).
The dashboard can be accessed via the CLI:
$ heroku addons:open cameratag
Opening cameratag for sharp-mountain-4005
or by visiting the Heroku Dashboard and selecting the application in question. Select CameraTag from the Add-ons menu.
Troubleshooting
If you run into any difficulties getting your <camera> set up please consult our docs. Answers to many of the most common questions can be found online. If you need additional assistance please do not hesitate to contact us at help@cameratag.com.
Migrating between plans
Use the heroku addons:upgrade command to migrate to a new plan.
$ heroku addons:upgrade cameratag:pro
-----> Upgrading cameratag:pro to sharp-mountain-4005... done, v18 ($49/mo)
Your plan has been updated to: cameratag:pro
Removing the add-on
CameraTag can be removed via the CLI.
This will destroy all associated data and cannot be undone!
$ heroku addons:destroy cameratag
-----> Removing cameratag from sharp-mountain-4005... done, v20 (free)
Before removing CameraTag, you can export your video data by using our REST API.
Support
All CameraTag support and runtime issues should be submitted via one of the Heroku Support channels. Any non-support related issues or product feedback is welcome online or via phone: contact us.