feat: support DRI in JPEG depay

Support DRI in MJPEG by adding the correct DRI headers when required. Adjusted the simple camera example so the canvas keeps its aspect ratio.
AxisCommunications · Oct 29, 2021 · 877dbaf · 877dbaf
1 parent 067a574
commit 877dbaf
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 5 deletions.
diff --git a/examples/browser/camera/simple.html b/examples/browser/camera/simple.html
@@ -21,10 +21,10 @@
     </div>
     <div style="position: fixed; width: 1280px; height: 720px">
       <video
-        style="position: absolute; width: 100%; height: 100%;"
+        style="width: 100%; height: 100%; object-fit: contain"
         autoplay
       ></video>
-      <canvas style="position: absolute; width: 100%; height: 100%;"></canvas>
+      <canvas style="width: 100%; height: 100%; object-fit: contain"></canvas>
     </div>
     <script src="../media-stream-library.min.js"></script>
     <script src="simple-player.js"></script>

diff --git a/lib/components/jpegdepay/headers.ts b/lib/components/jpegdepay/headers.ts
@@ -199,3 +199,7 @@ export function makeScanHeader() {
     0,
   ])
 }
+
+export function makeDRIHeader(dri: number) {
+  return Buffer.from([0xff, 0xdd, 0x00, 4, dri >> 8, dri & 0xff])
+}
diff --git a/lib/components/jpegdepay/parser.ts b/lib/components/jpegdepay/parser.ts
@@ -4,6 +4,7 @@ import {
   makeScanHeader,
   makeQuantHeader,
   makeFrameHeader,
+  makeDRIHeader,
 } from './headers'
 import { payload } from '../../utils/protocols/rtp'
 import { makeQtable } from './make-qtable'
@@ -115,9 +116,8 @@ export function jpegDepayFactory(defaultWidth = 0, defaultHeight = 0) {
 
     const quantHeader = makeQuantHeader(precision, qTable)
 
-    if (metadata.DRI !== 0) {
-      throw new Error('not implemented: DRI')
-    }
+    const driHeader =
+      metadata.DRI === 0 ? Buffer.alloc(0) : makeDRIHeader(metadata.DRI)
 
     const frameHeader = makeFrameHeader(width, height, type)
 
@@ -126,6 +126,7 @@ export function jpegDepayFactory(defaultWidth = 0, defaultHeight = 0) {
       data: Buffer.concat([
         IMAGE_HEADER,
         quantHeader,
+        driHeader,
         frameHeader,
         HUFFMAN_HEADER,
         SCAN_HEADER,