dojo.require("dojo.parser");
dojo.require("dojo.cookie");
dojo.require("dijit.form.Button");
dojo.require("dijit.Dialog");
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.LayoutContainer");
dojo.require("dijit.layout.SplitContainer");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.AccordionContainer");
dojo.require("dijit.Menu");
dojo.require("dijit.Toolbar");
dojo.require("dijit.Tooltip");

dojo.require("dojo.hash");
dojo.require("dijit.dijit");
dojo.require("dijit.form.Form");
dojo.require("dijit.form.TextBox");
dojo.require("dijit.form.NumberTextBox");
dojo.require("dijit.form.MultiSelect");
dojo.require("dijit.form.CheckBox");
dojo.require("dijit.form.NumberSpinner");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dijit.Editor");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojox.grid.DataGrid");
dojo.require("dijit.form.SimpleTextarea");
dojo.require("dijit.form.Textarea");
dojo.require("dijit.form.ComboBox");
dojo.require("dijit.Declaration");
dojo.require("dijit._editor.plugins.AlwaysShowToolbar");
dojo.require("dijit._editor.plugins.EnterKeyHandling");
dojo.require("dijit._editor.plugins.TextColor");
dojo.require("dijit._editor.plugins.LinkDialog");
dojo.require("dojox.editor.plugins.Save");
dojo.require("dojox.form.Rating");
dojo.require("dojo.number");
dojo.require("dojox.data.XmlStore");
dojo.require("dojox.layout.ScrollPane"); 
dojo.require("dojox.form.FileInputAuto");

dojo.require("dojox.grid.TreeGrid");
dojo.require("dijit.tree.ForestStoreModel");

var session;
var pages = new Array();
var paneId=1;
var popupId=1;

var resultStructure = [
			   {cells: [
{name: "ID", field: "ID", width: "auto",formatter: ciproIDFormatter},
{name: "Length", field: "Length", width: "auto"},
{name: "MW", field: "MW(calc)", width: "auto"},
{name: "pI", field: "pI(calc)", width: "auto"}
				    ]}
			   ];
var pmfStructure = [
			   {cells: [
{name: "ID", field: "ID", width: "auto",formatter: pmfFormatter},
{name: "Length", field: "Length", width: "auto"},
{name: "MW", field: "MW(calc)", width: "auto"},
{name: "pI", field: "pI(calc)", width: "auto"},
{name: "Count", field: "count", width: "auto"}
				    ]}
			   ];

var blastStructure = [
			   {cells: [
{name: "ID", field: "ID", width: "auto",formatter: ciproIDFormatter},
{name: "Length", field: "Length", width: "auto"},
{name: "MW", field: "MW(calc)", width: "auto"},
{name: "pI", field: "pI(calc)", width: "auto"},
{name: "E-value", field: "evalue", width: "auto"}
				    ]}
			   ];

var blastpmfStructure = [
			   {cells: [
{name: "ID", field: "ID", width: "auto",formatter: pmfFormatter},
{name: "Length", field: "Length", width: "auto"},
{name: "MW", field: "MW(calc)", width: "auto"},
{name: "pI", field: "pI(calc)", width: "auto"},
{name: "E-value", field: "evalue", width: "auto"},
{name: "Count", field: "count", width: "auto"}
				    ]}
			   ];


var uploadCallback = function(data,ioArgs,widgetRef){
    if(data){
	if(data.status && data.status == "success"){
	    widgetRef.overlay.innerHTML = "success!";
	}else{
	    widgetRef.overlay.innerHTML = "error? ";
	    //console.log('error',data,ioArgs);
	}
    }else{
	// debug assist
	//console.log('ugh?',arguments);
    }
}

function addNewUpload(){
    var node = document.createElement('input');
    var targetNode = dojo.byId('upload');
    while (targetNode.firstChild) {
	targetNode.removeChild(targetNode.firstChild);
    }
    dojo.byId('upload').appendChild(node);
    var widget = new dojox.form.FileInputAuto({
	    url: "RecieveFile.cgi",
	    name: "inputFile",
	    triggerEvent:"onchange",
	    onComplete: uploadCallback
	},node);
    widget.startup();
}


function clone(entry){
    var popup = new dijit.Dialog({content: '<b>clone id:</b><br>'+entry.replace(/#/g,"<br>")
	});
    dojo.body().appendChild(popup.domNode);
    popup.startup();
    popup.show();
    //alert("This is test alert");
}

function permsDetail(arg) {
    var elm = arg.split("|");
    var queries = elm[1].split(",");
    var popup = new dijit.Dialog({title: 'Detail: '+elm[0], 
    				content: '<iframe id="pmf'+elm[0]+"_"+popupId+'" src="showDetail.cgi?id='+elm[0]+"&query="+elm[1]+"&accuracy="+elm[2]+"&ptms="+elm[3]+"&contami="+elm[4]+"&enzyme="+elm[5]+
					  '" frameborder="0" marginheight="0" marginwidth="0" width="680" height="'+(queries.length*20)+'"></iframe>'
	});
    dojo.body().appendChild(popup.domNode);
    popup.startup();
    popup.show();
}

function testClose(pane,tab){
    return confirm("Are you sure you want to discard your changes?");
}

function ciproIDFormatter(id){
    return "<a href='#" + id + "'>"+id+"</a>";
}

function pmfFormatter(arg) {
    var elm = arg.split("|");
    return "<a href='#" + elm[0] + "'>" + elm[0] + "</a>&nbsp;<a href='javascript:permsDetail(\"" + arg + "\")'> Detail </a>";
}

function myImageFormatter(url){
    return "<img width='40' height='40' src='" + url + "'/>";
}

var checkboxFormatter = function(data, rowIndex){
    if (data) {	
	return "<input type='checkbox' checked />";
    }
    else {
	return "<input type='checkbox'  />";
    }
};
var rangeFormatter = function(data, rowIndex){
    if (data) {
	return "<img src='php/hit.php?range="+data+"'/>";
    }
};

function onStyleRow(inRow) {
    with (inRow) {
        if (over)
            customClasses += ' overRow';
    }
}

function indexinit(sid)
{
    session = dojo.cookie("at-ciprojp");
    if(!session){
	dojo.cookie("at-ciprojp", sid, {expires: 365});
	session = sid;
    }
    //dojo.connect(document.body,"onhashchange",null,updateHash,true);
    dojo.subscribe("/dojo/hashchange",document.body,updateHash);
    updateHash();

    obj = dijit.byId("maindiv");
    dojo.connect(obj,"selectChild",function(child){
	    dojo.hash(child.title);
	    getEvidence(child.title);
	    //getRelated(child.title);
	    getComment(child.title);
	    getHistory(child.title);
	});
    dojo.connect(document.body,"onbeforeunload",null,sendHistory,true);
}

function getMaintext(cipro_id) {
    var targetNode = dojo.byId(cipro_id+"_maintext");
    var header = dojo.byId("header"+cipro_id);

    // Wiki link
    var wtable = dojo.create("table", { style:"border:0;cellpadding:0;cellspacing:0;"},'extra'+cipro_id);
    var wtr = dojo.create("tr", {}, wtable);
    var wtd = dojo.create("td", {}, wtr);
    var wlink = dojo.create("a", {innerHTML:"&raquo; Wiki", href: "/wiki/"+cipro_id, target: "wiki"}, wtd);

    var e = new Array();
    var d = new Array();
    dojo.xhrGet({url: "php/rate.php",
		content:{id: cipro_id},handleAs: "json",load: function(data){
		var rate = new dojox.form.Rating({numStars:"5",value: data.items[0].rating, disabled: "true"},header);
	    }});
    dojo.xhrGet({url:"php/getcevidence.php",content:{id:cipro_id,sid:session},handleAs:"json",load:function(data){
		dojo.forEach(data.items,function(eitem, eidx, earr){
			e[eitem.id] = true;
			d[eitem.type] = eitem.id;
		    });
	    }});
    
    var annot = new dijit.form.ComboBox({
            store: new dojo.data.ItemFileReadStore({url: "php/getcname.php?id="+cipro_id}),
	    autoComplete: true,
	    searchAttr:"cname",
	    labelAttr:"label",
	    style: "width: 300px;",
	    },"annotname"+cipro_id);
    var user = new dijit.form.ComboBox({
	    style: "width: 150px;",
	    hasDownArrow: false,
	    required: true,
	    },"uname"+cipro_id);    
    var vote = new dijit.form.ComboBox({
            store: new dojo.data.ItemFileReadStore({url: "php/name.php?id="+cipro_id}),
	    autoComplete: true,
	    query: {name: "*"},
	    style: "width: 150px;",
	    required: true,
	},"cname"+cipro_id);
    var xhrArgs = {
	url: "php/results.php",
	content: {id: cipro_id},
	handleAs: "json",
	load: function(data) {
	    dojo.forEach(data.items,function(item, idx, arr){
		    var table = dojo.create("table", { style:"border:0;cellpadding:0;cellspacing:0;"},'extra'+cipro_id);
		    if(item.type == "basic"){
			var table = dojo.create("table", { style:"border:0;cellpadding:0;cellspacing:0;"},targetNode);
			var tr = dojo.create("tr",{},table);
			var ter = ".&nbsp;";
			if(item.sflag == "t"){
			    ter += '<font color="darkred"><b>Met</b></font> &raquo;';
			}
			if(item.eflag){
			    ter += '&raquo;&nbsp;<font color="darkred"><b>Stop codon</b></font>';
			}
			var td = dojo.create("td",
				    {style:"font-family: Arial;font-size: 9pt;",
					    innerHTML:"Length: "+item.length + "aa, MW: " + item.mw + "Da, pI: "+ item.pi + ter},tr);
			tr = dojo.create("tr",{},table);
			td = dojo.create("td",{},tr);
			dojo.create("textarea",{id:"sequence"+cipro_id},td);
			var textarea = new dijit.form.Textarea({
				name: "sequence"+cipro_id,
				value: item.seq,
				style: "width:400px;"
			    },"sequence"+cipro_id);
			var tr2 = dojo.create("tr",{},table);
			var td2 = dojo.create("td",{},tr2);			
			dojo.create("a",{innerHTML:"&raquo; Submit sequence to NCBI BLAST",
				    href: 'http://blast.ncbi.nlm.nih.gov/Blast.cgi?PROGRAM=blastp&BLAST_PROGRAMS=blastp'+
				    '&PAGE_TYPE=BlastSearch&SHOW_DEFAULTS=on&LINK_LOC=blasthome&QUERY='+dijit.byId("sequence"+cipro_id).attr('value'),
				    target:"_blank"},td2);
			dojo.forEach(item.content,function(i, idx, arr){
				if(i == "sds"){
				    var sds = dojo.byId("sds"+cipro_id);
				    var gels = new dojox.layout.ScrollPane({orientation:"horizontal",
									    style:"overflow:hidden;width:310px;height:155px;"+
									    " border:1px solid #b7b7b7"}).placeAt(sds);
				    dojo.xhrGet({url: "php/2dgel.php", content:{id: cipro_id},handleAs: "json",load: function(data){
						var table = dojo.create("table",{},sds);
						gels.attr('content', table);
						var tr = dojo.create("tr",{},table);
						dojo.forEach(data.items,function(item, idx, arr){
							var popup = new dijit.Dialog({id:"sds"+cipro_id+"_"+item.id+"_"+popupId,
										      title:"2D-PAGE: "+cipro_id,
										      content: '<iframe id="sdsi'+cipro_id+"_"+item.id+"_"+popupId+
										      '" src="2d_page/cgi-bin/2d/2dgel.cgi?id='+item.acc+'&gel='+item.gel+
										      '&popupid='+cipro_id+"_"+item.id+"_"+popupId+
										      '" frameborder="0" height="300" width="300">'+
										//      '" frameborder="0" height="300" width="300", marginheight="0" marginwidth="0">'+
										      '</iframe>'
							    });
							dojo.body().appendChild(popup.domNode);
							popup.startup();
							var td = dojo.create("td",{style:"position: relative;"},tr);
							var div = dojo.create("div",{style:"position: relative;"},td);
							var a = dojo.create("a",{href:"javascript:void(0)",
							onClick:"dijit.byId('sds"+cipro_id+"_"+item.id+"_"+popupId+"').show(); dojo.attr(dojo.byId('sdsi" + cipro_id + "_" + item.id + "_" + popupId + "'), 'src', '2d_page/cgi-bin/2d/2dgel.cgi?id=" + item.acc + "&gel=" + item.gel + "&popupid=" + cipro_id + "_" + item.id + "_" + popupId + "'); return false;"},div);
							var img = dojo.create("img",{src:item.url,style:"border: 1px solid #E3E3E3;"},a);
							var tag = dojo.create("div",{style:"position:absolute; bottom:0px; left:0px; width: 151px; color:#FFF;",
										     innerHTML:item.id,align:"center"},div);
							dojo.style(tag,{background: "#003366",opacity:"0.75"});
						    });
					    }});
				    gels.startup();
				    var expression = dojo.byId("expression"+cipro_id);
				    if(!expression.firstChild){
					var title = dojo.create("div",{style:"width: 97%;background: url(images/header.gif) repeat-x 0px 2px;"+
									 "padding-bottom: 7px;margin-top:7px;"},expression);
					dojo.create("p",{style:"background-color: white;color: #B22929;"+
						    "display: inline;font-size: 1.2em;font-weight: bold;line-height: 1em;"+
						    "margin: 0px;padding: 0px 3px 0px 0px;text-transform: uppercase;",
						    innerHTML:"Expression Profile"},title);
					var div = new dijit.layout.ContentPane().placeAt(expression);					
					div.attr('href',"php/openflashchart1/expressionchart.php?id="+cipro_id+"&width=300&height=300");
				    }
				}else if(i == "expression"){
					var expression = dojo.byId("expression"+cipro_id);
					if(!expression.firstChild){
					var title = dojo.create("div",{style:"width: 100%;background: url(images/header.gif) repeat-x 0px 2px;"+
									 "padding-bottom: 7px;margin-top:7px;"},expression);
					dojo.create("p",{style:"background-color: white;color: #B22929;"+
						    "display: inline;font-size: 1.2em;font-weight: bold;line-height: 1em;"+
						    "margin: 0px;padding: 0px 3px 0px 0px;text-transform: uppercase;",
						    innerHTML:"Expression Profile"},title);
					    var div = new dijit.layout.ContentPane().placeAt(expression);
					    div.attr('href',"php/openflashchart1/expressionchart.php?id="+cipro_id+"&width=300&height=300");
					}
				}else if(i == "modeller"){
				    var modeller = dojo.byId("modeller"+cipro_id);
				    var popup = new dijit.Dialog({id:"jmol"+cipro_id+"_"+popupId, title:"Jmol: "+cipro_id+".pdb",
								  content: '<iframe id="jmoli'+cipro_id+"_"+popupId+'" src="cph.cgi?id='+cipro_id+"_"+popupId+
								  '" frameborder="0" height="300" width="300",marginheight="0" marginwidth="0"></iframe>'
					});
				    dojo.body().appendChild(popup.domNode);
				    popup.startup();
				    var expand = new dijit.Dialog({id:i+'pop'+cipro_id+"_"+popupId, title:i+": "+cipro_id,
								  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+i+'" >'});
				    dojo.body().appendChild(expand.domNode);
				    expand.startup();
				    var div = dojo.create("div",{style:"position: relative;margin-bottom: 7px;"},modeller);
				    var a = dojo.create("a",{href:"javascript:void(0)",
							     onClick:"dijit.byId('"+i+'pop'+cipro_id+"_"+popupId+"').show(); return false;"},div);
				    var img = dojo.create("img",{src:'php/thumbnail.php?id='+cipro_id+'&prog='+i,style:"border: 1px solid #E3E3E3;"},a);
				    var tag = dojo.create("div",{style:"position:absolute; top:0px; left:0px; width: 151px; color:#FFF;",
								 innerHTML:i,align:"center"},div);
				    dojo.style(tag,{background: "#003366",opacity:"0.75"});
				    var jmol = dojo.create("a",{href:"javascript:void(0)",
								onClick:"dijit.byId('jmol"+cipro_id+"_"+popupId+"').show(); return false;",
								innerHTML:'<img src="images/icon/Jmol.png"></img>',
								style:"position:absolute; bottom:5px; left:5px;"},div);
				    dojo.style(jmol,{opacity:"0.75"});
				}else if(i == "blastp"){
				    var blastp = dojo.byId("blastp"+cipro_id);			 
				    var title = dojo.create("div",{style:'background: url(images/header.gif) repeat-x 0px 2px;height: 13px;'+
								   'padding-bottom: 7px;margin-top:7px;'},blastp);
				    var h2 = dojo.create("h2",{},title);
				    var a = dojo.create("a",{href:'q.cgi?t=BLAST&s=nr&id='+cipro_id,target:"_blank"},h2);
				    dojo.create("span",{innerHTML:"BLAST"},a);
				    var div = new dijit.layout.ContentPane().placeAt(blastp);
				    div.attr('href',"php/openflashchart1/blastchart.php?id="+cipro_id+"&width=300&height=200");

				    var ncbi = dojo.create("div", {},'ncbi'+cipro_id);
				    dojo.create("h4", {innerHTML: "BLAST result against NCBI nr database"},ncbi);
				    var ncbi_grid = dojo.create("div", {},ncbi);

				    var url = 'http://www.ncbi.nlm.nih.gov/protein/';
				    var blink = 'http://www.ncbi.nlm.nih.gov/sutils/blink.cgi?pid=';
				    var accFmt = function(data,rowIndex){
					var acc = "<a target='_blank' href='"+url+data+"'>"+data+"</a>";
					if(this.grid.getItem(rowIndex).source == 'Ciona intestinalis'){
					    acc += ' ('+"<a target='_blank' href='"+blink+data+"'>Blink</a>"+') '
					}
					return acc;
				    };

				    var getTest = function(data,rowIndex){
					var item = this.grid.getItem(rowIndex);
					if (item != null) {
					    var  view = item.name;
					    if(item.range != null){
						view += "<br><img src='php/hit.php?range="+item.range+"' height='5' width='101'/><br>";
					    }
					    return view;
					}
				    };
				    
				    var checkboxFmt = function(data,rowIndex){
					var item = this.grid.getItem(rowIndex);
					if (e[item.acc]) {
					    return "<input type='checkbox' name='"+item.type+"' value='"+item.acc+
					    "' class='evidence"+cipro_id.replace(/\./g,"_")+"' checked />";
					}
					else {
					    return "<input type='checkbox' name='"+item.type+"' value='"+item.acc+
					    "' class='evidence"+cipro_id.replace(/\./g,"_")+"' />";
					}
				     }
				    
				    var view0 = {
					noscroll: true,
					cells: [
  				    { name: "Source", field: "source", width: "120px"},
				    { name: " ", formatter: checkboxFmt, width: "20px" },
				    { name: "Description",formatter: getTest, width: "100px" },
				    { name: "Accession", field: "acc", width: "80px", formatter: accFmt },
						]};
				    
				    var view1 = [
						 { name: "Score", field: "score", width:"100px"},						 
						 { name: "E value", field: "evalue", width:"85px"},						 
						 { name: "Identity %", field: "idt", width:"85px"},						 
						 { name: "Coverage %", field: "coverage", width:"85px"}
						 ];
				    var layout = [view0,view1];
				    var jsonStore2 = new dojo.data.ItemFileWriteStore({ url: 'php/ortholog.php?id='+cipro_id });
				    jsonStore2.fetch({query: {name:"*"},
						onComplete: function(items, request){
						if(items.length < 6){
						    grid2.attr('autoHeight',true);
						}else{
						    grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
						}
					    }});
				    var grid2 = new dojox.grid.DataGrid({
					    store: jsonStore2,
					    structure: layout,
					    selectable: true,
					    onStyleRow: onStyleRow,
					    style:  "margin-bottom:7px",
					}, ncbi_grid);
				    dojo.connect(grid2, "onresize", grid2, "resize");
				    dojo.addClass(grid2.domNode, "nihilo");
				    grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
				    grid2.startup();
				    
				    dojo.create('input',{type:"hidden",'class':'blastp_switch',value:true},'blastp'+cipro_id);
				    var toggle = dojo.create('a',{href:"javascript:void(0)",
								  //style:"position: relative;margin-bottom: 7px;",
								  onclick:function(){
						var val = dojo.query('.blastp_switch','blastp'+cipro_id).attr('value');
						if(val == "true"){
						    var store = new dojo.data.ItemFileWriteStore({ url: 'php/ortholog25.php?id='+cipro_id });
						    store.fetch({query: {name:'*'},
								onComplete: function(items, request){
								if(items.length < 6){
								     grid2.attr('autoHeight',true);
								}else{
								    grid2.attr('autoHeight',false);
								    grid2._setStyleAttr({height:'30em',width: '450px','font-family': 'Arial','font-size': '7pt'});
								}
							    }});
						    grid2.setStore(store);
						    dojo.query('.blastp_switch','blastp'+cipro_id).attr('value',false);
						    toggle.innerHTML = "&laquo; BLAST Top hit";
						}else{
						    var store = new dojo.data.ItemFileWriteStore({ url: 'php/ortholog.php?id='+cipro_id });
						    store.fetch({query: {name:'*'},
								onComplete: function(items, request){
								if(items.length < 6){
								    grid2.attr('autoHeight',true);
								}else{
								    grid2.attr('autoHeight',false);
								    grid2._setStyleAttr({height:'30em',width: '450px','font-family': 'Arial','font-size': '7pt'});
								}
							    }});
						    grid2.setStore(store);
						    dojo.query('.blastp_switch','blastp'+cipro_id).attr('value',true);
						    toggle.innerHTML = "BLASTP 25% identity &raquo;";
						}
					    },innerHTML: "BLASTP 25% identity &raquo;"
					},'blastp25'+cipro_id);
				}else if(i == "savignyi") {
				    var savignyi = dojo.create("div", {},'savignyi'+cipro_id);
				    dojo.create("h4", {innerHTML: "Top hit with <i>C. savignyi</i> proteins"}, savignyi);		      
				    var savignyi_grid = dojo.create("div", {},savignyi);
				    
				    var accFmt = function(data,rowIndex){
					if(data.match(/ENSCSAV/)) {
					    return "<a target = '_blank' href='http://www.ensembl.org/Ciona_savignyi/Transcript/ProteinSummary?db=core;t="+data+"'>"+data+"</a>";
					} else {
					    return data;
					}
				    };
			
				    var getTest = function(data,rowIndex){
					var item = this.grid.getItem(rowIndex);
					if (item != null) {
					    var  view = item.desc;
					    if(item.range != null){
						view += "<br><img src='php/hit.php?range="+item.range+"' height='5' width='101'/><br>";
					    }
					    return view;
					}
				    };
			
				    var view0 = {
					noscroll: true,
					cells: [
				    { name: "Source", field: "source", width: "80px" },
				    { name: "Description", formatter: getTest, width: "120px" },
				    { name: "Accession", field: "acc", width: "120px", formatter: accFmt },
						]};
				    var view1 = [
						 { name: "Score", field: "score", width:"100px"},
						 { name: "E value", field: "evalue", width:"85px"},
						 { name: "Identity %", field: "idt", width:"85px"},
						 { name: "Coverage %", field: "coverage", width:"85px"}
						 ];
				    var layout = [view0,view1];
				    
				    var jsonStore2 = new dojo.data.ItemFileWriteStore({ url: 'php/savignyi.php?id='+cipro_id });
				    jsonStore2.fetch({query: {name:"*"},
						onComplete: function(items, request){
						if(items.length < 6){
						    grid2.attr('autoHeight',true);
						}else{
						    grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
						}
					    }});
				    var grid2 = new dojox.grid.DataGrid({
					    store: jsonStore2,
					    structure: layout,
					    selectable: true,
					    onStyleRow: onStyleRow,
					    style:  "margin-bottom:7px"
					}, savignyi_grid);
				    dojo.connect(grid2, "onresize", grid2, "resize");
				    dojo.addClass(grid2.domNode, "nihilo");
				    grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
				    grid2.startup();
				} else if(i == "phylogeny"){
				    var figs = dojo.byId(i+cipro_id);
				    var popup = new dijit.Dialog({id:"tree"+cipro_id+"_"+popupId, title:"Phylogenic tree: "+cipro_id,
								  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+i+'" >'});
				    dojo.body().appendChild(popup.domNode);
				    popup.startup();
				    var expand = new dijit.Dialog({id:i+'pop'+cipro_id+"_"+popupId, title:i+": "+cipro_id,
								  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+i+'" >'});
				    dojo.body().appendChild(expand.domNode);
				    expand.startup();
				    var div = dojo.create("div",{style:"position: relative;margin-bottom: 7px;"}, figs);
				    var a = dojo.create("a",{href:"javascript:void(0)",
							     onClick:"dijit.byId('"+i+'pop'+cipro_id+"_"+popupId+"').show(); return false;"},div);
				    var img = dojo.create("img",{src:'php/thumbnail.php?id='+cipro_id+'&prog='+i,style:"border: 1px solid #E3E3E3;"},a);
				    var tag = dojo.create("div",{style:"position:absolute; top:0px; left:0px; width: 151px; color:#FFF;",
								 innerHTML:i,align:"center"},div);
				    dojo.style(tag,{background: "#003366",opacity:"0.75"});
				    var tree = dojo.create("a",{href:"http://cipro7.ibio.jp/2.5/svgt2.cgi?"+cipro_id,
					      		        target: "_blank",
								innerHTML:'<img src="images/icon/tree.png"></img>',
								style:"position:absolute; bottom:5px; left:5px;"},div);
				    dojo.style(tree, {opacity:"0.75"});
				} else if(i && i != "msms"){
				    var figs = dojo.byId(i+cipro_id);
				    var popup = new dijit.Dialog({id:i+'pop'+cipro_id+"_"+popupId, title:i+": "+cipro_id,
								  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+i+'" >'});
				    dojo.body().appendChild(popup.domNode);
				    popup.startup();
				    var div = dojo.create("div",{style:"position: relative;margin-bottom: 7px;"},figs);
				    var a = dojo.create("a",{href:"javascript:void(0)",
							     onClick:"dijit.byId('"+i+'pop'+cipro_id+"_"+popupId+"').show(); return false;"},div);
				    var img = dojo.create("img",{src:'php/thumbnail.php?id='+cipro_id+'&prog='+i,style:"border: 1px solid #E3E3E3;"},a);
				    var tag = dojo.create("div",{style:"position:absolute; top:0px; left:0px; width: 151px; color:#FFF;",
								 innerHTML:i,align:"center"},div);
				    dojo.style(tag,{background: "#003366",opacity:"0.75"});
				}
			    });
		    }else if(item.type == "faba"){
			if(item.fabaitem.length){
			    var faba = dojo.byId("faba"+cipro_id);
			    var faba_view = new dojox.layout.ScrollPane({orientation:"horizontal",
									 style:"overflow:hidden;width:310px;height:75px;"+
									 " border:1px solid #b7b7b7"}).placeAt(faba);			
			    var table = dojo.create("table",{},faba);
			    faba_view.attr('content', table);
			    var tr = dojo.create("tr",{},table);
			    dojo.forEach(item.fabaitem,function(i, idx, arr){
				    var popup = new dijit.Dialog({id:"faba"+cipro_id+"_"+idx+"_"+popupId,
								  title:"3DPL: "+i.tissue + " (HPF: "+i.hpf+")",
								  content: '<iframe id="fabai'+cipro_id+"_"+idx+"_"+popupId+
								  '" src="'+i.link+
								  '" frameborder="0" height="300" width="800",marginheight="0" marginwidth="0">'+
								  '</iframe>'
					});
				    dojo.body().appendChild(popup.domNode);
				    popup.startup();
				    var td = dojo.create("td",{style:"position: relative;"},tr);
				    var div = dojo.create("div",{id:i.hpf,style:"height:70px;width:120px;background: #000;position: relative;"},td);
				    var a = dojo.create("a",{href:"javascript:void(0)",
							     onClick:"dijit.byId('faba"+cipro_id+"_"+idx+
							     "_"+popupId+"').show(); return false;"},div);
				    var img = dojo.create("img",{src:i.thumbnail},a);
				    var tag = dojo.create("div",{style:"position:absolute; bottom:0px; left:0px; width: 120px; color:#FFF;",
								 innerHTML:i.tissue + " (HPF: "+i.hpf+")",align:"center"},div);
				    dojo.style(tag,{background: "#003366",opacity:"0.75"});
				    var desc = new dijit.Tooltip({connectId: [i.hpf],label: i.locate,position:["before","below"]});
				});
			    faba_view.startup();
			}
		    }else if(item.type == "xseq"){
			var xseq = dojo.byId("xseq"+cipro_id);
			if(!xseq.firstChild){
			    dojo.style(xseq,{"margin-bottom": "7px"});
			    var div = dojo.create("div",{style:"background: url(images/header.gif) repeat-x 0px 2px;padding-bottom: 7px;height: 13px;",
							 innerHTML:""},xseq);
			    dojo.create("p",{style:"color: #B22929;font-size: 1.2em;font-weight: bold;margin: 0px;padding: 0px 0px 0px;",
					innerHTML:'Identical Sequences'},xseq);
			}
			dojo.create("a",{href:"#"+item.cipro,style:"font-family: Arial;font-size: 9pt;",innerHTML:item.cipro},xseq);
			dojo.create("br",{},xseq);
		    }else if(item.type == "xref"){
			var xref = dojo.create("div", {},'xref'+cipro_id);
			dojo.create("h4", {innerHTML: "Cross references"}, xref);		      
			var xref_grid = dojo.create("div", {},xref);

			var xidFmt = function(data,rowIndex){
			    var item = this.grid.getItem(rowIndex);
			    var id = item.xid;
			    var url;
			    if(item.type == "aniseed"){
				var tmp = item.xid+'_';
				id = tmp.replace(/.*_(.*)_/,"$1");
				url = "target='_blank' href='"+'http://aniseed-ibdm.univ-mrs.fr/gene-card.php?clusterid=cluster';
			    }else if(item.type == "jgi1"){
				url = "target='_blank' href='"+'http://genome.jgi-psf.org/cgi-bin/dispGeneModel?db=ciona4&id=';
				id += "";
				id = id.slice(6);
			    }else if(item.type == "ensembl"){
				url = "target='_blank' href='"+'http://www.ensembl.org/Ciona_intestinalis/Transcript/Transcript?db=core;t=';
			    }else if(item.type == "kg"){
				url = '#';
			    }
			    var xid = "<a "+url+id+"'>"+data+"</a>";
			    return xid;
			};
			var getTest = function(data,rowIndex){
			    var item = this.grid.getItem(rowIndex);
			    if (item != null) {
				var view = '';
				if(item.type == "kg"){
				    view = '';
				}else{
				    view = item.name;
				}				
				if(item.range != null){
				    view += "<br><img src='php/model.php?range="+item.range+"&direction="+item.direction+"' height='5' width='111'/><br>";
				}
				return view;
			    }
			};
				    
			var checkboxFmt = function(data,rowIndex){
			    var item = this.grid.getItem(rowIndex);
			    if (e[item.xid]) {
				return "<input type='checkbox' name='"+item.type+"' value='"+item.xid+
				    "' class='evidence"+cipro_id.replace(/\./g,"_")+"' checked />";
			    }else {
				return "<input type='checkbox' name='"+item.type+"' value='"+item.xid+
				"' class='evidence"+cipro_id.replace(/\./g,"_")+"' />";
			    }
			};
			
				    
			var layout = [
                        { name: "Database", field: "db", width: "120px"},
                        { name: " ", formatter: checkboxFmt, width: "20px" },
                        { name: "Name",formatter: getTest, width: "auto" },
			{ name: "ID", field: "xid", width: "auto", formatter: xidFmt },
				      ];
			var jsonStore2 = new dojo.data.ItemFileWriteStore({ url: 'php/xref.php?id='+cipro_id });
			jsonStore2.fetch({query: {name:"*"},
				    onComplete: function(items, request){
				    if(items.length < 6){
					grid2.attr('autoHeight',true);
				    }else{
					grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
				    }
				}});
			var grid2 = new dojox.grid.DataGrid({
				store: jsonStore2,
				structure: layout,
				selectable: true,
				onStyleRow: onStyleRow,
				style:  "margin-bottom:7px",
			    }, xref_grid);
			dojo.connect(grid2, "onresize", grid2, "resize");
			dojo.addClass(grid2.domNode, "nihilo");
			grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
			grid2.startup();
		    }else if(item.type == "interpro"){
			var interpro = dojo.create("div", {},'interpro'+cipro_id);
			dojo.create("h4", {innerHTML: "InterPro result"}, interpro);
			var interpro_grid = dojo.create("div", {},interpro);

			var idFmt = function(rowIndex,item){
			    if (item != null) {
				var url;
				if(item.db == "SMART"){
				    url = 'http://smart.embl-heidelberg.de/smart/do_annotation.pl?BLAST=DUMMY&ACC=';
				}else if(item.db == "PFAM"){
				    url = 'http://pfam.sanger.ac.uk/family?entry=';
				}else if(item.db == "PANTHER"){
				    url = 'http://www.pantherdb.org/panther/family.do?clsAccession=';
				}else if(item.db == "PROFILE"){
				    url = 'http://www.expasy.org/prosite/';
				}else if(item.db == "SUPERFAMILY"){
				    url = 'http://supfam.org/SUPERFAMILY/cgi-bin/scop.cgi?ipid=';
				}else if(item.db == "InterProScan"){
				    url = 'http://www.ebi.ac.uk/interpro/IEntry?ac=';
				}else if(item.db == "GO"){
				    url = 'http://amigo.geneontology.org/cgi-bin/amigo/term-details.cgi?term=';
				}
				if(url){
				    return "<a target='_blank' href='"+url+item.id+"'>"+item.id+"</a>";
				}else{
				    return item.id;
				}
			    }
			};

			var getTest = function(rowIndex, item){
			    if (item != null) {
				var  view = item.name;
				if(item.range != null){
				    view += "<br><img src='php/hit.php?range="+item.range+"' height='5' width='101'/>";
				}
				return view;
			    }
			}
			var checkboxFmt = function(rowIndex,item){
			    if (item != null) {
				if (e[item.id] != null) {
				    return "<input type='checkbox' name='"+
				    item.type+"' value='"+item.id+"' class='evidence"+cipro_id.replace(/\./g,"_")+"' checked />";
				}
				else {
				    return "<input type='checkbox' name='"+
				    item.type+"' value='"+item.id+"' class='evidence"+cipro_id.replace(/\./g,"_")+"' />";
				}
			    }
			};

			var noSort = function(index){
			    return false;
			};

			var layout = [
                                      { name: "Program type", field: "db", width: "120px" },
                                      { name: " ", width: "20px",get:checkboxFmt },
                                      { name: "Description", get: getTest, width: "100px" },
                                      { name: "ID",  width: "80px",get:idFmt },
                                      { name: "Score", field: "score", width: "auto" },
				      ];
						
			var jsonStore2 = new dojo.data.ItemFileWriteStore({ url: 'php/interpro.php?id='+cipro_id });
			jsonStore2.fetch({query: {name:"*"},
				    onComplete: function(items, request){
				    if(items.length < 6){
					grid2.attr('autoHeight',true);
				    }else{
					grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
				    }
				}});
			var treeModel2 = new dijit.tree.ForestStoreModel({
				store: jsonStore2,
				query: { type: 'interpro' },
				rootId: 'interproRoot',
				rootLabel: 'Program type',
				childrenAttrs: ['children']
			    });
			var grid2 = new dojox.grid.TreeGrid({			    
				treeModel: treeModel2,
				structure: layout,
				selectable: true,
				canSort:noSort,
				onStyleRow: onStyleRow,
				style:  "margin-bottom:7px",
				defaultOpen: true
			    }, interpro_grid);
			grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
			dojo.connect(grid2, "onresize", grid2, "resize");
			dojo.addClass(grid2.domNode, "nihilo");
			grid2.startup();
		    }else if(item.type == "mim"){
			var mim = dojo.create("div", {},'mim'+cipro_id);
			dojo.create("h4", {innerHTML: "Human diseases"},mim);
			var mim_grid = dojo.create("div", {},mim);

			var xidFmt = function(data,rowIndex){
			    var url = 'http://www.ncbi.nlm.nih.gov/omim/';
			    return '<a href="'+url+data+'" target="_blank" >'+data+'</a>';
			};
			var getTest = function(data,rowIndex){
			    var item = this.grid.getItem(rowIndex);
			    var view = item.symbols;
			    if (item != null) {
				/*
				if(item.range != null){
				    view += "<br><img src='php/hit.php?range="+item.range+"' height='5' width='101'/><br>";
				}
				*/
				return view;
			    }
			};
				    
			var checkboxFmt = function(data,rowIndex){
			    var item = this.grid.getItem(rowIndex);
			    if (e[item.xid]) {
				return "<input type='checkbox' name='"+item.type+"' value='"+item.xid+
				    "' class='evidence"+cipro_id.replace(/\./g,"_")+"' checked />";
			    }else {
				return "<input type='checkbox' name='"+item.type+"' value='"+item.xid+
				"' class='evidence"+cipro_id.replace(/\./g,"_")+"' />";
			    }
			};
			
				    
			var layout = [
			{ name: "MIM", field: "xid", width: "120px", formatter: xidFmt },
                        { name: " ", formatter: checkboxFmt, width: "20px" },
                        { name: "Symbols",formatter: getTest, width: "100px" },
                        { name: "Disorder", field: "disorder", width: "auto"},
                        { name: "Location", field: "location", width: "auto"},			
			{ name: "E value", field: "evalue", width: "auto"}
				      ];
			var jsonStore2 = new dojo.data.ItemFileWriteStore({ url: 'php/mim.php?id='+cipro_id });
			jsonStore2.fetch({query: {name:"*"},
				    onComplete: function(items, request){
				    if(items.length < 6){
					grid2.attr('autoHeight',true);
				    }else{
					grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
				    }
				}});
			var grid2 = new dojox.grid.DataGrid({
				store: jsonStore2,
				structure: layout,
				selectable: true,
				onStyleRow: onStyleRow,
				style:  "margin-bottom:7px",
			    }, mim_grid);
			dojo.connect(grid2, "onresize", grid2, "resize");
			dojo.addClass(grid2.domNode, "nihilo");
			grid2._setStyleAttr({height:"30em",width: "450px","font-family": "Arial","font-size": "7pt"});
			grid2.startup();
		    }else if(item.type == "hinv"){
			var tr = dojo.create("tr",{},table);
			/*
			var box = new dijit.form.CheckBox({
				name: item.type,
				value: item.xid,
				'class':"evidence"+cipro_id.replace(/\./g,"_"),
				checked: e[item.xid] || false,
				onChange: function(b) {
				    //alert('onChange called with parameter = ' + b + ', and widget value = ' + checkBox.attr('value'));
				}
			    },
			    td1);
			*/
			var td = dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
						   innerHTML:'<b>H-inv autoannotation</b>: '+item.description+', '+ 
						   item.category+', '+item.evidence+', '+item.identity+', '+item.coverage+', '+item.species},tr);
		    }else if(item.type == "literature"){
//			var tr0 = dojo.create("tr",{},table);
//			var td0 = dojo.create("td",{colspan:2,style:"font-family: Arial;font-size: 9pt;",
//						    innerHTML:'<b>Phylogeny</b>: <a href="http://cipro7.ibio.jp/2.5/svgt2.cgi?'+cipro_id+
//						    '" target="_blank">'+cipro_id+'</a>'},tr0);			
			// HGNC
			var tr0 = dojo.create("tr",{},table);
			var td0 = dojo.create("td",{colspan:2,style:"font-family: Arial;font-size: 9pt;",
						    innerHTML:'<a href="http://cipro.ibio.jp/~tendo/annotation/index.php/hgnc/" target="_blank">[ Refer to HGNC dictionary ]</a>'},tr0);			
			// HGNC

			var tr0 = dojo.create("tr",{},table);
			var td0 = dojo.create("td",{colspan:2,style:"font-family: Arial;font-size: 9pt;",
						    innerHTML:'<b>KEGG OC</b>: <a href="http://cipro5.ibio.jp/~apa/oc/oc.cgi?'+cipro_id+
						    '" target="_blank">'+cipro_id+'</a>'},tr0);			
			tr0 = dojo.create("tr",{},table);
			td0 = dojo.create("td",{colspan:2,style:"font-family: Arial;font-size: 9pt;",
						    innerHTML:'<b>Sequence duplicate</b>: <a href="http://cipro5.ibio.jp/~apa/oc/sim.cgi?'+cipro_id+
						    '" target="_blank">'+cipro_id+'</a>'},tr0);
			var th = dojo.create("tr",{},table);
			dojo.style(table,{width:"450px"});
			var td = dojo.create("td",{colspan:2,style:"font-family: Arial;font-size: 9pt;"},th);
			dojo.create("div", { style:"border-bottom-color: #CCC;"+
				    " border-bottom-style: dotted;border-bottom-width: 1px;padding-bottom: 7px;margin-bottom: 7px;"},td);
			var tr1 = dojo.create("tr",{},table);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>PMID</b>: '},tr1);
			var td1 = dojo.create("tr",{},tr1);
			new dijit.form.TextBox({
				name: "literature",
				value: d[item.type] || null,
				'class': "etc"+cipro_id.replace(/\./g,"_"),
				style: "width:150px;"
			    },td1);
			var tr2 = dojo.create("tr",{},table);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>URL</b>: '},tr2);
			var td2 = dojo.create("tr",{},tr2);
			new dijit.form.TextBox({
				name: "url",
				value: d["url"] || null,
				'class': "etc"+cipro_id.replace(/\./g,"_"),
				style: "width:150px;"
			    },td2);
			var tr3 = dojo.create("tr",{},table);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>Acc: </b>'},tr3);
			var td3 = dojo.create("td",{},tr3);
			var text = new dijit.form.TextBox({
				name: "homology",
				value: d["homology"] || null,
				'class': "etc"+cipro_id.replace(/\./g,"_"),
				style: "width:150px;"
			    },td3);       		
		    }else if(item.type == "experimental"){
			var th = dojo.create("tr",{},table);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>Experimental</b>: '},th);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>Theoretical</b>: '},th);		      
			var tr = dojo.create("tr",{},table);
			var td1 = dojo.create("td",{},tr);
			var td2 = dojo.create("td",{},tr);
			var exp = dojo.create("div",{},td1);
			var thr = dojo.create("div",{},td2);			
			var explist = new Array("2D-PAGE","MS/MS","3DPL","EST","Microarray","etc");
			var thrlist = new Array("KEGG OC","Phylogeny","InterProScan","TMHMM","BLASTP","MODELLER","PSIPRED","NetPhos","OMIM","WoLF PSORT","etc");
			for (var i in explist) {
			    var c = dojo.doc.createElement('option');
			    c.innerHTML = explist[i];
			    c.selected = e[explist[i]] || false;
			    exp.appendChild(c);
			}
			for (var i in thrlist) {
			    var c = dojo.doc.createElement('option');
			    c.innerHTML = thrlist[i];
			    c.selected = e[thrlist[i]] || false;
			    thr.appendChild(c);
			}			
			var multiselect = new dijit.form.MultiSelect({
				name: "experimental",
				style:"height:100px; width: 150px; border:5px solid #ededed;margin-right:10px;",
				method:'post',
				multiple:true,
				'class': 'multiexp'+cipro_id.replace(/\./g,"_")
			    },exp);
			var multiselect2 = new dijit.form.MultiSelect({
				name: "theoretical",
				style:"height:100px; width: 150px; border:5px solid #ededed;",
				method:'post',
				multiple:true,
				'class': 'multithr'+cipro_id.replace(/\./g,"_")
			    },thr);
		    }else if(item.type == "noevidence"){
			var tr = dojo.create("tr",{},table);
			var td1 = dojo.create("tr",{},tr);
			var box = new dijit.form.CheckBox({
				name: item.type,
				value: item.type,
				'class':"evidence"+cipro_id.replace(/\./g,"_"),
				checked: e[item.type] || false
			    },td1);
			dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
				    innerHTML:'<b>No evidence</b>'},tr);
		    }else if(item.type == "pubmed"){
			var url = 'http://www.ncbi.nlm.nih.gov/pubmed/'+item.pmid+'?dopt=Abstract';
			var tr = dojo.create("tr",{},table);
			dojo.create("td",{},tr);
			var td = dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
						   innerHTML:'<b>PubMed id</b>'+ ": "+ '<a href="'+url+item.pmid+'" target="_blank">'+
						   item.pmid +'</a>'+ ", "+ item.name.join(", ")+" ("+ item.year+")<br>"+
						   item.title+'<br>'+'<i>'+item.journal+'</i>, '+'<b>'+item.volume+'</b>, '+item.page},tr);
		    }else if(item.type == "antibody"){
			var url = "http://www.scbt.com/display.php?search=";
			var antibody = "";
			if(item.peptide != null || item.recombinant != null){
			    antibody = ', ';
			}
			if(item.peptide != null){
			    var anti = item.peptide.split(", ");
			    var body = new Array();
			    for (var i = 0; i < anti.length; i++) {
				body.push('<a href="'+url+anti[i]+'" target="_blank">'+anti[i]+'</a>');
			    }
			    antibody = antibody + body.join(", ")+ ' for peptide';
			}
			if(item.recombinant != null){
			    var anti = item.recombinant.split(", ");
			    var body = new Array();
			    for (var i = 0; i < anti.length; i++) {
				body.push('<a href="'+url+anti[i]+'" target="_blank">'+anti[i]+'</a>');
			    }
			    antibody = antibody + ', '+ body.join(", ") + ' for recombinant';
			}
			var tr = dojo.create("tr",{},table);
			dojo.create("td",{},tr);
			var td = dojo.create("td",{style:"font-family: Arial;font-size: 9pt;",
						   innerHTML:'<b>Molecular tool: </b>'+'anti-'+item.desc+antibody},tr);
		    } else if(item.type == "msms") {
		        var figs = dojo.byId(item.type+cipro_id);
			var popup = new dijit.Dialog({id:item.type+'pop'+cipro_id+"_"+popupId, title:"Tandem MS: "+cipro_id,
						  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+item.type+'" >'});
			dojo.body().appendChild(popup.domNode);
			popup.startup();
			var expand = new dijit.Dialog({id:'ms_pop'+cipro_id+"_"+popupId, title:item.type+": "+cipro_id,
				  content:'<img src="php/picture.php?id='+cipro_id+'&prog='+item.type+'" >'});
			dojo.body().appendChild(expand.domNode);
			expand.startup();
			var div = dojo.create("div",{style:"position: relative;margin-bottom: 7px;"},figs);
			var a = dojo.create("a",{href:"javascript: void(0)",
			     onClick: "dijit.byId('"+item.type+'pop'+cipro_id+"_"+popupId+"').show(); return false;"}, div);
			var img = dojo.create("img",{src:'php/thumbnail.php?id='+cipro_id+'&prog='+item.type,style:"border: 1px solid #E3E3E3;"},a);
			var tag = dojo.create("div",{style:"position:absolute; top:0px; left:0px; width: 151px; color:#FFF;",
				 innerHTML:"peptide atlas", align:"center"},div);
			dojo.style(tag,{background: "#003366",opacity:"0.75"});
			var msms = dojo.create("a",{href:"http://cipro5.ibio.jp/~apa/aabm/locus.pl?"+item.locus_id,
						target: "_blank",
						innerHTML:'<img src="images/icon/aabm.png"></img>',
						style:"position:absolute; bottom:5px; left:5px;"},div);
		        dojo.style(msms, {opacity:"0.75"});
		    }
		});
	},
	error: function(error) {
	    targetNode.innerHTML = "An unexpected error occurred: " + error;
	}
    }
    var deferred = dojo.xhrGet(xhrArgs);
    popupId++;
}

function getRelated(cipro_id) {
    var targetNode = dojo.byId(cipro_id+"_related");
    var param = {id: cipro_id};
    var xhrArgs = {
	url: "php/getrelated.php",
	content: param,
	handleAs: "json",
	load: function(data) {
	    if(targetNode){
		while (targetNode.firstChild) {
		    targetNode.removeChild(targetNode.firstChild);
		}
	    }
	    if(data.items.length){
		var related = dojo.create("div",{style:"width: 97%;background: url(images/header.gif) repeat-x 0px 2px;padding-bottom: 7px;"},targetNode);
		dojo.create("p",{style:"background-color: white;color: #B22929;display: inline;font-size: 1.2em;font-weight: bold;line-height: 1em;"+
			    "margin: 0px;padding: 0px 3px 0px 0px;text-transform: uppercase;",innerHTML:"Users Who Checked This Protein Also Checked"},related);
		var related_view = new dojox.layout.ScrollPane({orientation:"horizontal",
								style:"overflow:hidden;width:940px;height:180px;"}).placeAt(related);			
		var table = dojo.create("table",{},related);
		related_view.attr('content', table);
		var tr = dojo.create("tr",{},table);
		dojo.forEach(data.items,function(item, idx, arr){
			item.page;
			item.score;
			var td = dojo.create("td",{style:"position: relative;",align:"center"},tr);
			var div = dojo.create("div", {},td);
			var a = dojo.create("a",{href:'#'+item.page},div);
			dojo.create("img",{src:'php/thumbnailpicker.php?id='+item.page},a);
			dojo.create("br",{},div);
			dojo.create("b",{innerHTML:item.page},div);
			dojo.create("br",{},div);
			var rate = dojo.create("div",{},div);
			dojo.xhrGet({url: "php/rate.php",
				    content:{id: item.page},handleAs: "json",load: function(d){
				    var star = new dojox.form.Rating({numStars:"5",value: d.items[0].rating, disabled: "true"},rate);
				}});
		    });
		related_view.startup();
	    }
	},
	error: function(error) {
	    targetNode.innerHTML = "An unexpected error occurred: " + error;
	}
    }
    var deferred = dojo.xhrGet(xhrArgs);
}


function getAnnotName(cipro_id) {
    dojo.xhrGet({url:"php/getcname.php",content:{id:cipro_id,sid:session},handleAs:"json",load:function(data){
		dijit.byId('cname'+cipro_id).attr('value',null);
		dijit.byId('cname'+cipro_id).attr('value',data.items[0].cname);	
	    }});
    dojo.xhrGet({url:"php/getuname.php",content:{sid:session},handleAs:"json",load:function(data){
		dijit.byId('uname'+cipro_id).attr('value',null);
		dijit.byId('uname'+cipro_id).attr('value',data.items[0].uname);
	    }});
    var store = new dojo.data.ItemFileReadStore({url: "php/getcname.php?id="+cipro_id});
    if(dijit.byId('annotname'+cipro_id)){
        dijit.byId('annotname'+cipro_id).attr('store',null);
        dijit.byId('annotname'+cipro_id).attr('store',store);
    }
    dojo.xhrGet({url:"php/getcname.php",content:{id:cipro_id},handleAs:"json",load:function(data){
		dijit.byId('annotname'+cipro_id).attr('value',null);
		dijit.byId('annotname'+cipro_id).attr('value',data.items[0].cname);
	    }});
}

function getHistory(cipro_id) {
    var targetNode = dojo.byId(cipro_id+"_history");
    var param = {sid: session};
    var xhrArgs = {
	url: "php/gethistory.php",
	content: param,
	handleAs: "json",
	load: function(data) {
	    if(targetNode){
		while (targetNode.firstChild) {
		    targetNode.removeChild(targetNode.firstChild);
		}
	    }
	    if(data.items.length){
		var history = dojo.create("div",{style:"width: 97%;background: url(images/header.gif) repeat-x 0px 2px;padding-bottom: 7px;"},targetNode);
		dojo.create("p",{style:"background-color: white;color: #B22929;display: inline;font-size: 1.2em;font-weight: bold;line-height: 1em;"+
			    "margin: 0px;padding: 0px 3px 0px 0px;text-transform: uppercase;",innerHTML:"Your Recent History "},history);
		var history_view = new dojox.layout.ScrollPane({orientation:"horizontal",
								style:"overflow:hidden;width:900;height:180px;"}).placeAt(history);			
		var table = dojo.create("table",{},history);
		history_view.attr('content', table);
		var tr = dojo.create("tr",{},table);
		dojo.forEach(data.items[0].pages,function(item, idx, arr){
			var td = dojo.create("td",{style:"position: relative;",align:"center"},tr);
			var div = dojo.create("div", {},td);
			var a = dojo.create("a",{href:'#'+item},div);
			dojo.create("img",{src:'php/thumbnailpicker.php?id='+item},a);
			dojo.create("br",{},div);
			dojo.create("b",{innerHTML:item},div);
			dojo.create("br",{},div);
			var rate = dojo.create("div",{},div);
			dojo.xhrGet({url: "php/rate.php",
				    content:{id: item},handleAs: "json",load: function(d){
				    var star = new dojox.form.Rating({numStars:"5",value: d.items[0].rating, disabled: "true"},rate);
				}});
		    });
		history_view.startup();
	    }
	},
	error: function(error) {
	    targetNode.innerHTML = "An unexpected error occurred: " + error;
	}
    }
    var deferred = dojo.xhrGet(xhrArgs);
}


function getComment(cipro_id) {
    var targetNode = dojo.byId(cipro_id+"_comment");
    var param = {id: cipro_id, sid: session};
    var xhrArgs = {
	url: "php/getcomment.php",
	content: param,
	handleAs: "json",
	load: function(data) {
	    if(targetNode){
		while (targetNode.firstChild) {
		    targetNode.removeChild(targetNode.firstChild);
		}
	    }
	    if(data.items.length){
		var div = dojo.create("div",{style:"width: 97%;background: url(images/header.gif) repeat-x 0px 2px;padding-bottom: 7px;"},targetNode);
		dojo.create("p",{style:"background-color: white;color: #B22929;display: inline;font-size: 1.2em;font-weight: bold;line-height: 1em;"+
			    "margin: 0px;padding: 0px 3px 0px 0px;text-transform: uppercase;",innerHTML:"User Reviews"},div);
	    }
	    dojo.forEach(data.items,function(item, idx, arr){
		    var table = dojo.create("table",{style:"width: 97%;"},targetNode);
		    var tr = dojo.create("tr",{},table);
		    var td = dojo.create("td",{},tr);
		    var header = dojo.create("div", { style:"border-bottom-color: #CCC;"+
						   " border-bottom-style: dotted;border-bottom-width: 1px;padding-bottom: 7px;margin-bottom: 7px;"},td);
		    var rate = new dojox.form.Rating({numStars:"5",value: item.rating, disabled: "true",style:"padding-bottom: 7px;"}).placeAt(header);
		    var title = 'No Title';
		    var name = 'Unknown';
		    if(item.title != null){
			title = item.title;
		    }
		    if(item.name != null){
			name = item.name;
		    }
		    dojo.create("span",{innerHTML:' <b>'+ title +'</b>, '+item.date+', by '+ name},header);
		    rate.startup();
		    var div = dojo.create("div", { style:"border-bottom-color: #CCC;"+
						   " border-bottom-style: dotted;border-bottom-width: 1px;padding-bottom: 7px;margin-bottom: 7px;"},td);
		    div.innerHTML = item.content;
		    td.appendChild(div);
		    var tr2 = dojo.create("tr",{},table);
		    var td2 = dojo.create("td",{},tr2);
		    if(item.sid == session){
			var edit = dojo.create("a",{href:"javascript:void(0)",
						    onClick:'var newTab = new Comment({id: "new"+paneId  }).container;'+
						    'var editor = dijit.byId("new"+paneId+"_content");'+
						    'var subject = dijit.byId("new"+paneId+"_subject");'+
						    'var to = dojo.query("#"+"new"+paneId+"_to");'+
						    'var title = dijit.byId("new"+paneId+"_title");'+
						    'var name = dijit.byId("new"+paneId+"_name");'+
						    "dojo.xhrGet({url: 'php/editcomment.php',content:{id: '"+cipro_id+"', sid: session},"+
						    " handleAs: 'json',load: function(data) {editor.onLoadDeferred.addCallback("+
						    "function(){"+
						    "subject.attr('value','"+cipro_id+"');"+
						    "title.attr('value',data.items[0].title);"+
						    "to.attr('value',data.items[0].rating);"+
						    "name.attr('value',data.items[0].name);"+
						    "editor.attr('value', data.items[0].content);})}});"+
						    'dojo.mixin(newTab,{title: "New Comment #" + paneId++,closable: true});'+
						    ' var maindiv = dijit.byId("maindiv");maindiv.addChild(newTab);maindiv.selectChild(newTab);return false;',
						    style:"border-right-width: 1px;border-right-style: solid;"+
						    "border-right-color: #E0E0E0;margin-right: 10px;padding-right: 10px;"},td2);
			dojo.create("img",{src:"images/icon/comment_edit.png",style:"vertical-align:middle;"},edit);
			dojo.create("span",{innerHTML:"Edit"},edit);
			var del = dojo.create("a",{href:"javascript:void(0)",
						   onClick:'dojo.xhrGet({url:"php/deletecomment.php",'+
						   'content:{id: "'+cipro_id+'", sid: session}});'+
						   'dojo.hash("HOME");dojo.hash("'+cipro_id+'");',
						   style:"border-right-width: 1px;border-right-style: solid;"+
						   "border-right-color: #E0E0E0;margin-right: 10px;padding-right: 10px;"},td2);
			dojo.create("img",{src:"images/icon/comment_delete.png",style:"vertical-align:middle;"},del);
			dojo.create("span",{innerHTML:"Delete"},del);
		    }
		    var recommend = dojo.create("span",{innerHTML:"Helpful or Unhelpful:&nbsp;",
						     style:"margin-right: 2px;padding-right: 10px;"},td2);
		    var up = dojo.create("a",{href:"javascript:void(0)",
					      onClick:'dojo.xhrGet({url:"php/up.php",'+
					      'content:{id: "'+cipro_id+'", sid: session, cid:"'+item.id+'"}});'},recommend);
		    dojo.create("img",{src:"images/icon/up.png",style:"vertical-align:middle;"},up);
		    dojo.create("font",{innerHTML:'&nbsp;'+item.up+'&nbsp;',color:"green"}, recommend);
		    var down = dojo.create("a",{href:"javascript:void(0)",
						onClick:'dojo.xhrGet({url:"php/down.php",'+
						'content:{id: "'+cipro_id+'", sid: session, cid:"'+item.id+'"}});'},recommend);
		    dojo.create("img",{src:"images/icon/down.png",style:"vertical-align:middle;"},down);
		    dojo.create("font",{innerHTML:'&nbsp;'+item.down+'&nbsp;',color:"red"}, recommend);
		    dojo.create("br",{},targetNode);
		    dojo.create("br",{},targetNode);
		});
	},
	error: function(error) {
	    targetNode.innerHTML = "An unexpected error occurred: " + error;
	}
    }
    var deferred = dojo.xhrGet(xhrArgs);
}

function getEvidence(cipro_id){
    var uncheck = dojo.query('input', 'description'+cipro_id);
    for(var i = 0;i < uncheck.length;i++){
	uncheck[i].checked = false;
    }
    dojo.xhrGet({url:"php/getcevidence.php",content:{id:cipro_id,sid:session},handleAs:"json",load:function(data){
		dojo.forEach(data.items,function(eitem, eidx, earr){
			var check = dojo.query('input[value~="'+eitem.id+'"]', 'description'+cipro_id);
			for(var i = 0;i < check.length;i++){
			    if(check[i].name == eitem.type){
				check[i].checked = true;
			    }
			}
		    });
	    }});    
}

function sendComment(id){
    var cipro_id = dijit.byId(id+"_subject").getValue(false);
    var title = dijit.byId(id+"_title").getValue(false);
    var rating = dojo.query("#"+id+"_to").attr('value');
    var name = dijit.byId(id+"_name").getValue(false);
    var comment = dijit.byId(id+"_content").getValue(false);
    var param = {id: cipro_id, comment: comment, sid: session, rating: rating, title:title, name:name};
    var xhrArgs = {
	url: "php/comment.php",
	content: param
    }
    var deferred = dojo.xhrPost(xhrArgs);
}

function sendHistory(){
    dojo.xhrPost({
	url: "php/history.php",
	content: {history: pages.join(","), sid: session}
    });
}

function sendAnnotName(id){
    var cname = dijit.byId("cname"+id).attr('value');
    var uname = dijit.byId("uname"+id).attr('value');
    var evidence = new Array();
    var obj = new Object();
    var types = dojo.query('input:checked', 'description'+id).attr('value');
    var names = dojo.query('input:checked', 'description'+id).attr('name');
    for(var i = 0;i < types.length;i++){
	var type = new Object;
	type["type"] = names[i];
	type["id"] = types[i];
	evidence.push(type);
    }
    var etypes = dojo.query(".etc"+id.replace(/\./g,"_")).attr('value');
    var enames = dojo.query(".etc"+id.replace(/\./g,"_")).attr('name');
    for(var i = 0;i < etypes.length;i++){
	var type = new Object;
	if(etypes[i]){
	    type["type"] = enames[i];
	    type["id"] = etypes[i];
	    evidence.push(type);
	}
    }

    var mname = dojo.query(".multiexp"+id.replace(/\./g,"_")).attr('name');
    var mtypes = dojo.query(".multiexp"+id.replace(/\./g,"_")+" :checked").attr('value');
    for(var i = 0;i < mtypes.length;i++){
        var type = new Object;
        type["type"] = mname;
        type["id"] = mtypes[i];
        evidence.push(type);
    }
    var mname = dojo.query(".multithr"+id.replace(/\./g,"_")).attr('name');
    var mtypes = dojo.query(".multithr"+id.replace(/\./g,"_")+" :checked").attr('value');
    for(var i = 0;i < mtypes.length;i++){
        var type = new Object;
        type["type"] = mname;
        type["id"] = mtypes[i];
        evidence.push(type);
    }

    obj["items"] = evidence;
    var deferred = dojo.xhrPost({url: "php/cname.php",content: {id:id, cname:cname,
		    uname:uname, sid: session,
		    evidence: dojo.toJson(obj)}});
    deferred.addCallback(function() {
	    getAnnotName(id);
    });
    //alert(dojo.toJson(obj));
}

function deleteAnnotName(id){
    var deferred = dojo.xhrGet({url:"php/deletecname.php",content:{id: id, sid: session}});
    deferred.addCallback(function() {
	    getAnnotName(id);
    });
    var checkbox = dojo.query('input:checked', 'description'+id);
    for(var i = 0;i < checkbox.length;i++){
	checkbox[i].checked = false;
    }
}

function changeResultGrid(csv){
    //var keyword = document.getElementById('fulltextsearchtext').value;
    var keyword = dojo.query('#fulltextsearchtext').attr('value');
    var annotuname = document.getElementById('annotuname').value;
    var annotf = dojo.number.parse(document.getElementById('annotf').value);
    var annott = dojo.number.parse(document.getElementById('annott').value);
    var order = dojo.query('#order').attr('checked');
    var hinvd = document.getElementById('hinvdesc').value;
    var hinvc = dojo.number.parse(document.getElementById('hinvcategory').value);
    var lf = dojo.number.parse(document.getElementById('lf').value);
    var lt = dojo.number.parse(document.getElementById('lt').value);
    var mwf = dojo.number.parse(document.getElementById('mwf').value);
    var mwt = dojo.number.parse(document.getElementById('mwt').value);
    var pif = document.getElementById('pif').value;
    var pit = document.getElementById('pit').value;
    var est = dijit.byId('est').attr('value');
    var content = dijit.byId('content').attr('value');
    var homolog = dojo.query('.homolog > input[type=radio]:checked').attr('value');
    var homologid = document.getElementById('homologid').value;
    var evalue = document.getElementById('homologevalue').value;

    var seq = document.getElementById('blastseq').value;
    var prog = dojo.query('.blastprog > input[type=radio]:checked').attr('value');
    var filter = dojo.query('.blastfilter > input[type=radio]:checked').attr('value');
    var matrix = document.getElementById('blastmatrix').value;

    var pattern = document.getElementById('grep').value;
    var peptidemass = dijit.byId('pmf').attr('value').replace(/\s+/g, ",");
    var accuracy = dijit.byId('accuracy').attr('value');
    var ptm = dijit.byId('ptm').attr('value');
    var sh = dojo.query('.sh > input[type=radio]:checked').attr('value');
    var contami = dijit.byId('contami').attr('value');
    var enzyme = dojo.query('.enzyme > input[type=radio]:checked').attr('value');

    var searchvalue = new Array();
    if(keyword){
	searchvalue.push("keyword=" + keyword);
    }
    if(annotuname){
	searchvalue.push("annotuname=" + annotuname);
    }
    if(isFinite(annotf) && isFinite(annott)){
	searchvalue.push("annotf=" + annotf + "&annott=" + annott);
    }
    if(hinvd){
	searchvalue.push("hinvdesc=" + hinvd);
    }
    if(isFinite(hinvc)){
	searchvalue.push("hinvcategory=" + hinvc);
    }
    if(order == "true"){
	searchvalue.push("random=1");
    }
    if(est.length){
	searchvalue.push("est=" + est.join(","));
    }
    if(content.length){
	searchvalue.push("content=" + content.join(","));
    }
    if(isFinite(lf) && isFinite(lt)){
	searchvalue.push("lf=" + lf + "&lt=" + lt);
    }
    if(mwf && mwt){
	searchvalue.push("mwf=" + mwf + "&mwt=" + mwt);
    }
    if(pif && pit){
	searchvalue.push("pif=" + pif + "&pit=" + pit);
    }
    if(homolog && homologid && evalue){
	searchvalue.push(homolog + "=" + homologid + "&evalue=" + evalue);
    }
    if(seq){
	searchvalue.push("seq=" + seq + "&prog=" + prog + "&filter=" + filter + "&matrix=" + matrix);
    }
    if(pattern){
	searchvalue.push("grep=" + pattern);
    }
    if(peptidemass){   
	searchvalue.push("pmf=" + peptidemass + "&accuracy="+accuracy);
	if(ptm.length){
	    searchvalue.push("ptm="+ptm.join(","));
	}
	if(sh != "None"){
	    searchvalue.push("sh="+sh);
	}
	if(contami){
	    searchvalue.push("contami="+contami);
	}
	if(enzyme != "None"){
	    searchvalue.push("enzyme="+enzyme);
	}
    }

    if(csv){
	location.href='php/csvresult.php?'+encodeURI(searchvalue.join("&"));
    }else{
	var newStore = new dojo.data.ItemFileReadStore({ url: "./php/searchresult.php?" + encodeURI(searchvalue.join("&")) });
	newStore.fetch({query: {ID:"*"},
		    onComplete: function(items, request){
		    dijit.byId("searchtab").attr('title','SEARCH '+items.length+' results')
			}});
	var grid = dijit.byId("grid");
	grid.setStore(newStore);
	if(seq && peptidemass){
	    grid.setStructure(blastpmfStructure);
	}else if(seq){
	    grid.setStructure(blastStructure);
	}else if(peptidemass){
	    grid.setStructure(pmfStructure);
	}else{
	    grid.setStructure(resultStructure);
	}
    }
}

function updateHash() {
    var ciproId = window.location.hash.substring(1);
    if(ciproId.match(/KH|CIPRO|JGI|ci|PROCITS|ENSCINT|HOME|SEARCH|Overview|Help\|FAQ|Member|2D PAGE|FABA|SiteMap|Annotation_Jumboree/)){
	if(ciproId.match(/KH/)){
	    var id = ciproId.split('.');
	    if(id.length == 3){
		dojo.hash("SEARCH");
		var newStore = new dojo.data.ItemFileReadStore({ url: "./php/searchresult.php?" + encodeURI("keyword="+ciproId+".v") });
		newStore.fetch({query: {ID:"*"},
			    onComplete: function(items, request){
			    dijit.byId("searchtab").attr('title','SEARCH '+items.length+' results');
			}});
		var grid = dijit.byId("grid");
		grid.setStore(newStore);
		grid.setStructure(resultStructure);
		return;
	    }
	}
	if(ciproId.match(/results|Comment/)){
	    return;
	}
	if(ciproId.match(/KH|CIPRO|JGI|ci|PROCITS|ENSCINT/)){
	    pages.push(ciproId);
	}
	var tabTitle = ciproId;
	if (ciproId.search(/KH/i) != -1) {
	    tabTitle = ciproId;
	}
	var tabContainer = dijit.byId('maindiv');
	var tabChildren = tabContainer.getChildren();
	for( i = 0 ; i < tabChildren.length ; i++ ){
	    if(tabChildren[i].controlButton.containerNode.innerHTML.match(tabTitle)){
		tabContainer.selectChild(tabChildren[i]);
		return;
	    }
	}
	if(ciproId == "2D PAGE") {
	    addNewTabOuterPage('2d_page/cgi-bin/2d/2d.cgi', ciproId);
	    return;
	}
	var pageUrl;
	if(ciproId.match(/KH|CIPRO|JGI|ci|PROCITS|ENSCINT/)){
	    pageUrl = "viewdata.cgi?id=" + ciproId;
	}
	if(ciproId == 'Overview'){
	    pageUrl = "html/overview.html";
	}else if(ciproId == 'HOME'){
	    pageUrl = "html/home.html";
	}else if(ciproId == 'Help|FAQ'){
	    pageUrl = "html/helpfaq.html";
	}else if(ciproId == 'Member'){
	    pageUrl = "html/member.html";
	}else if(ciproId == 'FABA'){
	    pageUrl = "cgi/faba.cgi";
	}else if(ciproId == 'SiteMap'){
	    pageUrl = "html/sitemap.html";
	}else if(ciproId == 'Annotation_Jumboree'){
	    pageUrl = "html/annotation.html";
	}
	var contentPane = new dijit.layout.ContentPane({
		href:pageUrl,
		closable: true,
		onClose: function(){
		    //this.attr('href',null);
		    this.attr('href','#HOME');
		    tabContainer.removeChild(this);
		},
		title: tabTitle
	    });
	//contentPane.onLoad = function(){getMaintext(ciproId);getAnnotName(ciproId);getComment(ciproId);getRelated(ciproId);getHistory(ciproId);};
	contentPane.onLoad = function(){
		getMaintext(ciproId);
		getAnnotName(ciproId);
		getComment(ciproId);
		getHistory(ciproId);};
	tabContainer.addChild(contentPane);
	tabContainer.selectChild(contentPane);
	tabContainer.layout();
    }
}

function searchPerms()
{
    var modElement      = document.getElementById('permsmod');
    var cmodElement     = document.getElementById('permscmod');
    var contamElement   = document.getElementById('permscontam');
    var trypsinElement  = document.getElementById('permstrypsin');
}

function showPermsDetail(idx)
{
    var formId = 'permsdetailform' + idx;
    var formElement = document.getElementById(formId);
    formElement.target = "_blank";
    formElement.action = "permsdetail.cgi";
    formElement.submit();
}

function addNewTab(pageUrl,tabTitle)
{
    var tabContainer = dijit.byId('maindiv');
    var tabChildren = tabContainer.getChildren();
    for( i = 0 ; i < tabChildren.length ; i++ )
    {
        if(tabChildren[i].controlButton.containerNode.innerHTML == tabTitle)
        {
            tabContainer.selectChild(tabChildren[i]);
            return;
        }
    }

    var contentPane = new dijit.layout.ContentPane({
	    href:pageUrl,
	    closable: true,
	    onClose: function(){
		//this.attr('href',null);
		this.attr('href','#HOME');
		tabContainer.removeChild(this);
	    },
	    title: tabTitle
	});
    tabContainer.addChild(contentPane);
    tabContainer.selectChild(contentPane);
    tabContainer.layout();
}

function addNewTabOuterPage(pageUrl,tabTitle)
{
    var tabContainer = dijit.byId('maindiv');
    var tabChildren = tabContainer.getChildren();
    for( i = 0 ; i < tabChildren.length ; i++ )
    {
        if(tabChildren[i].controlButton.containerNode.innerHTML == tabTitle)
        {
            tabContainer.selectChild(tabChildren[i]);
            return;
        }
    }

    var contentPane = new dijit.layout.ContentPane({ 
                                 closable: true,
                                 title: tabTitle
                      });
    var contents = '<iframe src="'+pageUrl+'" frameborder="0" style="width:100%; height:100%;"/>';
    contentPane.setContent(contents);
    tabContainer.addChild(contentPane);
    tabContainer.selectChild(contentPane);
    tabContainer.layout();
}