$j(document).ready(function($) {
    $j('.home-page-carousel .carousel-image').first().css({
        'opacity': '1'
    }).siblings({
        'opacity': '0'
    });
    $j('.home-page-carousel').carousel({
        'pageSelector': '.carousel-image',
        'updateFunction': function(carousel) {
            var config = $j(carousel).data('config');
            var position = parseInt($j(carousel).data("position"));

            $j('.carousel-image.active', carousel).animate({'opacity': '0'}, config.speed).removeClass('active');
            $j('.carousel-image', carousel).eq(position).animate({'opacity': '1'}, config.speed).addClass('active');
        },
        'speed': 1000
    });

    $j('.chip-selector').carousel({
        'interval': 0
    });

    $j('.chip-selector').hide().first().show();
    $j('#chip-selector .tabs li').first().addClass('active');

    $j('.chip-selector li.item').click(function() {
        var sample = this;
        var product_id = $j(this).attr('rel');
        var not_in_use = true;
        
        $j('.selected-samples li.sample').each(function() {
            if ($j(this).data('id') == product_id) {
                not_in_use = false;
            }
        });

        if (not_in_use) {
            // add to list
            // check if full
            $j('.selected-samples li.sample:not(.used)').first().each(function() {
                $j('img', this).attr('src', $j('img', sample).attr('src')).fadeIn();
                $j('.title', this).text($j('.title', sample).text());
                $j('.sku', this).text($j('.sku', sample).text());
                $j('input', this).val(product_id);
                $j(this).data('id', product_id);
                $j(this).addClass('used');
                var remove_button = $j('<span class="remove">X</span>');
                
                remove_button.click(function() {
                    var sample = $j(this).parents('li.sample');
                    sample.data('id', null).removeClass('used');
                    $j('img', sample).fadeOut();
                    $j('.title', sample).text('');
                    $j('.sku', sample).text('');
                    $j('input', sample).val('');
                    $(this).remove();
                });
                
                $j('.image', this).append(remove_button);

            });
        }
    });

    $j('.extras-room-design ul li button.include-in-cart').click(function(e) {
        e.preventDefault();

        var product_id = $j(this).attr('rel');
        $j(this).siblings('input').val(product_id);
        $j(this).parent().fadeOut();
        return false;
    });

    $j('.more-views a').click(function() {
        $j('#image').attr('src', $j(this).attr('rel'));
    });

    $j('.reveal-more').click(function() {
        if ($(this).hasClass('hide-more')) {
            $j(this).removeClass('hide-more').text('More...');
            var $list = $j(this).parent().next('.room-product-list');
            $j('.hidden', $list).fadeOut();
        } else {
            $j(this).addClass('hide-more').text('Less...');
            var $list = $j(this).parent().next('.room-product-list');
            $j('.hidden', $list).fadeIn();
        }
    });
    
    $j('a[rel="gallery"]').colorbox();

//    $(document).pngFix();
//    $(".tabs li a").pngFix();

});