////////////////////////////////////////////////////////////////////////////////////////////////////////
// Calc.calc_13.input
////////////////////////////////////////////////////////////////////////////////////////////////////////
// Klasa reprezentuje sekcję wprowadzania danych użytkownika
////////////////////////////////////////////////////////////////////////////////////////////////////////
Ext.ns('Calc.calc_13.input');

Calc.calc_13.input = Ext.extend(Calc.input, {
	title: 'Jak zbudować swój plan finansowy?',
	initComponent: function() {
		Ext.apply(this, {
			id: 'input-section',
			items: [{
			  //input subsection
				xtype: 'inputPanel',
				title: 'Kredyt',
				html: '',
				items: [{
					//-----------------------------KWOTA SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Kwota kredytu',
					valueName: 'kwotaKredytu',
					labels: Calc.sliderData.kwota,
					initValue: Calc.Defaults.values.kwota_k
					//-----------------------------/KWOTA SLIDER-------------------------------
				},{
					//-----------------------------OKRES SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Okres spłaty',
					valueName: 'okres',
					yearsToMonths: true,
					labels: Calc.sliderData.okres,
					initValue: Calc.Defaults.values.okres_k
					//-----------------------------/OKRES SLIDER-------------------------------
				},{
					xtype: 'panel',
					labelAlign: 'left',
					border: true,
					baseCls: 'calc-form',
					bodyStyle:'padding:5px',
			        //width: 500,
			        items: [{
			            layout:'column',
			            baseCls: 'calc-form',
			            border: false,
			            items:[{
			                columnWidth:.5,
			                layout: 'form',
			                baseCls: 'calc-form',
			                labelWidth: 180,
			                border: false,
			                items: [{
			                    xtype:'elem.numberfield',
			                    width: 40,
			                    fieldLabel: 'Oprocentowanie kredytu',
			                    id: 'oprocentowanie',
			                    name: 'oprocentowanie',
			                    value: Calc.Defaults.values.oprocentowanie_k,
                                plugins: Calc.Labels.proc
			                }]
			            }]
			        }]
				}]

			},{
			  //input subsection
				xtype: 'inputPanel',
				title: 'Lokata',
				html: '',
				items: [{
					//-----------------------------KWOTA SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Kwota',
					valueName: 'kwotaLokaty',
					labels: Calc.sliderData.rata.concat( Calc.sliderData.kwota ),
					initValue: Calc.Defaults.values.kwota_l
					//-----------------------------/KWOTA SLIDER-------------------------------
				},{
					//-----------------------------OKRES SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Okres',
					valueName: 'okresLokaty',
					yearsToMonths: true,
					labels: Calc.sliderData.okres,
					initValue: Calc.Defaults.values.okres_l
					//-----------------------------/OKRES SLIDER-------------------------------
				},{
					xtype: 'panel',
					labelAlign: 'left',
					border: true,
					baseCls: 'calc-form',
					bodyStyle:'padding:5px',
			        //width: 500,
			        items: [{
			            layout:'column',
			            baseCls: 'calc-form',
			            border: false,
			            items:[{
			                columnWidth:.5,
			                layout: 'form',
			                baseCls: 'calc-form',
			                labelWidth: 180,
			                border: false,
			                items: [{
			                    xtype:'elem.numberfield',
			                    width: 40,
			                    fieldLabel: 'Oprocentowanie',
			                    id: 'oprocentowanieLokaty',
			                    name: 'oprocentowanieLokaty',
			                    value: Calc.Defaults.values.oprocentowanie_l ,
                                plugins: Calc.Labels.proc
			                }]
			            } ]
			        }]
				}]

			},{
			  //input subsection
				xtype: 'inputPanel',
				title: 'Oszczędzanie',
				html: '',
				items: [{
					//-----------------------------KWOTA SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Kwota',
					valueName: 'kwotaOszczedzania',
					labels: Calc.sliderData.rata,
					initValue: Calc.Defaults.values.kwota_o
					//-----------------------------/KWOTA SLIDER-------------------------------
				},{
					//-----------------------------OKRES SLIDER-------------------------------
					xtype: 'elem.slider',
					title: 'Okres',
					valueName: 'okresOszczedzania',
					yearsToMonths: true,
					labels: Calc.sliderData.okres,
					initValue: Calc.Defaults.values.okres_o
					//-----------------------------/OKRES SLIDER-------------------------------
				},{
					xtype: 'panel',
					labelAlign: 'left',
					border: true,
					baseCls: 'calc-form',
					bodyStyle:'padding:5px',
			        //width: 500,
			        items: [{
			            layout:'column',
			            baseCls: 'calc-form',
			            border: false,
			            items:[{
			                columnWidth:.5,
			                layout: 'form',
			                baseCls: 'calc-form',
			                labelWidth: 180,
			                border: false,
			                items: [{
			                    xtype:'elem.numberfield',
			                    width: 40,
			                    fieldLabel: 'Oprocentowanie',
			                    id: 'oprocentowanieOszczedzania',
			                    name: 'oprocentowanieOszczedzania',
			                    value: Calc.Defaults.values.oprocentowanie_o ,
                                plugins: Calc.Labels.proc
			                }]
			            } ]
			        }]
				}]

			}]

		});
		Calc.calc_13.input.superclass.initComponent.apply(this, arguments);
	}
});

Ext.reg('calc_13.input', Calc.calc_13.input);
