jQuery(document).ready(function($) {


    function bg($parent, urlLeft, urlCenter, urlRight) {
        var $bgDiv = $('<div id="bg">').mousedown(function(e) {
            e.preventDefault();
        });

        $parent.append($bgDiv);

        $bgDiv.append($('<img class="left" src="' + urlLeft + '">').bind('load', function() {
            $bgDiv.append($('<img class="right" src="' + urlRight + '">').bind('load', function() {
                $bgDiv.prepend($('<img class="center" src="' + urlCenter + '">').bind('load', function() {
                    var $imgLeft = $bgDiv.find('img.left');
                    var $imgCenter = $bgDiv.find('img.center');
                    var $imgRight = $bgDiv.find('img.right');
                    var rLeft = $imgLeft.width() / $imgLeft.height();
                    var rCenter = $imgCenter.width() / $imgCenter.height();
                    var rRight = $imgRight.width() / $imgRight.height();

                    bgResize();

                    $(window).resize(function() {
                        bgResize();
                    });

                    $bgDiv.css({
                        visibility: 'visible'
                    });

                    function bgResize() {
                        var winSize = {
                            w: $(window).width(),
                            h: $(window).height()
                        };

                        var wLeft = Math.floor(winSize.h * rLeft);
                        var wCenter = Math.floor(winSize.h * rCenter);
                        var wRight = Math.floor(winSize.h * rRight);

                        var cntCenter = Math.ceil((winSize.w - wLeft - wRight) / wCenter) || 1;

                        $imgLeft.css({
                            width: wLeft,
                            height: winSize.h,
                        });
                        $imgRight.css({
                            width: wRight,
                            height: winSize.h,
                        });

                        var $imgCenterList = $bgDiv.find('img.center');
                        var curCntCenter = $imgCenterList.length;

                        if (curCntCenter > cntCenter) {
                            $bgDiv.find('img.center:gt(' + (cntCenter - 1)+ ')').remove();
                            $imgCenterList = $bgDiv.find('img.center');
                        } else if (curCntCenter < cntCenter) {
                            for (var i = curCntCenter; i < cntCenter; i++) {
                                $bgDiv.prepend($imgCenter.clone());
                            }
                            $imgCenterList = $bgDiv.find('img.center');
                        }

                        $imgCenterList.each(function(index) {
                            $(this).css({
                                left: (wLeft + wCenter * index) + 'px'
                            });
                        }).css({
                            width: wCenter,
                            height: winSize.h
                        });
                    }
                }));
            }));
        }));
    }
});

