// MNTV Item
// Spot box on the front page with the selectable days
// Requires that base_change.js is loaded as well

function swapSpot(affectSpot, loadSpot) {

  affectSpot   = (affectSpot >= 1 && affectSpot <= 6) ? affectSpot : null;

  var spotIDs  = new Array();
  spotPrefix   = 'frontspotday';

  spotIDs[1]   = spotPrefix + 'mon';
  spotIDs[2]   = spotPrefix + 'tue';
  spotIDs[3]   = spotPrefix + 'wed';
  spotIDs[4]   = spotPrefix + 'thu';
  spotIDs[5]   = spotPrefix + 'fri';
  spotIDs[6]   = spotPrefix + 'sat';

  switch(affectSpot) {
  case null:
  // If no spot is selected, presume it is a rollout and
  // revert to the currently active day.
    spotStyle(spotIDs[spotHover], 'leave'); // unmark last hovered style
    swapSpot(spotActive);
    return true;

  default:
  // Change the onmouseover state for the selected day
  // This is only done if the selected day is not already active
    var spotPositions   = new Array();
    var setSpotPosition = -67;
    for(thisSpot = 1; thisSpot <= 6; thisSpot++) {
      // Set the different spot marker positions
      setSpotPosition        += 67;
      spotPositions[thisSpot] = setSpotPosition;
    }

    baseChange('frontspotdayactive', 'shift', spotPositions[affectSpot]);

    spotStyle(spotIDs[spotActive], 'leave'); // unmark the active style
    spotStyle(spotIDs[affectSpot], 'enter'); // mark the new day

    spotHover = affectSpot;

    // If selected, load the data and set this as the active spot
    if( loadSpot == true ) {

      // Detect the day abbreviation
      spotAbbr    = spotIDs[affectSpot].substr(spotPrefix.length, 3);

      // Change ...
      // 1. The Header
      document.getElementById('frontspotday').src = 'images/front_spots_day_' + spotAbbr + '.png';

      // 2. The Date
      document.getElementById('frontspotdate').innerHTML = spotDates[affectSpot];

      // 3. The Image
      document.getElementById('frontspotimage').src = 'assets/test_image_' + spotAbbr + '.jpg';

      // 4. The HTML data
      document.getElementById('frontspotdata').innerHTML = document.getElementById('spot' + spotAbbr).innerHTML;

      spotActive  = affectSpot; // mark as active
    } // ! load data?

  return true;
  } // ! switch (affect?)

} // ! swapSpot()




function spotStyle(spotID, spotAction) {

  var spotCheck   = document.getElementById(spotID);
  spotCheck       = (spotCheck != undefined) ? 'object' : null;

  // Check if the object exists
  if( spotCheck == "object" ) {

    spotStyles    = document.getElementById(spotID).style;

    switch(spotAction) {
    case 'enter':
    // Set the style as marked
      spotStyles.padding = '11px 0 0 1px';
      spotStyles.width   = '67px';
      spotStyles.color   = '#FCF906';
      spotStyles.border  = '0';
    break;
    default:
    // Set the style as unmarked
      spotStyles.padding     = '8px 0 0 0';
      spotStyles.width       = '65px';
      spotStyles.color       = '#AED3F0';
      spotStyles.border      = '2px solid #FFFFFF';
      spotStyles.borderWidth = '3px 0 0 2px';      
    } // ! switch (spot action)

  } // ! valid spotID?

} // ! spotStyle()