feat: 캡쳐 이미지 다운로드 기능 추가

Author: codejs-kr

frontend/views/examples/capture/index.ejs

@@ -16,7 +16,7 @@
       <hr />
 
       <div id="output">
-        <strong>Capture images</strong>
+        <strong>Capture images (아래 캡쳐된 이미지를 클릭하면 다운로드 할 수 있습니다)</strong>
         <div id="images"></div>
       </div>
 

frontend/views/examples/capture/js/main.js

@@ -19,9 +19,15 @@ function capture() {
 function insertImage(imageData) {
   const $images = document.querySelector('#images');
   const $img = document.createElement('img');
+  const $a = document.createElement('a');
+  const fileName = `[WebRTC 연구실] Capture - ${new Date().getTime()}`;
 
   $img.src = imageData;
-  $images.insertBefore($img, $images.childNodes[0]);
+  $a.href = imageData;
+  $a.download = fileName;
+  $a.appendChild($img);
+
+  $images.insertBefore($a, $images.childNodes[0]);
 }
 
 /**