<!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/jquery-1.3.2.js"></script>
        <script type="text/javascript" src="../build/js/ox.js"></script>
        <script>
            $(function() {
                var $body = $("body"),
                    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"
                    ;
                $.get("http://google.com", function(data) {
                    var str = data; //data.substr(0, 2048);
                    $("<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>