$(function() {

    $.preload = function(images, option) {
        var setting = $.extend({
            init: function(loaded, total) {},
            loaded: function(img, loaded, total) {},
            loadedAll: function(loaded, total) {}
        }, option),
        total = images.length,
        loaded = 0;
        setting.init(0, total);
        for (var i = 0; i < total; i++) {
            $('<img />').load(function() {
                loaded++;
                setting.loaded(this, loaded, total);
                if (loaded == total) {
                    setting.loadedAll(loaded, total);
                }
            }).attr('src', images[i]);
        }
    };

    $.fn.inputPlaceholder = function() {
        var value;
        this.focus(function() {
            if ($(this).hasClass('empty')) {
                value = $(this).val();
                $(this).val('').removeClass('empty');
            }
        }).focusout(function() {
            if ($(this).val() == '') {
                $(this).val(value).addClass('empty');
            }
        });
    };

    $.fn.lightbox = function() {
        this.click(function() {
            var lb = $('#lbCont'),
                ct = lb.children('.ct'),
                loader = lb.children('.loader'),
                height = $(document).height(),
                src = $('#stCont .screen ul li:visible a').attr('href');
           $.preload([src], {
                init: function() {
                    lb.height(height).fadeIn().click(function() {
                        $(this).fadeOut('slow', function() {
                            ct.empty().hide();
                        })
                    });
                    loader.fadeIn('fast');
                },
                loaded: function(img, loaded, total) {
                    var width = img.width+6,
                        height = img.height+6;
                    ct.html('<div class="drop-shadow curved curved-h" style="width:'+width+'px;height:'+height+'px;"><img src="'+src+'" alt="" /></div>').fadeIn('slow');
                    loader.fadeOut('fast');
                }
            });
            return false;
        });
    };

    var pointer = 0;

    $('#stCont .control li a').live('click', function() {
        if (!$(this).hasClass('focus')) {
            $('#stCont .control li a').removeClass('focus');
            $(this).addClass('focus');
            var id = ($(this).attr('class').replace('image_', '').split(' '))[0],
                next = $('#stCont .screen ul li:eq('+id+')'),
                visible = $('#stCont .screen ul li:visible');
            if (id > pointer) {
                next.fadeIn('slow', function() {
                    visible.hide();
                });
            } else if (id < pointer) {
                next.show();
                visible.fadeOut('slow');
            }
            pointer = id;
        }
    });

    $('#sbCont input').inputPlaceholder();

    $('#stCont .overlay').lightbox();

    $('#ctCont .slider').slider({
        min: 0,
        max: 40,
        value: 0,
        slide: function(event, ui) {
            var price = $(this).parent('.product').children('input').val()*ui.value,
                totalPrice = 0;
            $(this).parent('.product').children('h4').children('.price').text(price);
            $(this).parent('.product').children('h4').children('.time').text(ui.value);
            $('#ctCont .product h4 .price').each(function() {
                totalPrice += Number($(this).text());
            });
            $('#ctCont .finalPrice span').text(totalPrice);

        }
    });

});