~mortenoh/+junk/dhis2-detailed-import-export

« back to all changes in this revision

Viewing changes to gis/dhis-gis-geostat/mfbase/openlayers/tests/manual/tiles-loading.html

  • Committer: larshelge at gmail
  • Date: 2009-03-03 16:46:36 UTC
  • Revision ID: larshelge@gmail.com-20090303164636-2sjlrquo7ib1gf7r
Initial check-in

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
<html xmlns="http://www.w3.org/1999/xhtml">
 
2
  <head>
 
3
    <title>Tiles Loading Acceptance Test</title>
 
4
    <style type="text/css">
 
5
        body {
 
6
            font-size: 0.8em;
 
7
        }
 
8
        p {
 
9
            padding-top: 1em;
 
10
        }
 
11
        #map {
 
12
            margin: 1em;
 
13
            float: left;
 
14
            width: 512px;
 
15
            height: 512px;
 
16
        }
 
17
    </style>
 
18
 
 
19
    <script src='http://maps.google.com/maps?file=api&amp;v=2.82&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
 
20
    <script src="../../lib/OpenLayers.js"></script>
 
21
    <script type="text/javascript">
 
22
        // make map available for easy debugging
 
23
        var map;
 
24
 
 
25
        // avoid pink tiles
 
26
        OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
 
27
        OpenLayers.Util.onImageLoadErrorColor = "transparent";
 
28
 
 
29
        function init(){
 
30
            var options = {
 
31
                controls: [],
 
32
                projection: "EPSG:900913",
 
33
                units: "m",
 
34
                maxResolution: 156543.0339,
 
35
                maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
 
36
                                                 20037508, 20037508.34)
 
37
            };
 
38
            map = new OpenLayers.Map('map', options);
 
39
            // create Google Mercator layers
 
40
            var gmap = new OpenLayers.Layer.Google(
 
41
                "Google Streets",
 
42
                {'sphericalMercator': true}
 
43
            );
 
44
            // create WMS layer
 
45
            var wmsMaxResolution = 78271.51695;
 
46
            var wms = new OpenLayers.Layer.WMS(
 
47
                "World Map",
 
48
                "http://world.freemap.in/tiles/",
 
49
                {'layers': 'factbook-overlay', 'format':'png'},
 
50
                {
 
51
                    'opacity': 0.4,
 
52
                    'isBaseLayer': false,
 
53
                    'wrapDateLine': true,
 
54
                    'buffer': 0,
 
55
                    'maxResolution' : wmsMaxResolution
 
56
                }
 
57
            );
 
58
            map.addLayers([gmap, wms]);
 
59
            map.addControl(new OpenLayers.Control.Navigation());
 
60
            map.addControl(new OpenLayers.Control.LayerSwitcher());
 
61
            map.addControl(new OpenLayers.Control.PanZoomBar());
 
62
 
 
63
            function onLayerChanged() {
 
64
                var html = '<p>WMS Layer state - in range: '
 
65
                    + this.inRange
 
66
                    + ', visibility: '
 
67
                    + this.visibility;
 
68
                    + '</p>';
 
69
                document.getElementById('layerstate').innerHTML = html;
 
70
            }
 
71
            map.events.register('changelayer', wms, onLayerChanged);
 
72
 
 
73
            function onTileLoaded() {
 
74
                var html = '<p>Message: ';
 
75
                if (this.numLoadingTiles > 0) {
 
76
                    html += 'Loading tiles...';
 
77
                } else {
 
78
                    html += 'Done loading tiles';
 
79
                }
 
80
                html += '</p>';
 
81
                document.getElementById('tilesloading').innerHTML = html;
 
82
            }
 
83
            wms.events.register('tileloaded', wms, onTileLoaded);
 
84
 
 
85
            map.zoomToMaxExtent()
 
86
        }
 
87
    </script>
 
88
  </head>
 
89
  <body onload="init()">
 
90
    <div id="map"></div>
 
91
    <p>
 
92
 
 
93
      <b>Test 0</b> : at the initial zoom the WMS layer is in range, you should
 
94
      therefore see the 'Loading tiles...' message when loading the page for
 
95
      the first time.
 
96
 
 
97
    </p>
 
98
    <p>
 
99
 
 
100
      <b>Test 1</b> : If you zoom out by one level (using the zoombar), the WMS
 
101
      layer becomes out of range. No tile should be loaded so you shouldn't see
 
102
      the 'Loading tiles...' message.
 
103
 
 
104
    </p>
 
105
    <p>
 
106
 
 
107
      <b>Test 2</b> : Zoom in by one level to go back to initial state (the WMS
 
108
      is back). Open the layer switcher and turn off the WMS layer. No tile
 
109
      should be loaded so you shouldn't see the 'Loading tiles...' message.
 
110
 
 
111
    </p>
 
112
    <p>
 
113
 
 
114
      <b>Test 3</b> : Keep the WMS layer turned off in the layer switcher. Zoom
 
115
      out by one level again. The layer is both invisible and out of range, so
 
116
      you shouldn't see the 'Loading tiles...' message.
 
117
 
 
118
    </p>
 
119
    <div id="layerstate"><p>WMS Layer state - in range: true, visibility: true</p></div>
 
120
    <div id="tilesloading"><p>Message:</p></div>
 
121
  </body>
 
122
</html>