JSFiddle - React, Tailwind, and code Playground

by vijayweb

JavaScript

var img = new Image(),
    $canvas = $("<canvas>"),
    canvas = $canvas[0],
    context = canvas.getContext("2d");

var removeBlanks = function (imgWidth, imgHeight) {
        var imageData = context.getImageData(0, 0, imgWidth, imgHeight),
            data = imageData.data,
            getRBG = function(x, y) {
                return {
                    red:   data[(imgWidth*y + x) * 4],
                    green: data[(imgWidth*y + x) * 4 + 1],
                    blue:  data[(imgWidth*y + x) * 4 + 2]
                };
            },
            isWhite = function (rgb) {
                return rbg.red == 255 && rbg.green == 255 && rbg.blue == 255;
            },
            scanY = function (fromTop) {
                var offset = fromTop ? 1 : -1;
                
                // loop through each row
                for(var y = fromTop ? 0 : imgHeight - 1; fromTop ? (y < imgHeight) : (y > -1); y += offset) {
                    
                    // loop through each column
                    for(var x = 0; x < imgWidth; x++) {
                        if (!isWhite(getRBG(x, y))) {
                            return y;                        
                        }      
                    }
                }
                return null; // all image is white
            },
            scanX = function (fromLeft) {
                var offset = fromLeft? 1 : -1;
                
                // loop through each column
                for(var x = fromLeft ? 0 : imgWidth - 1; fromLeft ? (x < imgWidth) : (x > -1); x += offset) {
                    
                    // loop through each row
                    for(var y = 0; y < imgHeight; y++) {
                        if (!isWhite(getRBG(x, y))) {
                            return x;                        
                        }      
                    }
                }
                return null; // all image is white
            };

    
    var cropTop = scanY(true),
       ...