// >script.js
// Copyright © 2008, 7th software
// All rights reserved.

var navitm_width  = 120;             /* Width of a navbar item */
var menu_width    = 112;             /* Width of a menu */
var menu_ypos     = 130;             /* Vertical position of top of menus */
var item_height   = 26;              /* Height of a menu item */
var term_width    = 400;             /* Maximum width of the terminology pop-up bubble */
var page_width    = 7*navitm_width;  /* Maximum width of the page (the navbar defines this) */
var quote_level   = 1.0;             /* Opacity level of the quote text */
var quote_pause   = 25;              /* Millisecond delay between fade levels */
var quote_step    = 0.1;             /* Fade step ( */
var quote_refresh = 10*1000;         /* Millisecond delay between new quote appearing (excluding fade times) */
var quote_rnd     = -1;              /* Index of last random quote */
var open_menu     = -1;              /* Index of the current open menu (-1 for none) */

var norm     = new Array;
var over     = new Array;
var high     = new Array;
var has_menu = new Array;
var link     = new Array('index', 'about', 'classes', 'gallery', 'links', 'facebook', 'contact');
var loaded   = !(1 + navigator.userAgent.indexOf('Netscape6'));
var quotes   = new Array(
"The classes are very motivating and extremely fun - we love to attend them!",
"Classes are very enjoyable and the show was a pleasurable opportunity to be part of",
"This class has improved my technique by a huge amount!",
"Good fun and a good way to keep fit by dancing",
"The Maple Academy show this year was a huge success. It was a pleasure to be involved",
"The classes are great fun and I feel so much more confident",
"I look forward to coming to ballet every Tuesday with Karen",
"It's fun and good exercise and the teaching is brilliant!",
"I could never wish for a better teacher than Karen, everything's now arranged around my ballet",
"Movement, rhythm, poise, strength, grace, balance, magic - dance!"
);

/** Initialise the JavaScript for a page. Called from onLoad() event handler.
 *
 *  @param  site  Non-zero if a Google map is to be used.
 *
 *  If the page is one of the 'map' pages, we initialise a Google map to the correct
 *  location and with other peripheral bits as required.
 */
function initialise(site)
{
  if (site)
  {
    if (GBrowserIsCompatible())
    {
      var map       = new GMap2(document.getElementById("map"));
//      var thetford  = new GLatLng(52.365244, 0.245814);
      var soham     = new GLatLng(52.325833, 0.350079);
//      var cambridge = new GLatLng(52.232360, 0.121815);
      var shelford  = new GLatLng(52.146269, 0.135800);
//      var harston   = new GLatLng(52.137096, 0.081348);
      var stapleford = new GLatLng(52.145405, 0.151963);

      switch (site)
      {
        case 1:
        {
//          map.setCenter(cambridge, 15);
//          map.openInfoWindowHtml(cambridge, "Buchan Street Neighbourhood Centre<br />North Cambridge");
          break;
        }
        case 2:
        {
          map.setCenter(soham, 13);
          map.openInfoWindowHtml(soham, "Soham Blueshed Studios<br />16.3 miles North East of Cambridge");
          break;
        }
        case 3:
        {
          map.setCenter(shelford, 14);
          map.openInfoWindowHtml(shelford, "Great Shelford Memorial Hall<br />4.5 miles South of Cambridge");
          break;
        }
        case 4:
        {
//          map.setCenter(harston, 14);
//          map.openInfoWindowHtml(harston, "Harston and Newton Primary School<br />5 miles South of Cambridge");
          break;
        }
        case 5:
        {
          map.setCenter(stapleford, 14);
          map.openInfoWindowHtml(stapleford, "Stapleford Community Primary School<br />5 miles South of Cambridge");
          break;
        }
      }

      map.addOverlay(new GMarker(soham));
//      map.addOverlay(new GMarker(thetford));
//      map.addOverlay(new GMarker(cambridge));
      map.addOverlay(new GMarker(shelford));
//      map.addOverlay(new GMarker(harston));
      map.addOverlay(new GMarker(stapleford));

      var mapControl = new GMapTypeControl();
      map.addControl(mapControl);
      map.addControl(new GSmallMapControl());
    }
  }
}


/** Finalise the JavaScript for a page. Called from onUnload() event handler.
 *
 *  @param  site  Non-zero if a Google map was used.
 */
function finalise(site)
{
  if (site)
    GUnload();
}


/** Return the value of a named parameter, as encoded in our URI.
 *
 *  @param  strParamName  Name of parameter to look for.
 *
 *  @return  Value of parameter (empty string if not found).
 */
function get_URL_param(strParamName)
{
  var strReturn = "";
  var strHref = window.location.href;

  if (strHref.indexOf("?") > -1)
  {
    //var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase();
    var strQueryString = strHref.substr(strHref.indexOf("?"));
    var aQueryString = strQueryString.split("&");
    for (var iParam = 0; iParam < aQueryString.length; iParam++)
    {
      if (aQueryString[iParam].indexOf(strParamName.toLowerCase() + "=") > -1)
      {
        var aParam = aQueryString[iParam].split("=");
        strReturn = aParam[1];
        break;
      }
    }
  }
  return unescape(strReturn);
}


/** Select a random quote and write it into the document body at the location where this function is called.
 */
function write_quote()
{
  document.write("<div class='oddbox' style='margin: 0px; padding: 0px; text-align: center;'>");
  document.write("<div id='quote'>");
  document.write("<img src='./images/lquot.gif' alt='\"' style='padding: 4px;' />");
  document.write("<span id='quote_txt'></span>");
  document.write("<img src='./images/rquot.gif' alt='\"' style='padding: 4px;' />");
  document.write("</div>");
  document.write("</div>");

  select_quote();
  setTimeout("quote_fade(true)", quote_refresh);
}


/** Select a random quote from the array (but not the same one as the last time).
 */
function select_quote()
{
  var rnd, max;

  do
  {
    rnd = Math.random();
    max = quotes.length;
    rnd = parseInt(rnd * max);
  } while (rnd == quote_rnd);

  quote_rnd = rnd;
  document.getElementById("quote_txt").innerHTML = quotes[quote_rnd];
}


/** Update the fade level of our home page quote.
 *
 *  @param  fade_out  Non-zero if we're fading out, zero if we're fading in.
 */
function quote_fade(fade_out)
{
  if (fade_out)
  {
    quote_level -= quote_step;
    if (quote_level <= 0)
      quote_level = 0;
    setTimeout("quote_fade(" + (quote_level == 0 ? "false" : "true") +")", quote_pause);
  }
  else
  {
    quote_level += quote_step;
    if (quote_level >= 1.0)
    {
      quote_level = 1.0;
      setTimeout("quote_fade(true)", quote_refresh);
    }
    else
    {
      setTimeout("quote_fade(false)", quote_pause);
    }
  }

  document.getElementById("quote").style.opacity = quote_level;
  document.getElementById("quote").style.filter  = "alpha(opacity=" + (quote_level * 100) + ")";

  if (quote_level == 0)
    select_quote();
}

/** Create all of the menus for the navbar. Needs to be called somewhere in the page body.
 *
 *  @param  root  URI fragment for navigating from the current document location to the website root.
 *
 *  For normal pages, root would be something like "./" or "" on entry.
 */
function create_menus(root)
{
  var i;

  if (document.images)
  {
    for (i=0; i<link.length; i++)
    {
      has_menu[i] = false;
      norm[i]     = new Image;
      norm[i].src = root + "./images/navbar/" + link[i] + "-lo.png";
      high[i]     = new Image;
      high[i].src = root + "./images/navbar/" + link[i] + "-hi.png";
      over[i]     = new Image;
      over[i].src = root + "./images/navbar/" + link[i] + ".gif";
    }
  }

  create_menu(1);
  create_menu(2);
  create_menu(3);
}

/** Set a navbar image to its highlighted and animated state.
 *
 *  @param  num  Navbar image identifier.
 */
function img_over(num)
{
  if (document.images && loaded)
  {
    document.images[link[num]].src = over[num].src;
  }
  showhide_menu(num, true);
}

/** Set a navbar image to its unhighlighted state.
 *
 *  @param  num  Navbar image identifier.
 */
function img_norm(num)
{
  if (document.images && loaded)
  {
    document.images[link[num]].src = norm[num].src;
  }
  showhide_menu(num, false);
}

/** Set a navbar image to its highlighted (but not animated) state.
 *
 *  @param  num  Navbar image identifier.
 */
function img_high(num)
{
  if (document.images && loaded)
  {
    document.images[link[num]].src = high[num].src;
  }
  showhide_menu(num, false);
}

/** Create a menu. This function must be called somewhere in the page body.
 *
 *  @param  num  The menu identifier.
 */
function create_menu(num)
{
  var xlo   = num * navitm_width;
  var ylo   = 130;

  document.write("<div id='menu_"+link[num]+"' style='max-width: "+menu_width+"px; position: absolute; left: "+xlo+"px; top: "+menu_ypos+"px; width: "+menu_width+"px; border: solid 2px #d0d0ee; background-color: #1a3b8b; color: #d0d0ee; visibility: hidden; z-index: 1000; opacity: .93; filter: alpha(opacity=93);' onMouseOver='showhide_menu("+num+",true)'>");

//onMouseOut='showhide_menu("+num+",false)'>");

  switch (num)
  {
    case 1: /* About */
    {
      create_item("Karen", "karen");
      create_item("FAQ", "faq");
      create_item("Newsletters", "newsletters");
      break;
    }
    case 2: /* Classes */
    {
      create_item("Term",  "term");
      create_item("Times", "times");
      create_item("Rules", "rules");
      document.write("<div style='float: left;'><img style='padding: 0;' width='"+menu_width+"' vspace='0' hspace='0' align='left' src='./images/items/spacer.png' alt='-------' /></div>");
//      create_item("Cambridge", "cambridge");
      create_item("Soham", "soham");
      create_item("Gt. Shelford", "gt_shelford");
      create_item("Stapleford", "stapleford");
//      create_item("Harston", "harston");
      break;
    }
    case 3: /* Gallery */
    {
      create_item("Showcase 2006", "showcase06");
      create_item("Showcase 2007", "showcase07");
      create_item("Classes", "class_pics");
      break;
    }
    case 0: /* Index */
    case 4: /* Links */
    case 5: /* Facebook */
    case 6: /* Contact us */
    {
      /* Do nothing */
    }
  }

  document.write("</div>");
  has_menu[num] = true;
}

/** Define a menu item.
 *
 *  @param  text  The alt text for the menu item.
 *  @param  ref   The URI for the menu item to jump to when clicked.
 */
function create_item(text, ref)
{
  document.write("<div style='float: left;'><img style='padding: 0; text-align: left;' width='"+menu_width+"' height='"+item_height+"' vspace='0' hspace='0' align='left' src='./images/items/"+ref+"-lo.png' onMouseOver='this.src=\"./images/items/"+ref+"-hi.png\"' onMouseOut='this.src=\"./images/items/"+ref+"-lo.png\"' onClick='document.location.href=\"./"+ref+".html\"' alt='"+text+"' /></div>");
}

/** Show or hide the specified menu.
 *
 *  @param  num    The menu identifier.
 *  @param  state  true to show or false to hide.
 */
function showhide_menu(num, state)
{
  if (has_menu[num])
  {
    if (state)
    {
      toggle_term(false);

      if (open_menu != -1)
        showhide_menu(open_menu, false);

      document.getElementById("shadow").style.left   = ((num * navitm_width) + 5) + "px";
      document.getElementById("shadow").style.top    = (menu_ypos + 5) + "px";
      document.getElementById("shadow").style.width  = document.getElementById("menu_" + link[num]).offsetWidth + "px";
      document.getElementById("shadow").style.height = document.getElementById("menu_" + link[num]).offsetHeight + "px";
      open_menu = num;
    }
    else
    {
      open_menu = -1;
    }
    document.getElementById("menu_" + link[num]).style.visibility = state ? "visible" : "hidden";
    document.getElementById("shadow").style.visibility            = state ? "visible" : "hidden";
  }
  else if (open_menu != -1)
    showhide_menu(open_menu, false);
}

/** Create the terminology pop-up bubble.
 */
function create_term_bubble()
{
  /* This is the hidden div for pop-up terminology information */
  document.write("<div id='shadow'></div>");
  document.write("<div id='terminology' onMouseOut='toggle_term(false)'><span id='phrase' class='term' onMouseOver='toggle_term(true)' onMouseOut='toggle_term(false)'></span>: <span id='description' onMouseOver='toggle_term(true)' onMouseOut='toggle_term(false)'></span></div>");
}

/** Launch the terminology pop-up bubble for the specified term.
 *
 *  @param  e     Event object (expected to come from an onMouseOver() event).
 *  @param  term  The term string to look up.
 *
 *  If the term is not defined in our list below, the pop-up will not appear.
 */
function show_term(e, term)
{
  var desc = "";

  switch (term)
  {
    case "Ballet":
    {
      desc = "There are a number of ballet classes available...<br /><span class='term'>Nursery</span>: a fun class encouraging young dancers to free their creative side with the use of mime and props. This class is aimed at students aged 3 - 4 years.<br /><span class='term'>Pre-Primary</span>: aimed at honing a young dancers ability to perform ballet using plenty of imagination and fun. A class examination is available at the ISTD headquarters in London. This class is aimed at students aged 5 — 6 years.<br /><span class='term'>Grade 4</span>: class following the ISTD grade 4 syllabus. Students are encouraged to take an exam with the ISTD in London. This class is aimed at students aged 12 - 16 years.<br /><span class='term'>Grade 6</span>: as for grade 3 but following the ISTD grade 6 syllabus. Aimed at students aged 14 - 18 years.";
      break;
    }
    case "Jazz":
    {
      desc = "<span class='term'>Jazz</span>: aimed at improving jazz technique for children aged 11 - 16 years.";
      break;
    }
    case "Contemporary":
    {
      desc = "A challenging class for students aged 14 - 18 years who would like to expand their dance vocabulary.";
      break;
    }
    case "Tap":
    {
      desc = "There are currently two tap classes...<br /><span class='term'>Primary</span>: enjoyable class for children wanting to explore a different style of dance. There is plenty of noise and fun in this class! This class is aimed at students aged 5 - 6 years.<br /><span class='term'>Grade 4</span>: a class following the ISTD grade 4 syllabus. Students are encouraged to take an exam with the ISTD in London. This class is aimed at students aged 12 - 16 years.<br /><span class='term'>Adult</span>: A fun class aimed at anyone from 18 to 80, with a choice of beginner or intermediate level.";
      break;
    }
    case "National":
    {
      desc = "<div class='caption' onMouseOver='toggle_term(true)' onMouseOut='toggle_term(false)'>The <a href='http://www.istd.org' target='_top'>ISTD</a> website says:</div><img src='./images/lquot.gif'>The aim of the National Dance Faculty is to bring the joy of European Folk Dance to all age levels. Folk dance develops a sense of community and awareness of others. The dancers have the opportunity to study traditional dances, costumes, music and customs.<div style='text-align: right;' onMouseOver='toggle_term(true)' onMouseOut='toggle_term(false)'><img src='./images/rquot.gif' /></div>";
      break;
    }
    case "Dance technique":
    {
      desc = "A motivating class aimed at improving the dance technique of dedicated students aged 14 - 18 years.";
      break;
    }
    case "Modern":
    {
      desc = "A class combining jazz with the strong technique of ballet aimed at children aged 7 - 9 years.";
      break;
    }
  }
  if (desc == "")
    return;

  var xpos = e.clientX;
  var ypos = e.clientY + 20;

  if (xpos > page_width - term_width)
    xpos = page_width - term_width;

  document.getElementById("phrase").innerHTML       = term;
  document.getElementById("description").innerHTML  = desc;
  document.getElementById("terminology").style.left = xpos + "px";
  document.getElementById("terminology").style.top  = ypos + "px";
  document.getElementById("shadow").style.left      = (xpos + 5) + "px";
  document.getElementById("shadow").style.top       = (ypos + 5) + "px";
  document.getElementById("shadow").style.width     = document.getElementById("terminology").offsetWidth + "px";
  document.getElementById("shadow").style.height    = document.getElementById("terminology").offsetHeight + "px";
  toggle_term(true);
}

/** Open or shut the terminology pop-up bubble (and its drop shadow).
 *
 *  @param  open  true to open or false to close.
 */
function toggle_term(open)
{
  document.getElementById("shadow").style.visibility      = open ? "visible" : "hidden";
  document.getElementById("terminology").style.visibility = open ? "visible" : "hidden";
}
