// Script for glossary in text
// please use the following code around the word,
// this script automatically search for the answer in the glossary
// <acronym onmouseover="glossary(this.innerHTML, '<bw:link id="brands_bionic-finish_fluorine-reduced_glossary"/>')">

function glossary(keyword, glossaryLink){

   $(document).ready(function(){
	  
	  // make info box
	  $('<div class="glossaryDescr"><dl class="glossaryContent"><dt></dt><dd></dd></dl></div>').appendTo("#brands-content");
	  
      // img arrow link
      var imgBackCount = glossaryLink.match(/\//gi).length -3;
      count = 0;
      backlink = '';
      while (count <= imgBackCount) {
         backlink = backlink + '../';
    	 count++;
      }
      imgFullLink = backlink + 'img/brands/bionic-finish/layout/glossary-arrow.png';

      // make var for ajax load
      var chooseIdA = glossaryLink + " dt[id='" + keyword + "']";
      var chooseIdB = glossaryLink + " dd[class='" + keyword + "']";
      // actual position of mousepointer
      //var filter = "acronym:contains(" + keyword + ")";
      var filter = "acronym[class*='" + keyword + "']";
      var position = $(filter).position();

      // make info box content
      $(this).attr("class", keyword);
      $(".glossaryDescr").css("top", position.top + 25).css("left", position.left).fadeTo(300, 0.90); // position
      $(".glossaryContent dt").load(chooseIdA);
      $(".glossaryContent dd").load(chooseIdB);
      $(".glossaryDescr").prepend('<img src="' + imgFullLink + '"/>'); // add arrow img
      
      // delete all after mouseout
      $(filter).mouseout(function(){
    	   $(".glossaryDescr").hide();
    	   $(".glossaryContent dt").empty();
    	   $(".glossaryContent dd").empty();
      });
      
   });
      
}