/**
 * Erweiterungsfunktionen fuer schnuckschnuck.de
 * Bilder-Klick-Farbauswahl, Bild Klick-Vergroessern Details
 * 
 * @copyright Steffen Becker
 * @author Steffen Becker
 */
window.addEvent('domready', function() {  
  
  // Bilder-Array
  var imgs = $$('#extraImgs img.smallImage');
  var colorSelect = $$('select.selectFarbe');
  var options = $$('select.selectFarbe option');
  var bigImg = $('productMainImage');

  if (imgs.length > 0) {
    imgs.each(function(img) {
      img.addEvents({
        'click': function(e) {
          var newSrc = img.get('src');
          // aber aus dem unterordner info_image
          newSrc = newSrc.replace(/popup_images/, 'info_images');
          bigImg.set('src', newSrc);
          // Alle anderen Bilder Rahmen entfernen
          $$('#extraImgs img.smallImage').each(function(i) {
            i.removeClass('activeSmallImage');
          })
          img.addClass('activeSmallImage');
          
          /* Farbauswahlbox. Bei Klick auf Bilder selected-Status und grosses Bild
           * aendern, bei Klick auf select vice versa.
           */
          if (options.length > 0) {
            options[img.get('rel')].set('selected', 'selected');     
          }
        },
        
        'mouseover': function() {
          img.setStyle('background', '#c4c4c4');
        },
        'mouseout': function() {
          img.setStyle('background', '#fff');
        }
      });
    });
  }
  
  // bilder wechseln auch bei select-auswahl
  if (colorSelect) {
    var rel = '';
    colorSelect.addEvent('change', function(e) {
      var opts = colorSelect.getSelected();
      opts.each(function(opt) {
         rel = opt.get('rel');
      });
      var newSrc = '';
      imgs.each(function(img) {
        img.removeClass('activeSmallImage');
        if ( parseInt(img.get('rel')) == rel ) {
          newSrc = img.get('src');
          newSrc = newSrc.replace(/popup_images/, 'info_images');
          bigImg.set('src', newSrc);
          img.addClass('activeSmallImage');
        }
      });
    });
  }
  
});