1 var map_config;

     2 var map;

     3 

     4 L.Control.Link = L.Control.extend({

     5     options: {

     6         position: 'topright',

     7         url: null,

     8     },

     9 

    10     onAdd: function (map) {

    11         var container = L.DomUtil.create('div', 'leaflet-control-link');

    12 

    13         var link = this.link = L.DomUtil.create('a', 'leaflet-control-link-link', container);

    14 

    15         map.on('move', this._update, this);

    16 

    17         return container;

    18     },

    19 

    20     onRemove: function (map) {

    21         map.off('move', this._update, this);

    22     },

    23 

    24     _update: function (e) {

    25         var map_center = map.getCenter();

    26         var map_zoom = map.getZoom();

    27         var size = map.getSize();

    28         

    29         var x = (+map_center.lng) * Math.pow(2, map_config.tile_zoom);

    30         var y = (-map_center.lat) * Math.pow(2, map_config.tile_zoom);

    31         var zoom = map_config.tile_zoom - map_zoom;

    32 

    33         var state = {

    34             w: size.x,

    35             h: size.y,

    36             x: x >> zoom,

    37             y: y >> zoom,

    38             z: zoom

    39         };

    40 

    41         var url = L.Util.template(this.options.url, L.extend(state, this.options));

    42         

    43         this.link.href = url;

    44 

    45         with (state) {

    46             this.link.innerHTML = w + 'x' + h + ' @ (' + x + ', ' + y + ') @ ' + z;

    47         }

    48     },

    49 });

    50 

    51 L.control.link = function (options) {

    52     return new L.Control.Link(options);

    53 };

    54 

    55 function map_init (_config) {

    56     map_config = _config;

    57     

    58     // pixel coordinates

    59     var bounds = L.latLngBounds(

    60         L.latLng(-map_config.image_height, 0),

    61         L.latLng(0, +map_config.image_width)

    62     );

    63     

    64     // in zoom-scaled coordinates

    65     var map_bounds = [

    66         [ -(map_config.image_height >> map_config.tile_zoom), 0 ],

    67         [ 0, +(map_config.image_width >> map_config.tile_zoom) ], 

    68     ];

    69 

    70     map = L.map('map', {

    71         crs: L              .CRS.Simple,

    72         minZoom:            0,

    73         maxZoom:            map_config.tile_zoom,

    74         maxBounds:          map_bounds

    75     });

    76 

    77     map.on('move', map_move);

    78 

    79     L.tileLayer(map_config.tile_url, {

    80         tiles_url:          map_config.tiles_url,

    81         tiles_mtime:        map_config.tiles_mtime,

    82         minZoom:            0,

    83         maxZoom:            map_config.tile_zoom,

    84         tileSize:           map_config.tile_size,

    85         continuousWorld:    true,

    86         noWrap:             true,

    87         zoomReverse:        true,

    88         bounds:             bounds

    89     }).addTo(map);

    90 

    91     // controls

    92     L.control.link({

    93         url:        map_config.image_url,

    94         tiles_url:  map_config.tiles_url,

    95         tiles_mtime:        map_config.tiles_mtime,

    96     }).addTo(map);

    97 

    98     // set position

    99     var x = bounds.getCenter().lng;

   100     var y = -bounds.getCenter().lat;

   101     var z = 0;

   102 

   103     if (document.location.hash) {

   104         // parse x:y:z tuple

   105         var pt = document.location.hash.substr(1).split(":");

   106         

   107         // unpack    

   108         if (pt.length) x = parseInt(pt.shift()) || x;

   109         if (pt.length) y = parseInt(pt.shift()) || y;

   110         if (pt.length) z = parseInt(pt.shift()) || z;

   111     }

   112 

   113     map_center(x, y, z);

   114 }

   115 

   116 function map_move () {

   117     var map_center = map.getCenter();

   118     var map_zoom = map.getZoom();

   119 

   120     var x = (+map_center.lng) << map_config.tile_zoom;

   121     var y = (-map_center.lat) << map_config.tile_zoom;

   122     var z = map_config.tile_zoom - map_zoom;

   123 

   124     document.location.hash = x + ":" + y + ":" + z;

   125 }

   126 

   127 /*

   128  * Position map based on pngtile coordinates

   129  */

   130 function map_center (x, y, z) {

   131     // translate to lat/lng

   132     // leaflet seems to base its latlng coordinates on the max zoom level

   133     var map_center = [

   134         -(y >> map_config.tile_zoom),

   135         +(x >> map_config.tile_zoom),

   136     ];

   137 

   138     // reversed zoom

   139     var map_zoom = map_config.tile_zoom - z;

   140     

   141     map.setView(map_center, map_zoom);

   142 }

   143