function launchProductImageBrowser( sImageTitle, sImageFullscreenUri)
{
  var sImageFullscreenViewUri = document.getElementById( 'imageFullscreenViewUri' ).value;
  var iDiameter = parseInt( document.getElementById( 'imageFullscreenDiameter' ).value );
  
  window.open( sImageFullscreenViewUri + "?imageUri=" + sImageFullscreenUri + "&title=" + sImageTitle, "_blank", "width=" + iDiameter + ",height=" + iDiameter );
}

function setOpacity(rObject, iOpacity)
{
  iOpacity = (iOpacity == 100) ? 99.999 : iOpacity;
  
  // IE/Win
  rObject.style.filter = "alpha(opacity:" + iOpacity + ")";
  
  // Safari<1.2, Konqueror
  rObject.style.KHTMLOpacity = iOpacity/100;
  
  // Older Mozilla and Firefox
  rObject.style.MozOpacity = iOpacity/100;
  
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  rObject.style.opacity = iOpacity/100;
}

function fadeIn(sObjectId, iOpacity, iPreviewThumbTransactionId/*,  sImageName */)
{
  var rPreviewThumbTransactionId = document.getElementById('previewThumbTransactionId');
  
  // zruseni zobrazeni a fade in obrazku, kdyz mezitim vznikl pozadavek na jiny obrazek
  if( parseInt(rPreviewThumbTransactionId.value) != iPreviewThumbTransactionId )
  {
    //window.alert("Transakce cislo " + iPreviewThumbTransactionId + " - " + sImageName + " byla prerusena.");
    return;
  }
  else
  {
    //window.alert("Transakce cislo " + iPreviewThumbTransactionId + " probehla.");
    if (document.getElementById) {
      rObject = document.getElementById(sObjectId);
      if ( iOpacity <= 100 ) {
        setOpacity( rObject, iOpacity );
        iOpacity += 20;
        window.setTimeout( "fadeIn( '" + sObjectId + "', " + iOpacity + ", " + iPreviewThumbTransactionId + " )", 40 );
      }
    }
  }
}

function imageLoaded(sImageAlt, sImageName, sImageUri, iPreviewThumbTransactionId)
{
  var rPreviewThumbTransactionId = document.getElementById('previewThumbTransactionId');
 
  // zruseni zobrazeni a fade in obrazku, kdyz mezitim vznikl pozadavek na jiny obrazek
  if( parseInt(rPreviewThumbTransactionId.value) != iPreviewThumbTransactionId )
  {
    //window.alert("Transakce cislo " + iPreviewThumbTransactionId + " - " + sImageName + " byla prerusena.");
    return;
  }
  else
  {
    // setup
    var sImageUriBase = document.getElementById('imageUriBase').value;
    var sImageFullscreenSizeDir = document.getElementById('imageFullscreenSizeDir').value;
    var sImageFullscreenUri = sImageUriBase + "/" + ( sImageFullscreenSizeDir ? sImageFullscreenSizeDir + "/" : "" ) + sImageName;
    
    // objekty
    var rLargeImageA = document.getElementById('largeImageA');
    var rLargeImageImg = document.getElementById('largeImageImg');

    // zmena vsech atributu <A ..> velkeho nahledu na karte
    rLargeImageA.title = sImageAlt;
    rLargeImageA.href = sImageFullscreenUri;

    
    /* fce onclick zrusena - nahrazeno thickboxem
    // nastaveni nove akce onclick na velkem nahledu
    rLargeImageA.onclick = function ()
      {
        // launchProductImageBrowser( sImageTitle, sImageUri )
        launchProductImageBrowser( sImageAlt, sImageFullscreenUri )
      }
    ;
    */

    // zmena vsech atributu <IMG .. /> velkeho nahledu na karte
    rLargeImageImg.alt = sImageAlt;
    rLargeImageImg.src = sImageUri;

    // fade in obrazku
    fadeIn('largeImageImg', 0, iPreviewThumbTransactionId /*,  sImageName */);
  }
}

function scrollImages(sDirection)
{
  var iSumImagesVisible = parseInt( document.getElementById( 'sumImagesVisible' ).value );

  // box a tlacitka
  var rInSiteBrowserBox = document.getElementById('inSiteBrowserBox');
  var btnImagesScrollUp = document.getElementById('btnImagesScrollUp');
  var btnImagesScrollDown = document.getElementById('btnImagesScrollDown');
  
  // nastaveni
  var iSumImages = parseInt( document.getElementById('sumImages').value );
  var iSumImagesVisible = parseInt( document.getElementById('sumImagesVisible').value );
  var iBrowseIconDiameter = parseInt(document.getElementById('browseIconDiameter').value);
  var iBrowseIconDistance = parseInt(document.getElementById('browseIconDistance').value);
  var iImageShift = iBrowseIconDiameter + iBrowseIconDistance;
  var minTop = ( iSumImages > iSumImagesVisible ) ? -( ( iSumImages - iSumImagesVisible ) * iImageShift ) : 0; //  max posun boxu nahoru podle celkoveho a zobrazeneho poctu obrazku
  var maxTop = 0; // pozice start hodnoty boxu
  
  // aktualni stav
  if ( isNaN(rInSiteBrowserBox.style.top) )
  {
    var iCssTop = parseInt(rInSiteBrowserBox.style.top);
  }
  else
  {
    var iCssTop = 0;
  }
  // scroll obrazku (zobrazovaci cast)
  switch(sDirection)
  {
    case 'up':
      // nova pozice s kontrolou proti presahu
      var iNewPosition = ( ( iCssTop + iImageShift ) > maxTop ) ? maxTop : ( iCssTop + iImageShift );
      // event. deaktivace resp. aktivace tlacitka [posunout nahoru] resp. [posunout dolu]
      if ( iNewPosition == maxTop ) btnImagesScrollUp.className = 'off';
      if ( iNewPosition > minTop ) btnImagesScrollDown.className = '';
      // posun pres CSS
      rInSiteBrowserBox.style.top = ( iNewPosition + 10 ).toString() + 'px';
    break;
    case 'down':
      // nova pozice s kontrolou proti presahu
      var iNewPosition = ( ( iCssTop - iImageShift ) < minTop ) ? minTop : ( iCssTop - iImageShift );
      // event. aktivace resp. deaktivace tlacitka [posunout nahoru] resp. [posunout dolu]
      if ( iNewPosition < maxTop ) btnImagesScrollUp.className = '';
      if ( iNewPosition == minTop ) btnImagesScrollDown.className = 'off';
      // posun pres CSS
      rInSiteBrowserBox.style.top = ( iNewPosition - 10 ).toString() + 'px';
    break;
    default:
    break;
  }
  
  // oznaceni zobrazenych obrazku
  if( iSumImages > iSumImagesVisible )
  {
    var iFirstImageIndex = Math.abs( iNewPosition / iImageShift ); 
    
    for( i = 0; i < iSumImages; i++ )
    {
      var sElementId = "helpImageMark_" + i;// id divu zobrazujiciho jeden obrazek
      var rHelpImageMark = document.getElementById( sElementId );

      if( iFirstImageIndex <= i && i < ( iFirstImageIndex + iSumImagesVisible ) )
      {
        rHelpImageMark.className = "on";
      }
      else
      {
        rHelpImageMark.className = "off";
      }
    }
  }
}

function scrollMan(sDirection)
{
  var iSumImagesVisible = parseInt( document.getElementById( 'man_sumImagesVisible' ).value );

  // box a tlacitka
  var rInSiteBrowserBox = document.getElementById('man_inSiteBrowserBox');
  var btnImagesScrollUp = document.getElementById('man_btnImagesScrollUp');
  var btnImagesScrollDown = document.getElementById('man_btnImagesScrollDown');
  
  // nastaveni
  var iSumImages = parseInt( document.getElementById('man_sumImages').value );
  var iSumImagesVisible = parseInt( document.getElementById('man_sumImagesVisible').value );
  var iBrowseIconDiameter = parseInt(document.getElementById('man_browseIconDiameter').value);
  var iBrowseIconDistance = parseInt(document.getElementById('man_browseIconDistance').value);
  var iImageShift = iBrowseIconDiameter + iBrowseIconDistance;
  var iImageShift_half = iImageShift/2;
  var minTop = ( iSumImages > iSumImagesVisible ) ? -( ( iSumImages - iSumImagesVisible ) * iImageShift_half ) : 0; //  max posun boxu nahoru podle celkoveho a zobrazeneho poctu obrazku
  var maxTop = 0; // pozice start hodnoty boxu
  
  // aktualni stav
  if ( isNaN(rInSiteBrowserBox.style.top) )
  {
    var iCssTop = parseInt(rInSiteBrowserBox.style.top);
  }
  else
  {
    var iCssTop = 0;
  }
  // scroll obrazku (zobrazovaci cast)
  switch(sDirection)
  {
    case 'up':
      // nova pozice s kontrolou proti presahu
      var iNewPosition = ( ( iCssTop + iImageShift ) > maxTop ) ? maxTop : ( iCssTop + iImageShift );
      // event. deaktivace resp. aktivace tlacitka [posunout nahoru] resp. [posunout dolu]
      if ( iNewPosition == maxTop ) btnImagesScrollUp.className = 'off';
      if ( iNewPosition > minTop ) btnImagesScrollDown.className = '';
      // posun pres CSS
      rInSiteBrowserBox.style.top = ( iNewPosition ).toString() + 'px';
    break;
    case 'down':
      // nova pozice s kontrolou proti presahu
      var iNewPosition = ( ( iCssTop - iImageShift ) < minTop ) ? minTop : ( iCssTop - iImageShift );
      // event. aktivace resp. deaktivace tlacitka [posunout nahoru] resp. [posunout dolu]
      if ( iNewPosition < maxTop ) btnImagesScrollUp.className = '';
      if ( iNewPosition == minTop ) btnImagesScrollDown.className = 'off';
      // posun pres CSS
      rInSiteBrowserBox.style.top = ( iNewPosition ).toString() + 'px';
    break;
    default:
    break;
  }
  
  // oznaceni zobrazenych obrazku
  if( iSumImages > iSumImagesVisible )
  {
    var iFirstImageIndex = Math.abs( iNewPosition / iImageShift ); 
    
    for( i = 0; i < iSumImages; i++ )
    {
      var sElementId = "helpImageMark_" + i;// id divu zobrazujiciho jeden obrazek
      var rHelpImageMark = document.getElementById( sElementId );

      if( iFirstImageIndex <= i && i < ( iFirstImageIndex + iSumImagesVisible ) )
      {
        rHelpImageMark.className = "on";
      }
      else
      {
        rHelpImageMark.className = "off";
      }
    }
  }
}

function previewThumb(sImageAlt, sImageName)
{
  // ihned po zahajeni noveho pozadavku nastavit pozadovany obrazek (prevence presahu zobrazovacich fci)
  var rPreviewThumbTransactionId = document.getElementById('previewThumbTransactionId');
  var iPreviewThumbTransactionId =  parseInt( rPreviewThumbTransactionId.value );
  
  // nastaveni noveho ID trasakce
  rPreviewThumbTransactionId.value = iPreviewThumbTransactionId + 1;
  
  //document.getElementById('testTransaction').innerHTML = rPreviewThumbTransactionId.value;
  
  // reference k A a IMG velkeho nahledu na karte
  var rLargeImageA = document.getElementById('largeImageA');
  var rLargeImageImg = document.getElementById('largeImageImg');
  
  // setup
  var displayedImageName = document.getElementById('displayedImageName'); // XXX
  var sImageUriBase = document.getElementById('imageUriBase').value;
  var sImageSizeDir = document.getElementById('imageLargeSizeDir').value;
  var sImageUri = sImageUriBase + "/" + (sImageSizeDir ? sImageSizeDir + "/" : "") + sImageName;

  // skryti predchoziho obrazku
  setOpacity(rLargeImageImg, 0);
  
  // objekt obrazku
  var oThumb = new Image();
  // nastaveni akce po stazeni do cache
  oThumb.onload = function ()
    {
      imageLoaded(sImageAlt, sImageName, sImageUri, iPreviewThumbTransactionId + 1)
    }
  ;
  oThumb.src = sImageUri;
}