Principia javascript Image to Lua array

gistfile1.js

function clear_me()
{
    var img_info = Sizzle('#content .nospace')[0];
    var img_help = Sizzle('#content .help')[0];
    $S(img_info, {'display': 'none'});
    $S(img_help, {'display': 'none'});

    var code_container = $('code_container');
    $S(code_container, {'display': 'none'});

    var code_1 = $('code_1');
    var code_2 = $('code_2');
    var str_len_1 = $('str_len_1');
    var str_len_2 = $('str_len_2');

    code_1.value = '';
    code_2.value = '';

    str_len_1.innerHTML = 'Optimal code';
    str_len_2.innerHTML = 'Sub-optimal code';
}

function do_it()
{
    var el = $('temp_upload');
    var canvas = $('temp_canvas');
    var img = $('temp_img');
    var include_alpha = $('include_alpha').checked;
    var img_info = Sizzle('#content .nospace')[0];
    var img_help = Sizzle('#content .help')[0];
    var loading = Sizzle('#content .loading')[0];
    $S(img_info, {'display': 'none'});
    $S(img_help, {'display': 'none'});
    $S(loading, {'display': 'block'});

    var code_container = $('code_container');
    $S(code_container, {'display': 'none'});

    img.src = '';

    if (el.files.length == 1) {
        var f = el.files[0];
        if (f.type.match(/image.*/)) {
            var reader = new FileReader();

            reader.onload = function(e) { img.src = e.target.result; }
            reader.readAsDataURL(f);

            img.onload = function(e) {
                var w = img.width;
                var h = img.height;

                var img_width = document.getElementById('img_width');
                var img_height = document.getElementById('img_height');
                img_width.innerHTML = w;
                img_height.innerHTML = h;

                var ctx = canvas.getContext("2d");
                ctx.drawImage(img, 0, 0);

                var img_data = ctx.getImageData(0, 0, w, h);
                var data = img_data.data;

                var str_1 = '';

                var str_2 = '';
                var vars = '';

                var colors = [];
                var counter = 0;

                for (var i=0, n=data.length; i < n; i += 4) {
                    var red   = data[i  ];
                    var green = data[i+1];
                    var blue  = data[i+2];
                    var alpha = 0;
                    var color_str = '';
                    if (include_alpha) {
                        alpha = data[i+3];
                        color_str = '{' + red + ',' + green + ',' + blue + ',' + alpha + '}';
                    } else {
                        color_str = '{' + red + ',' + green + ',' + blue + '}';
                    }

                    var ic = red + (green << 8) + (blue << 16) + (alpha << 24);

                    var c = colors[ic];
                    var varname = '';

                    if (c === undefined) {
                        varname = 'c' + ++counter;
                        colors[ic] = varname;
                        vars += varname + '=' + color_str + ';';
                    } else {
                        varname = c;
                    }

                    str_1 += color_str + ',';
                    str_2 += varname + ',';
                }

                var code_1 = $('code_1');
                var code_2 = $('code_2');
                var str_len_1 = $('str_len_1');
                var str_len_2 = $('str_len_2');

                str_1 = 'colors={ ' + str_1 + '}';
                str_2 = vars + '\ncolors={ ' + str_2 + '}';

                str_1 = 'img_width='+w+'\nimg_height='+h+'\n'+str_1;
                str_2 = 'img_width='+w+'\nimg_height='+h+'\n'+str_2;

                if (str_1.length > str_2.length) {
                    code_1.value = str_2;
                    str_len_1.innerHTML = 'Optimal code (' + str_2.length + ' chars)';

                    code_2.value = str_1;
                    str_len_2.innerHTML = 'Sub-optimal code (' + str_1.length + ' chars)';
                } else {
                    code_1.value = str_1;
                    str_len_1.innerHTML = 'Optimal code (' + str_1.length + ' chars)';

                    code_2.value = str_2;
                    str_len_2.innerHTML = 'Sub-optimal code (' + str_2.length + ' chars)';
                }

                var load_texels = $('load_texels');
                load_texels.value =
'for x=1, img_width do\n'+
' for y=1, img_height do\n'+
'  local c = colors[x+((y-1)*img_width)]\n'+
'  this:set_sprite_texel(x-1, img_height-y, c[1]/255, c[2]/255, c[3]/255, (c[4] ~= nil and c[4]/255 or 1.0))\n'+
' end\n'+
'end'
;

                var draw_image = $('draw_image');
                draw_image.value = 'this:draw_sprite(0, 0, 0, 5, 5, 0, 0, img_width, img_height)';

                $S(code_container, {'display': 'block'});
                $S(img_info, {'display': 'block'});
                $S(img_help, {'display': 'block'});
                $S(loading, {'display': 'none'});
            }
        } else {
            $S(loading, {'display': 'block'});
        }
    } else {
        $S(loading, {'display': 'block'});
    }
}