window.onload = init

function init()
{ setRollovers()
  setWindows()
  
  if (document.getElementById("home"))
  { homeBuildThumbs()
  }
  
}




/*

after the html page loads, setRollovers() scans the HTML page for any img tag 
that has the class "rollOver". When it finds one, it attaches the mouseover events.

*/

function setRollovers()
{ imgs = document.getElementsByTagName("img")
  for (i=0;i<imgs.length;i++)
  { if (/rollOver/.test(imgs[i].className))
    { imgs[i].parentNode.onmouseover=function(){roll(this,true);}
      imgs[i].parentNode.onmouseout=function(){roll(this,false);}
      imgs[i].parentNode.onfocus=function(){roll(this,true);}
      imgs[i].parentNode.onblur=function(){roll(this,false);}
    }
  }
}

function setWindows()
{ var anchors = document.getElementsByTagName("a")
  for (var i=0; i<anchors.length; i++)
  { var anchor = anchors[i]
    if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "newWindow")
    { anchor.target = "_blank";
    }
  }
} 




/*

roll() handles the image rollovers.

*/

function roll(node,status)
{ nodeImg = node.firstChild
  srcImg = nodeImg.getAttribute("src")
  fileName = srcImg.substring(0,srcImg.length - 7)
  navState = srcImg.substring(srcImg.length - 7,srcImg.length - 4)
  fileType = srcImg.substring(srcImg.length - 3,srcImg.length - 0)
  
  if (status)
  { if (navState == "off")
    { fileName = fileName + "ovr." + fileType
      nodeImg.setAttribute("src",fileName)
    }
  }
  else
  { if ((navState != "sel") && (navState != "off"))
    { fileName = fileName + "off." + fileType
      nodeImg.setAttribute("src",fileName)
    }
  }
}








/*

Video Definitions/Database.

*/

var current = 0
var totalVideos = 13

video = new Array(totalVideos)
video[0] = "<iframe src='http://player.vimeo.com/video/26892285?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[1] = "<iframe src='http://player.vimeo.com/video/26019721?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[2] = "<iframe src='http://player.vimeo.com/video/23497166?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='331' frameborder='0'></iframe>"
video[3] = "<iframe src='http://player.vimeo.com/video/23393790?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[4] = "<iframe src='http://player.vimeo.com/video/22452245?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[5] = "<iframe src='http://player.vimeo.com/video/26892459?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[6] = "<iframe src='http://player.vimeo.com/video/26892593?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[7] = "<iframe src='http://player.vimeo.com/video/23392430?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[8] = "<iframe src='http://player.vimeo.com/video/23409607?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[9] = "<iframe src='http://player.vimeo.com/video/23497941?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='331' frameborder='0'></iframe>"
video[10] = "<iframe src='http://player.vimeo.com/video/26892212?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='333' frameborder='0'></iframe>"
video[11] = "<iframe src='http://player.vimeo.com/video/23383015?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"
video[12] = "<iframe src='http://player.vimeo.com/video/28210579?title=0&amp;byline=0&amp;portrait=0&amp;color=9f986c' width='500' height='281' frameborder='0'></iframe>"

title = new Array(totalVideos)
title[0] = "Modelo Especial"
title[1] = "Sports Illustrated 2011 3D Special"
title[2] = "Flanm"
title[3] = "Tele Haiti"
title[4] = "Sports Illustrated Swimsuit &mdash; 2011 Selection Show"
title[5] = "Sports Illustrated Model Search"
title[6] = "Borsari Italy"
title[7] = "On Je Bil Tam"
title[8] = "Annabel Mobile"
title[9] = "From Here to There"
title[10] = "Matpar"
title[11] = "Digicel Gold Cup"
title[12] = "All Angels"

descr = new Array(totalVideos)
descr[0] = "2011 National Commercial (Clint Dempsey Sweepstake)<br />Director: Jonathan Whittaker | Producer: Alessandro Penazzi<br /><span class='date'>July 5, 2011</span>"
descr[1] = "Sports Illustrated partners with Sony Network Entertainment to deliver celebrated Swimsuit Issue in 3D Video.<br />Client: Sports Illustrated | Director: Jonathan Whittaker | Producer: Christian Whittaker<br /><span class='date'>April 16, 2011</span>"
descr[2] = "Client: Coca Cola | Director: Bruno Mourral| Agency: Multi Ad<br />Awards: Best Commercial, Garden State Film Festival 2010.<br /><span class='date'>April 9, 2011</span>"
descr[3] = "Director: Bruno Mourral<br /><span class='date'>April 2, 2011</span>"
descr[4] = "Client: DirecTV/Sports Illustrated | Director: Jonathan Whittaker | Producer: Christian Whittaker<br /><span class='date'>March 20, 2011</span>"
descr[5] = "ManInHat is proud to present the Sports Illustrated 2011 Model Search in collaboration with Nissan.<br />Client: Nissan / Sports Illustrated | Director Jonathan Whittaker | Agency: Chiat Day<br /><span class='date'>February 10, 2011</span>"
descr[6] = "Client: Gioielleria Borsari | Director: Alessandro Penazzi <br /><span class='date'>February 5, 2011</span>"
descr[7] = "Artist: Petra Petan | Director: Jonathan Whittaker<br /><span class='date'>May 7, 2010</span>"
descr[8] = "Director: Jonathan Whittaker | Agency: Storm <br /><span class='date'>May 7, 2010</span>"
descr[9] = "Music Video | Director: Bruno Mourral | Music by Birdy Nam Nam<br /><span class='date'>December 9, 2009</span>"
descr[10] = "Director: Bruno Mourral | Agency: Multi Ad<br /><span class='date'>May 7, 2008</span>"
descr[11] = "Client: Digicel | Director: Bruno Mourral | Agency: Blue Mango<br /><span class='date'>June 1, 2006</span>"
descr[12] = "Client: Columbia University | Director: D Bhatt<br /><span class='date'>August 29, 2011</span>"

names = new Array(totalVideos)
names[0] = "modelo"
names[1] = "si3d"
names[2] = "flanm"
names[3] = "haiti"
names[4] = "sishow"
names[5] = "simodel"
names[6] = "borsari"
names[7] = "petra"
names[8] = "anabel"
names[9] = "fromhere"
names[10] = "matpar"
names[11] = "digicel"
names[12] = "angels"










/*

Pop-up video handlers.

*/

function showVid(which)
{ setVid()
  window.onscroll = setVid
  current = which
  document.getElementById("video").style.display = "block"
  document.getElementById("movie").innerHTML = video[current]
  document.getElementById("title").innerHTML = title[current]
  document.getElementById("descr").innerHTML = descr[current]
  document.getElementById("count").innerHTML = "PROJECT " + (current+1) + " of " + totalVideos
}

function showVidHome(obj)
{ which = obj.firstChild.className
  which = parseInt(which.substring(3))
  setVid()
  window.onscroll = setVid
  current = which
  document.getElementById("video").style.display = "block"
  document.getElementById("movie").innerHTML = video[current]
  document.getElementById("title").innerHTML = title[current]
  document.getElementById("descr").innerHTML = descr[current]
  document.getElementById("count").innerHTML = "PROJECT " + (current+1) + " of " + totalVideos
}

function hideVid()
{ window.onscroll = null
  document.getElementById("movie").innerHTML = ""
  document.getElementById("title").innerHTML = ""
  document.getElementById("descr").innerHTML = ""
  document.getElementById("count").innerHTML = ""
  document.getElementById("video").style.display = "none"
}

function prevVid()
{ current--
  if (current < 0)
  { current = (totalVideos - 1)
  }
  
  document.getElementById("movie").innerHTML = video[current]
  document.getElementById("title").innerHTML = title[current]
  document.getElementById("descr").innerHTML = descr[current]
  document.getElementById("count").innerHTML = "PROJECT " + (current+1) + " of " + totalVideos
}

function nextVid()
{ current++
  if (current == totalVideos)
  { current = 0
  }
  
  document.getElementById("movie").innerHTML = video[current]
  document.getElementById("title").innerHTML = title[current]
  document.getElementById("descr").innerHTML = descr[current]
  document.getElementById("count").innerHTML = "PROJECT " + (current+1) + " of " + totalVideos
}

function setVid()
{ document.getElementById("video").style.marginTop = (posVid() - 20) + "px"
}

function posVid()
{ vert = document.body.scrollTop
          || window.pageYOffset 
          || (document.body.parentElement
              ? document.body.parentElement.scrollTop
              : 0
              )
  return vert
}















/*

home page building and animation.

*/

function homeBuildThumbs()
{ tag = "<li><img src='images/home/spacer.gif' width='58' height='42' /></li>"
  
  str = ""
  for (i=0; i<21; i++)
  { str += tag
  }
  document.getElementById("col0").getElementsByTagName("ul")[0].innerHTML = str
  
  str = ""
  for (i=0; i<36; i++)
  { str += tag
  }
  document.getElementById("col1").getElementsByTagName("ul")[0].innerHTML = str
  
  str = ""
  for (i=0; i<27; i++)
  { str += tag
  }
  document.getElementById("col2").getElementsByTagName("ul")[0].innerHTML = str
  
  str = ""
  for (i=0; i<16; i++)
  { str += tag
  }
  document.getElementById("col3").getElementsByTagName("ul")[0].innerHTML = str
  
  str = ""
  for (i=0; i<30; i++)
  { str += tag
  }
  document.getElementById("col4").getElementsByTagName("ul")[0].innerHTML = str
  
  assignIDs()  
}



var success = 0
var imgFill = 0
filled = new Array(130)

for (i=0; i<130; i++)
{ filled[i] = false
}

function assignIDs()
{  loc = Math.floor(Math.random() * 130)
  
  if (filled[loc] == false)
  { document.getElementById("home").getElementsByTagName("li")[success].firstChild.id = "img" + loc
    success++
    filled[loc] = true
  }
  
  if (success < 130)
  { assignIDs()
  }
  else
  { populateImages()
  }
}








iter = 0

function populateImages()
{ div = Math.floor(iter/10)
  rem = iter % 10
  document.getElementById("img" + iter).setAttribute("src","images/thumbs/" + names[div] + rem + "_sm_off.jpg")
  document.getElementById("img" + iter).className = "set" + div
  document.getElementById("home").getElementsByTagName("li")[iter].onmouseover = function(){thumbOn(this);}
  document.getElementById("home").getElementsByTagName("li")[iter].onmouseout = function(){thumbOff(this);}
  document.getElementById("home").getElementsByTagName("li")[iter].onclick = function(){showVidHome(this);}
  iter++
  if (iter < 130)
  { setTimeout("populateImages()",10)
  }
}


function thumbOn(obj)
{ set = obj.firstChild.className
  
  for(i=0; i<130; i++)
  { clss = document.getElementById("home").getElementsByTagName("li")[i].firstChild.className
    if (clss == set)
    { srcImg = document.getElementById("home").getElementsByTagName("li")[i].firstChild.getAttribute("src")
      fileName = srcImg.substring(0,srcImg.length - 7)
      navState = srcImg.substring(srcImg.length - 7,srcImg.length - 4)
      fileType = srcImg.substring(srcImg.length - 3,srcImg.length - 0)
      fileName = fileName + "ovr." + fileType
      document.getElementById("home").getElementsByTagName("li")[i].firstChild.setAttribute("src",fileName)
    }
  }
}

function thumbOff(obj)
{ set = obj.firstChild.className
  
  for(i=0; i<130; i++)
  { clss = document.getElementById("home").getElementsByTagName("li")[i].firstChild.className
    if (clss == set)
    { srcImg = document.getElementById("home").getElementsByTagName("li")[i].firstChild.getAttribute("src")
      fileName = srcImg.substring(0,srcImg.length - 7)
      navState = srcImg.substring(srcImg.length - 7,srcImg.length - 4)
      fileType = srcImg.substring(srcImg.length - 3,srcImg.length - 0)
      fileName = fileName + "off." + fileType
      document.getElementById("home").getElementsByTagName("li")[i].firstChild.setAttribute("src",fileName)
    }
  }
}