// Set the id of the container that holds the property slides
var parentContainerId = 'featured';

// Current slide index
var featureIndex = 0;

// Array which we will populate with the elements we want to show or hide
var featureSlides = [];

// Control links call nextFeature() or previousFeature() to move slides forward or back.
function nextFeature() {
 moveFeaturedSlide(1);
}

function previousFeature() {
 moveFeaturedSlide(-1);
}

function moveFeaturedSlide(direction) {
 var newIndex = featureIndex + direction;

 // Ignore a previous call if we're already at the first frame
 if (newIndex < 0) {
  return;
 }


 // Initialize our feature slides array if necessary
 if (featureSlides.length == 0) {
  // Start by targeting a wrapper div - we're keying in on a div with ID featured
  var content = document.getElementById(parentContainerId);

  // Get an array of all the divs within our target and iterate through each one.
  var divs = content.getElementsByTagName('div');
  for (var a = 0; a < divs.length; a++) {
   var div = divs[a];
   
   // If our div has a classname of fp (visible) or fpHidden(hidden) add them to our array of slides
   if (div.className == 'fp' || div.className == 'fpHidden') {
    featureSlides[featureSlides.length] = div;
   }
  }
 }

 // If we are already at the last slide ignore a next slide call.
 if (newIndex >= featureSlides.length) {
  return;
 }

 // Hide the slide that was previously visible
 var lastDiv = featureSlides[featureIndex];
 lastDiv.className = "fpHidden";

 // Show our newly selected slide
 var nextDiv = featureSlides[newIndex];
 nextDiv.className = "fp";
 
 // Update featureIndex so next time the function is called we'll know what frame we're on.
 featureIndex = newIndex;

 // Call in the next previous links and alter their class names - we can change their appearance
 // from disabled to enabled by giving these styles different colors, behavior or background images.
 // All the heavy lifting of changing appearance is done in the style sheet.
 var nextLink = document.getElementById('nextFeature');
 var prevLink = document.getElementById('previousFeature');
 nextLink.className = "";
 prevLink.className = "enabledLinkLeft";

 if (newIndex == featureSlides.length - 1) {
  nextLink.className = "disabledLinkRight";
 } else if (newIndex == 0) {  
  prevLink.className = "disabledLinkLeft";  
 }
}