2 files changed, 25 insertions, 23 deletions
diff --git a/public/assets/js/app.js b/public/assets/js/app.js
index 87cb48d..0ea5eeb 100644
--- a/public/assets/js/app.js
+++ b/public/assets/js/app.js
@@ -1,28 +1,40 @@
-var socket = io.connect('/client');
+const container = document.querySelector('#container')
 
-ss(socket).on('frame', (stream, data) => {
-  console.log('received frame', data)
-  Object.values(client.connected).map(socket => {
-    ss(socket).emit('frame', stream, data)
-  })
-})
+let socket = io.connect('/client')
+let got_frame = false
 
 socket.on('res', (data) => {
   console.log(data)
 })
 
-socket.on('frame', (fn, data) => {
-  console.log('frame', fn, data.length)
-  document.write(data)
+socket.on('frame', (data) => {
+  got_frame = true
+  console.log('frame', data.fn)
+  // console.log(data.frame)
+  // return
+  const blob = new Blob([data.frame], { type: 'image/jpg' })
+  const url = URL.createObjectURL(blob)
+
+  const img = new Image ()
+  img.onload = function() {
+    URL.revokeObjectURL(url)
+    container.innerHTML = ''
+    container.appendChild(img)
+  }
+  img.src = url
 })
 
 socket.emit('cmd', {
   cmd: 'get_params',
 })
 
-socket.emit('cmd', {
-  cmd: 'get_last_frame',
-})
+setTimeout(() => {
+  if (!got_frame) {
+    socket.emit('cmd', {
+      cmd: 'get_last_frame',
+    })
+  }
+}, 500)
 
 socket.emit('cmd', {
   cmd: 'send_param',
@@ -31,12 +43,3 @@ socket.emit('cmd', {
     'value': 'test',
   }
 })
-
-// $('#file').change(function(e) {
-//   var file = e.target.files[0];
-//   var stream = ss.createStream();
-
-//   // // upload a file to the server.
-//   // ss(socket).emit('file', stream, {size: file.size});
-//   // ss.createBlobReadStream(file).pipe(stream);
-// })
-\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 9f851c2..04817a1 100644
--- a/public/index.html
+++ b/public/index.html
@@ -13,7 +13,6 @@
   <div id="container"></div>
 </body>
 <script src="/socket.io/socket.io.js"></script>
-<script src="/assets/js/vendor/socket.io-stream.js"></script>
 <script>
   var s = document.createElement('script');
   s.setAttribute('src','assets/js/app.js?' + Date.now());