web-a2e 1.0.0

package/src/js/file-explorer/dos33.js

@@ -0,0 +1,266 @@
+/*
+ * dos33.js - DOS 3.3 filesystem parser
+ *
+ * Written by
+ *  Mike Daley <michael_daley@icloud.com>
+ */
+
+/**
+ * DOS 3.3 Filesystem Parser
+ * Parses DOS 3.3 disk images to read catalog and file contents
+ */
+
+import { parseDOS33Filename } from './utils.js';
+
+// DOS 3.3 Constants
+const TRACKS = 35;
+const SECTORS_PER_TRACK = 16;
+const BYTES_PER_SECTOR = 256;
+const DISK_SIZE = TRACKS * SECTORS_PER_TRACK * BYTES_PER_SECTOR; // 143,360 bytes
+
+// VTOC Location
+const VTOC_TRACK = 17;
+const VTOC_SECTOR = 0;
+
+// Catalog structure
+const CATALOG_ENTRY_SIZE = 35;
+const ENTRIES_PER_SECTOR = 7;
+
+// File types
+const FILE_TYPES = {
+  0x00: { name: 'T', description: 'Text' },
+  0x01: { name: 'I', description: 'Integer BASIC' },
+  0x02: { name: 'A', description: 'Applesoft BASIC' },
+  0x04: { name: 'B', description: 'Binary' },
+  0x08: { name: 'S', description: 'Type S' },
+  0x10: { name: 'R', description: 'Relocatable' },
+  0x20: { name: 'a', description: 'Type a' },
+  0x40: { name: 'b', description: 'Type b' },
+};
+
+/**
+ * Calculate sector offset in disk image
+ * @param {number} track - Track number (0-34)
+ * @param {number} sector - Sector number (0-15)
+ * @returns {number} Byte offset in disk image
+ */
+function getSectorOffset(track, sector) {
+  return (track * SECTORS_PER_TRACK + sector) * BYTES_PER_SECTOR;
+}
+
+/**
+ * Read a sector from disk data
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @param {number} track - Track number
+ * @param {number} sector - Sector number
+ * @returns {Uint8Array} 256-byte sector data
+ */
+function readSector(diskData, track, sector) {
+  const offset = getSectorOffset(track, sector);
+  return diskData.slice(offset, offset + BYTES_PER_SECTOR);
+}
+
+/**
+ * Parse the VTOC (Volume Table of Contents)
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @returns {Object|null} VTOC data or null if invalid
+ */
+export function parseVTOC(diskData) {
+  if (diskData.length < DISK_SIZE) {
+    return null;
+  }
+
+  const vtoc = readSector(diskData, VTOC_TRACK, VTOC_SECTOR);
+
+  // Validate DOS 3.3 signature
+  const catalogTrack = vtoc[0x01];
+  const catalogSector = vtoc[0x02];
+  const dosVersion = vtoc[0x03];
+
+  // Basic validation
+  if (catalogTrack !== 0x11 || dosVersion !== 0x03) {
+    return null; // Not a DOS 3.3 disk
+  }
+
+  return {
+    catalogTrack,
+    catalogSector,
+    dosVersion,
+    volumeNumber: vtoc[0x06],
+    maxTrackSectorPairs: vtoc[0x27],
+    lastTrackAllocated: vtoc[0x30],
+    tracksPerDisk: vtoc[0x34] || 35,
+    sectorsPerTrack: vtoc[0x35] || 16,
+    bytesPerSector: (vtoc[0x37] << 8) | vtoc[0x36] || 256,
+  };
+}
+
+
+/**
+ * Parse a catalog entry
+ * @param {Uint8Array} entry - 35-byte catalog entry
+ * @returns {Object|null} Parsed entry or null if empty/deleted
+ */
+function parseCatalogEntry(entry) {
+  const firstTrack = entry[0x00];
+  const firstSector = entry[0x01];
+
+  // Check for deleted or empty entry
+  if (firstTrack === 0xFF || firstTrack === 0x00) {
+    return null;
+  }
+
+  const typeAndFlags = entry[0x02];
+  const fileType = typeAndFlags & 0x7F;
+  const isLocked = (typeAndFlags & 0x80) !== 0;
+
+  const filenameBytes = entry.slice(0x03, 0x03 + 30);
+  const filename = parseDOS33Filename(filenameBytes);
+
+  const sectorCount = entry[0x21] | (entry[0x22] << 8);
+
+  return {
+    firstTrack,
+    firstSector,
+    fileType,
+    fileTypeName: FILE_TYPES[fileType]?.name || '?',
+    fileTypeDescription: FILE_TYPES[fileType]?.description || 'Unknown',
+    isLocked,
+    filename,
+    sectorCount,
+  };
+}
+
+/**
+ * Read the disk catalog
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @returns {Array} Array of catalog entries
+ */
+export function readCatalog(diskData) {
+  const vtoc = parseVTOC(diskData);
+  if (!vtoc) {
+    return [];
+  }
+
+  const entries = [];
+  let track = vtoc.catalogTrack;
+  let sector = vtoc.catalogSector;
+  const visited = new Set();
+
+  // Follow catalog sector chain
+  while (track !== 0 && sector !== 0) {
+    const key = `${track},${sector}`;
+    if (visited.has(key)) break; // Prevent infinite loops
+    visited.add(key);
+
+    const catalogSector = readSector(diskData, track, sector);
+
+    // Parse entries in this sector (skip first 11 bytes - header)
+    for (let i = 0; i < ENTRIES_PER_SECTOR; i++) {
+      const entryOffset = 0x0B + (i * CATALOG_ENTRY_SIZE);
+      const entryData = catalogSector.slice(entryOffset, entryOffset + CATALOG_ENTRY_SIZE);
+      const entry = parseCatalogEntry(entryData);
+      if (entry) {
+        entries.push(entry);
+      }
+    }
+
+    // Get next catalog sector
+    track = catalogSector[0x01];
+    sector = catalogSector[0x02];
+  }
+
+  return entries;
+}
+
+/**
+ * Read a file's track/sector list
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @param {number} track - First T/S list track
+ * @param {number} sector - First T/S list sector
+ * @returns {Array} Array of {track, sector} pairs
+ */
+function readTrackSectorList(diskData, track, sector) {
+  const pairs = [];
+  const visited = new Set();
+
+  while (track !== 0) {
+    const key = `${track},${sector}`;
+    if (visited.has(key)) break;
+    visited.add(key);
+
+    const tsList = readSector(diskData, track, sector);
+
+    // Read sector pairs from this T/S list (starting at offset 0x0C)
+    for (let i = 0x0C; i < 0x100; i += 2) {
+      const t = tsList[i];
+      const s = tsList[i + 1];
+      if (t === 0 && s === 0) break;
+      pairs.push({ track: t, sector: s });
+    }
+
+    // Get next T/S list sector
+    track = tsList[0x01];
+    sector = tsList[0x02];
+  }
+
+  return pairs;
+}
+
+/**
+ * Read file contents
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @param {Object} catalogEntry - Catalog entry for the file
+ * @returns {Uint8Array} File contents
+ */
+export function readFile(diskData, catalogEntry) {
+  const sectors = readTrackSectorList(
+    diskData,
+    catalogEntry.firstTrack,
+    catalogEntry.firstSector
+  );
+
+  // Concatenate all data sectors
+  const chunks = [];
+  for (const { track, sector } of sectors) {
+    const sectorData = readSector(diskData, track, sector);
+    chunks.push(sectorData);
+  }
+
+  // Combine into single array
+  const totalSize = chunks.reduce((sum, chunk) => sum + chunk.length, 0);
+  const result = new Uint8Array(totalSize);
+  let offset = 0;
+  for (const chunk of chunks) {
+    result.set(chunk, offset);
+    offset += chunk.length;
+  }
+
+  return result;
+}
+
+/**
+ * Get file size information for Binary files
+ * Binary files have a 4-byte header: 2 bytes address, 2 bytes length
+ * @param {Uint8Array} fileData - Raw file data
+ * @returns {Object} {address, length} or null
+ */
+export function getBinaryFileInfo(fileData) {
+  if (fileData.length < 4) return null;
+
+  const address = fileData[0] | (fileData[1] << 8);
+  const length = fileData[2] | (fileData[3] << 8);
+
+  return { address, length };
+}
+
+/**
+ * Check if disk is DOS 3.3 format
+ * @param {Uint8Array} diskData - Raw disk image data
+ * @returns {boolean} True if DOS 3.3 format
+ */
+export function isDOS33(diskData) {
+  return parseVTOC(diskData) !== null;
+}
+
+export { FILE_TYPES, BYTES_PER_SECTOR };

package/src/js/file-explorer/file-viewer.js

@@ -0,0 +1,359 @@
+/*
+ * file-viewer.js - File content viewer for disk images
+ *
+ * Written by
+ *  Mike Daley <michael_daley@icloud.com>
+ */
+
+/**
+ * File Viewer - Formats and displays file contents
+ * Supports different Apple II file types
+ */
+
+import { disassemble } from "./disassembler.js";
+import { escapeHtml } from "../utils/string-utils.js";
+import { highlightBasicSource } from "../utils/basic-highlighting.js";
+import { highlightMerlinSource, isMerlinSource } from "../utils/merlin-highlighting.js";
+
+let wasmModule = null;
+
+/**
+ * Set the WASM module for BASIC detokenization
+ * @param {Object} wasm - The WASM module instance
+ */
+export function setFileViewerWasm(wasm) {
+  wasmModule = wasm;
+}
+
+/**
+ * Detokenize BASIC program using WASM and apply JS syntax highlighting.
+ * Returns { html, lineNumToIndex, lineCount }
+ */
+function detokenizeBasicViaWasm(data, hasLengthHeader, isApplesoft) {
+  if (!wasmModule) {
+    return { html: '(WASM module not loaded)', lineNumToIndex: new Map(), lineCount: 0 };
+  }
+
+  const wasm = wasmModule;
+
+  // Copy data to WASM heap
+  const dataPtr = wasm._malloc(data.length);
+  wasm.HEAPU8.set(data, dataPtr);
+
+  // Call WASM detokenizer
+  const resultPtr = isApplesoft
+    ? wasm._detokenizeApplesoft(dataPtr, data.length, hasLengthHeader)
+    : wasm._detokenizeIntegerBasic(dataPtr, data.length, hasLengthHeader);
+
+  wasm._free(dataPtr);
+
+  // Read plain text result
+  const plainText = resultPtr ? wasm.UTF8ToString(resultPtr) : '';
+  if (!plainText) {
+    return { html: '', lineNumToIndex: new Map(), lineCount: 0 };
+  }
+
+  // Build lineNumToIndex from the plain text (line numbers are at start of each line)
+  const lineNumToIndex = new Map();
+  const textLines = plainText.split('\n');
+  for (let i = 0; i < textLines.length; i++) {
+    const match = textLines[i].match(/^\s*(\d+)/);
+    if (match) {
+      lineNumToIndex.set(parseInt(match[1], 10), i);
+    }
+  }
+
+  // Apply HTML syntax highlighting
+  const highlighted = highlightBasicSource(plainText, { preserveCase: false });
+
+  // Post-process: add bas-lineref data attributes for GOTO/GOSUB/THEN targets
+  // The highlighter wraps numbers in <span class="bas-number"> spans.
+  // We look for numbers that follow GOTO/GOSUB/THEN keywords and add lineref attributes.
+  const html = highlighted.replace(
+    /(<span class="bas-(?:flow|misc)">(?:GOTO|GOSUB|THEN)<\/span>\s*)<span class="bas-number">(\d+)<\/span>/g,
+    (match, prefix, num) => {
+      const lineNum = parseInt(num, 10);
+      if (lineNumToIndex.has(lineNum)) {
+        return `${prefix}<span class="bas-number bas-lineref" data-target-line="${lineNum}">${num}</span>`;
+      }
+      return match;
+    }
+  );
+
+  return {
+    html,
+    lineNumToIndex,
+    lineCount: textLines.length,
+  };
+}
+
+function detokenizeApplesoft(data, hasLengthHeader = true) {
+  return detokenizeBasicViaWasm(data, hasLengthHeader, true);
+}
+
+function detokenizeIntegerBasic(data, hasLengthHeader = true) {
+  return detokenizeBasicViaWasm(data, hasLengthHeader, false);
+}
+
+/**
+ * Format binary data as hex dump with ASCII (returns HTML)
+ * @param {Uint8Array} data - Binary data
+ * @param {number} baseAddress - Starting address for display
+ * @param {number} maxBytes - Maximum bytes to show (0 = all)
+ * @returns {string} Formatted hex dump as HTML
+ */
+export function formatHexDump(data, baseAddress = 0, maxBytes = 0, bytesPerRow = 16) {
+  const lines = [];
+  const bytesToShow =
+    maxBytes > 0 ? Math.min(data.length, maxBytes) : data.length;
+  const groupSize = 8;
+
+  for (let i = 0; i < bytesToShow; i += bytesPerRow) {
+    const addr = (baseAddress + i).toString(16).toUpperCase().padStart(4, "0");
+
+    let hexBytes = "";
+    let ascii = "";
+
+    for (let j = 0; j < bytesPerRow; j++) {
+      // Add group gap every 8 bytes (not at start)
+      if (j > 0 && j % groupSize === 0) {
+        hexBytes += `<span class="hex-group-gap"></span>`;
+      }
+
+      if (i + j < bytesToShow) {
+        const byte = data[i + j];
+        const hexStr = byte.toString(16).toUpperCase().padStart(2, "0");
+
+        // Style based on byte value
+        let byteClass = "hex-byte";
+        if (byte === 0x00) {
+          byteClass += " hex-zero";
+        } else if (byte >= 0x20 && byte < 0x7f) {
+          byteClass += " hex-printable";
+        } else if (byte >= 0x80) {
+          byteClass += " hex-highbit";
+        }
+
+        hexBytes += `<span class="${byteClass}">${hexStr}</span> `;
+
+        // ASCII representation (printable chars only)
+        const ch = byte & 0x7f;
+        if (ch >= 0x20 && ch < 0x7f) {
+          const escaped = ch === 0x26 ? "&amp;" : ch === 0x3c ? "&lt;" : ch === 0x3e ? "&gt;" : String.fromCharCode(ch);
+          ascii += `<span class="hex-ascii-printable">${escaped}</span>`;
+        } else {
+          ascii += `<span class="hex-ascii-dot">.</span>`;
+        }
+      } else {
+        hexBytes += "   ";
+        ascii += " ";
+      }
+    }
+
+    lines.push(
+      `<span class="hex-line">` +
+      `<span class="hex-addr">${addr}</span>` +
+      `<span class="hex-separator">:</span> ` +
+      `<span class="hex-bytes">${hexBytes}</span>` +
+      `<span class="hex-ascii-separator">│</span>` +
+      `<span class="hex-ascii">${ascii}</span>` +
+      `<span class="hex-ascii-separator">│</span>` +
+      `</span>`
+    );
+  }
+
+  if (maxBytes > 0 && data.length > maxBytes) {
+    lines.push(`<span class="hex-truncated">... (${data.length - maxBytes} more bytes)</span>`);
+  }
+
+  return lines.join("\n");
+}
+
+/**
+ * Format text file (strip high bits, convert to readable text)
+ * @param {Uint8Array} data - Raw file data
+ * @returns {string} Formatted text
+ */
+export function formatTextFile(data) {
+  let text = "";
+
+  for (let i = 0; i < data.length; i++) {
+    const byte = data[i] & 0x7f; // Strip high bit
+
+    if (byte === 0x0d) {
+      // Carriage return -> newline
+      text += "\n";
+    } else if (byte === 0x00) {
+      // Null - end of text or padding
+      continue;
+    } else if (byte >= 0x20 && byte < 0x7f) {
+      // Printable ASCII
+      text += String.fromCharCode(byte);
+    } else if (byte === 0x09) {
+      // Tab
+      text += "\t";
+    }
+  }
+
+  return text;
+}
+
+/**
+ * Format file contents based on type
+ * @param {Uint8Array} data - Raw file data
+ * @param {number} fileType - DOS 3.3 file type code
+ * @param {Object} options - Optional settings
+ * @param {boolean} options.hasLengthHeader - Whether BASIC files have 2-byte length header (DOS 3.3 = true, ProDOS = false)
+ * @returns {Object} {content, format} where format is 'text' or 'hex'
+ */
+export function formatFileContents(data, fileType, options = {}) {
+  const { hasLengthHeader = true } = options;
+
+  switch (fileType) {
+    case 0x00: // Text
+      return {
+        content: formatTextFile(data),
+        format: "text",
+        description: "Text File",
+      };
+
+    case 0x02: {
+      // Applesoft BASIC
+      try {
+        const result = detokenizeApplesoft(data, hasLengthHeader);
+        return {
+          content: result.html,
+          format: "basic",
+          description: "Applesoft BASIC",
+          isHtml: true,
+          lineNumToIndex: result.lineNumToIndex,
+          lineCount: result.lineCount,
+        };
+      } catch (e) {
+        // Fall back to hex if detokenization fails
+        return {
+          content: formatHexDump(data),
+          format: "hex",
+          description: "Applesoft BASIC (raw)",
+          isHtml: true,
+        };
+      }
+    }
+
+    case 0x01: {
+      // Integer BASIC
+      try {
+        const result = detokenizeIntegerBasic(data, hasLengthHeader);
+        return {
+          content: result.html,
+          format: "basic",
+          description: "Integer BASIC",
+          isHtml: true,
+          lineNumToIndex: result.lineNumToIndex,
+          lineCount: result.lineCount,
+        };
+      } catch (e) {
+        // Fall back to hex if detokenization fails
+        return {
+          content: formatHexDump(data),
+          format: "hex",
+          description: "Integer BASIC (raw)",
+          isHtml: true,
+        };
+      }
+    }
+
+    case 0x04: {
+      // Binary - DOS 3.3 header: 2 bytes address, 2 bytes length
+      let description = "Binary File";
+
+      if (data.length >= 4) {
+        const address = data[0] | (data[1] << 8);
+        const length = data[2] | (data[3] << 8);
+        description = `Binary File - Load: $${address.toString(16).toUpperCase()}, Length: ${length} bytes`;
+      }
+
+      // Return a promise for async disassembly
+      return {
+        content: null, // Will be filled by async disassembly
+        format: "text",
+        description,
+        // Async loader for disassembly
+        loadAsync: async () => {
+          try {
+            return await disassemble(data);
+          } catch (e) {
+            // Fall back to hex dump if disassembly fails
+            const displayData = data.length >= 4 ? data.slice(4) : data;
+            const baseAddr = data.length >= 4 ? (data[0] | (data[1] << 8)) : 0;
+            return formatHexDump(displayData, baseAddr);
+          }
+        },
+      };
+    }
+
+    default:
+      return {
+        content: formatHexDump(data),
+        format: "hex",
+        description: "Unknown File Type",
+        isHtml: true,
+      };
+  }
+}
+
+/**
+ * Format file size for display
+ * @param {number} sectors - Number of sectors
+ * @returns {string} Formatted size string
+ */
+export function formatFileSize(sectors) {
+  const bytes = sectors * 256;
+  if (bytes < 1024) {
+    return `${bytes} bytes`;
+  }
+  return `${(bytes / 1024).toFixed(1)} KB`;
+}
+
+/**
+ * Decode raw Apple II bytes to plain text (strip high bits, CR -> newline)
+ * @param {Uint8Array} data - Raw file data
+ * @returns {string} Decoded text
+ */
+function decodeAppleIIText(data) {
+  let text = '';
+  for (let i = 0; i < data.length; i++) {
+    const byte = data[i] & 0x7F;
+    if (byte === 0x0D) {
+      text += '\n';
+    } else if (byte === 0x00) {
+      continue;
+    } else if (byte >= 0x20 && byte < 0x7F) {
+      text += String.fromCharCode(byte);
+    } else if (byte === 0x09) {
+      text += '\t';
+    }
+  }
+  return text;
+}
+
+/**
+ * Check if raw file data looks like Merlin assembler source
+ * @param {Uint8Array} data - Raw file data (high-bit encoded)
+ * @returns {boolean}
+ */
+export function checkIsMerlinFile(data) {
+  const text = decodeAppleIIText(data);
+  return isMerlinSource(text);
+}
+
+/**
+ * Format raw file data as highlighted Merlin assembler source
+ * @param {Uint8Array} data - Raw file data (high-bit encoded)
+ * @returns {Object} { content, format, isHtml }
+ */
+export function formatMerlinFile(data) {
+  const text = decodeAppleIIText(data);
+  const html = highlightMerlinSource(text);
+  return { content: html, format: 'merlin', isHtml: true };
+}