From 8067bc3863400fa5f411e7d939bb146273aa9697 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=89ric=20Lemoine?= <eric.lemoine@gmail.com>
Date: Thu, 9 Oct 2014 13:22:01 +0200
Subject: [PATCH] Show how to wrap world in xyz-esri-4326-512 example

---
 examples/xyz-esri-4326-512.js | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/examples/xyz-esri-4326-512.js b/examples/xyz-esri-4326-512.js
index 0b84f053ad..c10c5d270b 100644
--- a/examples/xyz-esri-4326-512.js
+++ b/examples/xyz-esri-4326-512.js
@@ -28,8 +28,8 @@ for (z = 0; z < 16; ++z) {
   resolutions[z] = maxResolution / Math.pow(2, z);
 }
 
-var url = 'http://services.arcgisonline.com/arcgis/rest/services/' +
-    'ESRI_Imagery_World_2D/MapServer/tile/';
+var urlTemplate = 'http://services.arcgisonline.com/arcgis/rest/services/' +
+    'ESRI_Imagery_World_2D/MapServer/tile/{z}/{y}/{x}';
 
 var map = new ol.Map({
   target: 'map',
@@ -39,8 +39,20 @@ var map = new ol.Map({
       source: new ol.source.TileImage({
         attributions: [attribution],
         tileUrlFunction: function(tileCoord, pixelRatio, projection) {
-          return url + tileCoord[0] + '/' + (-tileCoord[2] - 1) + '/' +
-              tileCoord[1];
+          var z = tileCoord[0];
+          var x = tileCoord[1];
+          var y = -tileCoord[2] - 1;
+          // wrap the world on the X axis
+          var n = Math.pow(2, z + 1); // 2 tiles at z=0
+          x = x % n;
+          if (x * n < 0) {
+            // x and n differ in sign so add n to wrap the result
+            // to the correct sign
+            x = x + n;
+          }
+          return urlTemplate.replace('{z}', z.toString())
+              .replace('{y}', y.toString())
+              .replace('{x}', x.toString());
         },
         projection: projection,
         tileGrid: new ol.tilegrid.TileGrid({