window.onload = function () { if (window.initPNG) { initPNG(); } }

jQuery.noConflict(); 
jQuery( document ).ready(

  function () {

    // preload images
    //initImage();

    // assign default thumbnail click
    jQuery( 'div#divContent div.right div.row img' ).click(

      function () {

        // assign all image opacity/pointer/hover
        jQuery( 'div#divContent div.right div.row img' ).css( 'cursor',  'pointer' );
        jQuery( 'div#divContent div.right div.row img' ).css( 'opacity', '1.0' );
        jQuery( 'div#divContent div.right div.row img' ).hover(
          function () { jQuery( this ).css( 'opacity', '0.7' ); },
          function () { jQuery( this ).css( 'opacity', '1.0' ); }
        );

        // assign this image's opacity/pointer/hover
        jQuery( this ).css( 'cursor',  'auto' );
        jQuery( this ).css( 'opacity', '0.3' );
        jQuery( this ).hover(
          function () { jQuery( this ).css( 'opacity', '0.3' ); },
          function () { jQuery( this ).css( 'opacity', '0.3' ); }
        );

        // display image/text
        jQuery( '#imgItem' ).attr( { src: jQuery( this ).attr( 'src' ).replace( '_tmb', '' ) } );

        // parse item id
        var nItemID = jQuery( this ).attr( 'src' ).replace( /^.*_([0-9]{2})_.*$/, "$1" );        

        // if item detail exists...
        if (jQuery( '#divItem_' + nItemID )) {

          // hide all item details
          jQuery( '#divItem div' ).css( 'display', 'none' );
          jQuery( '#divItem #divItem_' + nItemID ).css( 'display', 'block' );
        }
      }
    );

    // assign default thumbnail hover
    jQuery( 'div#divContent div.right div.row img' ).hover(
      function () { jQuery( this ).css( 'opacity', '0.7' ); },
      function () { jQuery( this ).css( 'opacity', '1.0' ); }
    );

    // set first thumbnail attributes
    jQuery( 'div#divContent div.right > div:first > img:first' ).css( 'cursor',  'auto' );
    jQuery( 'div#divContent div.right > div:first > img:first' ).css( 'opacity', '0.3' );
    jQuery( 'div#divContent div.right > div:first > img:first' ).hover(
      function () { jQuery( this ).css( 'opacity', '0.3' ); },
      function () { jQuery( this ).css( 'opacity', '0.3' ); }
    );
  }
);

function initImage() {

  var aImage = document.getElementsByTagName( 'img' );

  // loop images...  
  for (var i = 0; i < aImage.length; i++) {
    if (aImage[i].src.match( '_tmb' ) != null) {
      var oImage = new Image();
      oImage.src = aImage[i].src.replace( /\_tmb/, '' );
    }
  }
}
