// JavaScript Document

var sec="";
function goSection(str)
{
	sec=str;
	var btnDiv="";
	btnDiv=btnDiv+"<div style='position:absolute; top:0px; left:0px; width:80px; height:40px; cursor:pointer;' onclick='goHome()'></div>";
	btnDiv=btnDiv+"<div style='position:absolute; top:0px; left:80px; width:80px; height:40px; cursor:pointer;' onclick='showVideo()'></div>";
	btnDiv=btnDiv+"<div style='position:absolute; top:0px; left:160px; width:80px; height:40px; cursor:pointer;' onclick='showTxt()'></div>";
	btnDiv=btnDiv+"<div style='position:absolute; top:0px; left:240px; width:80px; height:40px; cursor:pointer;' onclick='showImg()'></div>";
	document.getElementById('status').innerHTML=btnDiv;
	showImg();
}

function goHome()
{
	sec="";
	var cellimg="";
	cellimg=cellimg+"<img src='img/yeast_cell.jpg' width='300' height='279' border='0' usemap='#Map' />";
	cellimg=cellimg+"<map name='Map' id='Map'>";
	cellimg=cellimg+"<area shape='rect' coords='177,2,255,16' href='javascript:goSection(\"mb\")' />";
	cellimg=cellimg+"<area shape='rect' coords='252,179,300,197' href='javascript:goSection(\"n\")' />";
	cellimg=cellimg+"<area shape='rect' coords='247,221,299,236' href='javascript:goSection(\"cw\")' />";
	cellimg=cellimg+"<area shape='rect' coords='170,260,300,277' href='javascript:goSection(\"er\")' />";
	cellimg=cellimg+"<area shape='rect' coords='12,261,76,281' href='javascript:goSection(\"c\")' />";
	cellimg=cellimg+"<area shape='rect' coords='1,107,49,128' href='javascript:goSection(\"v\")' />";
	cellimg=cellimg+"<area shape='rect' coords='7,65,95,82' href='javascript:goSection(\"g\")' />";
	cellimg=cellimg+"<area shape='rect' coords='37,25,124,45' href='javascript:goSection(\"mt\")' />";
	cellimg=cellimg+"<area shape='rect' coords='95,2,159,17' href='javascript:goSection(\"rib\")' />";
	cellimg=cellimg+"</map>";
	document.getElementById('image').innerHTML=cellimg;
	document.getElementById('status').style.backgroundPosition="0px 0px";
	document.getElementById('status').innerHTML="Tap the label to view the details.";
	document.getElementById('status').style.top="310px";
	document.getElementById('footage').style.top="395px";
}

function showVideo()
{
	switch (sec)
	{
		case 'mt':
			var emb='<embed src="img/src/video/mt/mt-iPhone.m4v" type="video/x-m4v" target="myself" scale="0.6" width="300" height="279" autoplay="true"  bgcolor="#333333" />';
			document.getElementById('image').innerHTML=emb;
			break;
		case 'rib':
			var emb='<embed src="img/src/video/rib/rib-iPhone.m4v" type="video/x-m4v" target="myself" scale="0.6" width="300" height="279" autoplay="true" bgcolor="#333333"  />';
			document.getElementById('image').innerHTML=emb;
			break;
		case 'n':
			var emb='<embed src="img/src/video/n/n-iPhone.m4v" type="video/x-m4v" target="myself" scale="0.6" width="300" height="279" autoplay="true" bgcolor="#333333"  />';
			document.getElementById('image').innerHTML=emb;
			break;
		default:
			break;
	}
	document.getElementById('image').style.height="279px";
	document.getElementById('status').style.top="310px";
	document.getElementById('footage').style.top="395px";
}

function showTxt()
{
	//ads links
	var strtmp="<br /><div class='ads'>See also:&nbsp;&nbsp;&nbsp;&nbsp;"
	strtmp=strtmp+"<a href='http://www.google.com/cse?cx=partner-pub-5042102399833742%3Af5dcn3-8x3c&ie=ISO-8859-1&q=cell+structure&sa=Search' target='_blank' class='ads-link'>Cell structure</a>&nbsp;&nbsp;&nbsp;&nbsp;"
	strtmp=strtmp+"<a href='http://www.google.com/cse?cx=partner-pub-5042102399833742%3Af5dcn3-8x3c&ie=ISO-8859-1&q=eukaryote&sa=Search' target='_blank' class='ads-link'>Eukaryote</a>&nbsp;&nbsp;&nbsp;&nbsp;"			
	strtmp=strtmp+"</div>"

	switch (sec)
	{
		case 'er':
			document.getElementById('image').innerHTML="<div><b>ENDOPLASMIC RETICULUM</b></div><br /><div>The endoplasmic reticulum is an essential organelle for the synthesis of protein. Two forms occur known as rough endoplasmic reticulum (RER) and smooth endosplasmic reticulum (SER). The endoplasmic reticulum originates from the nuclear membrane, protein is translocated to the ER where it is processed for transport. Proteins synthesised by ER-bound polysomes are \"translocated\" into the ER cytoplasm (lumen) and proteolytic cleavage of a signal peptide occurs. The protein is then folded with the assistance of stress proteins called chaparones. Finally the protein is glycosylated. The ER then resembles a packaging line in which the protein is \"processed\" for transport. The protein is then transported via vesicles to the golgi complex.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+65+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+75+"px";
			break;
		case 'c':
			document.getElementById('image').innerHTML="<div><b>CYTOPLASM</b></div><br /><div>The yeast cytoplasm is an aqueous acidic colloidal fluid containing low and intermediate weight compounds, dissolved proteins, glycogen and other soluble macromolecules. Also suspended in the cytosol are:</div><br /><div>- membrane bound organelles such as the mitochondria, vacuoles, golgi endoplasmic reticulum;</div><div>- macromolecular aggregations such as ribosomes;</div><div>- and microbodies involved in transport and storage of cellular macromolecules</div><br /><div>A cytoskeletal network provides structural organisation to the cytoplasm and comprises microtubules and microfilaments mostly composed of actin. The cytoskeleton is also involved in the movement (trafficking) of organelles around the cell including during cellular division.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+130+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+140+"px";
			break;
		case 'cw':
			document.getElementById('image').innerHTML="<div><b>CELL WALL</b></div><br /><div>The yeast outer envelope comprises the yeast cell wall, periplasmic space and the plasma membrane.  Its function is to surround and protect the cytoplasm and internal organelles.  It does so by acting as a rigid barrier protecting the cell from physical stresses including the mechanical stresses incurred during yeast handling during agitation of storage tanks and transportation through pumps and pipes.  Furthermore the plasma membrane and cell wall act together to regulate cell volume and therefore size when appropriate.  As a consequence this set of organelles is critical for survival in changing osmotic environments, such as pitching into fresh wort, dilution of yeast slurries during storage and acid washing.  The outer cell envelope occupies around 15-20% of the total cell volume.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+80+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+90+"px";
			break;
		case 'mt':
			document.getElementById('image').innerHTML="<div><b>MITOCHONDRION</b></div><br /><div>The mitochondria are dynamic organelles whose size, shape and number change according to the physiological state of the cell.</div><br /><div>Mitochondria comprises</div><br /><div>- an outer membrane which contains enzymes associated with lipid metabolism;</div><div>- a mitochondrial \"cytoplasm\" which is called the inner matrix and contains enzymes involved in fatty acid oxidation, the citric acid cycle, protein synthetic machinery and mitochondrial DNA;</div><div>- an inner membrane containing cytochromes of the respiratory chain, NADH, succinate dehydrogenase and H<sup>+</sup> ATPases.</div><br /><div>Mitochondria play a central role in the generation of energy during aerobic respiration.  In the brewing context the role of mitochondrial is hotly debated.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+115+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+125+"px";
			break;
		case 'g':
			document.getElementById('image').innerHTML="<div><b>GOLGI COMPLEX</b></div><br /><div>The golgi complex consists of a series of stacked membranes and vesicles. Its structure is fluid and dynamic making it difficult to visualise even with high powered microscopes. The organelle is part of the yeast secretory pathway and its been suggested that the Golgi complex is a \"sorting centre\" for separation of extracellular secretory proteins from those destined for the vacuole. In the golgi modification of carbohydrate side chains occurs. The golgi is crucial to the synthesis of cell wall mannoproteins but modifies those proteins destined for the periplasmic and wall particularly.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			break;
		case 'rib':
			document.getElementById('image').innerHTML="<div><b>RIBOSOME</b></div><br /><div>The ribosome is an organelle that participates in protein synthesis. It is composed of a complex mixture of RNA and proteins which are arranged in an orderly array to produce a biologically active organelle. Ribosomes exhibit a wide range of functionality depending on their configuration. They can be freely suspended, exist a polysomes in which ribosomes aggregate together or attach to another organelle such as endoplasmic reticulum or mitochondria. Indeed proteins destined for secretion are synthesised on endoplasmic reticulum bound polysomes.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			break;
		case 'v':
			document.getElementById('image').innerHTML="<div><b>VACUOLE</b></div><br /><div>The vacuole is a key organelles that exist as individual large compartments or fragmented \"provacuoles\".  They are bounded by a single membrane called a tonoplast and the enclosed \"cytoplasm\" is call the lumen. Vacuoles house enzymes and have been assigned various roles in storage, cellular waste management and intracellular protein trafficking.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			break;
		case 'mb':
			document.getElementById('image').innerHTML="<div><b>MICRO BODIES</b></div><br /><div>Micro bodies are single membrane bound organelles that have characteristic features including: the presence of catalase (antioxidant enzyme) and their osmotic sensitivity. Their occurrence and frequency depends on growth conditions. They include: Peroxisomes and glyoxysomes.</div><br /><div>Peroxisomes</div><br /><div>- Contain catalase, oxidases and are involved in the oxidative utilisation of specific carbon sources.</div><div>- Under the regulation of the PEX genes.</div><br /><div>Glyoxysomes</div><br /><div>- Contain catalase and enzymes associated with the glyoxylate cycle and amine metabolism.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+95+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+105+"px";
			break;
		case 'n':
			document.getElementById('image').innerHTML="<div><b>NUCLEUS</b></div><br /><div>The nucleus is a round-lobate organelle of around 1.5µm in diameter.  It tends to be located centrally within the cell.  The nucleus has a double outer membrane, to separate it from the cell’s cytoplasm.  The nuclear membrane has pores (50-100nm in diameter) which differ in number and size depending on the physiological state of the cell.  The nucleus “cytoplasm” is called the nucleosome and this is where most of the cell’s DNA is housed. The DNA in the nucleus is packaged into chromosomes.  There are 16 different types of brewing yeast chromosomes. A brewing yeast strain will have a least one copy of each chromosome but normally several copies of each are present.</div>";
			document.getElementById('image').innerHTML=document.getElementById('image').innerHTML+strtmp;
			document.getElementById('status').style.top=document.getElementById('image').offsetHeight+50+"px";
			document.getElementById('footage').style.top=document.getElementById('content').offsetHeight+60+"px";
			break;
		default:
			break;
	}
}

function showImg()
{
	switch (sec)
	{
		case 'er':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/er.jpg' width='300' height='279' />";
			break;
		case 'c':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/c.jpg' width='300' height='279' />";
			break;
		case 'cw':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/cw.jpg' width='300' height='279' />";
			break;
		case 'mt':
			document.getElementById('status').style.backgroundPosition="0px -40px";
			document.getElementById('image').innerHTML="<img src='img/src/mt.jpg' width='300' height='279' />";
			break;
		case 'g':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/g.jpg' width='300' height='279' />";
			break;
		case 'rib':
			document.getElementById('status').style.backgroundPosition="0px -40px";
			document.getElementById('image').innerHTML="<img src='img/src/rib.jpg' width='300' height='279' />";
			break;
		case 'v':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/v.jpg' width='300' height='279' />";
			break;
		case 'mb':
			document.getElementById('status').style.backgroundPosition="0px -80px";
			document.getElementById('image').innerHTML="<img src='img/src/mb.jpg' width='300' height='279' />";
			break;
		case 'n':
			document.getElementById('status').style.backgroundPosition="0px -40px";
			document.getElementById('image').innerHTML="<img src='img/src/n.jpg' width='300' height='279' />";
			break;
		default:
			break;
	}
	document.getElementById('image').style.height="279px";
	document.getElementById('status').style.top="310px";
	document.getElementById('footage').style.top="395px";
}