--- a/pngtile/image.py Mon Sep 15 00:49:15 2014 +0300
+++ b/pngtile/image.py Mon Sep 15 00:49:30 2014 +0300
@@ -47,6 +47,8 @@
tile_size = pngtile.tile.TILE_SIZE,
tile_zoom = pngtile.tile.MAX_ZOOM,
+ image_url = 'http://zovoweix.qmsk.net:8080/{name}?w={w}&h={h}&x={x}&y={y}&zoom={z}',
+ image_name = name,
image_width = image_info['img_width'],
image_height = image_info['img_height'],
)
--- a/static/pngtile/map.css Mon Sep 15 00:49:15 2014 +0300
+++ b/static/pngtile/map.css Mon Sep 15 00:49:30 2014 +0300
@@ -7,3 +7,15 @@
width: 100%;
height: 100%;
}
+
+div.leaflet-control-link {
+
+}
+
+a.leaflet-control-link-link {
+ display: block;
+ background-color: #fff;
+ box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+ padding: 0.5em;
+ border-radius: 4px;
+}
--- a/static/pngtile/map.js Mon Sep 15 00:49:15 2014 +0300
+++ b/static/pngtile/map.js Mon Sep 15 00:49:30 2014 +0300
@@ -1,6 +1,53 @@
var map_config;
var map;
+L.Control.Link = L.Control.extend({
+ options: {
+ position: 'topright',
+ url: null,
+ },
+
+ onAdd: function (map) {
+ var container = L.DomUtil.create('div', 'leaflet-control-link');
+
+ var link = this.link = L.DomUtil.create('a', 'leaflet-control-link-link', container);
+
+ map.on('move', this._update, this);
+
+ return container;
+ },
+
+ onRemove: function (map) {
+ map.off('move', this._update, this);
+ },
+
+ _update: function (e) {
+ var map_center = map.getCenter();
+ var map_zoom = map.getZoom();
+ var size = map.getSize();
+
+ var state = {
+ w: size.x,
+ h: size.y,
+ x: (+map_center.lng) << map_config.tile_zoom,
+ y: (-map_center.lat) << map_config.tile_zoom,
+ z: map_config.tile_zoom - map_zoom,
+ };
+
+ var url = L.Util.template(this.options.url, L.extend(state, this.options));
+
+ this.link.href = url;
+
+ with (state) {
+ this.link.innerHTML = w + 'x' + h + ' @ (' + x + ', ' + y + ') @ ' + z;
+ }
+ },
+});
+
+L.control.link = function (options) {
+ return new L.Control.Link(options);
+};
+
function map_init (_config) {
map_config = _config;
@@ -36,6 +83,12 @@
bounds: bounds
}).addTo(map);
+ // controls
+ L.control.link({
+ url: map_config.image_url,
+ name: map_config.image_name,
+ }).addTo(map);
+
// set position
var x = bounds.getCenter().lng;
var y = -bounds.getCenter().lat;