// Get the Sidebar
var mySidebar = document.getElementById("mySidebar");

// Get the DIV with overlay effect
var overlayBg = document.getElementById("myOverlay");

// Toggle between showing and hiding the sidebar, and add overlay effect
function w3_open() {
  if (mySidebar.style.display === 'block') {
    mySidebar.style.display = 'none';
    overlayBg.style.display = "none";
  } else {
    mySidebar.style.display = 'block';
    overlayBg.style.display = "block";
  }
}

// Close the sidebar with the close button
function w3_close() {
  mySidebar.style.display = "none";
  overlayBg.style.display = "none";
}

// Slideshow:

ssShowPro();

function ssShowPro() {
  showDivs("ss-img-pro", "ss-img-free", "ss-btn-pro", "ss-btn-free");
}

function ssShowFree() {
  showDivs("ss-img-free", "ss-img-pro", "ss-btn-free", "ss-btn-pro");
}

function showDivs(ssBlockClass, ssNoneClass, ssBtnSelectClass, ssBtnClearClass) {
  var i;
  var b = document.getElementsByClassName(ssBlockClass);
  for (i = 0; i < b.length; i++) {
    b[i].style.display = "block";  
  }  
  var n = document.getElementsByClassName(ssNoneClass);
  for (i = 0; i < n.length; i++) {
    n[i].style.display = "none";  
  }  
  var bs = document.getElementsByClassName(ssBtnSelectClass);
  for (i = 0; i < bs.length; i++) {
    bs[i].className = bs[i].className += " w3-theme-l2";
    bs[i].className = bs[i].className.replace(" w3-theme-l5", "");
  }
  var bc = document.getElementsByClassName(ssBtnClearClass);
  for (i = 0; i < bc.length; i++) {
    bc[i].className = bc[i].className += " w3-theme-l5";
    bc[i].className = bc[i].className.replace(" w3-theme-l2", "");
  }
}

// Slideshow

if (document.getElementsByClassName("mySlides").length > 0) {
  var slideIndex = 1;
  showSlides(slideIndex);
}

// Next/previous controls
function plusSlides(n) {
  showSlides(slideIndex += n);
}

// Thumbnail image controls
function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";
  dots[slideIndex-1].className += " active";
} 

// TM Slideshow

if (document.getElementsByClassName("tm-mySlides").length > 0) {
  var tmSlideIndex = Math.floor(Math.random() * 6) + 1;
  tmShowSlides(tmSlideIndex);
}

function tmPlusSlides(n) {
  tmShowSlides(tmSlideIndex += n);
}

function tmCurrentSlide(n) {
  tmShowSlides(tmSlideIndex = n);
}

function tmShowSlides(n) {
  var i;
  var slides = document.getElementsByClassName("tm-mySlides");
  var dots = document.getElementsByClassName("tm-dot");
  if (n > slides.length) {tmSlideIndex = 1}
    if (n < 1) {tmSlideIndex = slides.length}
    for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
    }
    for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" tm-active", "");
    }
  slides[tmSlideIndex-1].style.display = "block";
  dots[tmSlideIndex-1].className += " tm-active";
} 

/* Footer shadow, disable for now - does not hide on little content
window.onscroll = function() {
  var ratio = document.documentElement.scrollTop / document.documentElement.scrollHeight;
  document.getElementById("myFooter").style.boxShadow = "-10px -30px 40px -20px rgba(0, 0, 0, " + (1 - ratio) + ")"; 
}
*/