function InitPage (PageRef)

{
  if (PageRef == "112")  // "talking head" video page
    flowplayer(0).play();
  else
    flowplayer(0).stop();
 
  if (PageRef == "1121")  // "Manchester" video 
    flowplayer(1).play();
  else
    flowplayer(1).stop();

  if (PageRef != "1122")  // "Weddingintro" video 
    flowplayer(2).pause();
    
}

var ItemScroll;
var currentItemId = "";
var strBackgroundText = "";
var textItems;

//  Scroll To Item
//  The Item has been selected from the menu, or by
//  a hyperlink from another Item.
function ScrollToItem (itemId)

{
  itemId = itemId.toString ();
  if (itemId == currentItemId)
    return;
  
  currentItemId = itemId;  
  ShowStatus ("Scroll To Item (" + itemId + ")");

  // The column that contains this Item may be invisible.  
  var textPanel = $("textpanel");
  var textItems = textPanel.getChildren('div');
  var NewX = 0;
  var NewY = 0;
  var columnIndex = itemId.length;
  if (columnIndex > 0)  // "Home" has empty column index.
  {
    var promotedIndex = new Number(itemId.slice(0,1)) + columnIndex;
    var columnId = itemId.slice(0,columnIndex -1);
  //  ShowStatus("Scroll To Item (" + itemId + "): columnIndex="+columnIndex+", columnId="+columnId);
  
    if (columnId.length > 0)  // don't show / hide anything when going to root items.
    {
      textItems.each(function(item, index)
        {
          if (item.id.length > 1)  // don't hide / show root items
          {
            var promotedItemIndex = new Number(item.id.slice(0,1)) + item.id.length;
            if (promotedItemIndex == promotedIndex)   // All items in my column should be visible,
            {
              item.setStyle ("visibility", (item.id.indexOf(columnId) == 0) ? "visible" : "hidden");
              ShowStatus("item ["+ item.id+ "]: " + item.style.visibility);
            }
          }
        })
    }
    
    var thisItem = $(itemId.toString());
    NewX = 0-thisItem.getStyle ("left").toInt();
    NewY = 0-thisItem.getStyle ("top").toInt();
  }
  ShowStatus ("Scrolling to (" + NewX+ "," + NewY + ")");
  ItemScroll.start ({'left':NewX, 'top':NewY});
  InitPage (itemId);
}

function InitScroller ()

{
  var textPanel = $("textpanel");
  ItemScroll = new Fx.Morph (textPanel, {fps:25,link:'cancel',duration:'long',transition:Fx.Transitions.Cubic.easeInOut});
  var textItems = textPanel.getChildren('div');
  textItems.each(function(item, index)
     {
      StealText (item);
      var newPos = {x:0, y:0};
      item.setStyle ("display", "block");
      if (item.id.length > 0)
      {
        var tileSize = item.getSize();
        var xTile = Math.max (0,item.id.length-2);
        xTile += item.id.slice(0,1).toInt();
        var yTile = (item.id.length >1?1:0);
        for (var i=1; i<item.id.length; i++)
        {
          var yIncr = item.id.slice(i, i+1).toInt() -1;
          yTile += yIncr;
        }
        newPos.x=xTile*tileSize.x;
        newPos.y=yTile*tileSize.y;
//      alert ("Move tile (" + item.id+") = (" + xTile+ ", " + yTile+ ")");
      }
      item.setPosition (newPos);
     }
     )
  $("backgroundtext").innerHTML = strBackgroundText;
}

function ShowStatus (str)

{
  var pane = $("statuspane");
  var strtext = pane.innerHTML;
  pane.innerHTML = strtext + "<br/>" + str + "";
}

// Steal Text
// All the text in the text panels is copied out and placed on the background.
function StealText (item)

{
  var strText = item.innerHTML;
  strText = strText.replace (/<!--([\s\S]*?)-->/g, ""); // remove comments
  strText = strText.replace (/<[^>]*>/g, " ");  // remove HTML tags
//alert ("Steal Text " + strText);
  
  var sentences = strText.split (".");
  for (i=0;i<sentences.length;i++)
  {
    if (sentences[i].length > 2)
      strBackgroundText += ("<span itemNum='" + item.id + "'>" + sentences[i] + ". </span>");
  }
}

function tweakColour (item)

{
  var r = 180 + Math.floor (Math.random() * 60);
  var g = 180 + Math.floor (Math.random() * 60);
  var b = 180 + Math.floor (Math.random() * 60);
  
  var strColor = "rgb("+r+","+g+","+b+")";
  
//  ShowStatus ("Color: " + strColor);
  item.style.color = strColor;
}

function onclickBackground (event)

{
  alert ("Click!");
}
function AnimateBackgroundText ()

{
  if (textItems == undefined)
  {
    textItems = $("backgroundtext").getChildren('span');
  }
//ShowStatus ("AnimateBackgroundText: " + textItems.length + " items.");
  $("backgroundtext").addEvent("click", function(e){ScrollToItem (e.target.getAttribute ("itemnum"));});
  $("backgroundtext").addEvent("mouseover", function(e){(e.target.style.textDecoration="underline");});
  $("backgroundtext").addEvent("mouseout", function(e){(e.target.style.textDecoration="none");});
  textItems.each(tweakColour)
}