inspect-png-chunk.ts

/**
 * PNGのチャンク構成を確認するスクリプト
 * 
 * ```
 * deno run --allow-read=. inspect-png-chunk.ts 
 * ```
 */

type PNGChunk = {
    length: number;         // 4 bytes
    type: string;           // 4 bytes
    data: ArrayBuffer;      // length bytes
    crc: number;            // 4 bytes
}

class SeekDataView {
    public readonly data: DataView;
    public offset = 0;

    constructor(bytes: Uint8Array) {
        this.data = new DataView(bytes.buffer);
    }
    
    public readUint8() {
        const value = this.data.getUint8(this.offset);
        this.offset += 1;
        return value;
    }

    public readUint32() {
        const value = this.data.getUint32(this.offset);
        this.offset += 4;
        return value;
    }

    public readArray(length: number): Uint8Array {
        const value = this.data.buffer.slice(this.offset, this.offset + length);
        this.offset += length;
        return new Uint8Array(value);
    }
}

function toHex(value: number) {
    return value.toString(16).padStart(2, "0");
}

const fileName = "1_whole.png";

const rawData = await Deno.readFile(fileName);
const seekView = new SeekDataView(rawData);

console.log(`File: ${fileName} (${rawData.byteLength} bytes)`);

const pngSignature = seekView.readArray(8); // 8 bytes of PNG signature
if (String.fromCharCode(...pngSignature.slice(0, 4)) !== "\x89PNG") {
    throw new Error("Invalid PNG signature");
}

const chunks: PNGChunk[] = [];
while (seekView.offset < seekView.data.byteLength) {
    const length = seekView.readUint32();
    const type = String.fromCharCode(...seekView.readArray(4));
    const data = seekView.readArray(length);
    const crc = seekView.readUint32();
    chunks.push({ length, type, data, crc });

    console.log(`Chunk: ${type} (length: ${length} bytes) [offset: 0x${toHex(seekView.offset - length - 12)}]`);
}