CameraTag's Photo Booth

This library allows you to embed a CameraTag <photobooth> in your product.

Initialize A Booth

'Magically' initialize your booth using HTML

<photobooth
  id='myFirstBooth'
  data-app-id='a-6793d070-dbac-013b-f57a-529b7d4fe95c'>
</photobooth>

<script>
  CameraTagPhotobooth.setup(); // Scan DOM for new <photobooth> tags 
  // if you need to access the newly initialized &lt:photobooth> 
  // you can get a handle with.
  myBooth = CameraTagPhotobooth.instances["myFistBooth"];
</script>

Manually initialize your booth using JS

<div id="load_booth_here"></div>
<script>
  CameraTagPhotobooth = require("@cameratag/photobooth");
  var el = document.getElementById("load_booth_here");
  var myBooth = new CameraTagPhotobooth();
  myBooth.init(el {
    id: 'myFirstBooth'
    appUuid: 'a-6793d070-dbac-013b-f57a-529b7d4fe95c', 
  })
<script>

Control The Booth

You can control your <photobooth> with methods from our JS API

After you get a handle on a <photobooth> you can call methods on it like so:

myBooth.takePicture();

Observe The Booth

You can also observe events fired by the <photobooth> and trigger your own code. View our our docs to see the full list of events fired from the <photobooth>

myBooth.ovbserve("photoTaken", function(){
  console.log("Great pic!")
});