<html>
<head>
    <script src="../../OLLoader.js"></script>
    <script type="text/javascript">
    // turn off animation frame handling, so we can check img urls in tests
    delete OpenLayers.Layer.Grid.prototype.queueTileDraw;

    var isMozilla = (navigator.userAgent.indexOf("compatible") == -1);
    var isOpera   = (navigator.userAgent.indexOf("Opera") != -1);
    var isIElt9      = (parseFloat(navigator.appVersion.split("MSIE")[1]) < 9);

    var map, layer;
    var position = new OpenLayers.Pixel(20,30);
    var bounds   = new OpenLayers.Bounds(1,2,3,4);
    var url      = "http://www.openlayers.org/dev/tests/tileimage";
    var size     = new OpenLayers.Size(5,6);
    var name     = "OpenaLayers WMS";
    var wmsUrl   = "http://labs.metacarta.com/wms/vmap0?";
    
    function test_Tile_Image_IFrame_create (t) {
        t.plan( 3 );
        map   = new OpenLayers.Map('map', {tileManager: null});
        var bar = new Array(205).join("1234567890");
        layer = new OpenLayers.Layer.WMS(name, wmsUrl,
                                         {layers: 'basic', foo: bar},
                                         {tileOptions: {maxGetUrlLength: 2048},
                                          transitionEffect: 'resize'});
        map.addLayer(layer);

        var tile = layer.addTile(bounds, position);

        tile.draw();
        t.eq(tile.imgDiv.nodeName.toLowerCase(), "iframe", "IFrame used for long URL");
        
        layer.mergeNewParams({foo: null});
        tile.draw();
        t.eq(tile.imgDiv.nodeName.toLowerCase(), "img", "IMG used for short URL");
        
        tile.maxGetUrlLength = 0;
        tile.draw();
        t.eq(tile.imgDiv.nodeName.toLowerCase(), "iframe", "IFrame used when maxGetUrlLength is 0");
        
        tile.destroy();
        layer.destroy();
        map.destroy();
    }

    function test_Tile_Image_IFrame_clear (t) {
        t.plan( 1 );
        
        map   = new OpenLayers.Map('map');
        layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}}); 
        map.addLayer(layer);  
        tile = layer.addTile(bounds, position);
        tile.draw();
        tile.clear();

        t.eq(
            tile.frame.getElementsByTagName("iframe").length, 0,
            "IFrame removed on clear()");
        tile.destroy();
        layer.destroy();
        map.destroy();
    }

    function test_Tile_Image_IFrame_initImage (t) {
        t.plan( 2 );

        map   = new OpenLayers.Map('map');
        layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}}); 
        map.addLayer(layer);  
        tile = layer.addTile(bounds, position);
        tile.url = layer.getURL(bounds);
        tile.initImage();

        if(isMozilla) {
            t.ok( tile.imgDiv instanceof HTMLElement, "tile.iFrame successfully created.");
        }
        else {
            t.ok( tile.imgDiv != null, "tile.iFrame successfully created.");
        }
        t.eq( tile.imgDiv.className, "olTileImage", "iFrame's className correctly set.");

        map.destroy();
    }

    function test_Tile_Image_IFrame_createImage (t) {
        t.plan( 9 );

        map   = new OpenLayers.Map('map', {tileManager: null});
        layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}}); 
        map.addLayer(layer);  
        var tile = layer.addTile(bounds, position);
        tile.draw();
        var iFrame    = tile.imgDiv;
        var eventPane = tile.frame.childNodes[0];

        t.ok(OpenLayers.String.contains(eventPane.style.backgroundImage,
                    tile.blankImageUrl),
             "backgroundImage of eventPane is set.");
        t.eq(parseInt(eventPane.style.zIndex, 10), 1, "zIndex of eventPane is set.");
        if(isIElt9) {
            t.ok(iFrame != null, "IFrame successfully created.");
            t.eq(iFrame.style.backgroundColor, '#ffffff', "backgroundColor correctly set.");
            t.eq(iFrame.style.filter, 'chroma(color=#FFFFFF)', "filter correctly set.");
        } else {
            t.ok(iFrame instanceof HTMLElement, "IFrame successfully created.");
            t.ok(true, 'Skip IFrame backgroundColor test outside IE < 9');
            t.ok(true, 'Skip IFrame filter test outside IE < 9');
        }
        t.eq( iFrame.scrolling, 'no', "no scrolling");
        t.eq( parseFloat(iFrame.marginWidth), 0, "no margin width");
        t.eq( parseFloat(iFrame.marginHeight), 0, "no margin height");
        t.eq( parseFloat(iFrame.frameBorder), 0, "no iframe border");

        map.destroy();
    }

    function test_Tile_Image_IFrame_createRequestForm (t) {
        t.plan( 6 );

        var tParams = {
            SERVICE: "WMS", VERSION: "1.1.1",
            REQUEST: "GetMap", STYLES: "",
            FORMAT: "image/jpeg",
            SRS: "EPSG:4326", BBOX: [1,2,3,4],
            WIDTH: String(size.w), HEIGHT: String(size.h)
        };
        var newLayer = new OpenLayers.Layer.WMS("Name",
                     "http://labs.metacarta.com/TESTURL",
                     tParams,
                     {tileSize: size, tileOptions: {maxGetUrlLength: 0}});  
        map = new OpenLayers.Map('map'); 
        map.addLayer(newLayer);  
        tile = newLayer.addTile(bounds, position);
        tile.url = newLayer.getURL(bounds);
        tile.initImage();

        tile.url = newLayer.getURL(bounds);
        var form = tile.createRequestForm();
        if(isMozilla) {
            t.ok( form instanceof HTMLElement, "created html form successfully.");
        }
        else {
            t.ok( form != null, "created html form successfully.");
        }

        
        var cacheId = newLayer.params["_OLSALT"];
        cacheId     = (cacheId ? cacheId + "_" : "") + tile.bounds.toBBOX();
        var url = OpenLayers.Util.urlAppend(newLayer.url, cacheId);

        t.eq( form.method.toLowerCase(), 'post', "form method correctly set.");
        t.eq( form.target, tile.id+'_iFrame', "form target correctly set.");
        t.eq( form.action, url, "form action correctly set.");

        var formParams = {};
        var children = form.childNodes;
        for(var i=0; i<form.childNodes.length; i++) {
            formParams[children[i].name] = children[i].value
        }
        newLayer.params.BBOX = newLayer.params.BBOX.join(",");
        t.eq(newLayer.params, formParams, "html form elements equal layer's parameters.");

        tile.draw();
        tile.clear();
        tile.initImage();
        tile.createRequestForm();
        t.ok(
            tile.imgDiv.nodeName == "IFRAME",
            "Iframe has been reinserted properly"
        );
        
        tile.destroy();
        newLayer.destroy();
        map.destroy();
    }
</script>
</head>
<body>
<div id="map" style="height:550px;width:500px"></div>
</body>
</html>