function hideContent() {
  $( '#contentContainer' ).fadeOut( 200, function() {} );
  $( '#naviSub' ).fadeOut( 200, function() {} );
  $( '#btnMin' ).fadeOut( 200, function() {} );
  $( '#containerBg' ).fadeOut( 200, function() {} );
  $( '#cmBadge' ).fadeOut( 200, function() {} );

  for( i = 0; i < naviMainNum; i++ ) {
    nm = document.getElementById( "naviMainItem" + ( i + 1 ) );
    if( i != naviMainNumSelected ) {
      nm.className = "inactive";
    }
  }
}

function showContent() {
  $( '#contentContainer' ).fadeTo( 200, 1.0, function() {} );
  $( '#naviSub' ).fadeTo( 200, 1.0, function() {} );
  $( '#btnMin' ).fadeTo( 200, 0.8, function() {} );
  $( '#containerBg' ).fadeTo( 200, 0.5, function() {} );
  $( '#cmBadge' ).fadeTo( 200, 1.0, function() {} );

  for( i = 0; i < naviMainNum; i++ ) {
    nm = document.getElementById( "naviMainItem" + ( i + 1 ) );
    if( i != naviMainNumSelected ) {
      nm.className = "normal";
    }
  }
}

function showImage( p, fs ) {
  $( '#imgContainer' ).npFullBgImg( p + images[ imgIndex ], { fadeInSpeed: fs, center: true } );
  slideShowInfoId = document.getElementById( "slideShowInfo" );
  if( iptc[ imgIndex ] != "" ) {
    $( '#slideShowInfo' ).fadeIn( 200, function() {} );
    slideShowInfoId.innerHTML = iptc[ imgIndex ];
  } else {
    $( '#slideShowInfo' ).fadeOut( 200, function() {} );
    slideShowInfoId.innerHTML = "";
  }
  
  for( i = 0; i < images.length; i++ ) {
    il = document.getElementById( "imgLink" + ( i ) );
    if( i == imgIndex ) {
      il.className = "imgLinkHi";
      il.style.backgroundColor = catColorMain;
    } else {
      il.style.backgroundColor = "#999";
      il.className = "imgLink";
    }
  }
  imgIndex++;
  if( imgIndex == images.length ) {
    imgIndex = 0
  }
}

function jump2img( index ) {
  hideContent();
  if( slideshowState != "stopped" ) {
    stopSlideshow();
  }
  imgIndex = index;
  showImage( path, bgFadeSpeed );
}

function startSlideshow() {
  if( images.length > 1 ) {
    if( slideshowState == "stopped" ) {
      imgIndex = 0;
      slideInterval = window.setInterval( "showImage( path, bgFadeSpeed )", slideIntervalSpeed );
      slideshowState = "playing";
    }
  }
}

function contSlideshow() {
  if( slideshowState == "stopped" ) {
    btnPause = document.getElementById( 'slideShowPause' ).style.display = "block";
    btnCont  = document.getElementById( 'slideShowCont' ).style.display = "none";
    slideInterval = window.setInterval( "showImage( path, bgFadeSpeed )", slideIntervalSpeed );
    slideshowState = "playing";
  }
}

function stopSlideshow() {
  btnPause = document.getElementById( 'slideShowPause' ).style.display = "none";
  btnCont  = document.getElementById( 'slideShowCont' ).style.display = "block";
  window.clearInterval( slideInterval );
  slideshowState = "stopped";
}

function resizeStart() {
  resizeState = "on";
  if( resizeInterval == null ) {
    if( slideshowState == "playing" ) {
      resizeInterval = window.setInterval( "resizeStop()", 500 );
      window.clearInterval( slideInterval );
    }
  }
}

function resizeStop() {
  resizeState = "off";
  window.clearInterval( resizeInterval );
  resizeInterval = null;
  if( slideshowState == "playing" ) {
    slideInterval = window.setInterval( "showImage( path, bgFadeSpeed )", slideIntervalSpeed );
  }
}

$(document).ready(function() {
  //debug = document.getElementById( 'debugOutput' );
  //debug.style.display = "none";

  bgFadeSpeed        = 700;
  imgIndex           = 0;
  resizeInterval     = null;
  resizeState        = null;
  slideInterval      = null;
  slideIntervalSpeed = 10000;
  //slideIntervalSpeed = 3000;
  //naviFadeSpeed      = 200;
  path               = HOST + "content/" + imagesFolder + "/";
  slideshowState     = "disabled"; // stopped | playing | disabled
  slideshowLastState = null;

  if( images.length == 1 ) { // one image in folder
    slideshowState = "disabled"; 
    document.getElementById( "slideshowControls" ).style.display = "none";
    showImage( path, 1000 );
  } else if( images.length > 1 ) { // more than one image in folder
    slideshowState = "stopped";
    document.getElementById( "slideshowControls" ).style.display = "block";
  } else { // no image in folder
    slideshowState = "disabled";
    document.getElementById( "slideshowControls" ).style.display = "none";
  }

  if( slideshowState != "disabled" ) {
    showImage( path, bgFadeSpeed );
    contSlideshow();
  }

  $( '#slideShowStart' ).click( function () {
    if( slideshowState != "disabled" ) {
      startSlideshow();
    }
  } );

  $( '#slideShowStop' ).click( function () {
    if( slideshowState != "disabled" ) {
      stopSlideshow();
    }
  } );

  $( '#slideShowCont' ).click( function () {
    if( slideshowState != "disabled" ) {
      contSlideshow();
    }
  } );
});