summaryrefslogtreecommitdiff
path: root/misc/openlayers/tests/Control/CacheWrite.html
blob: 9922569332ed91fcc91852e6d1e4001255ab9696 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<html>
<head>
    <script src="../OLLoader.js"></script>
    <script type="text/javascript">
    function test_addLayer_removeLayer(t) {
        t.plan(6);
        var control = new OpenLayers.Control.CacheWrite();
        var map = new OpenLayers.Map({
            div: "map",
            controls: [control],
            layers: [
                new OpenLayers.Layer.WMS("One"),
                new OpenLayers.Layer.WMS("Two")
            ]
        });
        t.ok(map.layers[0].events.listeners.tileloaded, "tileloaded listener registered on layer One");
        t.ok(map.layers[1].events.listeners.tileloaded, "tileloaded listener registered on layer Two");        
        control.destroy();
        t.ok(!map.layers[1].events.listeners.tileloaded.length, "tileloaded listener unregistered");        
        
        control = new OpenLayers.Control.CacheWrite({
            layers: [map.layers[0]]
        });
        map.addControl(control);
        t.ok(map.layers[0].events.listeners.tileloaded.length, "tileloaded listener registered on layer One");
        t.ok(!map.layers[1].events.listeners.tileloaded.length, "tileloaded listener not registered on layer Two");
        control.destroy();        
        t.ok(!map.layers[0].events.listeners.tileloaded.length, "tileloaded listener unregistered");
        
        map.destroy();
    }
    
    function test_cache_clearCache(t) {

        if (!window.localStorage) {
            t.plan(2);
            var scope = {active: true};
            t.eq(OpenLayers.Control.CacheWrite.prototype.cache.call(scope), undefined, "no tiles cached when localStorage is not supported.");
            t.ok(!OpenLayers.Control.CacheWrite.clearCache(), "clearCache does nothing when localStorage is not supported.");
            return;
        }

        t.plan(4);
        OpenLayers.Control.CacheWrite.clearCache();
        var length = window.localStorage.length;
        
        var tiles = 0;
        var layer = new OpenLayers.Layer.XYZ("One", "../../img/blank.gif?${x},${y},${z}", {
            eventListeners: {
                tileloaded: function() {
                    tiles++;
                }
            }
        });
        var control = new OpenLayers.Control.CacheWrite({autoActivate: true});
        var map = new OpenLayers.Map({
            div: "map",
            projection: "EPSG:900913",
            controls: [control],
            layers: [layer],
            zoom: 1,
            center: [0, 0]
        });
        t.delay_call(1, function() {
            var canvasContext = layer.grid[1][1].getCanvasContext();
            t.eq(window.localStorage.length, length + (canvasContext ? tiles : 0), "cache filled with tiles");
            var url = layer.grid[1][1].url;
            // content will be null for browsers that have localStorage but no canvas support
            var content = canvasContext ? canvasContext.canvas.toDataURL("image/png") : null;
            t.eq(window.localStorage.getItem("olCache_"+url), content, "localStorage contains correct image data");

            layer.events.triggerEvent('tileloaded', {aborted: true, tile: layer.grid[1][1]});
            t.eq(window.localStorage.length, length + (canvasContext ? tiles-1 : 0), "tile aborted during load not cached");
            
            var key = Math.random();
            window.localStorage.setItem(key, "bar");
            OpenLayers.Control.CacheWrite.clearCache();
            t.eq(window.localStorage.length, length + 1, "cache cleared, but foreign entries left in localStorage");
            window.localStorage.removeItem(key);
            
            map.destroy();
        });
    }
    
    </script>
</head>
<body>
    <div id="map" style="width: 400px; height: 250px;"/>
</body>
</html>