$(function (){
  //bind click function on carrousel links
  $('.carrousel-links a').bind('click',function(){
    var all_links=$('.carrousel-links a');
    var clicked_element=$(this);
    var all_images=$('.carrousel-images a');
    var image_to_appear=$('.carrousel-images a.carrousel'+clicked_element.text());
    //If clicked elements has not the class active active it
    if(!clicked_element.hasClass('active')){
      //Remove the active class from all links
      all_links.removeClass('active');
      //And add it to the clicked element
      clicked_element.addClass('active');
      //Hide the previous image
      all_images.hide();
      //Remove the visible class form those elements
      all_images.removeClass('visible');
      //Show the new one
      image_to_appear.show();
      //Add class visible (height & display:block)
      image_to_appear.addClass('visible');
    }
    clearTimeout(timer);
    setTimeout(changeImage,5000);
    return false;
  });

  //auto-change image in carousel
  timer=setTimeout(changeImage,5000);

  //init the dialog box
  $('.dialog-content').dialog({
    autoOpen:false,
    width:915,
    minHeight:530,
    modal:true,
    draggable:false,
    resizable:false,
    position:'top'
  }); 

  //bind open dialog on a.buy-it clicks
  $('.buy-it').bind('click',function(){
    $('.dialog-content').load($(this).attr('href'), function(){setTimeout('setCustomSelectAfterAjax()',300)});
    $('.dialog-content').dialog('open');
    return false;
  });

  //When click on back it clicks on close dialog
  $('.lightbox-back-link').livequery('click',function(){
    $('.dialog-content').dialog('close');
    return false;
  });
  
  
})

function changeImage(){
    var selected_element=$('.carrousel-links a.active');
    var next_element=selected_element.next();
    if(next_element[0]==undefined){
      next_element=$('.carrousel-links a').eq(0);
    }
    next_element.click();
}

function setCustomSelectAfterAjax(){
  $('select').each(function() 
  {
    if(!$(this).parent().hasClass('enhanced'))
    {
      targetselect = $(this);
      targetselect.hide();

      // set our target as the parent and mark as such
      var target = targetselect.parent();
      target.addClass('enhanced');

      // prep the target for our new markup
      target.append('<dl class="dropdown '+$(this).val()+'"><dt><a class="dropdown_toggle" href="#"></a></dt><dd><div class="options"><ul></ul></div></dd></dl>');
      target.find('.dropdown').css('zIndex',z);
      z--;

      // we don't want to see it yet
      target.find('.options').hide();

      // parse all options within the select and set indices
      var i = 0;
      targetselect.find('option').each(function() 
      {
        // add the option
        target.find('.options ul').append('<li><a href="#"><span class="value">' + $(this).text() + '</span><span class="hidden index">' + i + '</span></a></li>');

        // check to see if this is what the default should be
        if($(this).attr('selected') == true)
        {
          targetselect.parent().find('a.dropdown_toggle').append('<span></span>').find('span').text($(this).text());
        }
        i++;
      });
    }
  });
}

function update_price(quantity,value){
  $("#total_price").html(parseInt(quantity)*value + ' &euro;')
}

