/*
-----------------------------------------------------------------------------
TinyDucky.com (Magento Section) JAVASCRIPT Styles

updated:		28 June 2009 
code author:	Clayton Farr
email:			contact@claytonfarr.com
-----------------------------------------------------------------------------*/

// remove default Magento javscript behavior
jQuery(document).ready(function($) {
	$('#nav li').removeAttr('onmouseout').removeAttr('onmouseover');
});

// update product image dependent upon color selection
jQuery(document).ready(function() {

    // On document ready hide all extra images first
    jQuery("#colorOptions img").hide();

	// #attribute76 is the Color attribute selector for the TinyDucky.com installation
    jQuery("#attribute76").change(function() {
        // Hide all images on select element change action
        jQuery("#colorOptions img").hide();

        // Get the value of selected option
        var optionValue = jQuery(this).attr('value');
        // Just a test to see if you're getting option value
        // alert(optionValue);

        // Get the content (aka inner HTML) of selected option
        var optionValueText = jQuery.trim(jQuery('#attribute76 :selected').text());

        // Just a test to see if you're getting right selected option inner text
        // alert('Selected option has value: ' + optionValue + ' and inner text: ' + optionValueText);

        // Show the image based on selected value (note: is case sensitive)
        // alert(optionValueText);
        jQuery("#colorOptions img[alt='" + optionValueText + "']").show();
    });

});