calculate real height in M1 mode

Author: jerch

README.md

@@ -58,7 +58,7 @@ It exposes the following properties:
     Reports the current width of the current image. For `truncate=true` this may report the raster width, if a valid raster attribute was found. Otherwise reports rightmost band cursor advance seen so far. 
 
 - `height: number`  
-    Reports the current height of the current image. Note that for `trancate=true` this may report the raster height, if a valid raster attribute was found. Otherwise reports the height in multiple of 6 pixels (seen sixel bands).
+    Reports the current height of the current image. Note that for `trancate=true` this may report the raster height, if a valid raster attribute was found. Otherwise reports the lowermost pixel position touched by a sixel.
 
 - `memoryUsage: number`  
     Reports the current memory usage of the decoder for wasm module memory and allocated pixel buffer.

index.html

@@ -35,9 +35,13 @@
   <br><br>
   <label><input type="checkbox" name="slow" id="slow" value="value"> Simulate slow chunks</label>
   <br>
+  <label><input type="checkbox" name="m1" id="m1" value="value"> Force M1 Mode (truncate: false)</label>
+  <br>
   <label><input type="color" name="fillColor" id="fillColor" value="#000000"> background color</label>
   <br><br>
   <span id="stats"></span>
+  <br>
+  <span id="decodetime"></span>
   <br><br>
   <canvas id="output_wasm" style="border: 1px solid black"></canvas>
   <script src="/dist/full.umd.js"></script>
@@ -75,7 +79,16 @@
   clearInterval(drawHandle);
 
   // initialize decoder
-  decoder.init(sixel.toRGBA8888(...hexColorToRGB(document.getElementById('fillColor').value)));
+  decoder.init(
+    // fillColor - BG color
+    sixel.toRGBA8888(...hexColorToRGB(document.getElementById('fillColor').value)),
+    // palette (null: dont change, undefined: pull default)
+    undefined,
+    // paletteLimit - max usable palette slots
+    256,
+    // truncate - whether to cut at raster dimensions (false - always M1 mode, true - maybe M2)
+    !document.getElementById('m1').checked
+  );
 
   // read in
   if (s === 'wiki') {
@@ -84,6 +97,9 @@
     const response = await fetch('/testfiles/' + s);
     const bytes = new Uint8Array(await response.arrayBuffer());
     if (document.getElementById('slow').checked) {
+      // inspect slow transmission image construction
+      // (dont copy this, its just a wild hack w'o proper async state handling)
+      document.getElementById('decodetime').innerText = '';
       let localHandle = drawHandle = setInterval(() => drawImageWasm(), 100);
       let i = 0;
       const endTens = bytes.length - (bytes.length % 10);
@@ -99,7 +115,9 @@
       }
       clearInterval(drawHandle);
     } else {
+      const start = Date.now();
       decoder.decode(bytes);
+      document.getElementById('decodetime').innerText = 'decoding time: ' + (Date.now() - start) + 'ms';
     }
   }
   document.getElementById('stats').innerText = 'width: ' + decoder.width + '\nheight: ' + decoder.height;

src/Decoder.test.ts

@@ -986,6 +986,35 @@ describe('Decoder', () => {
       dec.init(0, null, 256);
       assert.strictEqual(dec.data8.length, 0);
     });
+    it.only('M1 reports and uses correct with/height', () => {
+      const dec = new Decoder();
+      // no sixels at all
+      dec.decodeString('#0;');
+      assert.strictEqual(dec.width, 0);
+      assert.strictEqual(dec.height, 0);
+      assert.strictEqual(dec.data32.length, 0);
+
+      // helper to generate arbitrary diagonale
+      function diag(n: number) {
+        const d6 = '@ACGO_';
+        let final = '';
+        for (let i = 0; i < Math.floor(n / 6); ++i) {
+          final += d6;
+          final += '$-!' + ((i+1)*6) + '?';
+        }
+        final += d6.slice(0, n % 6)
+        return final;
+      }
+
+      // draw diagonale as 1x1, 2x2, 3x3, ... 19x19
+      for (let h = 1; h < 19; ++h) {
+        dec.init(0, null, 256);
+        dec.decodeString(diag(h));
+        assert.strictEqual(dec.width, h);
+        assert.strictEqual(dec.height, h);
+        assert.strictEqual(dec.data32.length, h*h);
+      }
+    });
   });
   describe('release', () => {
     const data = fs.readFileSync('./testfiles/test1_clean.sixel');

src/Decoder.ts

@@ -253,13 +253,13 @@ export class Decoder {
   /**
    * Height of the image data.
    * Returns the rasterHeight in level2/truncating mode,
-   * otherwise 6 * seen bands.
+   * otherwise height touched by sixels.
    */
   public get height(): number {
     return this._mode !== ParseMode.M1
       ? this._height
       : this._wasm.current_width()
-        ? this._bandWidths.length * 6 + 6
+        ? this._bandWidths.length * 6 + this._wasm.current_height()
         : this._bandWidths.length * 6;
   }
 
@@ -367,7 +367,7 @@ export class Decoder {
     }
 
     // get width of pending band to peek into left-over data
-    let currentWidth = this._wasm.current_width();
+    const currentWidth = this._wasm.current_width();
 
     if (this._mode === ParseMode.M2) {
       let remaining = this.height - this._currentHeight;
@@ -407,7 +407,8 @@ export class Decoder {
         }
       }
 
-      // worst case: copy re-aligned pixels if we have bands with different width
+      // worst case: re-align pixels if we have bands with different width
+      // This is somewhat allocation intensive, any way to do that in-place, and just once?
       const final = new Uint32Array(this.width * this.height);
       final.fill(this._fillColor);
       let finalOffset = 0;
@@ -419,9 +420,12 @@ export class Decoder {
           finalOffset += this.width;
         }
       }
+      // also handle left-over pixels of the current band
       if (currentWidth) {
         const adv = this._PIXEL_OFFSET;
-        for (let i = 0; i < 6; ++i) {
+        // other than finished bands, this runs only up to currentHeight
+        const currentHeight = this._wasm.current_height();
+        for (let i = 0; i < currentHeight; ++i) {
           final.set(this._pSrc.subarray(adv * i, adv * i + currentWidth), finalOffset + this.width * i);
         }
       }

src/Types.ts

@@ -144,6 +144,7 @@ export interface IWasmDecoderExports extends Record<string, WebAssembly.ExportVa
   init(sixelColor: number, fillColor: number, paletteLimit: number, truncate: number): void;
   decode(start: number, end: number): void;
   current_width(): number;
+  current_height(): number;
 }
 
 // wasm decoder

wasm/README.md

@@ -90,6 +90,10 @@ Exported symbols:
     Return the cursor advance of the current band in M1 mode, or width in M2 mode.
     This is needed to properly construct the full image at the end of decoding,
     in case the data did not finish with LF.
+- `int current_width()`  
+    M1 mode only - return the current lowermost pixel position touched by a sixel
+    of the current band. This is needed to properly construct the full image with
+    proper height for the current band, in case the data did not finish with LF.
 
 Needed callbacks:
  - `int mode_parsed(int mode)`  
@@ -121,10 +125,10 @@ Needed callbacks:
   raster dimensions on decoder side is not spec-conform, it is the expected data format created by
   a spec-conform encoder.
 - If `truncate` is not set, the width will be derived from cursor advance to the right, clamped
-  to `MAX_WIDTH-4`. In this mode, the height is always reported in terms of multiple of 6
-  (pixel height of a sixel band). Furthermore in this mode the height is not limited by any means,
-  thus decoding may run forever. Use some sort of accounting during `handle_band` to spot
-  malformed data or excessive memory usage, especially when dealing with data streams.
+  to `MAX_WIDTH-4`. In this mode, `current_height` is reported as lowermost pixel position touched by sixels.
+  Furthermore in this mode the height is not limited by any means, thus decoding may run forever.
+  Use some sort of accounting during `handle_band` to spot malformed data or excessive memory usage,
+  especially when dealing with data streams.
 - Palette colors are applied immediately to sixels (printer mode), there is no terminal-like indexed mode.
   While this is in line with the spec, it does not allow to mimick the palette behavior of older terminals
   (e.g. palette animations are not possible).

wasm/build.sh

@@ -66,6 +66,7 @@ emcc -O3 \
   "_init",
   "_decode",
   "_current_width",
+  "_current_height",
   "_get_state_address",
   "_get_chunk_address",
   "_get_p0_address",

wasm/decoder.cpp

@@ -55,6 +55,7 @@ static struct {
   int abort;
   int cleared_width;
   int real_width;
+  int band_height;
   int state;
   int color;
   int cursor;
@@ -83,6 +84,7 @@ extern "C" {
   void init(int sixel_color, int fill_color, unsigned int palette_length, int truncate);
   void decode(int start, int end);
   int current_width();
+  int current_height();
 
   // imported
   int handle_band(int width);
@@ -209,6 +211,7 @@ static inline void clear_next() {
 // Clear pixel buffers for next line processing (m1). Hardcoded to 128px chunk.
 static inline void reset_line_m1() {
   ps.real_width = 4;
+  ps.band_height = 0;
 
   // fill 128 pixels in p0 as copy source
   long long *blueprint = (long long *) &ps.p0[4];
@@ -289,6 +292,7 @@ void decode_m1(int start, int end) {
           int k = ps.params[0] ? ps.params[0] : 1;
           while (cur + k >= ps.cleared_width && ps.cleared_width < MAX_WIDTH) clear_next();
           put(code - 63, color, k, cur);
+          ps.band_height |= code - 63;
           cur += k;
           code = *c++ & 0x7F;
         } else {
@@ -299,6 +303,7 @@ void decode_m1(int start, int end) {
       while (unsigned(code - 63) < 64) {
         if (cur >= ps.cleared_width && ps.cleared_width < MAX_WIDTH) clear_next();  // FIXME: MAX_WIDTH is exp here
         put_single(code - 63, color, cur++);
+        ps.band_height |= code - 63;
         code = *c++ & 0x7F;
       };
     }
@@ -505,6 +510,7 @@ void init(int sixel_color, int fill_color, unsigned int palette_length, int trun
   ps.r_height = 0;
   ps.width = 0;
   ps.height = 0;
+  ps.band_height = 0;
   ps.abort = 0;
 }
 
@@ -526,3 +532,9 @@ int current_width() {
   }
   return 0;
 }
+
+// Height of the current band (M1 only).
+int current_height() {
+  int x = ps.band_height;
+  return x & 32 ? 6 : x & 16 ? 5 : x & 8 ? 4 : x & 4 ? 3 : x & 2 ? 2 : x & 1 ? 1 : 0;
+}