var CustomControllerBase = function(googlemap) {
	this.map        = googlemap;
	this.MAX_HEIGHT = googlemap.getDiv().style.height.match(/\d*/);
	this.MAX_WIDTH  = googlemap.getDiv().style.width.match(/\d*/);
	
	this.element    = document.createElement('div');
	this.element.style.margin   = '0';
	this.element.style.padding  = '5';
	this.element.style.position = 'absolute';
	this.element.style.zIndex   = '1001';
}

CustomControllerBase.prototype.alignContent = function(align) {
	this.element.style.textAlign = align;
}

CustomControllerBase.prototype.setBackgroundColor = function(bgColor) {
	this.element.style.backgroundColor = bgColor;
}

CustomControllerBase.prototype.setBackgroundImage = function(bgImage) {
	this.element.style.backgroundImage = "url('" + bgImage + "')";
}

CustomControllerBase.prototype.setWidth = function(width, percent) {
	var suffix = 'px';
	if (percent == '%')
		suffix = '%';	
	this.element.style.width = width + suffix;
}

CustomControllerBase.prototype.setHeight = function(height, percent) {
	var suffix = 'px';
	if (percent == '%')
		suffix = '%';	
	this.element.style.height = height + suffix;
}

CustomControllerBase.prototype.addElement = function(element, event, fn) {
	if (event && fn) {
		google.maps.event.addDomListener(element.getElement(), event, fn);
	}	
	this.element.appendChild(element.getElement());
}

CustomControllerBase.prototype.getElements = function() {
	return this.element.children();
}

CustomControllerBase.prototype.addZoomIncreaser = function(element, event) {
	if (!event)
		event = 'click';	
	var me = this;
	google.maps.event.addDomListener(element.getElement(), event, function() {
		me.map.set_zoom(me.map.get_zoom() + 1);
	});
	this.element.appendChild(element.getElement());
}

CustomControllerBase.prototype.addZoomDecreaser = function(element, event) {
	if (!event)
		event = 'click';	
	var me = this;
	google.maps.event.addDomListener(element.getElement(), event, function() {
		me.map.set_zoom(me.map.get_zoom() - 1);
	});
	this.element.appendChild(element.getElement());
}

CustomControllerBase.prototype.setMapTypeId = function(mapTypeId) {
	this.map.set_mapTypeId(mapTypeId);
}

CustomControllerBase.prototype.draw = function() {
	this.map.getDiv().appendChild(this.element);
}

var CustomController = function(type, content, cssClass) {
	this.element = document.createElement(type);
	if (type == 'img')
		this.element.src = content;
	else if(content)
		this.element.innerHTML = content;	
	if (cssClass)
		this.element.className = cssClass;
}

CustomController.prototype.addListener = function(event, fn) {
	google.maps.event.addDomListener(this.element, event, fn);
}

CustomController.prototype.getElement = function() {
	return this.element;
}