var slogan = "";

var identityNames = [];
var identityUrls = [];
var identityDescriptions = [];
var identityCount = 0;

var printsNames = [];
var printsUrls = [];
var printsDescriptions = [];
var printsCount = 0;

var interactNames = [];
var interactUrls = [];
var interactDescriptions = [];
var interactCount = 0;

var tvNames = [];
var tvUrls = [];
var tvDescriptions = [];
var tvCount = 0;


$(document).ready(function() {
   if ($.browser.msie) {
      $.ajax({
         type: "GET",
         url: "data.xml",
         success: parseXml
      });
   }
   else {
      $.ajax({
         type: "GET",
         url: "data.xml",
         dataType: "xml",
         success: parseXml
      });
   }

   $("#content-slider").slider({
      animate: true,
      change: handleSliderChange,
      slide: handleSliderSlide
   });
});


function handleSliderChange(e, ui)
{
   var maxScroll = $("#content-scroll").attr("scrollWidth") - $("#content-scroll").width() - 100;
   $("#content-scroll").animate({ scrollLeft: ui.value * (maxScroll / 100) }, 1000);
}


function handleSliderSlide(e, ui)
{
   var maxScroll = $("#content-scroll").attr("scrollWidth") - $("#content-scroll").width() - 100;
   $("#content-scroll").attr({ scrollLeft: ui.value * (maxScroll / 100) });
}


function parseXml(data)
{
   var xml;

   if ($.browser.msie && typeof data == "string")
   {
      xml = new ActiveXObject("Microsoft.XMLDOM");
      xml.async = false;
      xml.loadXML(data);
   }
   else
   {
      xml = data;
   }

   $(xml).find('site').each(function()
   {
      slogan = $(this).attr('slogan');
      $("#header-slogan").html("<p>" + slogan + "</p>");

      $(this).find('identity').each(function()
      {
         var identityHtml = "";

         $(this).find('media').each(function()
         {
            identityNames[identityCount] = $(this).attr('name');
            identityUrls[identityCount] = $(this).attr('url');
            identityDescriptions[identityCount] = $(this).attr('description');

            identityHtml = identityHtml + "<a href=\"javascript:displayMedia('identity', " + identityCount + ");\">" + identityNames[identityCount] + "</a><br />";

            identityCount++;
         });

         $("#identity").html("<p><b>IDENTITY</b><br /><br />" + identityHtml + "</p>");
      });

      $(this).find('prints').each(function()
      {
         var printHtml = "";

         $(this).find('media').each(function()
         {
            printsNames[printsCount] = $(this).attr('name');
            printsUrls[printsCount] = $(this).attr('url');
            printsDescriptions[printsCount] = $(this).attr('description');

            printHtml = printHtml + "<a href=\"javascript:displayMedia('prints', " + printsCount + ");\">" + printsNames[printsCount] + "</a><br />";
            
            printsCount++;
         });

         $("#print").html("<p><b>PRINTS</b><br /><br />" + printHtml + "</p>");
      });

      $(this).find('interactive').each(function()
      {
         var interactHtml = "";

         $(this).find('media').each(function()
         {
            interactNames[interactCount] = $(this).attr('name');
            interactUrls[interactCount] = $(this).attr('url');
            interactDescriptions[interactCount] = $(this).attr('description');

            interactHtml = interactHtml + "<a href=\"javascript:displayMedia('interactive', " + interactCount + ");\">" + interactNames[interactCount] + "</a><br />";

            interactCount++;
         });

         $("#interactive").html("<p><b>INTERACTIVE</b><br /><br />" + interactHtml + "</p>");
      });

      $(this).find('tv').each(function()
      {
         var tvHtml = "";

         $(this).find('media').each(function()
         {
            tvNames[tvCount] = $(this).attr('name');
            tvUrls[tvCount] = $(this).attr('url');
            tvDescriptions[tvCount] = $(this).attr('description');

            tvHtml = tvHtml + "<a href=\"javascript:displayMedia('tv/collateral', " + tvCount + ");\">" + tvNames[tvCount] + "</a><br />";

            tvCount++;
         });

         $("#tv").html("<p><b>TV/COLLATERAL</b><br /><br />" + tvHtml + "</p>");
      });
   });
}


function displayContact()
{
   handleSliderSlide(null, 0);
   handleSliderChange(null, 0);

   document.getElementById("media-image").src = "images/contact.jpg";
   $("#media-title").html("<p><font size=\"4\"><b>&nbsp;</b></font></p>");
   $("#media-name").html("<p>&nbsp;</p>");
   $("#media-description").html("<p>&nbsp;</p>");
}


function displayMedia(category, index)
{
   var list;

   handleSliderSlide(null, 0);
   handleSliderChange(null, 0);

   $("#media-title").html("<p><font size=\"4\"><b>" + category + "</b></font></p>");

   if (category == "identity")
   {
      document.getElementById("media-image").src = identityUrls[index];
      $("#media-name").html("<p>" + identityNames[index] + "</p>");
      $("#media-description").html("<p>" + identityDescriptions[index] + "</p>");
   }
   else if (category == "prints")
   {
      document.getElementById("media-image").src = printsUrls[index];
      $("#media-name").html("<p>" + printsNames[index] + "</p>");
      $("#media-description").html("<p>" + printsDescriptions[index] + "</p>");
   }
   else if (category == "interactive")
   {
      document.getElementById("media-image").src = interactUrls[index];
      $("#media-name").html("<p>" +interactNames[index] + "</p>");
      $("#media-description").html("<p>" + interactDescriptions[index] + "</p>");
   }
   else if (category == "tv/collateral")
   {
      document.getElementById("media-image").src = tvUrls[index];
      $("#media-name").html("<p>" + tvNames[index] + "</p>");
      $("#media-description").html("<p>" + tvDescriptions[index] + "</p>");
   }

   $("#content-holder").css("width", parseInt(document.getElementById("media-image").width) + 135 + "px");
   $("#content-slider a").css("left", 0 + "%");
}