(function( $ ) {
	'use strict';

	// Set Disabled on non available images (check for options)
	$( document.body ).on( 'woocommerce_update_variation_values', function(){
		$('.variations_form select').each(function(i, index) {

			var select = $(this);
			var attributeName = select.prop('id');
			console.log(attributeName);
			// $this.removeClass('woocommerce-attribute-images-variable-option-disabled');
			// $('.woocommerce-attribute-images-variable-option').removeClass('woocommerce-attribute-images-variable-option-disabled');

			$('.woocommerce-attribute-images-variable-option[data-attribute-name="' + attributeName + '"]').each(function(i, index) {
				var $this = $(this);
				var attributeValue = $(this).data('attribute-value');
				var exists = $('.variations_form select[id="' + attributeName + '"]').find('option[value="' + attributeValue + '"]');
				if(exists.length < 1) {
					$this.addClass('woocommerce-attribute-images-variable-option-disabled').removeClass('woocommerce-attribute-images-variable-option-active');
				} else {
					$this.removeClass('woocommerce-attribute-images-variable-option-disabled');
					console.log(exists);
					console.log($this);
					if(exists.is(':selected')) {
						$this.addClass('woocommerce-attribute-images-variable-option-active');
					}
				}
			});
		});
	});

	$(document).ready(function() {

		$('.value .woocommerce-attribute-images-variable-option').on('click', function(e) {
			e.preventDefault();

			var $this = $(this);
			var attributeName = $this.data('attribute-name');

			if($this.hasClass('woocommerce-attribute-images-variable-option-disabled')) {
				return;
			}

			$('.woocommerce-attribute-images-variable-option[data-attribute-name="' + attributeName + '"]').removeClass('woocommerce-attribute-images-variable-option-active');
			$this.addClass('woocommerce-attribute-images-variable-option-active');

			var attributeName = $this.data('attribute-name');
			var attributeValue = $this.data('attribute-value');
			
			var variationsTable = $('.variations');
			var targetSelect = variationsTable.find('select[name="attribute_' + attributeName + '"]');
			
			targetSelect.val(attributeValue).trigger('change');
		});

		$( '.reset_variations' ).on( 'click', function(){
			$('.woocommerce-attribute-images-variable-option').removeClass('woocommerce-attribute-images-variable-option-active');
		});

	} );

})( jQuery );