title: Adding a watermark to a canvas that already has an image - HTML5, Canvas
body: <p>I have a camera video feed and a canvas.</p>
  
  <p>The canvas takes the image of the feed when user clicks Submit</p>
  
  <pre><code>     &lt;video id="video" width="300" height="200" autoplay&gt;&lt;/video&gt;
       &lt;/section&gt;
        &lt;section class="btn"&gt;
        &lt;button id="btnClick"&gt;Submit&lt;/button&gt;&lt;br&gt;
        &lt;/section&gt;
  
       &lt;section&gt;
        &lt;canvas id="canvas" width="300" height="300"&gt;
        &lt;/section&gt;
  </code></pre>
  
  <p>After user has clicked Submit, he can click Share to upload the picture.</p>
  
  <pre><code>        &lt;input type="button" onclick="uploadEx()" value="Share" /&gt;
  
          &lt;form method="post" accept-charset="utf-8" name="form1"&gt;
          &lt;input name="hidden_data" id='hidden_data' type="hidden"/&gt;
           &lt;/form&gt;
  </code></pre>
  
  <p>I want to be able to overlay another png on top of the image prior to user Submitting the 1st snap by clicking on share button.</p>
  
  <p>JS for uploading pic:</p>
  
  <pre><code>           function uploadEx() {
              var canvas = document.getElementById("canvas");
              var dataURL = canvas.toDataURL("image/png");
              document.getElementById('hidden_data').value = dataURL;
  
              var fd = new FormData(document.forms["form1"]);
  
              var xhr = new XMLHttpRequest();
              xhr.open('POST', 'uploadscript.php', true);
  
              xhr.upload.onprogress = function(e) {
                  if (e.lengthComputable) {
                      var percentComplete = (e.loaded / e.total) * 100;
                      console.log(percentComplete + '% uploaded');
                      alert('Image uploaded');
                  }
              };
  
              xhr.onload = function() {
  
              };
              xhr.send(fd);
          };
  </code></pre>
  
  <p>How do I overlay a 2nd image on top (like watermark) when uploading?</p>