// JavaScript Document

function renderValidateStatus (value)
{
	return '<div style="width:50px">' + value + '</div>';
}

function load_submission (div_id, bid, vid, colMode)
{
	// clear if template has been previously loaded
	if (Ext.get(div_id).child('div')) {
		Ext.get(div_id).child('div').remove();
	}
	
	// configure column
	var hide_vs, hide_ss;
	if (colMode == 'submit') {
		hide_vs	=	true;
		hide_ss	=	true;
	} else if (colMode == 'validate') {
		hide_vs	=	false;
		hide_ss	=	true;
	} else if (colMode == 'load') {
		hide_vs	=	false;
		hide_ss	=	false;
	} else {
		hide_vs	=	true;
		hide_ss	=	true;
	}
	var	fm		=	Ext.form;
	var searchURL	=	'VarBatchSub.cgi';
	var px			=	new Ext.data.HttpProxy ({
							url: searchURL + '?bid=' + bid + '&vid=' + vid + '&rm=getbatch',
							method: 'GET'
						});
	var jd			=	new Ext.data.JsonReader ({
								root: 'results',
								totalProperty: 'total',
								id: 'recordID'
							}, [ 'recordID', 'status', 'subsnp_html', 'hgvs_sub', 'disease_id_type', 'disease_id', 'clinic_phrase', 'pubmed_id', 'lsnp_id', 'alvar', 'num_obs', 'linkout', 'comment'
						]);
	
	var ds			=	new Ext.data.Store ({
							proxy: px,
							reader: jd
							//listeners: {'load':function(){document.getElementById('bname').innerHTML = jd.jsonData.lbatch_id; document.getElementById('bdescription').innerHTML = jd.jsonData.description; document.getElementById('bstatus').innerHTML = jd.jsonData.status; }}
						});
	
	var	cm		=	new Ext.grid.ColumnModel([{
							id:'recordID',
							header:'',
							dataIndex:'recordID',
							width:40,
							editor: new fm.TextField ({
								allowBlank:false
							})
						}, {
							header: "Submitted SNP ID",
							dataIndex: 'subsnp_html',
							width:130,
							hidden: hide_ss
						}, {
							header: "Validation Status",
							dataIndex: 'status',
							width:430,
							hidden: hide_vs,
							renderer: renderValidateStatus
						}, {
							header: "HGVS Name",
							dataIndex: 'hgvs_sub',
							width:130,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Disease ID Type',
							dataIndex: 'disease_id_type',
							width:100,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Disease ID',
							dataIndex: 'disease_id',
							width:80,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Clinical interpretation',
							dataIndex: 'clinic_phrase',
							width:120,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'PubMed ID',
							dataIndex: 'pubmed_id',
							width:70,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Local ID',
							dataIndex: 'lsnp_id',
							width:50,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'OMIM allelic variant',
							dataIndex: 'alvar',
							width:100,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Number of observations',
							dataIndex: 'num_obs',
							width:100,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Linkout',
							dataIndex: 'linkout',
							width:50,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}, {
							header: 'Comment',
							dataIndex: 'comment',
							width:100,
							editor: new fm.TextField ({
								allowBlank:true
							})
						}
					]);

	var grid	=	new Ext.grid.EditorGridPanel({
		id: div_id,
		store:	ds,
		cm:		cm,
		renderTo: div_id,
		width: 880,
		height: 400,
		//autoWidth: true,
		loadMask:true,
		stripeRows: true,
		viewConfig: {
			//forceFit: true
			//autoFill: true
			//enableRowBody: true,
			//getRowClass: function (record, rowIndex, p, store) {
			//	p.body = '<p>' + record.data.status + '</p>';
			//	return 'x-grid3-row-expanded';
			//}
		},
//		autoExpandColumn:'recordID',
//		title:'Edit submission',
//		frame:true,
		clicksToEdit:1
	});
	ds.load({params:{start:0, limit:10}});
	return grid;
}

function view_batch (div_id, bid, vid, colMode)
{
	var	bwin	=	new Ext.Window ({
						title: 'View submission',
						width: 895,
						height: 470,
						layout: 'fit',
						modal: true,
						//html: '<div><dt>Submission name:</dt><dd id="bname"></dd><dt>Description</dt><dd id="bdescription"></dd><dt>Status</dt><dd id="bstatus"></dd></div><div id="' + div_id + '"></div>',
						html: '<div id="' + div_id + '"></div>',
						buttons: [{
							text: 'Close',
							handler: function() {
								bwin.close();
							}
						}]
					});
	bwin.show ();
	load_submission (div_id, bid, vid, colMode);
}