/*
 * Ext JS Library 2.2.1
 * Copyright(c) 2006-2009, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.chart.Chart.CHART_URL = 'assets/js/extjs/resources/charts.swf';

Ext.onReady(function(){
	//Ext.QuickTips.init();
	
    var fondsenStore = new Ext.data.JsonStore({
		// HttpProxy should be used here
        url: 'getresults.php',
        root: 'results',
        totalProperty: 'total',
        id: 'id',
		//remoteSort: true,
		sortInfo: {field: "fonds", direction: "ASC"},
        fields:	[
			{name: 'id', mapping: 'id', type: 'int'},
            {name: 'sector', mapping: 'sector',type:'string'},
            {name: 'fonds', mapping: 'fonds',type:'string'},
			{name: 'boekjaar', mapping: 'boekjaar', type:'string'},
			{name: 'valuta', mapping: 'valuta', type:'string'},
            {name: 'omzet', mapping: 'omzet', type: 'int'},
            {name: 'assets', mapping: 'assets', type: 'int'},
            {name: 'aantal_aandelen', mapping: 'aantal_aandelen', type: 'int'},
            {name: 'netto_jaarwinst', mapping: 'netto_jaarwinst', type: 'int'},
            {name: 'vreemd_vermogen', mapping: 'vreemd_vermogen', type: 'int'},
            {name: 'eigen_vermogen', mapping: 'eigen_vermogen', type: 'int'},
            {name: 'werkkapitaal', mapping: 'werkkapitaal', type: 'int'},
            {name: 'betaalde_rente', mapping: 'betaalde_rente', type: 'int'},
            {name: 'risicovrije_rente', mapping: 'risicovrije_rente', type:'float'},
            {name: 'cashflow', mapping: 'cashflow', type: 'int'},
            {name: 'ebitda', mapping: 'ebitda', type: 'int'},
            {name: 'koers', mapping: 'koers', type: 'float'}
		]
	});
		
    fondsenStore.load();//{params:{start:0, limit:25}});
	
	var colModel = new Ext.grid.ColumnModel([
	    { dataIndex:'sector', header: "Sector", width: 100, sortable: true},
	    { dataIndex:'fonds', header: "Fonds", width: 150, sortable: true, renderer:function(val){return "<b>"+val+"</b>";}}
	 ]);
	
	/*var paging = new Ext.PagingToolbar({
		store:store,
        pageSize: 25,
        displayInfo: true,
        displayMsg: 'Fonds {0} - {1} van {2}',
        emptyMsg: "No results to display"
    });*/
	
	function syncFilterBoxShadow()
	{
		filterBox.syncShadow();
		filterBox.center();
	}
	
	var filterBox = new Ext.Window({
		title: 'Filters',
		modal: true,
		width: 420,
		closeAction: 'hide',
		resizable: false,
		items: [
			new Ext.form.FormPanel({
				id:'filterBoxForm',
				layout:'fit',
				//labelAlign:'top',
				bodyStyle:'padding:10px 5px 5px 5px;',
				items: [
					{
						xtype:'fieldset',
			            checkboxToggle:true,
			            title: 'Filter 1',
						id: 'grid-filter-0',
			            autoHeight:true,
			            defaults: {width: 150},
			            defaultType: 'textfield',
			            collapsed: true,
			            items :[
							{
								xtype: 'combo',
								fieldLabel: 'Zoekveld',
								allowBlank: false,
								name: 'filterField0',
								transform: 'filter-columns',
								lazyRender: true,
								forceSelection: true,
								triggerAction: 'all',
								value: 'fonds',
								listWidth  :170
							},{
								xtype: 'combo',
								allowBlank: false,
								name: 'operator0',
								forceSelection: true,
								triggerAction: 'all',
								listWidth: 170,
								value: 'is gelijk aan',
								store: ['is gelijk aan', 'bevat', '< kleiner dan', '> groter dan']
								
							},{
								width  :166,
								fieldLabel: 'Zoekwaarde',
								name: 'filterValue0',
								allowBlank:false
							}
			            ],
						listeners: {
							collapse: syncFilterBoxShadow,
							expand: syncFilterBoxShadow
						}
					},
					{
						xtype:'fieldset',
			            checkboxToggle:true,
			            title: 'Filter 2',
						id: 'grid-filter-1',
			            autoHeight:true,
			            defaults: {width: 150},
			            defaultType: 'textfield',
			            collapsed: true,
			            items :[
							{
								xtype: 'combo',
								fieldLabel: 'Zoekveld',
								allowBlank: false,
								name: 'filterField1',
								transform: 'filter-columns1',
								lazyRender: true,
								forceSelection: true,
								triggerAction: 'all',
								value: 'fonds',
								listWidth  :170
							},{
								xtype: 'combo',
								allowBlank: false,
								name: 'operator1',
								forceSelection: true,
								triggerAction: 'all',
								listWidth: 170,
								value: 'is gelijk aan',
								store: ['is gelijk aan', 'bevat', '< kleiner dan', '> groter dan']
								
							},{
								width  :166,
								fieldLabel: 'Zoekwaarde',
								name: 'filterValue1',
								allowBlank:false
							}
			            ],
						listeners: {
							collapse: syncFilterBoxShadow,
							expand: syncFilterBoxShadow
						}
					},
					{
						xtype:'fieldset',
			            checkboxToggle:true,
			            title: 'Filter 3',
						id: 'grid-filter-2',
			            autoHeight:true,
			            defaults: {width: 150},
			            defaultType: 'textfield',
			            collapsed: true,
			            items :[
							{
								xtype: 'combo',
								fieldLabel: 'Zoekveld',
								allowBlank: false,
								name: 'filterField2',
								transform: 'filter-columns2',
								lazyRender: true,
								forceSelection: true,
								triggerAction: 'all',
								value: 'fonds',
								listWidth  :170
							},{
								xtype: 'combo',
								allowBlank: false,
								name: 'operator2',
								forceSelection: true,
								triggerAction: 'all',
								listWidth: 170,
								value: 'is gelijk aan',
								store: ['is gelijk aan', 'bevat', '< kleiner dan', '> groter dan']
								
							},{
								width  :166,
								fieldLabel: 'Zoekwaarde',
								name: 'filterValue2',
								allowBlank:false
							}
			            ],
						listeners: {
							collapse: syncFilterBoxShadow,
							expand: syncFilterBoxShadow
						}
					}
				]
			})
		],
		buttons: [
			{
				text: 'Filters wissen',
				iconCls: 'clear-filters',
				handler: function (args) {
					Ext.getCmp('grid-filter-0').collapse();
					Ext.getCmp('grid-filter-1').collapse();
					Ext.getCmp('grid-filter-2').collapse();
					Ext.getCmp('filterBoxForm').getForm().reset();
					fondsenStore.clearFilter();
				}
			},
			new Ext.Toolbar.Fill(),
			{
				text: 'Sluiten',
				iconCls: 'cancel',
				handler: function (args) {
					filterBox.hide();
				}
			},
			{
				text: 'Toepassen',
				iconCls: 'apply',
				handler: function () {
					// build filter object
					var filterObj = {};
						filterObj.filters = [];
					var form = Ext.getCmp('filterBoxForm').getForm();
					
					
					for(i = 0;i < 3;i++)
					{
						if(!Ext.getCmp('grid-filter-'+i).collapsed && form.findField('filterValue'+i).isValid())
						{
							var obj = {
								filterField	:	form.findField('filterField'+i).getValue(),
								operator	:	form.findField('operator'+i).getValue(),
								filterValue	:	form.findField('filterValue'+i).getValue()
							};
							filterObj.filters.push(obj);
						};
					}
					//console.log(filterObj.filters.length);
					//console.log(filterObj.filters);
					if(!filterObj.filters.length == 0)
					{
						// pass filter object to filter function
						//console.log(filterObj);
						fondsenStore.filterBy(gridFilterFunction,filterObj);
					} else {
						fondsenStore.clearFilter();
					}
				}
			}
		]
	});
	
	var grid = new Ext.grid.GridPanel({
        ds: fondsenStore,
        cm: colModel,
		sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
		stripeRows: true,
		region:'west',
		
		viewConfig: {
			forceFit: true
		},
		//bbar: paging,
		minSize: 300,
		width: 325,
		maxSize: 500,
	    height:500,
	    frame:false,
		tbar:	[
			'<b style="line-height:18px;">Fondsen</b>',
			'-',
			{
				iconCls:'filter',
				text:'Filters',
				handler: function(args) {
					filterBox.show();
				}
			}
		]
    });
	
	
	var tpl = new Ext.XTemplate(
	    '<table class="x-grid3-row" style="width:37%"><tbody>',
			
		'<tr><td width="20%">Fondsnaam</td><td width="17%"><strong>{fonds}</strong></td></tr>',		
		'<tr><td>Sector</td><td><em>{[this.toUcFirst(values.sector)]}</em></td></tr>',
		'<tr><td>Valuta</td><td>{valuta}</td></tr>',
		'<tr><td>Koers</td><td>{[this.asFloat(values.koers)]}</td></tr>',
		
		'<tr><td colspan="2">&nbsp;</td></tr>',
		
		'<tr><td>Marktwaarde</td><td>{[this.asCurrency(Math.round(values.aantal_aandelen * values.koers))]}</td></tr>',	    
		'<tr><td>Assets</td><td>{[this.asCurrency(values.assets)]}</td></tr>',	    
		'<tr><td>Omzet</td><td>{[this.asCurrency(values.omzet)]}</td></tr>',	    
		'<tr><td>Netto jaarwinst</td><td>{[this.asCurrency(values.netto_jaarwinst)]}</td></tr>',	    
		'<tr><td>Winst/aandeel</td><td>{[this.asCurrency((values.netto_jaarwinst / values.aantal_aandelen))]}</td></tr>',	   
		'<tr><td>Koers/winst verhouding</td><td>{[this.asCurrency((values.aantal_aandelen*values.koers/values.netto_jaarwinst))]}</td></tr>',	   
		
		'<tr><td colspan="2">&nbsp;</td></tr>',
		
		'<tr><td>Koers/boekwaarde</td><td>{[this.asCurrency(Math.round(values.aantal_aandelen * values.koers/values.eigen_vermogen*100)/100)]}</td></tr>',	    
		'<tr><td>Solvabiliteit (EV/EV+VV)</td><td>{[this.asCurrency(parseInt(values.eigen_vermogen)/(parseInt(values.eigen_vermogen) + parseInt(values.vreemd_vermogen)) )]}</td></tr>',	    
		'<tr><td>Winst/EV</td><td>{[this.asCurrency(parseInt(values.netto_jaarwinst)/parseInt(values.eigen_vermogen))]}</td></tr>',
		
		'<tr><td colspan="2">&nbsp;</td></tr>',
		
		'<tr><td>EV/aandeel</td><td>{[this.asCurrency((values.eigen_vermogen/values.aantal_aandelen))]}</td></tr>',
		'<tr><td>Assets/aandeel</td><td>{[this.asCurrency((values.assets/values.aantal_aandelen))]}</td></tr>',
		'<tr><td>DCF/aandeel</td><td>{[this.calculateDCF(this.calculateWACC(values.betaalde_rente,values.vreemd_vermogen,values.eigen_vermogen,values.netto_jaarwinst),values.cashflow,15,values.aantal_aandelen)]}</td></tr>',
		//'<tr><td>Riskfree rate plus 1</td><td>{[this.asFloat(values.risicovrije_rente)]}</td></tr>',
		'<tr><td>WACC plus 1</td><td>{[this.asFloat(this.calculateWACC(values.betaalde_rente,values.vreemd_vermogen,values.eigen_vermogen,values.netto_jaarwinst))]}</td></tr>',
		'<tr><td>Werkkapitaal/aandeel</td><td>{[this.asFloat(Math.round(100*values.werkkapitaal/values.aantal_aandelen)/100)]}</td></tr>',
	    
		'<tr><td colspan="2">&nbsp;</td></tr>',
				
		'<tr><td>Eigen vermogen</td><td>{[this.asCurrency(values.eigen_vermogen)]}</td></tr>',
		'<tr><td>Vreemd vermogen</td><td>{[this.asCurrency(values.vreemd_vermogen)]}</td></tr>',
		'<tr><td>Werkkapitaal</td><td>{[this.asCurrency((values.werkkapitaal))]}</td></tr>',
		'<tr><td>Cashflow</td><td>{[this.asCurrency(values.cashflow)]}</td></tr>',
		'<tr><td>Aantal aandelen</td><td>{[this.asCurrency((values.aantal_aandelen))]}</td></tr>',
	    
		'<tr><td colspan="2">&nbsp;</td></tr>',
				
		'<tr><td>Ebit(da)</td><td>{[this.asCurrency(values.ebitda)]}</td></tr>',
		'<tr><td>Ebit(da)/EV+VV</td><td>{[this.asFloat(Math.round(1000*(parseInt(values.ebitda)/(parseInt(values.eigen_vermogen)+parseInt(values.vreemd_vermogen))))/1000)]}</td></tr>',
		//'<tr><td>Ebit(da)/omzet</td><td>{[this.asFloat(Math.round(1000*values.ebitda/values.omzet)/1000)]}</td></tr>',
		'<tr><td>Ebit(da)/EV</td><td>{[this.asFloat(Math.round(1000*values.ebitda/values.eigen_vermogen)/1000)]}</td></tr>',
	    
		'<tr><td colspan="2">&nbsp;</td></tr>',
		
		'<tr><td>Betaalde rente</td><td>{[this.asCurrency(values.betaalde_rente)]}</td></tr>',
		'<tr><td>Rente/VV</td><td>{[this.asFloat(Math.round(values.betaalde_rente/values.vreemd_vermogen*1000)/1000)]}</td></tr>',
		'<tr><td>Werkkapitaal/assets</td><td>{[this.asFloat(Math.round(values.werkkapitaal/values.assets*1000)/1000)]}</td></tr>',
		'<tr><td>EV/assets</td><td>{[this.asFloat(Math.round(values.eigen_vermogen/values.assets*1000)/1000)]}</td></tr>',
		'<tr><td>Winst/omzet</td><td>{[this.asFloat(Math.round(values.netto_jaarwinst/values.omzet*1000)/1000)]}</td></tr>',
		
		'</tbody></table>',
		'<div style="position:absolute;width:63%;top:5px;left:37%;">',
			'<div id="koersgrafiek{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
			'<div id="winstperaandeeldiagram{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
			//'<div style="clear:both;"></div>',
			'<div id="omzetdiagram{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
			'<div id="eigenvermogendiagram{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
			//'<div style="clear:both;"></div>',
			'<div id="assetsdiagram{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
			'<div id="cashflowdiagram{id}" style="float:left;margin-right:5px;margin-bottom:5px;"></div>',
		'</div>',
		'<div style="clear:both;"></div>',
		'<br/><br/>',	{
			asFloat: function (val)
			{
				return val.toString().replace(".",",");
			},
			asCurrency: function (val)
			{
				return formatCurrency(val);
			},
			calculateDCF: function (rvr, cf, n,am_aand)
			{
				var retval = 0;
				
				if(rvr < 1) 
					return "<i>n/a</i>"
				
				for(var i = 1;i<=parseInt(n);i++)
				{
					retval += parseInt(cf)/Math.pow(rvr,i);
				}
				//console.log(retval);
				return this.asCurrency(retval/am_aand);
			},
			calculateWACC:function(betaalde_rente,vreemd_vermogen,eigen_vermogen,netto_jaarwinst) 
			{
			var varA = (parseInt(betaalde_rente)/parseInt(vreemd_vermogen));
			var varB = (parseInt(vreemd_vermogen)/(parseInt(vreemd_vermogen)+parseInt(eigen_vermogen)));
			var varC = ((parseInt(netto_jaarwinst)/parseInt(eigen_vermogen))*(parseInt(eigen_vermogen)/(parseInt(eigen_vermogen)+parseInt(vreemd_vermogen))));
			//*Y7*(K7/(K7+N7))+(P7*Q7)+1
			//alert(varA);
			//alert(varB);
			//alert(varC);
			return Math.round((0.7 * varA * varB + varC +1)*1000)/1000;
			 //return 0.7*(betaalde_rente/vreemd_vermogen)*(vreemd_vermogen/vreemd_vermogen+eigen_vermogen)+((parseInt(netto_jaarwinst)/parseInt(eigen_vermogen))*(parseInt(eigen_vermogen)/(parseInt(eigen_vermogen)+parseInt(vreemd_vermogen)))))+1;
			},
			toUcFirst: function(val)
			{
				return val.charAt(0).toUpperCase() + val.substr( 1, val.length);
			}
	});
	function formatCurrency(num) {
		num = num.toString().replace(/\$|\,/g,'');
		if(isNaN(num))
		num = "0";
		sign = (num == (num = Math.abs(num)));
		num = Math.floor(num*100+0.50000000001);
		cents = num%100;
		num = Math.floor(num/100).toString();

		for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
		num = num.substring(0,num.length-(4*i+3))+'.'+
		num.substring(num.length-(4*i+3));
		if(cents == 0){
			return (sign?'':'-')+num;
		} else if (cents<10) {
			cents = "0" + cents;
		}
		return (sign?'':'-')+num + ',' + cents;
	}
	var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait...",store:fondsenStore});
	
	
	var partAandeelwijzer = new Ext.Panel({
		layout:'border',
		region:'center',
		bodyBorder: false,
		defaults: {
		   // collapsible: false,
			split: true,
			autoHide: false,
			useSplitTips: false
		},
		items:[
			grid
			,new Ext.TabPanel({
				resizeTabs:true, // turn on tab resizing
				id:'propertyPanel',
				enableTabScroll:true,
				collapsible:false,
				defaults: {autoScroll:true},
				region:'center'
			})
		]
	});
	
	var partHome = new Ext.Panel({contentEl:"homeContent"});
	var partAgenda = new Ext.Panel({contentEl:"agendaContent"});
	var partToelichting = new Ext.Panel({contentEl:"toelichtingContent"});
	
	
	var borderLayout = new Ext.Viewport({
		id:'border-panel',
		layout:'border',
		height:550,
		bodyBorder: false,
		
		defaults: {
		    collapsible: false,
			split: false,
			autoHide: false,
			useSplitTips: false
		},
		items: [
			{
				layout: 'anchor',
				height: 60,
				border:false,
				collapsible: false,
				region: 'north',
				items: [
					new Ext.Panel({
					    height: 32,
					    contentEl:"header",
						baseCls : 'header'					
					}),
					new Ext.Toolbar({
						items: [
							{
								toggleGroup: 'default-menu',
								enableToggle : true,
								pressed : true,
								text:Ext.get("main-menu").query("a")[0].innerHTML,
								handler:function(e){
								e.toggle(true);
									Ext.getCmp('contentPanel').getLayout().setActiveItem(0);
								}
							},
							'-',
							{
								enableToggle : true,
								toggleGroup: 'default-menu',
								text:Ext.get("main-menu").query("a")[1].innerHTML,
								handler:function(e){
									Ext.getCmp('contentPanel').getLayout().setActiveItem(1);
									e.toggle(true);
								}
							},
							'-',
							{
								enableToggle : true,
								toggleGroup: 'default-menu',
								text:Ext.get("main-menu").query("a")[2].innerHTML,
								handler:function(e){
									e.toggle(true);
									Ext.getCmp('contentPanel').getLayout().setActiveItem(2);
								}
							},
							'-',
							{
								enableToggle : true,
								toggleGroup: 'default-menu',
								text: Ext.get("main-menu").query("a")[3].innerHTML,
								handler:function(e){
									e.toggle(true);
									Ext.getCmp('contentPanel').getLayout().setActiveItem(3);
								}
							}
						]
					})
				]
			},
			new Ext.Panel({
				id:'contentPanel',
				layout:'card',
				activeItem: 0,
				border:false,
				//layout:'fit',
				region:'center',
				items:[partHome,partAgenda,partToelichting,partAandeelwijzer]
			})
		]
	});
	borderLayout.render('aandeelwijzer-layout');
	
	
	/*******************************
		Listeners
	********************************/
	function gridFilterFunction(rec, id)
	{

		for (var i = 0;i < this.filters.length;i++)
		{


			var filterFieldValue;
			var filterValue = this.filters[i].filterValue;
			
			switch (this.filters[i].filterField) {
				case 'sector':
					filterFieldValue = rec.data.sector;
					break;
				case 'fonds':
					filterFieldValue = rec.data.fonds;
					break;
				case 'jaarwinst':
					filterFieldValue = parseInt(rec.data.netto_jaarwinst);
					break;
				case 'koers_boekwaarde':
					filterFieldValue = Math.round(rec.data.aantal_aandelen * rec.data.koers/rec.data.eigen_vermogen * 100) / 100;
					break;
				case 'winst_eigenvermogen':
					filterFieldValue = rec.data.netto_jaarwinst / rec.data.eigen_vermogen;
					break;
				case 'koers_winstverhouding':
					filterFieldValue = rec.data.aantal_aandelen * rec.data.koers / rec.data.netto_jaarwinst;
					break;
				case 'marktwaarde':
					filterFieldValue = Math.round(rec.data.aantal_aandelen * rec.data.koers);
					break;
			}
			
			switch (this.filters[i].operator)
			{
				case 'is gelijk aan':
					if(!(filterFieldValue.toString().toUpperCase() == filterValue.toString().toUpperCase()))
						return false;
					break;
				case 'bevat':
					if(filterFieldValue.toString().toUpperCase().indexOf(filterValue.toString().toUpperCase()) == -1)
						return false;
					break;
				case '< kleiner dan':
					if(filterFieldValue >= parseFloat(filterValue.replace(',','.')))
						return false;
					break;
				case '> groter dan':
					if(filterFieldValue <= parseFloat(filterValue.replace(',','.')))
						return false;
					break;
			}

		}
		return true;
		//console.log(arg1, this);return false;
	}
	
	grid.addListener('cellclick',function( grid, rowIndex, columnIndex, e){
		var record = grid.getStore().getAt(rowIndex);
		var createGraphs = false;
		//var propGrid = Ext.getCmp('propGrid');
        // make sure the property grid exists
		//if (propGrid) {
		//Koers
			// populate the property grid with store data
			//setTitle("Fonds: "+  record.data.fonds);
		var tabPanel = Ext.getCmp('propertyPanel');
		if(!tabPanel.findById(record.data.id+"tab")){
			Ext.getCmp('propertyPanel').add({id:record.data.id+"tab",title:record.data.fonds,closable:true,html:tpl.applyTemplate(record.data)});
			createGraphs = true;
			//Ext.getCmp(record.data.id+"tab").doLayout();
		} 
		tabPanel.activate(record.data.id+"tab");
		
		if(createGraphs == true)
			addGraph(record);
		
		
			/*propGrid.setSource({
				 "Fondsnaam"			: record.data.fonds
				,"Sector"				: record.data.sector
				,"Valuta"				: record.data.valuta
				,"Koers"				: record.data.koers
				,"-"					: null
				,"Marktwaarde"			: " "
			
			});*/
		//}
	});
	
	function addGraph(rec)
	{
		var fundId = rec.data.id;
		
		// koers
		var koersStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=koers&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			fundIdentifier: fundId,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type:'date', dateFormat: 'Y-m-d'},
				{name: 'week', mapping: 'week'},
				{name: 'koers', mapping: 'koers', type:'float'}
			]
		});
		
		koersStore.addListener('load',function(st, recs, opt) {
			var yaxis ;
			var useMinimum = true;
			var negativeValue = false;
			
			for (var rec in recs) {
				//console.log(recs[rec]);
				if(typeof(recs[rec]) == "object" && recs[rec]['data']['koers'] >= 1)
					useMinimum = false;
				if(typeof(recs[rec]) == "object" && recs[rec]['data']['koers'] < 0)
					negativeValue = true;
			}
			if(useMinimum && !negativeValue){
				yaxis =  new Ext.chart.NumericAxis({
						displayName: 'Koers',
						snapToUnits: false,
						//alwaysShowZero: true,
						minimum:0,
						maximum: 1,
						labelRenderer : Ext.util.Format.numberRenderer('0.000,00/i')
					});
			} else {
				yaxis =  new Ext.chart.NumericAxis({
						displayName: 'Koers',
						snapToUnits: false,
						//alwaysShowZero: false,
						//minimum: 0,
						//maximum: 10,
						labelRenderer : Ext.util.Format.numberRenderer('0.000,00/i')
					});
			}
		
			new Ext.Panel({
				title: 'Koers op weekbasis',
				renderTo: 'koersgrafiek' + st.fundIdentifier,
				width:250,
				height:180,
				layout:'fit',

				items: {
					xtype: 'linechart',
					store: koersStore,
					xField: 'week',
					yField: 'koers',
					listeners: {
						itemclick: function(o){
							//var rec = store.getAt(o.index);
							//Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('name'));
						}
					},
					xAxis: new Ext.chart.CategoryAxis({
						hideOverlappingLabels:true
					}),
					yAxis: yaxis,
					tipRenderer : function(chart, record, index, series){
						if(series.yField == 'koers'){
							return Ext.util.Format.number(record.data.koers, '0.000,00/i') + ' in week ' + record.data.week;
						}
					},
					series: [{
						type: "line",
						displayName: "Koers",
						yField: "koers",
						style: {
							//fillColor: 0xFFAAAA,
							fillColor: 0xFF0000,
							//lineColor: 0xFF5555,
							lineColor: 0xFF0000,
							lineSize:1,
							size:4,
							//line:1,
							color:0xFF0000
						}
					}]
				}
			});
		});
		
		// winst per aandeel
		var winstperaandeelStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=wpa&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			fundIdentifier: fundId,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type: 'date', dateFormat:"Y-m-d"},
				{name: 'quarter', mapping: 'quarter'},
				{name: 'wpa', mapping: 'wpa', type:'float'}
			]
		});
		
		winstperaandeelStore.addListener('load',function(st, recs, opt) {
			var yaxis ;
			var useMinimum = true;
			var negativeValue = false;
			var highestVal = 0;
			var lowestVal = 0;
			
			for (var rec in recs) {
				//console.log(recs[rec]);
				if(typeof(recs[rec]) == "object" && recs[rec]['data']['wpa'] >= 1)
					useMinimum = false;
				if(typeof(recs[rec]) == "object" && recs[rec]['data']['wpa'] < 0)
					negativeValue = true;
					
				highestVal 	= 	(typeof(recs[rec]) == "object" && recs[rec]['data']['wpa'] > highestVal) ? recs[rec]['data']['wpa'] : highestVal;
				lowestVal 	= 	(typeof(recs[rec]) == "object" && recs[rec]['data']['wpa'] < lowestVal) 	? recs[rec]['data']['wpa'] : lowestVal;
			}
			//if(useMinimum && !negativeValue){
				yaxis =  new Ext.chart.NumericAxis({
						displayName: 'WPA',
						snapToUnits: false,
						//alwaysShowZero: false,
						minimum: lowestVal > 0 ? 0 : Math.floor(lowestVal),
						maximum: Math.ceil(highestVal),
						labelRenderer : Ext.util.Format.numberRenderer('0.000,00/i')
					});
		/*	} 	else if(negativeValue){
				yaxis =  new Ext.chart.NumericAxis({
						displayName: 'WPA',
						snapToUnits: false,
						//alwaysShowZero: false,
						//minimum: 0,
						maximum: 1,
						labelRenderer : Ext.util.Format.numberRenderer('0.000,00/i')
					});
			} else {
				yaxis =  new Ext.chart.NumericAxis({
						displayName: 'WPA',
						snapToUnits: false,
						//alwaysShowZero: false,
						//minimum: 0,
						//maximum: 1,
						labelRenderer : Ext.util.Format.numberRenderer('0.000,00/i')
					});
			}*/
			new Ext.Panel({
				title: 'Winst per aandeel op jaarbasis',
				renderTo: 'winstperaandeeldiagram'+st.fundIdentifier,
				width:250,
				height:180,
				layout:'fit',

				items: {
					xtype: 'columnchart',
					store: winstperaandeelStore,
					//id:"wpachart",
					xField: 'quarter',
					yField: 'wpa',
					
					listeners: {
						itemclick: function(o){
							//var rec = store.getAt(o.index);
							//Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('name'));
						}
					},
					yAxis: yaxis,
					tipRenderer : function(chart, record, index, series){
						if(series.yField == 'wpa') {
							return Ext.util.Format.number(record.data.wpa, '0.000,00/i') + ' WPA in ' + record.data.quarter;
						}
					},
					series: [{
						type: 'column',
						displayName: 'WPA',
						yField: 'wpa',
						style:{fillColor:'0xB3E5EF'}
					}]
				}
			});
			//console.log(Ext.getCmp('wpachart'));
		});
		
		
		
		// omzet
		var omzetStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=omzet&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type: 'date', dateFormat:"Y-m-d"},
				{name: 'quarter', mapping: 'quarter'},
				{name: 'omzet', mapping: 'omzet',type:'int'}
			]
		});
			
		new Ext.Panel({
			title: 'Omzet op jaarbasis',
			renderTo: 'omzetdiagram'+fundId,
			width:250,
			height:180,
			layout:'fit',

			items: {
				xtype: 'columnchart',
				store: omzetStore,
				xField: 'quarter',
				yField: 'omzet',
				yAxis: new Ext.chart.NumericAxis({
					displayName: 'Omzet',
					snapToUnits: false,
					labelRenderer : Ext.util.Format.numberRenderer('0.0/i')
				}),
				tipRenderer : function(chart, record, index, series){
					if(series.yField == 'omzet'){
						return Ext.util.Format.number(record.data.omzet, '0.0/i') + ' omzet in ' + record.data.quarter;
					}
				},
				series: [{
					type: 'column',
					displayName: 'Omzet',
					yField: 'omzet',
					style:{fillColor:'0xB3E5EF'}
                }]
			}
		});
	
		
		// eigen vermogen
		var evStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=ev&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type: 'date', dateFormat:"Y-m-d"},
				{name: 'quarter', mapping: 'quarter'},
				{name: 'eigen_vermogen', mapping: 'eigen_vermogen',type:'int'}
			]
		});
			
		new Ext.Panel({
			title: 'Eigen vermogen',
			renderTo: 'eigenvermogendiagram'+fundId,
			width:250,
			height:180,
			layout:'fit',

			items: {
				xtype: 'columnchart',
				store: evStore,
				xField: 'quarter',
				yField: 'eigen_vermogen',
				yAxis: new Ext.chart.NumericAxis({
					displayName: 'Eigen vermogen',
					snapToUnits: false,
					labelRenderer : Ext.util.Format.numberRenderer('0.0/i')
				}),
				tipRenderer : function(chart, record, index, series){
					if(series.yField == 'eigen_vermogen'){
						return Ext.util.Format.number(record.data.eigen_vermogen, '0.0/i') + ' E/V in ' + record.data.quarter;
					}
				},
				series: [{
					type: 'column',
					displayName: 'E/v',
					yField: 'eigen_vermogen',
					style:{fillColor:'0xB3E5EF'}
                }]
			}
		});
	
		
		
		// assets
		var assetsStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=assets&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type: 'date', dateFormat:"Y-m-d"},
				{name: 'quarter', mapping: 'quarter'},
				{name: 'assets', mapping: 'assets',type:'int'}
			]
		});
			
		new Ext.Panel({
			title: 'Assets',
			renderTo: 'assetsdiagram'+fundId,
			width:250,
			height:180,
			layout:'fit',

			items: {
				xtype: 'columnchart',
				store: assetsStore,
				xField: 'quarter',
				yField: 'assets',
				yAxis: new Ext.chart.NumericAxis({
					displayName: 'Assets',
					snapToUnits: false,
					labelRenderer : Ext.util.Format.numberRenderer('0.0/i')
				}),
				tipRenderer : function(chart, record, index, series){
					if(series.yField == 'assets'){
						return Ext.util.Format.number(record.data.assets, '0.0/i') + ' assets in ' + record.data.quarter;
					}
				},
				series: [{
					type: 'column',
					displayName: 'Assets',
					yField: 'assets',
					style:{fillColor:'0xB3E5EF'}
                }]
			}
		});
		
		
		// cashflow
		var cfStore = new Ext.data.JsonStore({
			autoLoad:		true,
			url: 			'graphData.php?action=cashflow&fundId='+fundId+"&boekjaar="+rec.data.boekjaar,
			root: 			'results',
			totalProperty: 	'total',
			sortInfo: {field: "datum", direction: "ASC"},
			fields:	[
				{name: 'datum', mapping: 'datum', type: 'date', dateFormat:"Y-m-d"},
				{name: 'quarter', mapping: 'quarter'},
				{name: 'cashflow', mapping: 'cashflow',type:'int'}
			]
		});
			
		new Ext.Panel({
			title: 'Cashflow',
			renderTo: 'cashflowdiagram'+fundId,
			width:250,
			height:180,
			layout:'fit',

			items: {
				xtype: 'columnchart',
				store: cfStore ,
				xField: 'quarter',
				yField: 'cashflow',
				yAxis: new Ext.chart.NumericAxis({
					displayName: 'Cashflow',
					snapToUnits: false,
					labelRenderer : Ext.util.Format.numberRenderer('0.0/i')
				}),
				tipRenderer : function(chart, record, index, series){
					if(series.yField == 'cashflow'){
						return Ext.util.Format.number(record.data.cashflow, '0.0/i') + ' cashflow in ' + record.data.quarter;
					}
				},
				series: [{
					type: 'column',
					displayName: 'Cashflow',
					yField: 'cashflow',
					style:{fillColor:'0xB3E5EF'}
                }]
			}
		});
		

	}
	
});