///////////////////////////////////////////////////////////
// BASIC INTERFACE TO ELEMENTS AND ATTRIBUTES IN THE HTML
///////////////////////////////////////////////////////////

// Page State variables

function pageState()
{
  var pageState = document.getElementById("page_state");
  return pageState;
}

function activeLinkName()
{
	link_name = pageState().getAttribute("activeLink");
	return link_name;
}

function setActiveLink(link_name)
{
	pageState().setAttribute("activeLink",link_name);
}

function buttonLock()
{
    var lockState = pageState().getAttribute("button_lock");
    return lockState;
}

function lockButtons()
{
    pageState().setAttribute("button_lock", "on");
}

function unlockButtons()
{
    pageState().setAttribute("button_lock", "off");
}

////////////////////////////////
// Access to HTML elements
////////////////////////////////

function getButton(buttonName)
{
		var button = document.getElementById(buttonName);
    return button;
}

function getContentPic()
{
  var image = document.getElementById("content_pic");;
  return image;
}

// Content Image States
function startingImageDrop()
{
  var drop = getContentPic();
}

///////////////////////////////////////////////////////////////


///////////////////////////////////////////////////////////////
// BUTTON ACTIONS
///////////////////////////////////////////////////////////////

function onButton(name)
{
	if ((activeLinkName() != name) && (buttonLock() == "off"))
	{
		var buttonName = name + "Button";
		var activeImage = "images/buttons/" + name + "_active.jpg";
		getButton(buttonName).setAttribute("src",activeImage);
	}
}

function offButton(name)
{
	if ((activeLinkName() != name) && (buttonLock() == "off"))
	{
		var buttonName = name + "Button";
		var inactiveImage = "images/buttons/" + name + "_inactive.jpg";
		getButton(buttonName).setAttribute("src",inactiveImage);
	}
}

function setCurrentButton(name)
{
	if ((activeLinkName() != name) && (buttonLock() == "off"))
    {
      lockButtons();
      pageState().setAttribute("nextLink",name);
      dropImage();
    }
}

function setImageHeight()
{
  var newdrop = pageState().getAttribute("image_drop");
  getContentPic().style.marginTop = newdrop + "px"; 
}

function dropImage()
{
  imageDrop = parseInt(pageState().getAttribute("image_drop"));
  endingImageDrop = parseInt(pageState().getAttribute("ending_image_drop"));
  if (imageDrop < endingImageDrop)
  {
  // get current image state 
    imageSpeed = parseInt(pageState().getAttribute("image_speed"));
    imageAcceleration = parseInt(pageState().getAttribute("image_acceleration"));

  // update image state variables
    imageSpeed += imageAcceleration;
    pageState().setAttribute("image_speed",imageSpeed);
    imageDrop += imageSpeed;
    pageState().setAttribute("image_drop", imageDrop);

  // let picture update to its new position based on new attributes in page_state
    setImageHeight();

  // drop again if necessary (wash, rinse, repeat!)
    imageTimeIncrement = parseInt(pageState().getAttribute("image_time_increment"));
    setTimeout("dropImage()",imageTimeIncrement);
  }
  else
  {
  // set to new image
    switchContentImage();
    
  // lift up new image
    liftImage();
  }
}

function switchContentImage()
{
  var newName = pageState().getAttribute("nextLink");
  var newImageSrc = "images/" + newName + "_pic";
  getContentPic().setAttribute("src",newImageSrc);
}

function liftImage()
{
  imageDrop = parseInt(pageState().getAttribute("image_drop"));
  if (imageDrop > 0)
  {
  // get current image state 
    imageSpeed = parseInt(pageState().getAttribute("image_speed"));
    minImageSpeed =
    parseInt(pageState().getAttribute("min_image_speed"));
    imageDecceleration = parseInt(pageState().getAttribute("image_acceleration"));

  // update image state variables
    imageSpeed -= imageAcceleration;
    if (imageSpeed < minImageSpeed)
      imageSpeed = minImageSpeed;
    pageState().setAttribute("image_speed",imageSpeed);
    imageDrop -= imageSpeed;
    if (imageDrop < startingImageDrop())
      imageDrop = 0;
    pageState().setAttribute("image_drop", imageDrop);

  // let picture update to its new position based on new attributes in page_state
    setImageHeight();

  // drop again if necessary (wash, rinse, repeat!)
    imageTimeIncrement = parseInt(pageState().getAttribute("image_time_increment"));
    setTimeout("liftImage()",imageTimeIncrement);
  }
  else
  {
    activateNextLink();
  }
}

function activateNextLink()
{
    unlockButtons();
  newName = pageState().getAttribute("nextLink");
  var buttonName = newName + "Button";
  var currentButtonImage = "images/buttons/" + newName + "_currentButton.jpg";
  var button = document.getElementById(buttonName);
  button.setAttribute("src",currentButtonImage);

	old_active_link_name = activeLinkName();

	setContent(newName);
	setActiveLink(newName);
	offButton(old_active_link_name);
}

function setContent(newName)
{
	content_node= document.getElementById("content");
	new_content = document.getElementById(newName + "_content");
	content_node.appendChild(new_content);

	invisible_node = document.getElementById("invisible_stuff");
	old_content = document.getElementById(activeLinkName() + "_content");
	invisible_node.appendChild(old_content);
}