<!DOCTYPE html>
<html>
    <head>
        <title>Ox.js PNG Test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <style>
            div {
                font-family: Consolas;
                font-size: 12px;
            }
        </style>
        <script type="text/javascript" src="../build/js/Ox.js"></script>
        <script>
        $(function() {
            var $body = $('body'),
                src = 'v78.png'
                //src = 'http://khm0.google.com/kh/v=46&x=0&y=0&z=0',
                //src = 'http://www.google.com/intl/en_ALL/images/logo.gif',
                //src = 'http://www.google.com/favicon.ico',
                //src = 'http://images.apple.com/global/nav/images/globalnavbg.png',
                //src = 'http://a1.twimg.com/a/1257210731/images/logo.png',
                //src = 'http://l.yimg.com/g/images/logo_home.png',
                //src = 'http://www.libpng.org/pub/png/img_png/png-9passes.png'
                //src = 'http://www.libpng.org/pub/png/img_png/libpng-88x31.png'
                //str = '¥€$',
                str = 'H€₤₤O ₩OR₤D';

            $('<img/>')
                .attr({
                    src: src
                })
                .load(function() {
                    var that = this;
                    Ox.print('encoding');
                    $('<img/>')
                        .attr({
                            src: Ox.encodePNG(that, str)
                        })
                        .load(function() {
                            Ox.print('decoding');
                            $('<div/>')
                                .html('[decoding original, should throw an error] ' + (function() {
                                    var ret;
                                    try {
                                        ret = Ox.decodePNG(that);
                                        ret = '[' + ret.length + ' bytes] ' + Ox.encodeHTML(ret);
                                    } catch (e) {
                                        ret = e.toString()
                                    }
                                    return ret;
                                }()) + '<br/>[decoding encoded, should return a string] ' + Ox.encodeHTML(Ox.decodePNG(this)))
                                .prependTo($body);
                        })
                        .appendTo($body);
                });
        });
        </script>
    </head>
    <body></body>
</html>