/*!
* Tiny Scrollbar 1.65
* http://www.baijs.nl/tinyscrollbar/
*
* Copyright 2010, Maarten Baijs
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://www.opensource.org/licenses/mit-license.php
* http://www.opensource.org/licenses/gpl-2.0.php
*
* Date: 10 / 05 / 2011
* Depends on library: jQuery
* 
*/

(function ($) {
    $.tiny = $.tiny || {};

    $.tiny.scrollbar = {
        options: {
            axis: 'y', // vertical or horizontal scrollbar? ( x || y ). 
            wheel: 40,  //how many pixels must the mouswheel scroll at a time.
            scroll: true, //enable or disable the mousewheel;
            size: 'auto', //set the size of the scrollbar to auto or a fixed number.
            sizethumb: 'auto', //set the size of the thumb to auto or a fixed number.
            usedisable: true,
            scrolltarget: '',
            pageid: '',
            horizon: false,
            autosize: false
        }
    };

    $.fn.tinyscrollbar = function (options) {
        var options = $.extend({}, $.tiny.scrollbar.options, options);
        this.each(function () {
            $(this).data('tsb', new Scrollbar($(this), options));
        });
        return this;
    };

    $.fn.tinyscrollbar_update = function (sScroll) { return $(this).data('tsb').update(sScroll); };

    function Scrollbar(root, options) {
        var oSelf = this;
        var oWrapper = root;

        var obj = convertForm();

        if (!!obj) {
            root = obj;
        }

        var oViewport = { obj: $('.viewport', root) };
        var oContent = { obj: $('.overview', root) };
        var oScrollbar = { obj: $('.scrollbar', root) };
        var oTrack = { obj: $('.track', oScrollbar.obj) };
        var oThumb = { obj: $('.thumb', oScrollbar.obj) };

        var oTrack_horizon, oThumb_horizon;

        var sAxis, sDirection, sSize;
        var secondAxis, secondDirection, secondSize;
        var secondAxis = options.horizon;
        var secondOScrollbar;

        if (secondAxis) {
            sAxis = false, sDirection = sAxis ? 'left' : 'top', sSize = sAxis ? 'Width' : 'Height';
            secondDirection = 'left', secondSize = 'Width';
            secondOScrollbar = { obj: $('.scrollbar_horizon', root) };
            oTrack_horizon = { obj: $('.track_horizon', secondOScrollbar.obj) };
            oThumb_horizon = { obj: $('.thumb_horizon', secondOScrollbar.obj) };

        } else {
            sAxis = options.axis == 'x', sDirection = sAxis ? 'left' : 'top', sSize = sAxis ? 'Width' : 'Height';
        }

        var iScroll, iPosition = { start: 0, now: 0 }, iMouse = {};

        var iScroll_horizon, iPosition_horizon = { start: 0, now: 0 }, iMouse_horizon = {};

        /* Customazing Scroller */
        function convertForm() {

            if (!!options.scrolltarget) {
                oWrapper.addClass("scrollbar_1")
				.find(options.scrolltarget).addClass("overview").wrap($("<div class='viewport'></div>"))
				.end().children()
				.first()
				.before($('<div class="scrollbar"><div class="track"><div class="thumb"> </div></div></div>'));
                return null;

            } else {

                oWrapper
					.addClass("viewport")
					.wrapInner($("<div>", { "class": "overview" }))
					.wrap($("<div>", { "id": "scroll-id", "class": "scrollbar_1" }));

                oWrapper = oWrapper.parent();
                oWrapper.children(".viewport").before($('<div class="scrollbar"><div class="track"><div class="thumb"> </div></div></div>'));

                if (options.horizon) {
                    oWrapper.find(".viewport").after($('<div class="scrollbar_horizon"><div class="track_horizon"><div class="thumb_horizon"> </div></div></div>'));
                }

                return oWrapper;
            }

        }

        function initialize() {
            setTimeout(function () {
                if (options.horizon) {

                    // 세로 스크롤 에 추가적인 가로 스크롤 처리
                    oSelf.update_horizon();
                    setEvents_horizon();

                    // 가로 스크롤 초기값 설정
                    iPosition_horizon.now = Math.round((secondOScrollbar.obj.width() - oThumb_horizon.obj.width()) / 2);

                    iScroll_horizon = iPosition_horizon.now * secondOScrollbar.ratio;
                    oContent.obj.css(secondDirection, -iScroll_horizon);
                    oThumb_horizon.obj.css(secondDirection, iPosition_horizon.now);

                    if (oContent.obj.width() < oViewport.obj.width()) {
                        oContent.obj.width(oViewport.obj.width());
                    }
                }

                // 세로 or 가로 스크롤 처리
                oSelf.update();
                setEvents();

                if (options.pageid === "ticket_seat" && options.axis === "y") {
                    oWrapper.find(".thumb").html('<img src="/Images/ticket/btn/btn_scroll_up.png" />'
							+ '<img src="/Images/ticket/btn/btn_scroll_down.png" style="margin-top:' + (oThumb[options.axis] - 23) + 'px;" />');
                }

                if (options.pageid === "ticket_seat" && !!options.horizon) {
                    oWrapper.find(".thumb_horizon").html('<img src="/Images/ticket/btn/btn_scroll_left.png" />'
							+ '<img src="/Images/ticket/btn/btn_scroll_right.png" style="margin-left:' + (oThumb_horizon['x'] - 23) + 'px;" />');
                }

                if (options.autosize == true) {
                    oScrollbar.obj.css({ "margin-left": (oWrapper.find(".viewport").width() + 2 - oScrollbar.obj.width()) + "px" });
                }

            }, 100);

            return oSelf;
        }
        this.update = function (sScroll) {
            oViewport[options.axis] = oViewport.obj[0]['offset' + sSize];

            oContent[options.axis] = oContent.obj[0]['scroll' + sSize];

            oContent.ratio = oViewport[options.axis] / oContent[options.axis];

            /* When you have no item in component, can choose scroll visibility. */
            if (!options.usedisable) {
                oScrollbar.obj.find(".thumb").toggleClass('disable', oContent.ratio >= 1);
            } else {
                oScrollbar.obj.toggleClass('disable', oContent.ratio >= 1);
            }
            oTrack[options.axis] = options.size == 'auto' ? oViewport[options.axis] : options.size;
            oThumb[options.axis] = Math.min(oTrack[options.axis], Math.max(0, (options.sizethumb == 'auto' ? (oTrack[options.axis] * oContent.ratio) : options.sizethumb)));

            oScrollbar.ratio = options.sizethumb == 'auto' ? (oContent[options.axis] / oTrack[options.axis]) : (oContent[options.axis] - oViewport[options.axis]) / (oTrack[options.axis] - oThumb[options.axis]);
            iScroll = (sScroll == 'relative' && oContent.ratio <= 1) ? Math.min((oContent[options.axis] - oViewport[options.axis]), Math.max(0, iScroll)) : 0;
            iScroll = (sScroll == 'bottom' && oContent.ratio <= 1) ? (oContent[options.axis] - oViewport[options.axis]) : isNaN(parseInt(sScroll)) ? iScroll : parseInt(sScroll);

            setSize();
        };
        function setSize() {
            oThumb.obj.css(sDirection, iScroll / oScrollbar.ratio);
            oContent.obj.css(sDirection, -iScroll);
            iMouse['start'] = oThumb.obj.offset()[sDirection];
            var sCssSize = sSize.toLowerCase();
            oScrollbar.obj.css(sCssSize, oTrack[options.axis]);
            oTrack.obj.css(sCssSize, oTrack[options.axis]);
            oThumb.obj.css(sCssSize, oThumb[options.axis]);
        };

        function setEvents() {
            oThumb.obj.bind('mousedown', start);
            oThumb.obj[0].ontouchstart = function (oEvent) {
                oEvent.preventDefault();
                oThumb.obj.unbind('mousedown');
                start(oEvent.touches[0]);
                return false;
            };
            oTrack.obj.bind('mouseup', drag);
            if (options.scroll && this.addEventListener) {
                oWrapper[0].addEventListener('DOMMouseScroll', wheel, false);
                oWrapper[0].addEventListener('mousewheel', wheel, false);
            }
            else if (options.scroll) { oWrapper[0].onmousewheel = wheel; }
        };

        function start(oEvent) {
            iMouse.start = sAxis ? oEvent.pageX : oEvent.pageY;
            var oThumbDir = parseInt(oThumb.obj.css(sDirection));
            iPosition.start = oThumbDir == 'auto' ? 0 : oThumbDir;
            $(document).bind('mousemove', drag);
            document.ontouchmove = function (oEvent) {
                $(document).unbind('mousemove');
                drag(oEvent.touches[0]);
            };
            $(document).bind('mouseup', end);
            oThumb.obj.bind('mouseup', end);
            oThumb.obj[0].ontouchend = document.ontouchend = function (oEvent) {
                $(document).unbind('mouseup');
                oThumb.obj.unbind('mouseup');
                end(oEvent.touches[0]);
            };
            return false;
        };

        function wheel(oEvent) {
            if (!(oContent.ratio >= 1)) {
                oEvent = $.event.fix(oEvent || window.event);
                var iDelta = oEvent.wheelDelta ? oEvent.wheelDelta / 120 : -oEvent.detail / 3;
                iScroll -= iDelta * options.wheel;
                iScroll = Math.min((oContent[options.axis] - oViewport[options.axis]), Math.max(0, iScroll));
                oThumb.obj.css(sDirection, iScroll / oScrollbar.ratio);
                oContent.obj.css(sDirection, -iScroll);
                oEvent.stopPropagation();
                oEvent.preventDefault();
                oEvent.cancelBubble = false;
            };
        };
        function end(oEvent) {
            $(document).unbind('mousemove', drag);
            $(document).unbind('mouseup', end);
            oThumb.obj.unbind('mouseup', end);
            document.ontouchmove = oThumb.obj[0].ontouchend = document.ontouchend = null;
            return false;
        };
        function drag(oEvent) {
            if (!(oContent.ratio >= 1)) {
                iPosition.now = Math.min((oTrack[options.axis] - oThumb[options.axis]), Math.max(0, (iPosition.start + ((sAxis ? oEvent.pageX : oEvent.pageY) - iMouse.start))));
                iScroll = iPosition.now * oScrollbar.ratio;
                oContent.obj.css(sDirection, -iScroll);
                oThumb.obj.css(sDirection, iPosition.now);
            }
            return false;
        };

        // 이하는 가로 스크롤처리
        this.update_horizon = function (sScroll) {
            oViewport['x'] = oViewport.obj[0]['offset' + secondSize];
            oContent['x'] = oContent.obj[0]['scroll' + secondSize];
            oContent.ratio = oViewport['x'] / oContent['x'];

            /* When you have no item in component, can choose scroll visibility. */
            if (!options.usedisable) {
                secondOScrollbar.obj.find(".thumb_horizon").toggleClass('disable', oContent.ratio >= 1);
            } else {
                secondOScrollbar.obj.toggleClass('disable', oContent.ratio >= 1);
            }

            oTrack_horizon['x'] = options.size == 'auto' ? oViewport['x'] : options.size;
            oThumb_horizon['x'] = Math.min(oTrack_horizon['x'], Math.max(0, (options.sizethumb == 'auto' ? (oTrack_horizon['x'] * oContent.ratio) : options.sizethumb)));

            secondOScrollbar.ratio = options.sizethumb == 'auto' ? (oContent['x'] / oTrack_horizon['x']) : (oContent['x'] - oViewport['x']) / (oTrack_horizon['x'] - oThumb_horizon['x']);
            iScroll_horizon = (sScroll == 'relative' && oContent.ratio <= 1) ? Math.min((oContent['x'] - oViewport['x']), Math.max(0, iScroll_horizon)) : 0;
            iScroll_horizon = (sScroll == 'bottom' && oContent.ratio <= 1) ? (oContent['x'] - oViewport['x']) : isNaN(parseInt(sScroll)) ? iScroll_horizon : parseInt(sScroll);

            setSize_horizon();
        };

        function setSize_horizon() {
            oThumb_horizon.obj.css(secondDirection, iScroll_horizon / secondOScrollbar.ratio);
            oContent.obj.css(secondDirection, -iScroll_horizon);
            iMouse_horizon['start'] = oThumb_horizon.obj.offset()[secondDirection];
            var sCssecondSize = secondSize.toLowerCase();

            secondOScrollbar.obj.css(sCssecondSize, oTrack_horizon['x']);
            oTrack_horizon.obj.css(sCssecondSize, oTrack_horizon['x']);
            oThumb_horizon.obj.css(sCssecondSize, oThumb_horizon['x']);
        };

        function setEvents_horizon() {
            oThumb_horizon.obj.bind('mousedown', start_horizon);
            oThumb_horizon.obj[0].ontouchstart = function (oEvent) {
                oEvent.preventDefault();
                oThumb_horizon.obj.unbind('mousedown');
                start_horizon(oEvent.touches[0]);
                return false;
            };
            oTrack_horizon.obj.bind('mouseup', drag_horizon);
        };

        function start_horizon(oEvent) {
            iMouse_horizon.start = oEvent.pageX;

            var oThumbDir = parseInt(oThumb_horizon.obj.css(secondDirection));
            iPosition_horizon.start = oThumbDir == 'auto' ? 0 : oThumbDir;
            $(document).bind('mousemove', drag_horizon);
            document.ontouchmove = function (oEvent) {
                $(document).unbind('mousemove');
                drag_horizon(oEvent.touches[0]);
            };
            $(document).bind('mouseup', end_horizon);
            oThumb_horizon.obj.bind('mouseup', end_horizon);
            oThumb_horizon.obj[0].ontouchend = document.ontouchend = function (oEvent) {
                $(document).unbind('mouseup');
                oThumb_horizon.obj.unbind('mouseup');
                end_horizon(oEvent.touches[0]);
            };
            return false;
        };

        function end_horizon(oEvent) {
            $(document).unbind('mousemove', drag_horizon);
            $(document).unbind('mouseup', end_horizon);
            oThumb_horizon.obj.unbind('mouseup', end_horizon);
            document.ontouchmove = oThumb_horizon.obj[0].ontouchend = document.ontouchend = null;
            return false;
        };
        function drag_horizon(oEvent) {
            if (!(oContent.ratio >= 1)) {
                iPosition_horizon.now = Math.min((oTrack_horizon['x'] - oThumb_horizon['x']), Math.max(0, (iPosition_horizon.start + (oEvent.pageX - iMouse_horizon.start))));
                iScroll_horizon = iPosition_horizon.now * secondOScrollbar.ratio;
                oContent.obj.css(secondDirection, -iScroll_horizon);
                oThumb_horizon.obj.css(secondDirection, iPosition_horizon.now);
            }
            return false;
        };

        return initialize();
    };
})(jQuery);

$(document).ready(function () {

    $(".sectionA:visible .scrollWrap").each(function (i) {
        //	$(".pScrollWrap").each(function(i){
        $(this).tinyscrollbar({
            sizethumb: 40,
            usedisable: true
        });
    });

    $("div.seatArray").tinyscrollbar({
        usedisable: true,
        pageid: "ticket_seat",
        axis: "y",
        horizon: true
    });

    $("#ticketWrap").find("div.payHiA").each(function () {
        $(this).tinyscrollbar({
            sizethumb: 43,
            usedisable: false
        });
    });

    $(".payHiB").tinyscrollbar({
        sizethumb: 43,
        usedisable: false
    });

    //	$("#header .scrollWrap").tinyscrollbar({
    //		sizethumb:40,
    //		usedisable:true
    //	});
});