function Annotate(httpImagesMacro)
{
  var httpImages = httpImagesMacro;

  var numAnnotations = 0;

  var username = null;

  this.getNumAnnotations = function() 
  {
      return numAnnotations;
  }

  this.setUsername = function(cgiUsername)
  {
      username = cgiUsername;
  }

  this.getUsername = function()
  {
      return username;
  }

  this.createAnnotation = function(xleft,ytop,xwidth,yheight,text)
  {
      // start new annotation
      var newAI = document.createElement("div");
      newAI.setAttribute("class","annotationNote");
      if (expeditee) {
          newAI.setAttribute("onmouseout", "javascript:annotateLoseFocus(this)");
      }

      //newAI.style.position   = "absolute";
      //newAI.style.visibility = "visible";
      //newAI.style.zIndex     = "2";
      //newAI.style.background = "rgba(255,200,200,0.7)";

      if (xwidth) {
          newAI.style.width     = xwidth + "px";
      }

      if (yheight) {
          newAI.style.height     = yheight + "px";
      }
      else {
          newAI.style.height     = "auto";
      }

      //newAI.style.borderStyle = "solid";
      //newAI.style.borderColor = "black";

      newAI.style.padding      = "1px";
      newAI.style.paddingRight = "6px";


      var annotate_x_org = xleft;
      var annotate_y_org = ytop;
  
      if (document.all) {
        newAI.style.pixelLeft = annotate_x_org
        newAI.style.pixelTop  = annotate_y_org;
      }
      else if (document.getElementById) {
        newAI.style.left = annotate_x_org + 'px';
        newAI.style.top  = annotate_y_org + 'px';
      }


      var tableElem  = document.createElement("table");
      var trElem     = document.createElement("tr");

      var tdTextElem = document.createElement("td");
      var tdDecElem  = document.createElement("td");

      var editableElem = document.createElement("span");
      if (expeditee) {
          editableElem.setAttribute("onmouseover","javascript:annotateGainFocus(this)");
          editableElem.setAttribute("onmousemove","javascript:annotateGainFocus(this)");
      }
      //else {
      // tableElem.setAttribute("onmousedown","javascript:return false;");
      // tableElem.setAttribute("onmouseup",  "javascript:return false;");
      // }

      var annotation = (username!=null) ? username+"-annotation" : "annotation";

      editableElem.setAttribute("id","annotateItem" + numAnnotations);
      editableElem.setAttribute("class","editable-metadata");
      editableElem.setAttribute("docoid",musicStand.getDocOID());
      editableElem.setAttribute("metaname",annotation);
      editableElem.setAttribute("metapos",numAnnotations);

      //editableElem.setAttribute("style", "cursor:text;");
      
      editableElem.style.position     = "relative";

      if (text == "") {
          text = " "
      }
      editableElem.innerHTML = text;

      tdTextElem.setAttribute("onmousedown","javascript:return annotateMouseDown(this,event);");
      tdTextElem.setAttribute("onmouseup",  "javascript:return annotateMouseUp(this,event);");
      tdTextElem.setAttribute("style", "cursor:text;");
      
      var closeElem = document.createElement("div");
      //closeElem.onmouseup=closeAnnotation;
      closeElem.setAttribute("onmouseup","javascript:return closeAnnotation(this,event);");
      closeElem.setAttribute("style", "cursor:default;");
      
      closeElem.style.position = "absolute";
      closeElem.style.top      = "0px";
      closeElem.style.right    = "0px";
      closeElem.innerHTML = '<img src="'+httpImages+'/window-close.gif">';

      var resizeElem = document.createElement("div");

      resizeElem.setAttribute("onmousedown","javascript:return startResizeAnnotation(this,event);");
      resizeElem.setAttribute("onmouseup",  "javascript:return stopResizeAnnotation(this,event);");

      resizeElem.setAttribute("style", "cursor:se-resize;");
      
      resizeElem.style.position = "absolute";
      resizeElem.style.bottom   = "0px";
      resizeElem.style.right    = "0px";
      resizeElem.innerHTML = '<img src="'+httpImages+'/resizer.gif">';

      tdTextElem.appendChild(editableElem);
      tdDecElem.appendChild(closeElem);
      tdDecElem.appendChild(resizeElem);
      trElem.appendChild(tdTextElem);
      trElem.appendChild(tdDecElem);
      tableElem.appendChild(trElem);
      newAI.appendChild(tableElem);

      numAnnotations++;

      return newAI;
  }


  this.saveAnnotation = function(annotateWrapper,editedElem) 
  {
       var docoid = editedElem.getAttribute("docoid");
        
       if (gsdefined(docoid)) {
           var metaname = editedElem.getAttribute("metaname");
           var metapos  = editedElem.getAttribute("metapos");
           var metavalue= editedElem.innerHTML;
        
           var metavalue = metavalue.replace(/&nbsp;/g, " ");
        
           gsapi.setDocumentMetadata(docoid,metaname,metapos,metavalue);
           // gsapi.setImportMetadata(docoid,metaname,metapos,metavalue);
        
	   // Store co-ord + width and height
	   var ax_org = parseInt(annotateWrapper.style.left);
	   var ay_org = parseInt(annotateWrapper.style.top);
	   var ax_dim = parseInt(annotateWrapper.style.width);
	   var ay_dim = parseInt(annotateWrapper.style.height);

	   var scaleFactor = musicStand.getScaleFactor();
	   ax_org /= scaleFactor;
	   ay_org /= scaleFactor;

	   var rectHash = { "left": ax_org, "top": ay_org };

	   if (ay_dim) {

	       if (!ax_dim) {
		   // switch to width and deliberately leave height 
		   // underdefined
	           //ax_dim = parseInt(editedElem.offsetWidth) +4;
	           ax_dim = parseInt(annotateWrapper.offsetWidth)-10;
	       }
	       else {
  	           rectHash.height  = ay_dim;	           
	       }
	   }

	   if (ax_dim) {
	       rectHash.width  = ax_dim;
	   }

	   var rectHashStr = JSON.stringify(rectHash);

	   //alert("rectHashStr = " + rectHashStr);

	   var metaname = (username!=null) ? username+"-rectpos" : "rectpos";

           gsapi.setDocumentMetadata(docoid,metaname,metapos,rectHashStr);
           // gsapi.setImportMetadata(docoid,metaname,metapos,rectHashStr);

       	 }

      return true;
  }

  this.clearAnnotations = function()
  {
	  var annotateCanvasElem = document.getElementById("annotateCanvas");
	  annotateCanvasElem.innerHTML = null;
	  numAnnotations = 0;
  }

  this.loadAnnotation = function(docoid,metapos)
  {
      var annotationMetaname = "annotation";
      var rectposMetaname    = "rectpos";
      if (username!=null) {
          annotationMetaname = username + "-" + annotationMetaname;
	  rectposMetaname    = username + "-" + rectposMetaname;
      }

      var annotateText = gsapi.getDocumentMetadata(docoid,annotationMetaname,metapos);
      var annotateRect = gsapi.getDocumentMetadata(docoid,rectposMetaname,metapos);

      //alert("annotateRect = " + annotateRect);

      // Non-existent annotation rectangle has somehow got into the database      
      if (annotateRect == "") { return; }

      var annotateHash = JSON.parse(annotateRect);

      var xleft   = annotateHash.left;
      var ytop    = annotateHash.top;
      var xwidth  = annotateHash.width;
      var yheight = annotateHash.height;
      
      var scaleFactor = musicStand.getScaleFactor();
      xleft *= scaleFactor;
      ytop  *= scaleFactor;

      var newAI = this.createAnnotation(xleft,ytop,xwidth,yheight,annotateText);

      var annotateCanvasElem = document.getElementById("annotateCanvas");
      annotateCanvasElem.appendChild(newAI);
  }

  this.loadAnnotations = function(docoid)
  {
      numAnnotations = 0;
      
      var metaname = (username!=null) ? username+"-numAnnotations" : "numAnnotations";

      var newNumAnnotations = gsapi.getLiveMetadata(docoid,metaname);

      //alert("load: newNumAnnotations = " + newNumAnnotations);

      for (var a=0; a<newNumAnnotations; a++) {
          this.loadAnnotation(docoid,a);
      }
  }


  this.removeAnnotation = function(annotateCanvas,removeMetapos)
  {
      var annotateDivs = annotateCanvas.childNodes;
      //var numAnnotations = annotateDivs.length;

      //alert("num annotations = " + numAnnotations + " removeMetapos = " + removeMetapos);

      for (var a=0; a<numAnnotations; a++) {
          var annotateDiv = annotateDivs[a];

          var editableElems = getElementsByClass("editable-",annotateDiv);
          var editableElem = editableElems[0];

          var metapos = editableElem.getAttribute("metapos");

          if (metapos>removeMetapos) {
              editableElem.setAttribute("metapos",metapos-1);
          }
      }

      if (annotateCanvas != null) {
          var removeElem = annotateDivs[removeMetapos];
          annotateCanvas.removeChild(removeElem);
      }


      var docoid = musicStand.getDocOID();

      var annotationMetaname     = "annotation";
      var rectposMetaname        = "rectpos";
      var numAnnotationsMetaname = "numAnnotations";

      if (username!=null) {
          annotationMetaname     = username + "-" + annotationMetaname;
          rectposMetaname        = username + "-" + rectposMetaname;
          numAnnotationsMetaname = username + "-" + numAnnotationsMetaname;
      }

      gsapi.removeDocumentMetadata(docoid,annotationMetaname,removeMetapos);
      gsapi.removeDocumentMetadata(docoid,rectposMetaname,removeMetapos);
      numAnnotations--;
      gsapi.setLiveMetadata(docoid,numAnnotationsMetaname,numAnnotations);
  }
}