//Ext.QuickTips.init();

Ext.ux.SliderTip = Ext.extend(Ext.Tip, {
		minWidth: 10,
		offsets : [0, -10],
		init : function(slider){
			slider.on('dragstart', this.onSlide, this);
			slider.on('drag', this.onSlide, this);
			slider.on('dragend', this.hide, this);
			slider.on('destroy', this.destroy, this);
	},
	
	onSlide : function(slider){
		this.show();
		this.body.update(this.getText(slider)+' Km');
		this.doAutoWidth();
		this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
	},
	
	getText : function(slider){
		return slider.getValue();
	}
});

Ext.layout.Accordion=Ext.extend(Ext.layout.FitLayout,{
	fill:true,
	autoWidth:true,
	titleCollapse:true,
	hideCollapseTool:false,
	collapseFirst:false,
	animate:false,
	sequence:false,
	activeOnTop:false,
	renderItem:function(B)
	{
		if(this.animate===false)
		{
			B.animCollapse=false
		}
		B.collapsible=true;
		if(this.autoWidth)
		{
			B.autoWidth=true
		}
		if(this.titleCollapse)
		{
			B.titleCollapse=true
		}
		if(this.hideCollapseTool)
		{
			B.hideCollapseTool=true
		}
		if(this.collapseFirst!==undefined)
		{
			B.collapseFirst=this.collapseFirst
		}
		if(!this.activeItem&&!B.collapsed)
		{
			this.activeItem=B
		}
		else
		{
			if(this.activeItem)
			{
				B.collapsed=true
			}
		}
		Ext.layout.Accordion.superclass.renderItem.apply(this,arguments);
		if ( B.header )
			B.header.addClass("x-accordion-hd");
		B.on("beforeexpand",this.beforeExpand,this)
	},
	beforeExpand:function(E,F)
	{
		var D=this.activeItem;
		if(D){
			if(this.sequence){
				delete this.activeItem;
				if(!D.collapsed){
					D.collapse({callback:function(){E.expand(F||true)},scope:this});
					return false
				}
			}else{
				D.collapse(this.animate)
			}
		}
		this.activeItem=E;
		if(this.activeOnTop){
			E.el.dom.parentNode.insertBefore(E.el.dom,E.el.dom.parentNode.firstChild)
		}
		this.layout()
	},
	setItemSize:function(J,K)
	{
		if(this.fill&&J)
		{
			var N=this.container.items.items;
			var L=0;
			for(var M=0,H=N.length;M<H;M++)
			{
				var I=N[M];
				if(I!=J){L+=(I.getSize().height-I.bwrap.getHeight())}
			}
			K.height-=L;J.setSize(K)
		}
	}
});
Ext.Container.LAYOUTS.accordion=Ext.layout.Accordion;

var RecordDef = Ext.data.Record.create([
    {name: 'id'}, {name: 'name', mapping: 'name'} 
]);

var countryRecordDef = Ext.data.Record.create([
    {name: 'id'}, {name: 'name', mapping: 'name'}, {name:'code'}, {name:'geocoder'} 
]);

document.mm.data.productGroups = new Ext.data.Store({
    baseParams: { action : 'getProductGroups', countryCode : document.mm.settings.countryCode },
    url: document.mm.settings.requestUrl,
    method: 'POST',
    reader : new Ext.data.JsonReader({
		    totalProperty: "dataCount",
		    root: "data",
		    id: "id"
		}, RecordDef),
	sortInfo: {field: "name", direction: "ASC"}  
});

document.mm.data.productBrand = new Ext.data.Store({
    baseParams: { action : 'getProductBrands' },
    url: document.mm.settings.requestUrl,
    method: 'POST',
    reader : new Ext.data.JsonReader({
		    totalProperty: "dataCount",
		    root: "data",
		    id: "id"
		}, RecordDef)
});

document.mm.data.countries = new Ext.data.Store({
    baseParams: { action : 'getActiveCountries', countryCode : document.mm.settings.countryCode },
    url: document.mm.settings.requestUrl,
    method: 'POST',
    reader : new Ext.data.JsonReader({
		    totalProperty: "dataCount",
		    root: "data",
		    id: "id"
		}, countryRecordDef)
});

var dealerSearchPanel=new Ext.Panel(
{
	xtype:"panel",
	id:"dealerSearchPanel",
	title:document.mm.settings.langDealerSearch,
	split: false,
    animate:true,
	labelWidth:100,	
	bodyStyle:"padding:3px",
	autoScroll:true,
	collapsed:false,
	collapsible:true,
	iconCls:"dealerPanel",
	hideBorders:true,
	contentEl:"panelDealerSearch",
	html:'',
	items:[{
		xtype:"fieldset",
		autoHeight:true,
		labelWidth:100,
		width:280,
		items:
		[
			{
				html:'<div class="frmHeadline">'+document.mm.settings.langPlace+'</div>',
				baseCls:'txtLabel'
			},
			{ html:'',id:'clearL'},
			{xtype:"textfield",
				fieldLabel:document.mm.settings.langCity,
				name:"searchCityFld",
				id:"searchCityFld",
				width:150,
				listeners:{specialkey:function(searchCityFld,e){
					if(e.getKey()==Ext.EventObject.ENTER)
					{
						document.mm.dealerSearch();
					}}}
			},
			
			countryCB = new Ext.form.ComboBox({
				id:'countryCB',
            	fieldLabel: document.mm.settings.langCountry,
            	hiddenName : 'countryComboBox', 
				hiddenid : 'countryComboBox',
			    store: document.mm.data.countries,				    
			    displayField:'name',				    
			    value:document.mm.settings.countryGeocoder,
				valueField:'geocoder',
			    width:150,
			    typeAhead: true,
			    selectOnFocus:true,
			    mode:'remote',
			    triggerAction: 'all',				    
			    allowBlank:false,
			    emptyText:document.mm.settings.langCboBoxEmpty,
			    blankText:document.mm.settings.langCountryMsg,
			    msgTarget: 'statusBar',
			    editable: false,
				listeners: {
					'select': {
						fn: function(){
						
						}
					}
				}
        	}),
        	
			{xtype:"hidden",
				name:"longitudeFld",
				id:"longitudeFld"
			},
			
			{xtype:"hidden",
				name:"latitudeFld",
				id:"latitudeFld"
			},
							
			{
				html:'<div class="frmHeadline">'+document.mm.settings.langSetting+'</div>',
				baseCls:'txtLabel',
				style:'padding-top:5px;'
			},
						
			{
				html:document.mm.settings.langRadius+':',
				baseCls:'txtLabel',
				id:'radLabel',
				style:'padding-top:5px;text-align:right;'
			},
			
			new Ext.Slider({
				id:"radiusSlider",
				name:"radiusSlider",
				width: 150,
				increment: 10,
				minValue: 0,
				value: 50,
				maxValue: 120,
				plugins: new Ext.ux.SliderTip(),
				listeners: { 'dragend': { fn: function() {
							document.mm.settings.radius = this.value;
							}}}
			    
			}),
        	
			productGroupComboBox = new Ext.form.ComboBox({
            	fieldLabel: document.mm.settings.langProductGroup,
            	width:150,
				id:'productGroupCboBox',
            	listWidth:250,
			    store: document.mm.data.productGroups,
			    displayField:'name',
			    valueField : 'id', 
			    hiddenName: 'productGroupComboBox', 
			    value:document.mm.settings.productGroupDefaultValue,
			    typeAhead: true,
				hideLabel:document.mm.settings.productGroupDefaultValue?true:false,
			    mode: 'remote',
			    triggerAction: 'all',
			    emptyText:document.mm.settings.langCboBoxEmpty,
			    selectOnFocus:true,
			    msgTarget: 'statusBar',
			    allowBlank:true,
			    blankText:document.mm.settings.langProductGroupMsg,
			    listeners: { 'select': { fn: function() {
						if ( !this.value )
						{
							document.mm.data.productBrand.baseParams = { action : 'getProductBrands' };
							document.mm.data.productBrand.reload();
						}
						else
						{
							document.mm.data.productBrand.baseParams = { action : 'getProductBrands', productGroup : this.value  };
							document.mm.data.productBrand.reload();
						}
					}}
			    }
        	}),
			
			productBrandComboBox = new Ext.form.ComboBox({
            	fieldLabel: document.mm.settings.langProductBrand,
            	width:150,
				id:'productBrandCboBox',
            	listWidth:250,
			    store: document.mm.data.productBrand,
			    displayField:'name',
			    valueField : 'id', 
				hideLabel:document.mm.settings.productBrandDefaultValue?true:false,
			    hiddenName: 'productBrandComboBox', 
			    value:document.mm.settings.productBrandDefaultValue,
			    typeAhead: true,
			    mode: 'remote',
			    triggerAction: 'all',
			    emptyText:document.mm.settings.langCboBoxEmpty,	
			    selectOnFocus:true,
			    msgTarget: 'statusBar',
			    allowBlank:true,
			    blankText:document.mm.settings.langProductBrandMsg
        	}),
			{xtype:"button",
				style:"clear:both; margin-left:207px; padding-top: 10px;",
				text:document.mm.settings.langBtnSearch,
				listeners:{click:document.mm.dealerSearch}}
		]
	}]
});

var helpPanel=new Ext.Panel(
{
	xtype:"panel",
	region: 'center',
	animate:true,
	id:"helpPanel",
	title:document.mm.settings.langHelp,
	bodyStyle:"padding: 5px",
	hideBorders:true,
	collapsed:true,
	collapsible:true,
	autoScroll:true,
	iconCls:"helpPanel",
	items:[{contentEl:"panelHelp"}]
});

var panels=[dealerSearchPanel, helpPanel];
for(var i=0;i<panels.length;i++)
{
	if(panels[i]==null)
	{
		panels.splice(i--,1)
	}
}

var clock = new Ext.Toolbar.TextItem('');

document.mm.accordion = new Ext.Window({
    id:"accordion",
    title: 'Navigation',
    closeAction:"hide",
    closable:false,
    resizable:true,
    collapsible:true,
    width:325,
    height:365,
    x:document.mm.settings.windowWidth-document.mm.settings.accordionX,
	y:40,
    plain:true,
    layout:"accordion",
    items: panels,
    bbar: new Ext.StatusBar({
        id: 'win-status',
        defaultText: '<div id="statusBar"></div>',
        items: [ clock ]
    }),
    listeners: {
        'render': {
            fn: function(){
                Ext.fly(clock.getEl().parentNode).addClass('x-status-text-panel');
                
                // Kick off the clock timer that updates the clock el every second:
			    Ext.TaskMgr.start({
			        run: function(){
			            Ext.fly(clock.getEl()).update(new Date().format('H:i:s'));
			        },
			        interval: 1000
			    });
            }
        }
	}
});

Ext.namespace('Ext.mmdata');

Ext.onReady(function()
{		
	actionPanel = new Ext.Panel({
		id:'actionPanel',
		region:'west',
		split:true,
		collapsible:true,
	    autoScroll:true,
	    collapsed:document.mm.settings.actionPanelCollapsed,
	    collapsible:true,
		collapseMode: 'mini',
		width:document.mm.settings.actionPanelWidth,
		minWidth:document.mm.settings.actionPanelWidth,
		border: false,
		baseCls:'x-plain',
		html: '<div id="actionPanelContent"></div>',
		listeners:{
			expand:{fn:function(panel){
				document.mm.settings.actionPanelExpanded=true;
				document.mm.resizeFunction();
			},single:false},
			beforecollapse:{fn:function(panel){
				document.mm.settings.actionPanelExpanded=false;
				document.mm.resizeFunction();
			},single:false}
		}
	});
	
	 mapPanel = new Ext.Panel({
    	id:'mapPanel',
    	region:'center',
    	split:true,
    	collapsible: false,
    	border: false,
    	baseCls:'x-plain',
    	items:[{contentEl:"map"}]
    });
    	
	document.mm.viewport=new Ext.Viewport(
	{
		layout:"border",
		items:[actionPanel,mapPanel],
		id:"col3_innen_content",
		listeners:{resize:function(){
			document.mm.setWindowSize();
			document.mm.accordion.setPagePosition(document.mm.settings.windowWidth-document.mm.settings.accordionX,40);
			document.mm.resizeFunction()
		}}
	});
	
	if(document.mm.settings.productGroupDefaultValue){
		Ext.getCmp('productGroupCboBox').hide();
	}
	if(document.mm.settings.productBrandDefaultValue){
		Ext.getCmp('productBrandCboBox').hide();
	}
	
	//document.mm.accordion.show(this);
});

document.mm.setWindowSize();
document.mm.accordion.show();
document.mm.resizeFunction();
document.mm.getElementById('loading').style.visibility='hidden';

