G-Major 17 Image Effect Generator

function processImage(originalImg, invertPct = 100, hueRotateDeg = 220, contrastPct = 200, saturatePct = 300, rgbSplitOffSetStr = "6") {
    // Create a new canvas to process the image
    const canvas = document.createElement('canvas');
    const width = originalImg.width;
    const height = originalImg.height;
    
    canvas.width = width;
    canvas.height = height;
    
    const ctx = canvas.getContext('2d');

    // G-Major effects are known for their harsh, inverted, and color-shifted visuals.
    // We apply base filters commonly found in these meme-style visual distortions.
    ctx.filter = `invert(${invertPct}%) hue-rotate(${hueRotateDeg}deg) contrast(${contrastPct}%) saturate(${saturatePct}%)`;
    ctx.drawImage(originalImg, 0, 0);

    // Parse the RGB split offset
    const offset = parseInt(rgbSplitOffSetStr, 10);
    
    // If an offset is provided, apply a chromatic aberration (RGB split) effect 
    // to give it that corrupted / glitchy G-Major VHS vibe.
    if (!isNaN(offset) && offset > 0) {
        const imageData = ctx.getImageData(0, 0, width, height);
        const pixels = imageData.data;
        
        // Clone the pixel data to reference original untouched channel values
        const bufferTemp = new Uint8ClampedArray(pixels);

        for (let y = 0; y < height; y++) {
            for (let x = 0; x < width; x++) {
                const i = (y * width + x) * 4;
                
                // Shift Red channel to the right
                const redX = x + offset;
                if (redX < width) {
                    const redBaseIndex = (y * width + redX) * 4;
                    pixels[i] = bufferTemp[redBaseIndex];     // Red
                }
                
                // Shift Blue channel to the left
                const blueX = x - offset;
                if (blueX >= 0) {
                    const blueBaseIndex = (y * width + blueX) * 4;
                    pixels[i + 2] = bufferTemp[blueBaseIndex + 2]; // Blue
                }
                
                // Green channel (pixels[i + 1]) stays in its original place
                // Alpha channel (pixels[i + 3]) stays untouched
            }
        }
        
        // Push the newly distorted pixel data back to the canvas
        ctx.putImageData(imageData, 0, 0);
    }

    // Return the final canvas element containing the customized G-Major 17 look
    return canvas;
}