/*!
 * Ext JS Library 3.1.1
 * Copyright(c) 2006-2010 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
/**
 * @class Ext.ux.GMapPanel
 * @extends Ext.Panel
 * @author Shea Frederick
 
 http://code.google.com/intl/de/apis/maps/signup.html
 http://code.google.com/intl/de/apis/maps/documentation/index.html#SpecifyingSensor
 http://code.google.com/intl/de/apis/maps/documentation/introduction.html#Loading_the_Maps_API
 
 */
Ext.ux.GMapPanel = Ext.extend(Ext.Panel, {
    initComponent : function(){
        
        var defConfig = {
            plain: true,
            zoomLevel: 3,
            yaw: 180,
            pitch: 0,
            zoom: 0,
            gmapType: 'map',
            border: false
        };
        
        Ext.applyIf(this,defConfig);
        
        Ext.ux.GMapPanel.superclass.initComponent.call(this);        

    },
    afterRender : function(){
        
        //DebugDump(this,'this '+this.height+' / '+this.width);
        if(this.ownerCt) {
			var wh = this.ownerCt.getSize();
			//DebugDump(wh,'ownerCt wh');
		} else {
			var wh = this.getSize();        
			//DebugDump(wh,'wh '+this.getItemId()+' / '+this.renderTo);
        }
        
        if((typeof this.width == 'undefined') 
        || (typeof this.height == 'undefined')
        || (this.width <= 0) 
        || (this.height <= 0)) Ext.applyIf(this, wh);
        
        this.animateLocationSwap = false;
        this.overlays = {};
		this.activeContentWrapper=false;
		
        Ext.ux.GMapPanel.superclass.afterRender.call(this);    
        
        if (this.gmapType === 'map'){
            this.gmap = new GMap2(this.body.dom);
        }
        
        if (this.gmapType === 'panorama'){
            this.gmap = new GStreetviewPanorama(this.body.dom);
        }
        
        if (typeof this.addControl == 'object' && this.gmapType === 'map') {
            this.gmap.addControl(this.addControl);
        }

		
        GEvent.bind(this.gmap, 'load', this, function(){
            this.onMapReady();
        });
        
        if (typeof this.setCenter === 'object') {
			if(this.setCenter.lat) { // get addr by lat/lng def
                if (this.gmapType === 'map'){
                    var point = new GLatLng(this.setCenter.lat,this.setCenter.lng);
                    this.gmap.setCenter(point, this.zoomLevel);    
                }
                if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){
                    this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear);
                }				
            } else if (typeof this.setCenter.geoCodeAddr === 'string'){ // get addr by string location
                this.geoCodeLookup(this.setCenter.geoCodeAddr);
            } else { // default ext code
                if (this.gmapType === 'map'){
                    var point = new GLatLng(this.setCenter.lat,this.setCenter.lng);
                    this.gmap.setCenter(point, this.zoomLevel);    
                }
                if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){
                    this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear);
                }
            }
            if (this.gmapType === 'panorama'){
                this.gmap.setLocationAndPOV(new GLatLng(this.setCenter.lat,this.setCenter.lng), {yaw: this.yaw, pitch: this.pitch, zoom: this.zoom});
            }
        }

        // start this conatiner element with visibility=hidden to get the size of it 
        if(this.renderTo && $(this.renderTo) && $(this.renderTo).style.visibility=='hidden') {
        	$(this.renderTo).style.display='none';
        	$(this.renderTo).style.visibility = 'visible';
        }
        

    },
    onMapReady : function(){
        this.addMarkers(this.markers);
        this.addMapControls();
        this.addOptions();  
    },
    onResize : function(w, h){

        if (typeof this.getMap() == 'object') {
            this.gmap.checkResize();
        }
        
        Ext.ux.GMapPanel.superclass.onResize.call(this, w, h);

    },
    setSize : function(width, height, animate){
        
        if (typeof this.getMap() == 'object') {
            this.gmap.checkResize();
        }
        
        Ext.ux.GMapPanel.superclass.setSize.call(this, width, height, animate);
        
    },
    getMap : function(){
        
        return this.gmap;
        
    },
    getCenter : function(){
        
        return this.getMap().getCenter();
        
    },
    getCenterLatLng : function(){
        
        var ll = this.getCenter();
        return {lat: ll.lat(), lng: ll.lng()};
        
    },
    addMarkers : function(markers) {
        
        if (Ext.isArray(markers)){
            this.getLocationDelay(markers,0);
        }
        
    },
    
    // Verzögerung !! 
	getLocationDelay:function(markers,i) {
		
		if((typeof markers[i] != 'object') || (!markers[i])) return;
		if(markers[i].lat) {
			var mkr_point = new GLatLng(markers[i].lat,markers[i].lng);
			this.addMarker(mkr_point,markers[i].marker,false,markers[i].setCenter, markers[i].listeners);
			i++;
			setTimeout(function(){this.getLocationDelay(markers,i);}.bind(this), 50);
		} else {
			this.geocoder.getLocations(markers[i].geoCodeAddr, this.addGeoCodeAddrToMap.createDelegate(this));
			i++;
			setTimeout(function(){this.getLocationDelay(markers,i);}.bind(this), 200);
		}

	},
    
    addGeoCodeAddrToMap : function(response) {
        
        if (!response || response.Status.code != 200) {
            //Ext.MessageBox.alert('Error', 'Code '+response.Status.code+' Error Returned');
			if(typeof console == 'object') console.log('x Error Returned: %o',response.Status.code);
        } else {
            place = response.Placemark[0];
            addressinfo = place.AddressDetails;
            accuracy = addressinfo.Accuracy;
            if (accuracy === 0) {
                Ext.MessageBox.alert('Unable to Locate Address', 'Unable to Locate the Address you provided');
                
            }else{
                if (accuracy < 7) {
                    Ext.MessageBox.alert('Address Accuracy', 'The address provided has a low accuracy.<br><br>Level '+accuracy+' Accuracy (8 = Exact Match, 1 = Vague Match)');
                }else{
                    point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);
                    if (typeof point === 'object'){
                    	// get marker by name
                    	for(i=0;i<this.markers.length;i++) {
                    		if(response.name == this.markers[i].geoCodeAddr) {
                    			this.markers[i].lat = place.Point.coordinates[1];
                    			this.markers[i].lng = place.Point.coordinates[0];
                    			var foundMarker = this.markers[i];
                    			break;
                    		}
                    	}
                    	// save data to $data array
						if(typeof this.coordsstore_str != 'string') this.coordsstore_str = '';
						this.coordsstore_str += '$data[\''+foundMarker.marker.p_id+'\'][\''+foundMarker.marker.i_id+'\'][\'lat\']= \''+place.Point.coordinates[1]+'\';<br />';         	
						this.coordsstore_str += '$data[\''+foundMarker.marker.p_id+'\'][\''+foundMarker.marker.i_id+'\'][\'lng\']= \''+place.Point.coordinates[0]+'\';<br />';
                        if(typeof foundMarker == 'object') this.addMarker(point,foundMarker.marker,false,foundMarker.setCenter,foundMarker.listeners);
                    } 
                }
            }
        }
        
    },    
    
    addMarker : function(point, marker, clear, center, listeners){

       if(marker['image_src']) {
			var myIcon = {
				image:marker['image_src'],
				iconSize:new GSize(marker['icon_size']['width'],marker['icon_size']['height']),
				id:marker['i_id']
			};
			var myIcon =  Ext.apply(G_DEFAULT_ICON,myIcon);
        } else var myIcon = G_DEFAULT_ICON;
        Ext.applyIf(marker,myIcon);
		
        if (clear === true){
            this.getMap().clearOverlays();
        }
        if (center === true) {
            this.getMap().setCenter(point, this.zoomLevel);
        }

        var mark = new GMarker(point,marker);
        if (typeof listeners === 'object'){
            for (evt in listeners) {
                GEvent.bind(mark, evt, mark, listeners[evt]);
            }
        }

        
        this.getMap().addOverlay(mark);
        
        if(marker.i_id) {
        	this.overlays[marker.i_id] = mark;
        	this.overlays[marker.i_id]['overlayIdx'] = FNK.overlayIdx;
        }
        //DebugDump(mark,'mark');

		FNK.overlayIdx++;

    },
    addMapControls : function(){
        if (this.gmapType === 'map') {
            if (Ext.isArray(this.mapControls)) {
                for(i=0;i<this.mapControls.length;i++){
                    this.addMapControl(this.mapControls[i]);
                }
            }else if(typeof this.mapControls === 'string'){
                this.addMapControl(this.mapControls);
            }else if(typeof this.mapControls === 'object'){
                this.getMap().addControl(this.mapControls);
            }
        }
        
    },
    addMapControl : function(mc){
        var mcf = window[mc];
        if (typeof mcf === 'function') {
            this.getMap().addControl(new mcf());
        }    
        
    },
    addOptions : function(){
        
        if (Ext.isArray(this.mapConfOpts)) {
            var mc;
            for(i=0;i<this.mapConfOpts.length;i++){
                this.addOption(this.mapConfOpts[i]);
            }
        }else if(typeof this.mapConfOpts === 'string'){
            this.addOption(this.mapConfOpts);
        }        
        
    },
    addOption : function(mc){
        
        var mcf = this.getMap()[mc];
        if (typeof mcf === 'function') {
            this.getMap()[mc]();
        }    
        
    },
    geoCodeLookup : function(addr) {
        
        this.geocoder = new GClientGeocoder();
        this.geocoder.getLocations(addr, this.addAddressToMap.createDelegate(this));
        
    },
    addAddressToMap : function(response) {
        
        if (!response || response.Status.code != 200) {
            Ext.MessageBox.alert('Error', 'Code '+response.Status.code+' Error Returned');
        }else{
            place = response.Placemark[0];
            addressinfo = place.AddressDetails;
            accuracy = addressinfo.Accuracy;
            if (accuracy === 0) {
                Ext.MessageBox.alert('Unable to Locate Address', 'Unable to Locate the Address you provided');
            }else{
                if (accuracy < 7) {
                    Ext.MessageBox.alert('Address Accuracy', 'The address provided has a low accuracy.<br><br>Level '+accuracy+' Accuracy (8 = Exact Match, 1 = Vague Match)');
                }else{
                    point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);
                    if (typeof this.setCenter.marker === 'object' && typeof point === 'object' && this.setCenter.mark != 'hidden'){
                        this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear,true, this.setCenter.listeners);
                    } else {
                    	this.gotToCenter(point,this.setCenter.marker,this.setCenter.marker.clear,true, this.setCenter.listeners);
                    }
                }
            }
        }
        
    },
    
    gotToCenter : function(point, marker, clear, center, listeners){
        
        //Ext.applyIf(marker,G_DEFAULT_ICON);
		
        if (clear === true){
            this.getMap().clearOverlays();
        }
        if (center === true) {
            this.getMap().setCenter(point, this.zoomLevel);
        }
        this.mapCenterPoint = point;
    },    
 
 
 	// MAP FUNCTIONS
		
	// locations
	showLocation:function(p_id,i_id) { // click on second level menu-item
		
		// highlight 
		// this.highlightLocation(p_id,i_id);
		// show window
		if(p_id == 'info') this.showInfoWindow(p_id,i_id);	
		else this.showLocationWindow(p_id,i_id);			
	
	},
	
	showLocations:function(p_id,c_id) { // click on first level menu-item 
					
		if(!this.data) this.data = FNK.data; // get from papa
		
		
		//this.client.setOpacity(.5,true);
		
		// activate content wrapper
		if(this.activeContentWrapper != c_id) {
			if(this.activeContentWrapper) {
				$(this.activeContentWrapper).style.display='none';
			}
			$(c_id).style.display='';
			this.activeContentWrapper=c_id;
		}
		
		//if(!p_id) return;
		
		if(this.activeLocations == p_id) return true;
		
        if (typeof this.setCenter === 'object' && typeof this.mapCenterPoint === 'object') {
            if(this.animateLocationSwap) {
            	this.getMap().setZoom(this.zoomLevel);
            	this.getMap().panTo(this.mapCenterPoint); // with animation
            } else this.getMap().setCenter(this.mapCenterPoint, this.zoomLevel);
        }
		
		// show menu
		if(this.openSubmenu != p_id) {
		
			if(this.openSubmenu) {
				// remove sub-menu selection? remove window? 
				if(this.openLocationwindow) {
					// hide selection
					var sit = Ext.get('item_'+this.openLocationwindow);
					if(sit) sit.removeClass('selected');			
					var win = Ext.getCmp('mapwindow');
					if(win) win.close();
				}

				// hide selection
				var cit = Ext.get('item_'+this.openSubmenu);
				cit.removeClass('selected');
				// close menu
				var ct = Ext.get('menu_'+this.openSubmenu);
				if(ct) {
					ct.vis = false;				
					ct.slideOut('t',{
						easing: 'easeIn',
						duration: 0.75,
						useDisplay:true,
						concurrent:true
					});
					ct.fadeOut({endOpacity:0,duration:.5,concurrent:true});				
				}
			}
			
			// select menu
			var mit = Ext.get('item_'+p_id);
			mit.addClass('selected');
			// open menu
			var mt = Ext.get('menu_'+p_id);
			if(mt) {
				mt.slideIn('t',{
					easing: 'easeIn',
					duration: 0.75,
					useDisplay:true,
					concurrent:true
				});
				mt.fadeIn({endOpacity:1,duration:.5,concurrent:true});
				mt.vis = true;
			} 
			this.openSubmenu = p_id;
			
		
		}
		
		// hide all map icons
		if(this.activeLocations && this.activeLocations != p_id) {
			this.resetLocations(this.activeLocations);
		}
		
		
		// go through locations and show them
		midx=0; var markers = new Array();
		for(dkey in this.data[p_id]) {
			//var io = Ext.get('map_'+dkey);
			//this.data[p_id][dkey]['has_marker'] = false;
			var cdata = this.data[p_id][dkey];
			
			if((!cdata['geoCodeAddr']) || (cdata['geoCodeAddr'].length==0) || (cdata['geoCodeAddr'].indexOf('undefined') >= 0)) {
				if((typeof cdata['city'] == 'undefined') || (!cdata['city']) || (cdata['city'].length == 0)) {
					continue; // we need at least a city...
				}
				cdata['geoCodeAddr'] = cdata['description']+', '+cdata['street']+', '+cdata['city']+', de';
				//cdata['geoCodeAddr'] = cdata['street']+', '+cdata['city']+', de';
			}
			
			markers[midx] = {
				lat: cdata['lat'] ? cdata['lat'] : null, // coordinates[1]
				lng: cdata['lng'] ? cdata['lng'] : null, // coordinates[0]
				marker: {
					title: cdata['description'],
					image_src:DOMAIN_SUBFOLDER_WWW_ROOT+cdata['icon_plan'],
					icon_size:{width:18,height:22},
					p_id:p_id,
					i_id:dkey
				},
				geoCodeAddr: cdata['geoCodeAddr'],
				listeners: {
					click: function(e){
						if(typeof this.ca == 'object') var ca = this.ca;
						else if(typeof this.$ == 'object') var ca = this.$;
						if(typeof ca == 'object') FNK.panel.showLocation(ca.p_id,ca.i_id);
					},
					mouseover: function(e){
						if(typeof this.ca == 'object') var ca = this.ca;
						else if(typeof this.$ == 'object') var ca = this.$;		
						if(typeof ca == 'object') FNK.panel.highlightMenuitem(ca.p_id,ca.i_id);
					}					
				}
			};
			//this.data[p_id][dkey]['has_marker'] = midx;
			midx++;
		}
		if(markers.length > 0) {
			this.markers=markers;
			this.addMarkers(markers);
		}
		this.activeLocations=p_id;
	},
	
	
	resetLocations: function(p_id) {
		// go through overlays and hide them
		this.getMap().clearOverlays();
		this.overlays = {};
		//this.overlayIdx=0;
	},
	
	
	highlightLocation: function(p_id,i_id) {
		
		var io = Ext.get(i_id);
		
		// try with "mtgt_"
		if((!io)) var io = Ext.get('mtgt_'+i_id);
		
		// trick to get the dom node by usemap-id
		if((!io) && (this.overlays) && (typeof this.overlays[i_id] == 'object')) {
			var it = Ext.DomQuery.select('img[usemap=#gmimap'+this.overlays[i_id]['overlayIdx']+']'); //usemap:#gmimap0
			if(typeof it == 'object') var io = Ext.get(it[0]);
		}
			
		if(io) {
			// do not highlight if its out of range
			pos = io.getXY(); // item
			var iop = Ext.get('plan_wr_r'); // parent
			var ppos = iop.getXY();
			ppos[2] = ppos[0]+iop.getWidth();
			ppos[3] = ppos[1]+iop.getHeight();
			if((pos[0]<ppos[0]) || pos[0]>ppos[2]) return false;
			if((pos[1]<ppos[1]) || pos[1]>ppos[3]) return false;
			
			io.frame("ff0000", 1, { duration: 1 });
		}
	},
	
	highlightMenuitem:function(p_id,i_id) {		
		var io = Ext.get('item_'+i_id);
		if(io) {
			io.frame("ff0000", 1, { duration: 1 });
		}
	},

	showLocationWindow: function(p_id,i_id) {
		
		
		if(this.openLocationwindow == i_id) return true;
		if(this.openLocationwindow) {
			// hide selection
			var cit = Ext.get('item_'+this.openLocationwindow);
			cit.removeClass('selected');			
		}
		// select menu
		var mit = Ext.get('item_'+i_id);
		mit.addClass('selected');
		
		if(this.overlays[i_id]) {
			var point = this.overlays[i_id].getPoint();
			if(this.animateLocationSwap) this.getMap().panTo(point); // with animation
			else this.getMap().setCenter(point);
		}
		
		var winHeight = 400;
		var winWidth = 300;
		
		// get position
		var io = Ext.get('plan_wr_r');
		var pos = io.getXY();
		
		pos[0] = (pos[0] + (this.getInnerWidth() /2));
		pos[1] = (pos[1] + (this.getInnerHeight() /2));
		
		
		var wx = (pos[0]-(winWidth+10));
		var wy = (pos[1]-(winHeight/2)); // half height
		var content = this.getLocationWindowContent(p_id,i_id);
		
		// set x
		var WWidth = GetWindowWidth();
		if(wx > (WWidth/2)) {
			var wx = (pos[0]-(winWidth+10));
		} else var wx = (pos[0]+40);
		
		if(wy < 55) {
			var wy = 55;
		} else if((wy+winHeight) > 660) var wy = 660-winHeight; 
		
		var win = Ext.getCmp('mapwindow');
		
		if(!win) {
			var d = {
				animEl: 'map_'+i_id,
				border:false,
				header:false,
				modal: false,
				id:'mapwindow',
				width:winWidth,
				height:winHeight,
				minWidth:winWidth,
				stateful:false,
				html:content,
				resizable:false,
				style:{zIndex:11999},
				x:wx,
				y:wy,
				shadow:true,
				shadowOffset:8,
				shim:false,	
				closable:false,
				defaultButton:0,
				buttons:[{
					 text: $L('schließen')
					,scope:this
					,handler:function(button) {
						button.ownerCt.close();
					}							
				}],
				cls:'x-local x-max-zindex'
			};
			
			if(typeof o != 'object') var o = {};
			o = Ext.apply(o,d);
			
			win = new Ext.Window(o);
			win.cdata = this.data[p_id][i_id];
			
			win.on("close", this.onCloseWin, this); 
			win.on("show", function(w) {
					
					FNK.panel.checkAndSetPosition(w);
					FNK.panel.setGMap(w.cdata);
				},win,{delay:50}
			); 				
		} else {
			win.cdata = this.data[p_id][i_id];
			win.body.update(content);
			win.setPosition(wx,wy);
			if(!win.hidden) this.setGMap(win.cdata);
		}
		
		
		//win.show(['map_'+i_id]);
		win.show();
		this.openLocationwindow = i_id;
		
	},	

	showInfoWindow: function(p_id,i_id) {
		
		
		if(this.openLocationwindow == i_id) return true;
		if(this.openLocationwindow) {
			// hide selection
			var cit = Ext.get('item_'+this.openLocationwindow);
			cit.removeClass('selected');			
		}
		// select menu
		var mit = Ext.get('item_'+i_id);
		mit.addClass('selected');
		
		var winHeight = 400;
		var winWidth = 300;
		
		// get position
		var io = Ext.get('info');
		var pos = io.getXY();

		var ioi = Ext.get(i_id);
		if(!ioi) return false;
		var pos = ioi.getXY();
		//DebugDump(pos,'pos');

		var wx = pos[0];//(pos[0]-(winWidth+10));
		var wy = (pos[1]-(winHeight/2)); // half height
		var content = this.getInfoWindowContent(p_id,i_id);
		//DebugDump(wx,'wy '+wy);
		// set x
		var WWidth = GetWindowWidth();
		if(wx > (WWidth/2)) {
			var wx = (pos[0]-(winWidth+10));
		} else var wx = (pos[0]+(ioi.getWidth()+10));
		
		if(wy < 55) {
			var wy = 55;
		} else if((wy+winHeight) > 660) var wy = 660-winHeight; 
		
		var win = Ext.getCmp('mapwindow');
		
		if(!win) {
			var d = {
				animEl: 'map_'+i_id,
				border:false,
				header:false,
				modal: false,
				autoScroll:true,
				id:'mapwindow',
				width:winWidth,
				height:winHeight,
				minWidth:winWidth,
				stateful:false,
				html:content,
				resizable:false,
				style:{zIndex:11999},
				x:wx,
				y:wy,
				shadow:true,
				shadowOffset:8,
				shim:false,	
				closable:false,
				defaultButton:0,
				buttons:[{
					 text: $L('schließen')
					,scope:this
					,handler:function(button) {
						button.ownerCt.close();
					}							
				}],
				cls:'x-local x-max-zindex'
			};
			
			if(typeof o != 'object') var o = {};
			o = Ext.apply(o,d);
			
			win = new Ext.Window(o);
			win.cdata = this.data[p_id][i_id];
			
			win.on("close", this.onCloseWin, this); 
			win.on("show", function(w) {
					
					FNK.panel.checkAndSetPosition(w);
					//FNK.panel.setGMap(w.cdata);
				},win,{delay:50}
			); 				
		} else {
			win.cdata = this.data[p_id][i_id];
			win.body.update(content);
			win.setPosition(wx,wy);
			if(!win.hidden) this.setGMap(win.cdata);
		}
		
		
		//win.show(['map_'+i_id]);
		win.show();
		this.openLocationwindow = i_id;
		
	},	
	
	onCloseWin:function() {
		if(this.openLocationwindow) {
			// hide selection
			var sit = Ext.get('item_'+this.openLocationwindow);
			if(sit) sit.removeClass('selected');
		}	
		this.openLocationwindow=false;
	},

	checkAndSetPosition: function(win) {
		
		scrolltop = PAGEdom.docScrollTop();
		var WHeight = GetWindowHeight();
		var WWidth = GetWindowWidth();
		var update_position = false;
		max = (scrolltop+WHeight);

		// height
		if(win.y<0) update_position = true;
		if(win.y<scrolltop) update_position = true;
		if((win.y+win.height)>(scrolltop+WHeight)) update_position = true;

		// width
		scrollleft = PAGEdom.docScrollLeft();
		var WWidth = GetWindowWidth();	
		if(win.x<0) update_position = true;
		if(win.x<scrollleft) update_position = true;
		if((win.x+win.width)>(scrollleft+WWidth)) update_position = true;		

		if(update_position) {
			win.setPosition(((WWidth/2)-(win.width/2)),(scrolltop+50));
		}

	},
		
	getLocationWindowContent: function(p_id,i_id) {
		// create content
		
		var data = this.data[p_id][i_id];
		
		var tpl='<div id="mapwin_content" class="w-content">';
		tpl+='<h1>';
		tpl+='<img class="w-icon" src="'+data['icon_window']+'" />';
		tpl+=''+data['description'];
		tpl+='</h1>';
		
		tpl+='<div class="w-hr"></div>';
		
		if(data['img'] && data['img'].length>0) tpl+='<img class="w-img" src="'+data['img']+'" />';
		tpl+='<p>';
		if(data['addr_txt'] && data['addr_txt'].length>0)  tpl+=''+data['addr_txt'];
		if(data['city'] && data['city'].length>0) tpl+=''+data['street']+' &bull; '+data['city']+'<br />';
		if(data['tel'] && data['tel'].length>0) {
			tpl+='Tel.: '+data['tel']+'<br />';
		}
		if(data['email'] && data['email'].length>0) {
			tpl+='<a class="email" href="mailto:'+data['email']+'">'+data['email']+'</a><br />';
		}
		if(data['www'] && data['www'].length>0) {
			tpl+='<a href="http://'+data['www']+'" target="_blank">'+data['www']+'</a><br />';
		}
		tpl+='</p>';
		
		tpl+='<div class="w-hr"></div>';
		
		tpl+='<p>';
		if(data['geoCodeAddr'] && data['geoCodeAddr'].length>0) {
			// http://maps.google.com/maps?f=q&source=s_q&hl=de&geocode=&q=Gemeindehaus+-+Unterbach,+Brorsstra%C3%9Fe+7,+40627+D%C3%BCsseldorf,+de&sll=37.0625,-95.677068&sspn=61.023673,123.046875&ie=UTF8&hq=Gemeindehaus+-&hnear=Brorsstra%C3%9Fe+7,+D%C3%BCsseldorf,+Bundesrepublik+Deutschland&z=13
			tpl+='<b><a href="'+data['gmap']+'/maps?f=q&source=s_q&z=13&hl=de&geocode=&q='+data['geoCodeAddr']+'" target="_blank">Standort (Vergrößerte Ansicht)</a></b>';
			tpl+='<div id="gmap"></div>';
		} else if(data['text'] && data['text'].length>0) {
			tpl+='<div id="wtext">'+data['text']+'</div>';
		}
		tpl+='';
		tpl+='</p>';
		tpl+='';
		tpl+='';
		tpl+='';
		tpl+='</div>';		
		
		return tpl;
	},

	getInfoWindowContent: function(p_id,i_id) {
		// create content
		
		var data = this.data[p_id][i_id];
		//DebugDump(data,'data');
		
		var tpl='<div id="mapwin_content" class="w-content">';
		tpl+='<h1>';
		tpl+='<img class="w-icon" src="'+data['img_window']+'" />';
		tpl+=''+data['title'];
		tpl+='</h1>';
		
		tpl+='<div class="w-hr"></div>';
		
		tpl+='<p>';
		tpl+=''+data['text'];
		tpl+='</p>';
		tpl+='';
		tpl+='';
		tpl+='';
		tpl+='</div>';		
		
		return tpl;
	},

	setGMap: function(cdata) {

		if((!cdata['geoCodeAddr']) || (cdata['geoCodeAddr'].length==0) || (cdata['geoCodeAddr'].indexOf('undefined') >= 0)) {
			if((typeof cdata['city'] == 'undefined') || (!cdata['city']) || (cdata['city'].length == 0)) {
				return false; // we need at least a city...
			}
			cdata['geoCodeAddr'] = cdata['description']+', '+cdata['street']+', '+cdata['city']+', de';
			//cdata['geoCodeAddr'] = cdata['street']+', '+cdata['city']+', de';
		}

		var gmap = Ext.get('gmap');
		var gmapcontainer = Ext.getCmp('localgmappanel');
		if(gmapcontainer) {
			gmapcontainer.destroy();
			gmapcontainer=false;
		}
		if(!gmapcontainer) {
			new Ext.Container({
				applyTo:gmap,
				id:'gmapcontainer',
				//width:270,
				height:180,
				items:{
					xtype: 'gmappanel',
					id:'localgmappanel',
					zoomLevel: 16,
					style:{border: '1px solid #002b4e'},
					gmapType: 'map',
					mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
					mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
					setCenter: {
						lat: cdata['lat'] ? cdata['lat'] : null, // coordinates[1]
						lng: cdata['lng'] ? cdata['lng'] : null, // coordinates[0]
						marker: {
							title: cdata['description'],
							image_src:DOMAIN_SUBFOLDER_WWW_ROOT+cdata['icon_plan'],
							icon_size:{width:18,height:22}
						},
						geoCodeAddr: cdata['geoCodeAddr']					
					}
				}
			});						
		} else {
			 gmapcontainer.geoCodeLookup(cdata['geoCodeAddr']);
		}
	}
		
 	
 
});

Ext.reg('gmappanel', Ext.ux.GMapPanel);