
function formSubmit() {

  // STEP 1 - define inputs as variables
  
  var gender=document.getElementById("gender");
  var height=document.getElementById("height");
  var weight=document.getElementById("weight");
 
  // STEP 2 - define mats and inputs as an Array of an Array

  var mat=Array();

  mat[0]=Array();
  mat[0][0]=7;
  mat[0][1]='eKO Lite Mat by Manduka';
  mat[0][2]=3;
  mat[0][3]=3;
  mat[0][4]=5;
  mat[0][5]='images/manduka_eKO_Lite_yoga_mat.jpg';

  mat[1]=Array();
  mat[1][0]=19;
  mat[1][1]='Jade Harmony Travel Mat 68';
  mat[1][2]=3;
  mat[1][3]=3;
  mat[1][4]=5;
  mat[1][5]='images/jade_harmony_travel.jpg';

  mat[2]=Array();
  mat[2][0]=19;
  mat[2][1]='Jade Harmony Travel Mat 74';
  mat[2][2]=3;
  mat[2][3]=3;
  mat[2][4]=5;
  mat[2][5]='images/jade_harmony_travel.jpg';

  mat[3]=Array();
  mat[3][0]=13;
  mat[3][1]='The Professional Mat by Jade 68';
  mat[3][2]=4;
  mat[3][3]=4;
  mat[3][4]=4;
  mat[3][5]='images/jade_professional_yoga_mat.jpg';

  mat[4]=Array();
  mat[4][0]=13;
  mat[4][1]='The Professional Mat by Jade 74';
  mat[4][2]=4;
  mat[4][3]=4;
  mat[4][4]=4;
  mat[4][5]='images/jade_professional_yoga_mat.jpg';

  mat[5]=Array();
  mat[5][0]=4;
  mat[5][1]='The Prolite Mat by Manduka';
  mat[5][2]=5;
  mat[5][3]=4;
  mat[5][4]=5;
  mat[5][5]='images/manduka_prolite_travel_yoga_mat.jpg';

  mat[6]=Array();
  mat[6][0]=5;
  mat[6][1]='eKO Mat by Manduka 71';
  mat[6][2]=4;
  mat[6][3]=4;
  mat[6][4]=3;
  mat[6][5]='images/manduka_eKO_yoga_mat.jpg';

  mat[7]=Array();
  mat[7][0]=5;
  mat[7][1]='eKO Mat by Manduka 85';
  mat[7][2]=4;
  mat[7][3]=4;
  mat[7][4]=3;
  mat[7][5]='images/manduka_eKO_yoga_mat.jpg';

  mat[8]=Array();
  mat[8][0]=17;
  mat[8][1]='The XW Mat by Jade 68';
  mat[8][2]=4;
  mat[8][3]=4;
  mat[8][4]=4;
  mat[8][5]='images/jade_harmony_XW_yoga_mat.jpg';

  mat[9]=Array();
  mat[9][0]=17;
  mat[9][1]='The XW Mat by Jade 74';
  mat[9][2]=4;
  mat[9][3]=4;
  mat[9][4]=4;
  mat[9][5]='images/jade_harmony_XW_yoga_mat.jpg';

  mat[10]=Array();
  mat[10][0]=20;
  mat[10][1]='Edge Collection by Jade';
  mat[10][2]=4;
  mat[10][3]=4;
  mat[10][4]=4;
  mat[10][5]='images/jade_edge_collection_yoga_mats.jpg';

  mat[11]=Array();
  mat[11][0]=2;
  mat[11][1]='Black Mat by Manduka 71';
  mat[11][2]=5;
  mat[11][3]=5;
  mat[11][4]=3;
  mat[11][5]='images/manduka_BlackMatPRO_yoga_mat.jpg';

  mat[12]=Array();
  mat[12][0]=2;
  mat[12][1]='Black Mat by Manduka 85';
  mat[12][2]=5;
  mat[12][3]=5;
  mat[12][4]=3;
  mat[12][5]='images/manduka_BlackMatPRO_yoga_mat.jpg';

  mat[13]=Array();
  mat[13][0]=15;
  mat[13][1]='The Fusion Mat by Jade 68';
  mat[13][2]=4;
  mat[13][3]=4;
  mat[13][4]=4;
  mat[13][5]='images/jade_fusion_yoga_mats.jpg';

  mat[14]=Array();
  mat[14][0]=15;
  mat[14][1]='The Fusion Mat by Jade 74';
  mat[14][2]=4;
  mat[14][3]=4;
  mat[14][4]=4;
  mat[14][5]='images/jade_fusion_yoga_mats.jpg';

  mat[15]=Array();
  mat[15][0]=24;
  mat[15][1]='Wai Lana Green EnviroMat';
  mat[15][2]=4;
  mat[15][3]=3;
  mat[15][4]=5;
  mat[15][5]='images/wai_lana_enviro_mat.jpg';

  mat[16]=Array();
  mat[16][0]=23;
  mat[16][1]='Wai Lana Green Eco Mat';
  mat[16][2]=4;
  mat[16][3]=4;
  mat[16][4]=4;
  mat[16][5]='images/wai_lana_eco_mat.jpg';

  mat[17]=Array();
  mat[17][0]=27;
  mat[17][1]='Cosmic Breath Yoga Mat';
  mat[17][2]=4;
  mat[17][3]=4;
  mat[17][4]=3;
  mat[17][5]='images/cosmic_breath_bolder_yoga_mat.jpg';

  mat[18]=Array();
  mat[18][0]=28;
  mat[18][1]='Fish Wish Yoga Mat';
  mat[18][2]=4;
  mat[18][3]=4;
  mat[18][4]=3;
  mat[18][5]='images/fish_wish_bolder_yoga_mat.jpg';

  mat[19]=Array();
  mat[19][0]=29;
  mat[19][1]='Flower Power Yoga Mat';
  mat[19][2]=4;
  mat[19][3]=4;
  mat[19][4]=3;
  mat[19][5]='images/flower_power_bolder_yoga_mat.jpg';

  mat[20]=Array();
  mat[20][0]=30;
  mat[20][1]='Go With The Flow Yoga Mat';
  mat[20][2]=4;
  mat[20][3]=4;
  mat[20][4]=3;
  mat[20][5]='images/gowiththeflow_bolder_yoga_mat.jpg';

  mat[21]=Array();
  mat[21][0]=31;
  mat[21][1]='Peace Prayer Yoga Mat';
  mat[21][2]=4;
  mat[21][3]=4;
  mat[21][4]=3;
  mat[21][5]='images/peace_prayer_bolder_yoga_mat.jpg';

  mat[22]=Array();
  mat[22][0]=26;
  mat[22][1]='Natural Fitness Divine Mat';
  mat[22][2]=5;
  mat[22][3]=5;
  mat[22][4]=3;
  mat[22][5]='images/natural_fitness_divine_yoga_mat.jpg';

  // STEP 3 - define output combinations for each unique case

  var choice1= null;
  var choice2= null;
  var choice3= null;

  if (gender.value=="female" && height.value=="h1" && weight.value=="w1") {
  var choice1=mat[0];
  var choice2=mat[1];
  var choice3=mat[15];
}
  else if (gender.value=="female" && height.value=="h1" && weight.value=="w2") {
  var choice1=mat[0];
  var choice2=mat[5];
  var choice3=mat[16];
}
  else if (gender.value=="female" && height.value=="h1" && weight.value=="w3") {
  var choice1=mat[3];
  var choice2=mat[6];
  var choice3=mat[15];
}
  else if (gender.value=="female" && height.value=="h1" && weight.value=="w4") {
  var choice1=mat[6];
  var choice2=mat[3];
  var choice3=mat[16];
}
  else if (gender.value=="female" && height.value=="h1" && weight.value=="w5") {
  var choice1=mat[11];
  var choice2=mat[13];
  var choice3=mat[15];
}
  else if (gender.value=="female" && height.value=="h2" && weight.value=="w1") {
  var choice1=mat[3];
  var choice2=mat[5];
}
  else if (gender.value=="female" && height.value=="h2" && weight.value=="w2") {
  var choice1=mat[3];
  var choice2=mat[5];
}
  else if (gender.value=="female" && height.value=="h2" && weight.value=="w3") {
  var choice1=mat[5];
  var choice2=mat[6];
  var choice3=mat[17];
}
  else if (gender.value=="female" && height.value=="h2" && weight.value=="w4") {
  var choice1=mat[11];
  var choice2=mat[9];
  var choice3=mat[18];
}
  else if (gender.value=="female" && height.value=="h2" && weight.value=="w5") {
  var choice1=mat[14];
  var choice2=mat[19];
  var choice3=mat[21];
}
  else if (gender.value=="female" && height.value=="h3" && weight.value=="w1") {
  var choice1=mat[5];
  var choice2=mat[4];
  var choice3=mat[22];
}
  else if (gender.value=="female" && height.value=="h3" && weight.value=="w2") {
  var choice1=mat[6];
  var choice2=mat[4];
}
  else if (gender.value=="female" && height.value=="h3" && weight.value=="w3") {
  var choice1=mat[6];
  var choice2=mat[4];
}
  else if (gender.value=="female" && height.value=="h3" && weight.value=="w4") {
  var choice1=mat[4];
  var choice2=mat[12];
  var choice3=mat[9];
}
  else if (gender.value=="female" && height.value=="h3" && weight.value=="w5") {
  var choice1=mat[12];
  var choice2=mat[14];
}
 else if (gender.value=="female" && height.value=="h4" && weight.value=="w1") {
  var choice1=mat[7];
  var choice2=mat[22];
}
 else if (gender.value=="female" && height.value=="h4" && weight.value=="w2") {
  var choice1=mat[7];
  var choice2=mat[4];
}
 else if (gender.value=="female" && height.value=="h4" && weight.value=="w3") {
  var choice1=mat[7];
  var choice2=mat[14];
}
 else if (gender.value=="female" && height.value=="h4" && weight.value=="w4") {
  var choice1=mat[7];
  var choice2=mat[14];
  var choice3=mat[12];
}
 else if (gender.value=="female" && height.value=="h4" && weight.value=="w5") {
  var choice1=mat[12];
  var choice2=mat[14];
}
 else if (gender.value=="female" && height.value=="h5" && weight.value=="w1") {
  var choice1=mat[7];
  var choice2=mat[22];
}
 else if (gender.value=="female" && height.value=="h5" && weight.value=="w2") {
  var choice1=mat[7];
  var choice2=mat[22];
}
 else if (gender.value=="female" && height.value=="h5" && weight.value=="w3") {
  var choice1=mat[7];
  var choice2=mat[12];
  var choice3=mat[22];
}
 else if (gender.value=="female" && height.value=="h5" && weight.value=="w4") {
  var choice1=mat[7];
  var choice2=mat[12];
  var choice3=mat[22];
}
 else if (gender.value=="female" && height.value=="h5" && weight.value=="w5") {
  var choice1=mat[12];
}
  else if (gender.value=="male" && height.value=="h1" && weight.value=="w1") {
  var choice1=mat[2];
  var choice2=mat[3];
  var choice3=mat[15];
}
  else if (gender.value=="male" && height.value=="h1" && weight.value=="w2") {
  var choice1=mat[2];
  var choice2=mat[3];
  var choice3=mat[16];
}
  else if (gender.value=="male" && height.value=="h1" && weight.value=="w3") {
  var choice1=mat[3];
  var choice2=mat[11];
  var choice3=mat[15];
}
  else if (gender.value=="male" && height.value=="h1" && weight.value=="w4") {
  var choice1=mat[3];
  var choice2=mat[11];
  var choice3=mat[16];
}
  else if (gender.value=="male" && height.value=="h1" && weight.value=="w5") {
  var choice1=mat[11];
  var choice2=mat[13];
  var choice3=mat[15];
}
  else if (gender.value=="male" && height.value=="h2" && weight.value=="w1") {
  var choice1=mat[3];
  var choice2=mat[11];
}
  else if (gender.value=="male" && height.value=="h2" && weight.value=="w2") {
  var choice1=mat[3];
  var choice2=mat[11];
}
  else if (gender.value=="male" && height.value=="h2" && weight.value=="w3") {
  var choice1=mat[11];
  var choice2=mat[4];
  var choice3=mat[22];
}
  else if (gender.value=="male" && height.value=="h2" && weight.value=="w4") {
  var choice1=mat[11];
  var choice2=mat[9];
  var choice3=mat[4];
}
  else if (gender.value=="male" && height.value=="h2" && weight.value=="w5") {
  var choice1=mat[14];
  var choice2=mat[12];
}
  else if (gender.value=="male" && height.value=="h3" && weight.value=="w1") {
  var choice1=mat[12];
  var choice2=mat[4];
}
  else if (gender.value=="male" && height.value=="h3" && weight.value=="w2") {
  var choice1=mat[12];
  var choice2=mat[4];
}
  else if (gender.value=="male" && height.value=="h3" && weight.value=="w3") {
  var choice1=mat[12];
  var choice2=mat[4];
  var choice3=mat[22];
}
  else if (gender.value=="male" && height.value=="h3" && weight.value=="w4") {
  var choice1=mat[4];
  var choice2=mat[12];
  var choice3=mat[9];
}
  else if (gender.value=="male" && height.value=="h3" && weight.value=="w5") {
  var choice1=mat[12];
  var choice2=mat[14];
}
 else if (gender.value=="male" && height.value=="h4" && weight.value=="w1") {
  var choice1=mat[12];
  var choice2=mat[4];
}
 else if (gender.value=="male" && height.value=="h4" && weight.value=="w2") {
  var choice1=mat[12];
  var choice2=mat[4];
  var choice3=mat[22];
}
 else if (gender.value=="male" && height.value=="h4" && weight.value=="w3") {
  var choice1=mat[12];
  var choice2=mat[14];
}
 else if (gender.value=="male" && height.value=="h4" && weight.value=="w4") {
  var choice1=mat[14];
  var choice2=mat[12];
}
 else if (gender.value=="male" && height.value=="h4" && weight.value=="w5") {
  var choice1=mat[12];
  var choice2=mat[14];
}
 else if (gender.value=="male" && height.value=="h5" && weight.value=="w1") {
  var choice1=mat[12];
  var choice2=mat[22];
}
 else if (gender.value=="male" && height.value=="h5" && weight.value=="w2") {
  var choice1=mat[12];
  var choice2=mat[22];
}
 else if (gender.value=="male" && height.value=="h5" && weight.value=="w3") {
  var choice1=mat[12];
  var choice2=mat[22];
}
 else if (gender.value=="male" && height.value=="h5" && weight.value=="w4") {
  var choice1=mat[12];
  var choice2=mat[22];
}
 else if (gender.value=="male" && height.value=="h5" && weight.value=="w5") {
  var choice1=mat[12];
  var choice2=mat[22];
}

 // Step 4 - display outputs
  
  var chart=document.getElementById("chart");
  
  // Displays header
  var teststring = '<br /><b>Recommended mats for you:</b><br /><br />';
  
  //Displays product image
  teststring = teststring + '<div style="float:left; width:100%;"><div style="float:left; width:40%; text-align:center;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice1[0] + '" target="_blank"><img src="' + choice1[5] + '" height="100px" /></a></div>';
  
  // Displays product rating
  teststring = teststring + '<div style="float:left; width:20%;"><h1>Durability</h1></div><div style="float:left;"><img src="/media/' + choice1[2] + 'stars.jpg" /></div>';
  teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Comfort</h1></div><div style="float:left;"><img src="/media/' + choice1[3] + 'stars.jpg" /></div>';
  teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Travel</h1></div><div style="float:left;"><img src="/media/' + choice1[4] + 'stars.jpg" /></div>';
  
  // Displays product name
  teststring = teststring + '<div style="text-align:center; width:40%; clear:left;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice1[0] + '" target="_blank">' + choice1[1] + '</a></div>';

  if (choice2 != null) {
	teststring = teststring + '<hr />';
	  
	//Displays product image
	teststring = teststring + '<div style="float:left; width:100%;"><div style="float:left; width:40%; text-align:center;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice2[0] + '" target="_blank"><img src="' + choice2[5] + '" height="100px" /></a></div>';
	
	// Displays product rating
	teststring = teststring + '<div style="float:left; width:20%;"><h1>Durability</h1></div><div style="float:left;"><img src="/media/' + choice2[2] + 'stars.jpg" /></div>';
	teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Comfort</h1></div><div style="float:left;"><img src="/media/' + choice2[3] + 'stars.jpg" /></div>';
	teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Travel</h1></div><div style="float:left;"><img src="/media/' + choice2[4] + 'stars.jpg" /></div>';
	  
	// Displays product name
	teststring = teststring + '<div style="text-align:center; width:40%; clear:left;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice2[0] + '" target="_blank">' + choice2[1] + '</a></div>';
  }
  
  if (choice3 != null) {
	teststring = teststring + '<hr />';
	  
	//Displays product image
	teststring = teststring + '<div style="float:left; width:100%;"><div style="float:left; width:40%; text-align:center;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice3[0] + '" target="_blank"><img src="' + choice3[5] + '" height="100px" /></a></div>';
	  
	// Displays product rating
	teststring = teststring + '<div style="float:left; width:20%;"><h1>Durability</h1></div><div style="float:left;"><img src="/media/' + choice3[2] + 'stars.jpg" /></div>';
	teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Comfort</h1></div><div style="float:left;"><img src="/media/' + choice3[3] + 'stars.jpg" /></div>';
	teststring = teststring + '<br /><br /><br /><div style="float:left; width:20%;"><h1>Travel</h1></div><div style="float:left;"><img src="/media/' + choice3[4] + 'stars.jpg" /></div>';
	  
	// Displays product name
	teststring = teststring + '<div style="text-align:center; width:40%; clear:left;"><a href="http://www.gogreenyogamats.com/index.php?main_page=product_info&cPath=2&products_id=' + choice3[0] + '" target="_blank">' + choice3[1] + '</a></div>';
  }

  teststring = teststring + '</div>';

  chart.innerHTML = teststring;

  return false;
}
