function JoyZoomInterface(map, params) {
	this.map = map; // map interface object

	this.zoomMin = 7;
	if (params && params.zoomMin) this.zoomMin = params.zoomMin;
	this.zoomMax = 19;
	
	this.imgPath = 'https://www.cykloserver.cz/img/';

	this._create = function() {
		this.node = document.createElement('div');
		this.node.style.position = "absolute";
		this.node.style.zIndex = "2000";
		this.node.style.marginTop = "295px";
		this.node.style.marginLeft = "15px";
					
		this.nodebtnup = document.createElement('div');
		this.nodebtnup.style.position = "absolute";
		this.nodebtnup.style.width = "22px";
		this.nodebtnup.style.height = "23px";
		this.nodebtnup.style.marginTop = "0px";
		this.nodebtnup.style.marginLeft = "22px";
		this.nodebtnup.style.background = "url('"+this.imgPath+"map_nav_up.gif')";
		this.nodebtnup.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnup);

		this.nodebtnleft = document.createElement('div');
		this.nodebtnleft.style.position = "absolute";
		this.nodebtnleft.style.width = "23px";
		this.nodebtnleft.style.height = "22px";
		this.nodebtnleft.style.marginTop = "22px";
		this.nodebtnleft.style.marginLeft = "0px";
		this.nodebtnleft.style.background = "url('"+this.imgPath+"map_nav_left.gif')";
		this.nodebtnleft.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnleft);

		this.nodebtnright = document.createElement('div');
		this.nodebtnright.style.position = "absolute";
		this.nodebtnright.style.width = "23px";
		this.nodebtnright.style.height = "22px";
		this.nodebtnright.style.marginTop = "22px";
		this.nodebtnright.style.marginLeft = "43px";
		this.nodebtnright.style.background = "url('"+this.imgPath+"map_nav_right.gif')";
		this.nodebtnright.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnright);

		this.nodebtndown = document.createElement('div');
		this.nodebtndown.style.position = "absolute";
		this.nodebtndown.style.width = "22px";
		this.nodebtndown.style.height = "23px";
		this.nodebtndown.style.marginTop = "43px";
		this.nodebtndown.style.marginLeft = "22px";
		this.nodebtndown.style.background = "url('"+this.imgPath+"map_nav_down.gif')";
		this.nodebtndown.style.cursor = "pointer";
		this.node.appendChild(this.nodebtndown);
		
		this.nodebtnzoomin = document.createElement('div');
		this.nodebtnzoomin.style.position = "absolute";
		this.nodebtnzoomin.style.width = "23px";
		this.nodebtnzoomin.style.height = "22px";
		this.nodebtnzoomin.style.marginTop = "75px";
		this.nodebtnzoomin.style.marginLeft = "22px";
		this.nodebtnzoomin.style.background = "url('"+this.imgPath+"map_nav_zi.gif')";
		this.nodebtnzoomin.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnzoomin);
		
		this.nodebtnzoomtop = document.createElement('div');
		this.nodebtnzoomtop.style.position = "absolute";
		this.nodebtnzoomtop.style.width = "18px";
		this.nodebtnzoomtop.style.height = "7px";
		this.nodebtnzoomtop.style.marginTop = "96px";
		this.nodebtnzoomtop.style.marginLeft = "24px";
		this.nodebtnzoomtop.style.background = "url('"+this.imgPath+"map_nav_zt.gif')";
		this.node.appendChild(this.nodebtnzoomtop);
					
		this.nodebtnzoomlvl = new Array();
		for (var ti = this.zoomMin; ti <= this.zoomMax; ti++) {
			var ti2 = this.nodebtnzoomlvl.length;
			this.nodebtnzoomlvl[ti2] = document.createElement('div');
			this.nodebtnzoomlvl[ti2].style.position = "absolute";
			this.nodebtnzoomlvl[ti2].style.width = "18px";
			this.nodebtnzoomlvl[ti2].style.height = "9px";
			this.nodebtnzoomlvl[ti2].style.marginTop = (103 + ti2 * 9)+"px";
			this.nodebtnzoomlvl[ti2].style.marginLeft = "24px";
			this.nodebtnzoomlvl[ti2].style.background = "url('"+this.imgPath+"map_nav_zv.gif')";
			this.node.appendChild(this.nodebtnzoomlvl[ti2]);
		}

		this.nodebtnzoombottom = document.createElement('div');
		this.nodebtnzoombottom.style.position = "absolute";
		this.nodebtnzoombottom.style.width = "18px";
		this.nodebtnzoombottom.style.height = "7px";
		this.nodebtnzoombottom.style.marginTop = (103 + (this.zoomMax - this.zoomMin + 1) * 9)+"px";
		this.nodebtnzoombottom.style.marginLeft = "24px";
		this.nodebtnzoombottom.style.background = "url('"+this.imgPath+"map_nav_zb.gif')";
		this.node.appendChild(this.nodebtnzoombottom);
		
		this.nodebtnzoomout = document.createElement('div');
		this.nodebtnzoomout.style.position = "absolute";
		this.nodebtnzoomout.style.width = "23px";
		this.nodebtnzoomout.style.height = "22px";
		this.nodebtnzoomout.style.marginTop = (110 + (this.zoomMax - this.zoomMin + 1) * 9)+"px";
		this.nodebtnzoomout.style.marginLeft = "22px";
		this.nodebtnzoomout.style.background = "url('"+this.imgPath+"map_nav_zo.gif')";
		this.nodebtnzoomout.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnzoomout);
		
		this.nodebtnzoomsliderbound = document.createElement('div');
		this.nodebtnzoomsliderbound.style.position = "absolute";
		this.nodebtnzoomsliderbound.style.width = "25px";
		this.nodebtnzoomsliderbound.style.height = ((this.zoomMax - this.zoomMin + 1) * 9)+"px";
		this.nodebtnzoomsliderbound.style.marginTop = "103px";
		this.nodebtnzoomsliderbound.style.marginLeft = "21px";
		this.nodebtnzoomsliderbound.style.cursor = "pointer";
		this.node.appendChild(this.nodebtnzoomsliderbound);

		this.nodebtnzoomslider = document.createElement('div');
		this.nodebtnzoomslider.style.position = "absolute";
		this.nodebtnzoomslider.style.width = "25px";
		this.nodebtnzoomslider.style.height = "9px";
		this.nodebtnzoomslider.style.background = "url('"+this.imgPath+"map_nav_slider.gif')";
		this.nodebtnzoomsliderbound.appendChild(this.nodebtnzoomslider);
		
		this.map.map.getViewport().appendChild(this.node);
		
		this.attachEvents();
		
		this.updateRider();
	}
	
	this.updateRider = function() {
		var zl = this.map.getZoom();
		if (this.zoomMax < zl) zl = this.zoomMax;
		if (this.zoomMin > zl) zl = this.zoomMin;
		this.nodebtnzoomslider.style.top = ((this.zoomMax - zl) * 9) + 'px';
	}
	
	this.onZoomEnd = function() {
		this.updateRider();
	}
	
	this.dragEnd = function() {
		var h = this.nodebtnzoomslider.style.top.replace(/px/g, "");
		var zl = this.zoomMax - Math.round(h / 9);
		if (this.zoomMax < zl) zl = this.zoomMax;
		if (this.zoomMin > zl) zl = this.zoomMin;
		this.map.setZoom(zl);
		return true;
	}
	
	this.zoomClick = function(a, b) {
		var h = (a.layerY?a.layerY:a.offsetY) - 5;
		var zl = this.zoomMax - Math.round(h / 9);
		if (this.zoomMax < zl) zl = this.zoomMax;
		if (this.zoomMin > zl) zl = this.zoomMin;
		this.map.setZoom(zl);
	}
	
	this.panDirectionUp = function() {
		this.map.panDirection(0, 1);
		
		return false;
	}
	
	this.panDirectionDown = function() {
		this.map.panDirection(0, -1);
		
		return false;
	}
	
	this.panDirectionLeft = function() {
		this.map.panDirection(1, 0);
		
		return false;
	}
	
	this.panDirectionRight = function() {
		this.map.panDirection(-1, 0);
		
		return false;
	}
	
	this.zoomout = function() {
		this.map.zoomOut();
		
		return false;
	}
	
	this.zoomin = function() {
		this.map.zoomIn();
		
		return false;
	}

	this.attachEvents = function(map) {
		$(this.nodebtnup).bind('click', jQuery.proxy(this.panDirectionUp, this));
		$(this.nodebtnleft).bind('click', jQuery.proxy(this.panDirectionLeft, this));
		$(this.nodebtnright).bind('click', jQuery.proxy(this.panDirectionRight, this));
		$(this.nodebtndown).bind('click', jQuery.proxy(this.panDirectionDown, this));

		$(this.nodebtnzoomin).bind('click', jQuery.proxy(this.zoomin, this));
		$(this.nodebtnzoomout).bind('click', jQuery.proxy(this.zoomout, this));
		
		$(this.nodebtnzoomslider).draggable({axis:'y', containment:this.nodebtnzoomsliderbound});
		$(this.nodebtnzoomslider).bind('dragstop', jQuery.proxy(this.dragEnd, this));
		$(this.nodebtnzoomslider).mousedown(false);
		
		$(this.nodebtnzoomsliderbound).bind('mousedown', jQuery.proxy(this.zoomClick, this));
		
		this.map.map.events.register('zoomend', this, this.onZoomEnd);
	}
	
	this.move = function(x, y) {
		this.node.style.marginTop = y + "px";
		this.node.style.marginLeft = x + "px";
	}

	this._create();
}