

var product_medal = {

   fieldsets:null,
   attributes:null,
   colors:['Gold','Silver','Bronze'],
   medal_attrib:null,
   
   load:function(args){

      var self = this;
      $(document).ready(function(){ self.init(); });
   
   },

   init:function() {
    
      var self = this;
      
      this.fieldsets = $("fieldset.gold,fieldset.silver,fieldset.bronze");
      
      var attributes = $("#attributes").find("select,input");
      //$("#attributes").hide(); // moved to end, so #attributes won't disappear if script dies prematurely
            
      self.color_select = attributes.find("option:contains('Medal Color')").parent("select");
      if (!self.color_select.size()) return;
    
      $("input[name=qf_qty]").attr({disabled:'disabled'}).hide().prev("label").hide();

	  attributes.each(function(){ // save initial disabled attributes for later:
	     var attrib = $(this);
		 if (attrib.attr('disabled')=='disabled'){
			 attrib.attr({soldout:'soldout'});
		 }
	  });
	  attributes.attr({disabled:'disabled'}); 

      self.medal_attrib = self.color_select.attr('name');

      var main_img = $("div.switchable img");
      
      self.color_select.find("option[value!='']").each(function(){
      
         var color = $(this).text();
         var option = $(this);

         self.color_select.append(option);
      
      });
      
      self.color_select.find("option[value!='']").each(function(){

         var label = $(this).text();
         var price_add = label.indexOf("($ ");
         var color = (price_add>0) ? label.substring(0,price_add-1) : label;
         var qty = $('input[name=qf_qty]').attr('value');

         var disabled = $(this).is('.disabled') ? 'disabled="disabled"' : '';
		 //console.log(this);
         
         var medal_val = '';

		 //alert(color+" / "+label+": "+attrib.attr('soldout'));
               
         var html = '<fieldset class="medals '+color+'">'
            //+'<div class="images"><a href="'+main_img.attr('src')+'"><img src="'+main_img.attr('src')+'" width="40" /></a></div>'
            +'<div class="images"></div>'
            +'<legend class="'+color+'">'+color+'</legend>';
            
            attributes.each(function(){
               
               var attrib = $(this);
               var attrib_label = attrib.prev("p").text();
               
               if (attrib_label=='Medal Color:') {
                       
                  self.color_select = attrib.find("option:contains('"+color+"')");
                  //html +='<input type="hidden" name="medals['+color+']['+attrib.attr('name')+']" value="'+self.color_select.attr('value')+'" />';
                  html +='<select '+disabled+' style="display:none;" name="medals['+color+']['+attrib.attr('name')+']"><option selected="selected" value="'+self.color_select.attr('value')+'">'+color+'</option></select>';
                  medal_val = self.color_select.attr('value');
               
               } else {
               
                  html +='<div class="attribute-container">'
                       //+ '<p class="heading">'+attrib_label+'</p>'
                       + '<select '+disabled+'name="medals['+color+']['+$(this).attr('name')+']">';
                       
                       $(this).find("option").each(function(){
                           
						   var opt_disabled = ($(this).is(".disabled")) ? 'disabled="disabled"' : '';
                           html += '<option '+opt_disabled+'value="'+this.value+'">'+$(this).text()+'</option>';
                       
                       });
                       
                  html +='</select>'
                       + '</div>';
               
               }
            
            });
                       
         html +='<p><strong>Quantity:</strong> <input class="qf_qty" '+disabled+'type="text" size="3" name="medals['+color+'][qf_qty]" value="0" /></p>';

         html += ''
            + '<small>(<a href>Show large image</a>)</small>'
            //+ '</div>'
            +'</fieldset>';
            
         var html_o = $(html);
         html_o.find("a").click(function(){
         
            var fieldset = $(this).parents("fieldset");
            self.set_option(fieldset,'active',true);
            //window.open('/product_images.php?attribvals='+medal_val,"image","width=200,height=230");
            
            return false;
        
         });
         
         $("#attributes").before(html_o);
         
      });
      $("#attributes").hide();
      
      $("input.qf_qty").change(function(){
         if (this.value>0) {
            $(this).parents("fieldset").addClass('ready');
         } else {
            $(this).parents("fieldset").removeClass('ready');            
         }
      
      });
      
      //$("select[name^=medals]").change(function(){
      $("select").change(function(){
      
         var attrib_id = this.name.substring(this.name.length-5,this.name.length-1);
         
         var fieldset = $(this).parents("fieldset");
         fieldset.find("img").parent("a").hide();

         fieldset.find("select").each(function(n,select){
         
            //if (console!=undefined) console.log(attrib_id + " / " + $(this).attr('value'));
            //fieldset.find("img[rel="+attrib_id+"]").parent("a").hide();
            fieldset.find("#img_"+$(this).attr('value')).parent("a").show();
         
         });
         
         //console.log(fieldset);
         self.set_images(fieldset);
         //console.log($("#img_"+this.value));
         
         //alert(attrib_id);
         //alert(this.value);
      
      });
      
      $("fieldset input,select").click(function(){
         var fieldset = $(this).parents("fieldset");
         self.set_option(fieldset,'active',true);
      });
      $("fieldset").click(function(){
         self.set_option($(this),'active',true);
      });
      
      attributes.each(function(){
      
         var name = $(this).attr('name');
         
         if (name) {
            var attrib_id = name.substr(10);
            self.get_images(attrib_id);
         }

      });
            
   },
   
   get_images:function(attrib_id){
      
      var self = this;
            
      $.getJSON(
         '/product_alt_ajax.php',
         {what:'attrib_images',attrib_ids:attrib_id},
         function(json){
            //console.log(json);
            var imgbox = $("select[name$='[qf_attrib_"+attrib_id+"]']").parents("div").find(".images");

            for (id in json) {

               var img = $('<a href="'+json[id]['src']+'">'
                       + '<img src="'+json[id]['src']+'" id="img_'+id+'" rel="'+attrib_id+'" width="'+json[id]['w_25']+'" height="'+json[id]['h_25']+'" /></a>');
               
               if ('qf_attrib_'+attrib_id==self.medal_attrib) {
                  imgbox.append(img);
               } else {
                  imgbox.prepend(img);
               }
               
               imgbox.find("#img_"+id).parent("a").hide();

            }

            //var fieldset = imgbox.parents("fieldset");
            //self.set_images(fieldset);

         });
      
   },
   
   set_images:function(fieldset){

      //$("div.switchable img").not("#img_default").remove();
      $("div.switchable img")/*.not("#img_default")*/.remove();
      
      //$(fieldset).find("select[name^='medals']").each(function(){
      $(fieldset).find("input,select").each(function(){
         var src = $("#img_"+this.value).attr('src');
         if (!this.value || !src) return;
         var img = '<img src="'+src+'" width="200" />';
         $("div.switchable").prepend(img);
      });

   
   },
   
   set_option:function(fieldset,state,value){

      var self = this;
   
      if (!fieldset) return;
      if (!state) return;
      
      //alert(state+": "+value+": "+attrib_id);
   
      switch (state) {
            
         case 'active':

            if (value) {
               fieldset.siblings("fieldset").removeClass('active');
               fieldset.addClass('active');
               
               self.set_images(fieldset);
               
            } else {
               fieldset.removeClass('active');               
            }

            break;
            
      }
   
   }
    
   
}

product_medal.load();

function oc(a) {
   var o = {};
   for(var i=0;i<a.length;i++) o[a[i]]='';
   return o;
}
