Image.js
7.31 KB
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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
/* Copyright (c) 2006 MetaCarta, Inc., published under the BSD license.
* See http://svn.openlayers.org/trunk/openlayers/release-license.txt
* for the full text of the license. */
/**
* @class
*
* @requires OpenLayers/Tile.js
*/
OpenLayers.Tile.Image = OpenLayers.Class.create();
OpenLayers.Tile.Image.prototype =
OpenLayers.Class.inherit( OpenLayers.Tile, {
/** @type String */
url: null,
/** @type DOMElement img */
imgDiv: null,
/**
* The image element is appended to the frame. Any gutter on the image
* will be hidden behind the frame.
*
* @type DOMElement div */
frame: null,
/** TBD 3.0 - reorder the parameters to the init function to put URL
* as last, so we can continue to call tile.initialize()
* without changing the arguments.
*
* @constructor
*
* @param {OpenLayers.Grid} layer
* @param {OpenLayers.Pixel} position
* @param {OpenLayers.Bounds} bounds
* @param {String} url
* @param {OpenLayers.Size} size
*/
initialize: function(layer, position, bounds, url, size) {
OpenLayers.Tile.prototype.initialize.apply(this, arguments);
this.url = url;
this.frame = document.createElement('div');
this.frame.style.overflow = 'hidden';
this.frame.style.position = 'absolute';
},
/**
*
*/
destroy: function() {
if (this.imgDiv != null) {
OpenLayers.Event.stopObservingElement(this.imgDiv.id);
if (this.imgDiv.parentNode == this.frame) {
this.frame.removeChild(this.imgDiv);
this.imgDiv.map = null;
}
}
this.imgDiv = null;
if ((this.frame != null) && (this.frame.parentNode == this.layer.div)) {
this.layer.div.removeChild(this.frame);
}
this.frame = null;
OpenLayers.Tile.prototype.destroy.apply(this, arguments);
},
/**
*
*/
draw:function() {
if (this.layer != this.layer.map.baseLayer && this.layer.reproject) {
this.bounds = this.getBoundsFromBaseLayer(this.position);
}
if (!OpenLayers.Tile.prototype.draw.apply(this, arguments)) {
return false;
}
if (this.imgDiv == null) {
this.initImgDiv();
}
this.imgDiv.viewRequestID = this.layer.map.viewRequestID;
this.url = this.layer.getURL(this.bounds);
// position the frame
OpenLayers.Util.modifyDOMElement(this.frame,
null, this.position, this.size);
if (this.layer.alpha) {
OpenLayers.Util.modifyAlphaImageDiv(this.imgDiv,
null, null, this.layer.imageSize, this.url);
} else {
this.imgDiv.src = this.url;
OpenLayers.Util.modifyDOMElement(this.imgDiv,
null, null, this.layer.imageSize) ;
}
this.drawn = true;
return true;
},
/** Clear the tile of any bounds/position-related data so that it can
* be reused in a new location.
*/
clear: function() {
OpenLayers.Tile.prototype.clear.apply(this, arguments);
if(this.imgDiv) {
this.imgDiv.style.display = "none";
}
},
/**
* @param {OpenLayers.Bounds}
* @param {OpenLayers.pixel} position
* @param {Boolean} redraw
*/
moveTo: function (bounds, position, redraw) {
if (this.layer != this.layer.map.baseLayer && this.layer.reproject) {
bounds = this.getBoundsFromBaseLayer(position);
}
this.url = this.layer.getURL(bounds);
OpenLayers.Tile.prototype.moveTo.apply(this, arguments);
},
/**
*
*/
initImgDiv: function() {
if (this.layer.alpha) {
this.imgDiv = OpenLayers.Util.createAlphaImageDiv(null,
this.layer.imageOffset,
this.layer.imageSize,
null,
"relative",
null,
null,
null,
true);
} else {
this.imgDiv = OpenLayers.Util.createImage(null,
this.layer.imageOffset,
this.layer.imageSize,
null,
"relative",
null,
null,
true);
}
this.imgDiv.className = 'olTileImage';
/* checkImgURL used to be used to called as a work around, but it
ended up hiding problems instead of solving them and broke things
like relative URLs. See discussion on the dev list:
http://openlayers.org/pipermail/dev/2007-January/000205.html
OpenLayers.Event.observe( this.imgDiv, "load",
this.checkImgURL.bindAsEventListener(this) );
*/
this.frame.appendChild(this.imgDiv);
this.layer.div.appendChild(this.frame);
if(this.layer.opacity != null) {
OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
null, null, null,
this.layer.opacity);
}
// we need this reference to check back the viewRequestID
this.imgDiv.map = this.layer.map;
},
/**
* Make sure that the image that just loaded is the one this tile is meant
* to display, since panning/zooming might have changed the tile's URL in
* the meantime. If the tile URL did change before the image loaded, set
* the imgDiv display to 'none', as either (a) it will be reset to visible
* when the new URL loads in the image, or (b) we don't want to display
* this tile after all because its new bounds are outside our maxExtent.
*
* This function should no longer be neccesary with the improvements to
* Grid.js in OpenLayers 2.3. The lack of a good isEquivilantURL function
* caused problems in 2.2, but it's possible that with the improved
* isEquivilant URL function, this might be neccesary at some point.
*
* See discussion in the thread at
* http://openlayers.org/pipermail/dev/2007-January/000205.html
*
* @private
*/
checkImgURL: function () {
// Sometimes our image will load after it has already been removed
// from the map, in which case this check is not needed.
if (this.layer) {
var loaded = this.layer.alpha ? this.imgDiv.firstChild.src : this.imgDiv.src;
if (!OpenLayers.Util.isEquivalentUrl(loaded, this.url)) {
this.imgDiv.style.display = "none";
}
}
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Tile.Image"
}
);