Image Horizontal Line Adder

function processImage(originalImg, lineCount = 5, lineColor = "black", lineWidth = 1) {
    // Sanitize lineCount: ensure it's a non-negative finite integer.
    // Uses the provided value if valid, otherwise defaults to 5.
    let sanitizedLineCount = parseInt(String(lineCount), 10);
    if (!Number.isFinite(sanitizedLineCount) || sanitizedLineCount < 0) {
        sanitizedLineCount = 5; // Default value for lineCount if parsing fails or value is invalid
    }

    // Sanitize lineColor: ensure it's a string.
    // The Canvas API handles invalid color strings gracefully (e.g., "invalid-color" usually defaults to black).
    const sanitizedLineColor = String(lineColor);

    // Sanitize lineWidth: ensure it's a positive finite number.
    // Uses the provided value if valid and positive, otherwise defaults to 1.
    let sanitizedLineWidth = parseFloat(String(lineWidth));
    if (!Number.isFinite(sanitizedLineWidth) || sanitizedLineWidth <= 0) {
        sanitizedLineWidth = 1; // Default value for lineWidth if parsing fails or value is invalid
    }

    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Use naturalWidth/Height if available for the true original dimensions.
    // Fallback to width/height if natural dimensions are not available.
    const imgWidth = originalImg.naturalWidth || originalImg.width;
    const imgHeight = originalImg.naturalHeight || originalImg.height;

    // Set canvas dimensions to match the image.
    canvas.width = imgWidth;
    canvas.height = imgHeight;

    // Only proceed with drawing if the image has valid (positive) dimensions.
    if (imgWidth > 0 && imgHeight > 0) {
        // Draw the original image onto the canvas.
        ctx.drawImage(originalImg, 0, 0, imgWidth, imgHeight);

        // Draw horizontal lines if sanitizedLineCount is greater than 0.
        if (sanitizedLineCount > 0) {
            ctx.strokeStyle = sanitizedLineColor;
            ctx.lineWidth = sanitizedLineWidth;

            // Calculate the vertical spacing for the lines.
            // Lines are distributed evenly, creating (sanitizedLineCount + 1) spaces.
            const spacing = imgHeight / (sanitizedLineCount + 1);

            for (let i = 1; i <= sanitizedLineCount; i++) {
                const yPosition = spacing * i;
                
                ctx.beginPath();
                ctx.moveTo(0, yPosition);       // Start point of the line (left edge of canvas)
                ctx.lineTo(imgWidth, yPosition); // End point of the line (right edge of canvas)
                ctx.stroke();                   // Render the line
            }
        }
    }
    // If imgWidth or imgHeight is 0 (e.g., image not loaded or is an empty image),
    // the canvas will have dimensions 0x0.
    // ctx.drawImage would not draw anything, and the line drawing logic above is skipped.
    // This results in an empty 0x0 canvas, which is an appropriate output for such input.

    return canvas;
}