var top = null;
var test = null;
var counter = 1;
var panelCounter = 1;
teaserNumber = 'watch_registration';
formular = "watch_registration";

Ext.onReady(function(){
	
	Ext.QuickTips.init();

    watchData = new Ext.form.FormPanel({
    	id: 'watchDatapanel1',
        labelAlign: 'top',
        frame:true,
        name: 'contact_form',
		width: 717,
		border: false,
		renderTo: Ext.get('form-head'),
		layout: 'form',
		
		
        items: [ 
        	new Ext.XTemplate(
        	
	        	'<p class=\'text-top\'>'+getLabelText(lang, 'watch_registration_yourWatchs')+'<p/>',
				'<div class=\'lineSpacer\'><img src=\'images/1x1_trans.gif\' height=\'1\' width=\'1\' border=\'0\'></div>'
						
        	),{
        		layout:'form',
        		items:[{
                //bodyStyle:'padding-right: 15px; width: 300px;',
                	layout: 'form',
                //columnWidth:.5,
                	items: [
                    	new Ext.form.ComboBox({
					    	fieldLabel: getLabelText(lang, 'models')+"*",
					    	labelSeparator: '',
						    displayField: 'models',
							valueField: 'id',
							name: 'models1',
						    mode: 'local',
							editable: false,
						    triggerAction: 'all',
							id:'models1',
						    emptyText:getLabelText(lang, 'waehlen'),
						    border: true,
							width: 200,
							listWidth: 200,
							
							selectOnFocus: true,
							border: true,
							allowBlank: false,
							msgTarget:'under',
							blankText:getLabelText(lang, 'model_error'),
						 
					    	store: new Ext.data.SimpleStore({
							     fields: [
							     	{name: 'id'},
							     	{name: 'models', type:'string'},
							     	{name: 'group'}
						    	],
								forceSelection: true,
						   		data : watchModels[lang],
						   	 	autoLoad:true
							}),
							tpl: new Ext.XTemplate(
								'<tpl for=".">',
								'<tpl if="this.group != values.group">',
								'<tpl exec="this.group = values.group"></tpl>',
								'<span class="groupModell">{group}</span>',
								'</tpl>',
								'<div class="x-combo-list-item">{models}</div>',
								'</tpl>'
							)
							

						})
					]
            
            }]
        		
        	},{
        		xtype:'numberfield',
		        fieldLabel: getLabelText(lang, 'caseno')+"*",
		        labelSeparator: '',
		        name: 'caseno',
		        id: 'caseno',
		        width: 200,
				border: true,
				allowBlank: false,
				msgTarget:'under',
				autoCreate : {tag: 'input', type: 'text', size: '20', maxlength: '6', autocomplete: 'off'},
				blankText:getLabelText(lang, 'errorcaseno')
	
				/*listeners: {
							blur: function() {
									    alert(this.getValue());
								}
							},
				*/
			/*	validator: function(v) { 
					 if (this.getValue().toString().length != 6 ) {   
						return getLabelText(lang, 'caseno_error');   
					 }       
						return true;  
				}
	        */
        	}
        	,{
        		xtype:'numberfield',
        		labelSeparator: '',
		        fieldLabel: getLabelText(lang, 'movmentno'),
		        name: 'movmentno',
		        width: 200,
		        id:'movmentno',
				allowBlank: false,
				msgTarget:'under',
				autoCreate : {tag: 'input', type: 'text', size: '20', maxlength: '5', autocomplete: 'off'},
				blankText:getLabelText(lang, 'movmentno_error')
	        
        	},
        		new Ext.XTemplate(
        	
        		'<p class=\'text-top\'>'+getLabelText(lang, 'purchasedate')+'<p/>'
			
        	),
		
		 	{

		 		items: [displayCalender('purchasedate', true, lang, 'form-head')]
			},
			
				new Ext.XTemplate(
        	
        		'<p class=\'text-top\' id=\'text-link\'><a href="javascript:createNewDataFields();initIframe();">'+getLabelText(lang, 'other_watches') +'</p>'
				
			)
			]		
			 
    });
      
});


   var positon = 0;
  
	
	var createNewDataFields = function(){
	
	Ext.get('text-link').remove();
	
	
   	counter = counter +1;
   	// Hier werden die neue Panles gez�hlt 
   	panelCounter = panelCounter + 1;
   	position = 4;
   	watchData = new Ext.form.FormPanel({
    	id: 'watchDataPanel'+counter,
        labelAlign: 'top',
        frame:true,
        name: 'watchDataPanel'+counter,
		width: 717,
		border: false,
		renderTo: Ext.get('newDataPanel'),
		layout: 'form',

		
        items: [ 
        	new Ext.XTemplate(
        	
			'<div class=\'lineSpacerSmall\'><img src=\'images/1x1_trans.gif\' height=\'1\' width=\'1\' border=\'0\'></div>'
						
        	),{
        		layout:'form',
        		items:[{
                //bodyStyle:'padding-right: 15px; width: 300px;',
                	layout: 'form',
                //columnWidth:.5,
                	items: [
                    	new Ext.form.ComboBox({
					    	fieldLabel: getLabelText(lang, 'models')+"*",
					    	labelSeparator: '',
						    displayField: 'models',
							valueField: 'id',
							name: 'models'+ counter,
						    mode: 'local',
							editable: false,
						    triggerAction: 'all',
							id:'models'+counter,
						    emptyText:getLabelText(lang, 'waehlen'),
						    border: true,
							allowBlank: false,
							width: 200,
							listWidth: 200,
							allowBlank: false,
							msgTarget:'under',
							blankText:getLabelText(lang, 'model_error'),
						 
					    	store: new Ext.data.SimpleStore({
							     fields: [
							     	{name: 'id'},
							     	{name: 'models', type:'string'},
							     	{name: 'group'}
						    	],
								forceSelection: true,
						   		data : watchModels[lang],
						   	 	autoLoad:true
							})
							,
							tpl: new Ext.XTemplate(
								'<tpl for=".">',
								'<tpl if="this.group != values.group">',
								'<tpl exec="this.group = values.group"></tpl>',
								'<span class="groupModell">{group}</span>',
								'</tpl>',
								'<div class="x-combo-list-item">{models}</div>',
								'</tpl>'
							)
							
						})
					]
            
            }]
        		
        	},{
        		xtype:'numberfield',
		        fieldLabel: getLabelText(lang, 'caseno')+"*",
		        labelSeparator: '',
		        name: 'caseno'+ counter,
		        id:'caseno'+ counter,
		        width: 200,
		        allowBlank: false,
				msgTarget:'under',
				autoCreate : {tag: 'input', type: 'text', size: '20', maxlength: '6', autocomplete: 'off'},
				blankText:getLabelText(lang, 'errorcaseno')
				/*validator: function(v) { 
					 if (this.getValue().toString().length != 6) {   
						return getLabelText(lang, 'caseno_error');   
					 }
					   
						return true;  
				}
				*/
	        
        	}
        	,{
        		xtype:'numberfield',
        		labelSeparator: '',
		        fieldLabel: getLabelText(lang, 'movmentno'),
		        name: 'movmentno'+ counter,
		        id: 'movmentno'+ counter,
		        width: 200,
		        allowBlank: false,
				msgTarget:'under',
				autoCreate : {tag: 'input', type: 'text', size: '20', maxlength: '5', autocomplete: 'off'},
				blankText:getLabelText(lang, 'movmentno_error')
	        
        	},
        		new Ext.XTemplate(
        	
        		'<p class=\'text-top\'>'+getLabelText(lang, 'purchasedate')+'<p/>'
			
        	),
		
		 	{

		 		items: [displayCalender('purchasedate'+counter, true, lang, 'newDataPanel')]
			},
			
				new Ext.XTemplate(
        	
        		'<p class=\'text-top\' id=\'text-link\'><a href="javascript:createNewDataFields();initIframe();">'+getLabelText(lang, 'other_watches') +'</p>'
				
			)
		]
		
		
			 
    });
    
   Ext.getCmp('purchasedate'+counter+'day').setValue(getLabelText(lang, 'day'));
	Ext.getCmp('purchasedate'+counter+'month').setValue(getLabelText(lang, 'month'));
	Ext.getCmp('purchasedate'+counter+'year').setValue(getLabelText(lang, 'year'));
};
