// jquery.customJScrollPane.js
(function ($) {
    $.fn.customJScrollPane = function () {
        return this.each(function () {
            var $this = $(this).jScrollPane();
            var $b = $this.find('.jspVerticalBar');
            var $c = $this.find('.jspContainer')
            var w = $c.width() -2 -$b.outerWidth();
            $c.css({ width: w, height: $c.height() -2 });
            $c.find('.jspPane').width(w);
            $this.data('jsp').resizeScrollbars();

            $this.find('.jspDrag').height($this.find('.jspDrag').height()-2);
            $this.append($this.find('.jspVerticalBar'));
        });
    };
})(jQuery);


// jquery.swatchSelect.js
(function ($) {
    $.fn.swatchSelect = function () {
        return this.each(function () {
            var $orig = $(this);
            var $swatchSelect = $('<div class="swatchSelect">').addClass($orig.attr('class'));
            var $swatchOptions = $('<div class="swatchOptions">').addClass($orig.attr('class'));
            $orig.after($swatchSelect).hide();
            
            // Create swatchSelect DOM
            var $label = $('<div class="swatchSelect-label">'),
                $value = $('<div class="swatchSelect-value">');
            $swatchSelect.append($label, $value);
            $label.text($orig.find('label').text());
            $value.text($orig.find('option').not('[data-swatch]').text());
            
            // Create swatchOptions DOM
            $swatchOptions.append($swatchSelect.clone());
            $orig.find('option').filter('[data-swatch]').each(function () {
                var $option = $(this);
                $swatchOptions
                    .append(
                        $('<div class="option">')
                            .append('<img src="'+$option.attr('data-swatch')+'" alt="'+$option.text()+'" />')
                            .append('<span>'+$option.text()+'</span>')
                            .data('option', this)
                            .attr('data-value', $option.val())
                            .hover(function () {
                                $orig.trigger('optionHoverIn', [ $option ]);
                            }, function () {
                                $orig.trigger('optionHoverOut');
                            })
                    );
            });
            
            // Methods
            function hideAll() {
                $('body .swatchOptions').detach();
            }
            function hide() {
                $swatchOptions.detach();
            }
            function show() {
                $('body').append($swatchOptions).one('click', hide);
                var swatchSelectOffset = $swatchSelect.offset();
                $swatchOptions.css({
                        left: swatchSelectOffset.left,
                        top: swatchSelectOffset.top +$swatchSelect.outerHeight() -$swatchOptions.outerHeight()
                    });
            }
            function setSelection(option, fromSelectChange) {
                // under the label
                $value.text($(option).text());
                
                // in the options list
                $swatchOptions.find('.option').removeClass('selected');
                $swatchOptions.find('.option[data-value="'+$(option).val()+'"]').addClass('selected');
                
                // the actual piggy-backed select
                $orig.find('select').val($(option).attr('value'));
                if (!fromSelectChange) $orig.find('select').change(); // additionally trigger change, if not already done
            }
            
            // Events
            $swatchSelect.click(function (e) {
                e.stopPropagation();
                hideAll();
                show();
            });
            $swatchOptions.find('.option')
                .click(function () {
                    setSelection($(this).data('option'));
                });
            $orig.find('select').change(function () {
                setSelection($(this).find('option[value="'+$(this).val()+'"]')[0], true);
            });
            
            if ($orig.find('select').val() != '') $orig.find('select').change();
        });
    };
})(jQuery);


// jquery.animatedButton.js
$.fn.animatedButton = function () {
    return this
        .each(function () {
            $(this)
                .html('<span>'+$(this).text()+'<br/>'+$(this).text()+'</span>')
                .find('span').css({ display: 'inline-block', zoom: 1, position: 'relative' });
        })
        .hover(function () {
            $(this)
                .stop(true, true).css({ anim: 0 })
                .animate({ anim: 1 }, { 
                step: function (now, fx) {
                    $(fx.elem).css({ paddingTop: -21*now, backgroundPosition: 'right ' + Math.floor(21*now) + 'px' })
                        .find('span').css({ top: Math.floor(-21*(1-now)) });
                }
            });
        }, function () { });
};


// initialization script
$(function () {
    $('#footer_links a, #social a').click(function (e) {
        e.preventDefault();
        window.open($(this).attr('href'));
    });
    
    $('#content a.button').animatedButton();
});