Ox.load({Geo: {}, Image: {}, UI: {}, Unicode: {}}, function() {
    Ox.getJSON('../dev/Ox/json/Ox.json', function(files) {
        
        var $body = $('body')
                .css({
                    overflowY: 'auto'
                }),
            $tests = new Ox.Bar({
                    size: 20
                })
                .css({
                    padding: '6px 0 6px 8px',
                    fontSize: '16px',
                    fontWeight: 'bold'
                })
                .appendTo($body);
            colors = [
                ['255, 64, 64', '224, 32, 32', '240, 16, 16'],
                ['64, 192, 64', '32, 160, 32', '40, 176, 48'],
                ['96, 96, 255', '64, 64, 224', '80, 80, 240']
            ];

        setBackground($tests, true);

        tests(
            Ox.flatten(files).sort().map(function(file) {
                return '../dev/' + file;
            }).concat([
                '../dev/Ox.Geo/Ox.Geo.js',
                '../dev/Ox.Image/Ox.Image.js',
                '../dev/Ox.Unicode/Ox.Unicode.js'
            ]).map(function(file) {
                return file + '?' + Ox.random(1000000);
            })
        );

        function tests() {
            var passed = 0, failed = 0,
                lines, spaces, command, expected, result, passed,
                replace = ['', ''], fns = [], $test;
            Ox.forEach(Ox.isArray(arguments[0]) ? arguments[0] : arguments, function(script, i) {
                Ox.test(script, function(results) {
                    var tests = {};
                    results.forEach(function(result) {
                        tests[result.section] = tests[result.section] || {};
                        tests[result.section][result.name] = tests[result.section][result.name] || [];
                        tests[result.section][result.name].push(result);
                    });
                    Ox.forEach(tests, function(functions, section) {
                        Ox.Bar({size: 14})
                            .css({padding: '1px 0 1px 4px'})
                            .html(Ox.parsePath(script).filename.split('?')[0] + ' ' + (section || ''))
                            .appendTo($body);
                        Ox.forEach(functions, function(arr, fn) {
                            var $test = Ox.CollapsePanel({
                                    collapsed: true,
                                    title: fn + '()'
                                })
                                .appendTo($body);
                            setBackground($test.find('.OxBar'), true);
                            arr.forEach(function(test) {
                                passed += test.passed;
                                failed += !test.passed;
                                $tests.html(
                                    (passed + failed) + ' tests, '
                                    + passed + ' passed, ' + failed + ' failed'
                                );
                                if (!test.passed) {
                                    setBackground($tests, false);
                                    setBackground($test.find('.OxBar'), false);
                                }
                                Ox.Element()
                                    .css({
                                        padding: '2px 0 2px 4px',
                                        background: 'rgb(' + colors[+test.passed][2] + ')'
                                    })
                                    .html(
                                        '<span style="font-family: Monaco">'
                                        + Ox.encodeHTMLEntities(test.statement) + ' '
                                        + (test.passed ? '=' : '!') + '=&gt; '
                                        + Ox.encodeHTMLEntities(test.expected)
                                        + (test.passed ? '' : ' ==&gt; ' + Ox.encodeHTMLEntities(test.actual))
                                        + '</tt>'
                                    )
                                    .appendTo($test.$content);
                            });
                            $test.$content.css({
                                marginTop: -$test.$content.height() + 'px'
                            });
                        });
                    });
                })
            });
        }

        function setBackground($element, passed) {
            ['-moz-linear-gradient', '-webkit-linear-gradient'].forEach(function(v) {
                $element.css({
                    background: v + '(top, rgb(' +
                        colors[+passed][0] + '), rgb(' +
                        colors[+passed][1] + '))'
                });
            });
            $.browser.msie && $element.css({
                    background: 'rgb(' + colors[+passed][0] + ')'
            });
        }

    });

});