/**
 * Data class for holding the employee data
 */
function Employee(photo, name, title, description, phone)
{
  this.photo = photo;
  this.name = name;
  this.title = title;
  this.description = description;
  this.phone = phone;
}

/**
 * This method takes the employee number as input and populates the popup 
 * with the details of the employee
 */
function populateEmployeeData(empNum)
{
  var photo = employees[empNum].photo;
  var name = employees[empNum].name;
  var title = employees[empNum].title;
  var description = employees[empNum].description;
  var phone = employees[empNum].phone;

  // Set the width and height of the container to maximum dimensions and let the resizing logic
  // decide on the actual dimensions to be resized to
  YAHOO.util.Dom.get("largePhotoContainer").style.width = '424px';
  YAHOO.util.Dom.get("largePhotoContainer").style.height = '216px';

  // Get the original width and height of the image
  var dimensions = getImageDimensions(photo);

  var displayStyle = (photo == "") ? "none" : "block";
  YAHOO.util.Dom.get("largePhoto").style.display = displayStyle;
  YAHOO.util.Dom.get("largePhotoColumn").style.display = displayStyle;

  // Reset the dimensions of the image to its actuals
  YAHOO.util.Dom.get("largePhoto").width = dimensions.width;
  YAHOO.util.Dom.get("largePhoto").height = dimensions.height;
  YAHOO.util.Dom.get("largePhoto").src = photo;
  resizeRollOverImage();
  
  // Populate the contents here
  setRollOverFieldValue("rollOverEmpName", name);
  setRollOverFieldValue("rollOverEmpTitle", title);

  // Append tel string to the telephone
  phone = (phone != "") ? (phonePrefix + phone) : phone;

  setRollOverFieldValue("rollOverEmpPhone", phone);
  setRollOverFieldValue("rollOverEmpDescription", description);

  // Resize the popup width and height
  resizeRollOverPopup();

  // Position the pop-up
  var coords = getRollOverPopupPosition(empNum);
  YAHOO.fdds.largePhoto.bioDataDlg.moveTo(coords[0], coords[1]);
  
  // Now show the popup
  YAHOO.fdds.largePhoto.bioDataDlg.render(document.body);
  showEmployeePopup();
}

/**
 * Returns the width and height of an image in an array of the form [width, height]
 */
function getImageDimensions(imageSource)
{
  if(imageSource == "") return [0, 0];
  var imageObj = new Image();
  imageObj.src = imageSource;
  return { width: imageObj.width, height: imageObj.height };
}


function setRollOverFieldValue(fieldName, value)
{
  if(value != "")
  {
    YAHOO.util.Dom.get(fieldName).style.display = "block";
    YAHOO.util.Dom.get(fieldName).innerHTML = value;
  }
  else
  {
    YAHOO.util.Dom.get(fieldName).style.display = "none";
  }
}

/**
 * Resizes the given image and ensure the image size is under 200 * 200 maintaining the aspect ratio
 */
function resizeRollOverImage()
{
  var largePhotoObject = YAHOO.util.Dom.get("largePhoto");
  if(largePhotoObject.offsetWidth <= 200 && largePhotoObject.offsetHeight <= 200) return;

  var aspectRatio = (largePhotoObject.offsetWidth / largePhotoObject.offsetHeight);
  var width;
  var height;

  if(largePhotoObject.offsetWidth > largePhotoObject.offsetHeight)
  {
     width = 200;
     height = parseInt(width / aspectRatio);
  }
  else
  {
     height = 200;
     width = parseInt(height * aspectRatio);
  }

  largePhotoObject.width = width;
  largePhotoObject.height = height;
}

/**
 * Resizes the popup based on the photo height and the bio data height
 */
function resizeRollOverPopup()
{
  var largePhotoHeight = YAHOO.util.Dom.get("largePhoto").offsetHeight;
  var bioDataHeight = YAHOO.util.Dom.get("bioData").offsetHeight;
  var popupHeight = ((largePhotoHeight > bioDataHeight) ? largePhotoHeight : bioDataHeight) + 16; // 16 px for spacing
  YAHOO.util.Dom.get("largePhotoContainer").style.height = popupHeight + 'px'; 
  YAHOO.fdds.largePhoto.bioDataDlg.cfg.setProperty('height', popupHeight, false);

  var largePhotoWidth = YAHOO.util.Dom.get("largePhoto").offsetWidth;
  var bioDataWidth = 200;
  var popupWidth = largePhotoWidth + bioDataWidth + 24; // 24 px for the spacing
  YAHOO.util.Dom.get("largePhotoContainer").style.width = popupWidth + 'px';
  YAHOO.fdds.largePhoto.bioDataDlg.cfg.setProperty('width', popupWidth, false);
}

/**
 * Hides the employee pop up
 */
function hideEmployeePopup()
{
  YAHOO.util.Dom.get("largePhotoContainer_c").style.visibility = "hidden";
}

/**
 * Shows the employee pop up
 */
function showEmployeePopup()
{  
  YAHOO.util.Dom.get("largePhotoContainer_c").style.visibility = "visible";
}

/**
 * Gets the pop-up height
 */
function getRollOverPopupHeight()
{
  return YAHOO.util.Dom.get("largePhotoContainer").offsetHeight + 5;
}

/**
 * Get the pop-up width
 */
function getRollOverPopupWidth()
{
  return YAHOO.util.Dom.get("largePhotoContainer").offsetWidth + 5;
}

/**
 * Returns a map which contains the values for keys (x1, y1, x2, y2) which correspond to the coordinates of the primary diagonal
 * of the element
 */
function findDiagonalCoordinates( element )
{
  var oElement = YAHOO.util.Dom.get(element);
  var coords = findPosition(oElement);
  var width = oElement.offsetWidth;
  var height = oElement.offsetHeight;
  return { x1:coords[0], y1:coords[1], x2:(coords[0] + width), y2:(coords[1] + height) };
}