1 (function ($, undefined) {
2 $.geo._serviceTypes.shingled = (function () {
4 create: function (map, serviceContainer, service, index) {
5 var serviceState = $.data(service, "geoServiceState");
12 var scHtml = '<div data-geo-service="shingled" style="position:absolute; left:0; top:0; width:16px; height:16px; margin:0; padding:0;"></div>';
14 serviceContainer.append(scHtml);
16 serviceState.serviceContainer = serviceContainer.children(":last");
17 $.data(service, "geoServiceState", serviceState);
20 return serviceState.serviceContainer;
23 destroy: function (map, serviceContainer, service) {
24 var serviceState = $.data(service, "geoServiceState");
26 serviceState.serviceContainer.remove();
28 $.removeData(service, "geoServiceState");
31 interactivePan: function (map, service, dx, dy) {
32 var serviceState = $.data(service, "geoServiceState");
35 this._cancelUnloaded(map, service);
37 var serviceContainer = serviceState.serviceContainer,
38 pixelSize = map._pixelSize,
39 scaleContainer = serviceContainer.children("[data-pixelSize='" + pixelSize + "']"),
40 panContainer = scaleContainer.children("div");
42 if ( !panContainer.length ) {
43 scaleContainer.children("img").wrap('<div style="position:absolute; left:0; top:0; width:100%; height:100%;"></div>');
44 panContainer = scaleContainer.children("div");
48 left: function (index, value) {
49 return parseInt(value) + dx;
51 top: function (index, value) {
52 return parseInt(value) + dy;
56 // until pan/zoom rewrite, remove all containers not in this scale
57 serviceContainer.children(":not([data-pixelSize='" + pixelSize + "'])").remove();
61 interactiveScale: function (map, service, center, pixelSize) {
62 var serviceState = $.data(service, "geoServiceState");
65 this._cancelUnloaded(map, service);
67 var serviceContainer = serviceState.serviceContainer,
69 contentBounds = map._getContentBounds(),
70 mapWidth = contentBounds["width"],
71 mapHeight = contentBounds["height"],
73 halfWidth = mapWidth / 2,
74 halfHeight = mapHeight / 2,
76 bbox = [center[0] - halfWidth, center[1] - halfHeight, center[0] + halfWidth, center[1] + halfHeight];
78 serviceContainer.children().each(function (i) {
79 var $scaleContainer = $(this),
80 scalePixelSize = $scaleContainer.attr("data-pixelSize"),
81 ratio = scalePixelSize / pixelSize;
83 $scaleContainer.css( {
84 width: mapWidth * ratio,
85 height: mapHeight * ratio } ).children("img").each(function (i) {
87 imgCenter = $img.data("center"),
88 x = (Math.round((imgCenter[0] - center[0]) / scalePixelSize) - halfWidth) * ratio,
89 y = (Math.round((center[1] - imgCenter[1]) / scalePixelSize) - halfHeight) * ratio;
91 $img.css({ left: x + "px", top: y + "px" });
97 refresh: function (map, service) {
98 var serviceState = $.data(service, "geoServiceState");
100 this._cancelUnloaded(map, service);
102 if ( serviceState && service && service.style.visibility === "visible" && !( serviceState.serviceContainer.is( ":hidden" ) ) ) {
104 var bbox = map._getBbox(),
105 pixelSize = map._pixelSize,
108 serviceContainer = serviceState.serviceContainer,
110 contentBounds = map._getContentBounds(),
111 mapWidth = contentBounds["width"],
112 mapHeight = contentBounds["height"],
114 halfWidth = mapWidth / 2,
115 halfHeight = mapHeight / 2,
117 scaleContainer = serviceContainer.children('[data-pixelSize="' + pixelSize + '"]'),
119 opacity = service.style.opacity,
123 if ( !scaleContainer.size() ) {
124 serviceContainer.append('<div style="position:absolute; left:' + halfWidth + 'px; top:' + halfHeight + 'px; width:' + mapWidth + 'px; height:' + mapHeight + 'px; margin:0; padding:0;" data-pixelSize="' + pixelSize + '"></div>');
125 scaleContainer = serviceContainer.children(":last");
128 scaleContainer.children("img").each(function (i) {
129 var $thisimg = $(this),
130 imgCenter = $thisimg.data("center"),
131 center = map._getCenter(),
132 x = Math.round((imgCenter[0] - center[0]) / pixelSize) - halfWidth,
133 y = Math.round((center[1] - imgCenter[1]) / pixelSize) - halfHeight;
135 $thisimg.css({ left: x + "px", top: y + "px" });
139 serviceContainer.find("img").attr("data-keepAlive", "0");
142 var urlProp = ( service.hasOwnProperty("src") ? "src" : "getUrl" ),
147 zoom: map._getZoom(),
151 isFunc = $.isFunction( service[ urlProp ] ),
156 imageUrl = service[ urlProp ]( urlArgs );
158 $.template( "geoSrc", service[ urlProp ] );
159 imageUrl = $.render( urlArgs, "geoSrc" );
162 serviceState.loadCount++;
163 //this._map._requestQueued();
165 scaleContainer.append('<img style="position:absolute; left:-' + halfWidth + 'px; top:-' + halfHeight + 'px; width:100%; height:100%; margin:0; padding:0; -khtml-user-select:none; -moz-user-select:none; -webkit-user-select:none; user-select:none; display:none;" unselectable="on" />');
166 $img = scaleContainer.children(":last").data("center", map._getCenter());
168 if ( typeof imageUrl === "string" ) {
169 serviceObj._loadImage( $img, imageUrl, pixelSize, serviceState, serviceContainer, opacity );
172 imageUrl.done( function( url ) {
173 serviceObj._loadImage( $img, url, pixelSize, serviceState, serviceContainer, opacity );
174 } ).fail( function( ) {
176 serviceState.loadCount--;
183 resize: function (map, service) {
184 var serviceState = $.data(service, "geoServiceState");
186 if ( serviceState && service && service.style.visibility === "visible" ) {
187 this._cancelUnloaded(map, service);
189 var serviceContainer = serviceState.serviceContainer,
191 contentBounds = map._getContentBounds(),
192 mapWidth = contentBounds["width"],
193 mapHeight = contentBounds["height"],
195 halfWidth = mapWidth / 2,
196 halfHeight = mapHeight / 2,
198 scaleContainer = serviceContainer.children();
200 scaleContainer.attr("data-pixelSize", "0");
202 left: halfWidth + 'px',
203 top: halfHeight + 'px'
208 opacity: function ( map, service ) {
209 var serviceState = $.data( service, "geoServiceState" );
210 serviceState.serviceContainer.find( "img" ).stop( true ).fadeTo( "fast", service.style.opacity );
213 toggle: function (map, service) {
214 var serviceState = $.data(service, "geoServiceState");
215 serviceState.serviceContainer.css("display", service.style.visibility === "visible" ? "block" : "none");
218 _cancelUnloaded: function (map, service) {
219 var serviceState = $.data(service, "geoServiceState");
221 if (serviceState && serviceState.loadCount > 0) {
222 serviceState.serviceContainer.find("img:hidden").remove();
223 while (serviceState.loadCount > 0) {
224 serviceState.loadCount--;
229 _loadImage: function ( $img, url, pixelSize, serviceState, serviceContainer, opacity ) {
230 $img.load(function (e) {
232 $(e.target).fadeTo(0, opacity);
237 serviceState.loadCount--;
239 if (serviceState.loadCount <= 0) {
240 serviceContainer.children(':not([data-pixelSize="' + pixelSize + '"])').remove();
242 var panContainer = serviceContainer.find('[data-pixelSize="' + pixelSize + '"]>div');
243 if (panContainer.size() > 0) {
244 var panContainerPos = panContainer.position();
246 panContainer.children("img").each(function (i) {
247 var $thisimg = $(this),
248 x = panContainerPos.left + parseInt($thisimg.css("left")),
249 y = panContainerPos.top + parseInt($thisimg.css("top"));
251 $thisimg.css({ left: x + "px", top: y + "px" });
254 panContainer.remove();
257 serviceState.loadCount = 0;
259 }).error(function (e) {
260 $(e.target).remove();
261 serviceState.loadCount--;
263 if (serviceState.loadCount <= 0) {
264 serviceContainer.children(":not([data-pixelSize='" + pixelSize + "'])").remove();
265 serviceState.loadCount = 0;