var baseUrl = window.location.protocol + "//" + window.location.host + "/";

var handleOfferSlider = {

    pageId: 0,
    totalPages: 0,
    width: 0,
    btnBack: "",
    btnNext: "",
    container: "",
    element: "",
    method: null,
    methodName: "",
    downloadedContent: [],
    clickActivate: false,
    Clone: function ()
    {

        //var newObject = JQ.extend({}, handleOfferSlider);
        var newObject = JQ.extend(true, {}, handleOfferSlider);
        return newObject;

    },
    init: function (container, method, pageSize, autoSelectFirst)
    {

        if (!pageSize)
            pageSize = 4

        var se = container + " .thumbs ul";
        this.element = JQ(se);

        se = se + " > li";

        this.totalPages = Math.ceil((JQ(se).length) / pageSize);

        if (JQ(container).parents("#left-pane").length > 0)
            this.width = 544;
        else
            this.width = 290;

        var btn = container + " .scroller";
        this.btnBack = JQ(btn + " .pleft");
        this.btnNext = JQ(btn + " .pright");
        this.container = JQ(container);

        this.element.css({ "width": (this.width * this.totalPages) + "px" });
        this.handlebtnNext();
        this.handlebtnBack();
        var as = se + " > a";
        this.handleThumbClick(as);
        this.buttonManager();

        this.methodName = method;
        switch (method)
        {
            case "gallery":
                this.method = BuildGalleryMarkup;
                break;
            case "proplayer":
                this.method = BuildProPlayerMarkup;
                break;
            case "amateurplayer":
                this.method = BuildAmateurPlayerMarkup;
                break;
            case "qualifiervenue":
                this.method = BuildQualifierVenueMarkup;
                break;
            case "review":
                this.method = BuildReviewMarkup;
                break;
            case "partner":
            case "charity":
                this.method = BuildCharityMarkup;
                break;
        }
        var auto = true;
        if (autoSelectFirst != undefined)
        {
            auto = autoSelectFirst;
        }
        if (auto == true)
        {
            JQ(as + ":first").trigger("click");
        }
    },

    buttonManager: function ()
    {
        this.btnBack.removeClass("deactivated");
        this.btnNext.removeClass("deactivated");

        var last = this.totalPages - 1;

        if (this.pageId == 0)
            this.btnBack.addClass("deactivated");

        if (this.pageId == last)
            this.btnNext.addClass("deactivated");
    },

    handlebtnNext: function ()
    {

        var that = this;

        that.btnNext.click(function ()
        {

            if (!that.btnNext.hasClass("deactivated") && that.clickActivate == false)
            {
                that.clickActivate = true;
                that.element.animate({ marginLeft: -((that.pageId + 1) * that.width) + "px" }, 1200, "easeOutCubic", function () { that.clickActivate = false; });
                that.pageId += 1;
                that.buttonManager();
            }

            return false;

        });

    },

    handlebtnBack: function ()
    {

        var that = this;
        that.btnBack.click(function ()
        {

            if (!that.btnBack.hasClass("deactivated") && that.clickActivate == false)
            {
                that.clickActivate = true;
                that.element.animate({ marginLeft: -((that.pageId - 1) * that.width) + "px" }, 1200, "easeOutCubic", function () { that.clickActivate = false; });
                that.pageId -= 1;
                that.buttonManager();
            }

            return false;

        });

    },

    handleThumbClick: function (ele)
    {
        var that = this;
        JQ(ele).click(function ()
        {
            var a = JQ(this);
            var ph = JQ(".preview", that.container);

            ph.fadeOut("fast", function ()
            {

                //that.showPreLoader(ph);

                var id = a.attr("dbid");

                if (that.downloadedContent[id] != undefined)
                {
                    that.displayContent(that.downloadedContent[id]);
                }
                else
                {
                    that.downloadData(id, function (data)
                    {
                        if (data == undefined)
                            that.displayContent({ Caption: '', Large: '/Sitefinity/WebsiteTemplates/EmiratesInvitational/App_Themes/Default/Images/Generic/ajax-error-preview.jpg' });
                        else
                        {
                            that.downloadedContent[id] = data;
                            that.displayContent(data);
                        }
                    });
                }

            });
            //var li = JQ(this).parent();
            //var that = JQ(".Data", li);

            //JQ(".preview", li.parents(".widget")).fadeOut("fast", function () {
            //    JQ(".preview", li.parents(".widget")).html(that.html());
            //    JQ(".preview", li.parents(".widget")).fadeIn("slow");

            return false;

        });
    },

    //    showPreLoader: function (placeHolder) {
    //        placeHolder.empty();
    //        placeHolder.append("<div class='ajaxloader' />");
    //    },

    displayContent: function (data)
    {
        var loader = JQ(".ajaxloader", this.container);
        loader.css("display", "none");

        var markup = this.method(data);
        var ph = JQ(".preview", this.container);
        ph.empty();
        for (var a = 0; a < markup.length; a++)
        {
            ph.append(markup[a]);
        }

        ph.fadeIn("slow");

        //        Shadowbox.setup("a.sb", {
        //            gallery: "Images",
        //            autoplayMovies: true
        //        });

        //CufonNow();
    },

    downloadData: function (id, cakllBack)
    {
        var loader = JQ(".ajaxloader", this.container);
        loader.css("display", "block");

        var path = baseUrl + "AjaxHandler.ashx?method=" + this.methodName + "&id=" + id;

        JQ.ajax({ url: path, cache: false, data: id, dataType: 'application/json',
            success: function (data, textStatus, XMLHttpRequest)
            {
                eval("var dataObj = " + data);
                cakllBack(dataObj);
            },
            error: function (XMLHttpRequest, textStatus, errorThrown)
            {
                cakllBack(undefined);
            }
        });
    }
}

function BuildGalleryMarkup(data)
{
    var arr = new Array();

    if (data.Caption.length != 0)
    {
        var div = JQ("<div class='ImgCaption' />").html(data.Caption);
        arr.push(div);
    }


    var img = JQ("<img width='530' height='175' />").attr("src", data.Medium);


    arr.push(img);

    return arr;
}

function BuildProPlayerMarkup(data)
{
    var arr = new Array();

    var img = JQ("<img width='530' height='175' />").attr("src", data.Medium);

    img.hover(function ()
    {
        $(this).parent().find("div.overlay").animate({ right: -260 }, { duration: 500, queue: false }, "easeOutCubic");
    }, function ()
    {
        $(this).parent().find("div.overlay").animate({ right: 0 }, { duration: 500, queue: false }, "easeOutCubic");
    });

    var divoverlay = JQ("<div class='overlay'></div>");
    divoverlay.append(JQ("<div class='bg'></div>"));
    var divdetails = JQ("<div class='details'></div>");
    divoverlay.append(divdetails);
    divdetails.append(JQ("<h6></h6>").html(data.Name));

    var tbl;
    var tr;

    var divbio = JQ("<div class='DTableContainer'></div>")
    divdetails.append(divbio);

    var divstats = JQ("<div class='DTableContainer flexcroll hide'></div>")
    divdetails.append(divstats);
    tbl = JQ("<table class='bio' cellpadding='0' cellspacing='0' border='0'></table>");

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>OWGR</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.OWGR));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Race To Dubai</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.RaceToDubai));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Money Won</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.MoneyWon));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Driving Distance</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.DrivingDistance));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Green in Reg</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.GreenInReg));
    tbl.append(tr);

    divstats.append(tbl);

    var divresults = JQ("<div class='DTableContainer flexcroll hide'></div>")
    divdetails.append(divresults);
    //contents for results
    tbl = JQ("<table class='results' cellpadding='0' cellspacing='0' border='0'></table>");

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'><strong>Year</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Position</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Score</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Prize Money</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Charity Donation</strong></td>"));

    tbl.append(tr);

    for (var a = 0; a < data.Results.length; a++)
    {
        tr = JQ("<tr></tr>");
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Year));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Position));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Score));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].PrizeMoney));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].CharityDonation));
        tbl.append(tr);
    }

    divresults.append(tbl);


    var ol = JQ("<ol class='morelinks' />");
    ol.append(JQ("<li class='mlactive'>Biography</li>").click(function ()
    {
        if (!JQ(this).hasClass("mlactive"))
        {
            var ol = JQ(this).parent();
            ol.children().removeClass("mlactive");
            JQ(this).addClass("mlactive");

            var divs = JQ("div.DTableContainer", ol.parent());
            divs.addClass("hide");
            divs.eq(0).removeClass("hide");
        }
    }));

    ol.append(JQ("<li>Statistics</li>").click(function ()
    {
        if (!JQ(this).hasClass("mlactive"))
        {
            var ol = JQ(this).parent();
            ol.children().removeClass("mlactive");
            JQ(this).addClass("mlactive");

            var divs = JQ("div.DTableContainer", ol.parent());
            divs.addClass("hide");
            divs.eq(1).removeClass("hide");
        }
    }));
    ol.append(JQ("<li>Results</li>").click(function ()
    {
        if (!JQ(this).hasClass("mlactive"))
        {
            var ol = JQ(this).parent();
            ol.children().removeClass("mlactive");
            JQ(this).addClass("mlactive");

            var divs = JQ("div.DTableContainer", ol.parent());
            divs.addClass("hide");
            divs.eq(2).removeClass("hide");
        }
    }));


    divdetails.append(ol);
    if (data.Caption.length > 0)
    {
        var enlarge = $("<div class='EnImage'><a href='" + data.Link + "' class='sb' target='_blank'>" + data.Caption + "</a></div>");
        divdetails.append(enlarge);
    }

    arr.push(img);
    arr.push(divoverlay);

    return arr;
}

function BuildAmateurPlayerMarkup(data)
{
    var arr = new Array();

    var img = JQ("<img width='530' height='175' />").attr("src", data.Medium);

    img.hover(function ()
    {
        $(this).parent().find("div.overlay").animate({ right: -260 }, { duration: 500, queue: false }, "easeOutCubic");
    }, function ()
    {
        $(this).parent().find("div.overlay").animate({ right: 0 }, { duration: 500, queue: false }, "easeOutCubic");
    });

    var divoverlay = JQ("<div class='overlay'></div>");
    divoverlay.append(JQ("<div class='bg'></div>"));
    var divdetails = JQ("<div class='details'></div>");
    divoverlay.append(divdetails);
    divdetails.append(JQ("<h6></h6>").html(data.Name));

    var tbl;
    var tr;

    var divbio = JQ("<div class='DTableContainer'></div>")
    divdetails.append(divbio);
    tbl = JQ("<table class='bio' cellpadding='0' cellspacing='0' border='0'></table>");

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Nationality</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.Nationality));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Country of Residence</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.CountryOfResidence));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Handicap</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.HandiCap));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'>Home Club</td>"));
    tr.append(JQ("<td valign='top'></td>").html(data.HomeClub));
    tbl.append(tr);

    divbio.append(tbl);

    var divresults = JQ("<div class='DTableContainer flexcroll hide'></div>")
    divdetails.append(divresults);
    //contents for results
    tbl = JQ("<table class='results' cellpadding='0' cellspacing='0' border='0'></table>");

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td valign='top'><strong>Year</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Position</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Pro Partner</strong></td>"));
    tr.append(JQ("<td valign='top'><strong>Score</strong></td>"));

    tbl.append(tr);

    for (var a = 0; a < data.Results.length; a++)
    {
        tr = JQ("<tr></tr>");
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Year));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Position));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].ProPartner));
        tr.append(JQ("<td valign='top'></td>").html(data.Results[a].Score));

        tbl.append(tr);
    }

    divresults.append(tbl);


    var ol = JQ("<ol class='morelinks' />");
    ol.append(JQ("<li class='mlactive'>BioGraphy</li>").click(function ()
    {
        if (!JQ(this).hasClass("mlactive"))
        {
            var ol = JQ(this).parent();
            ol.children().removeClass("mlactive");
            JQ(this).addClass("mlactive");

            var divs = JQ("div.DTableContainer", ol.parent());
            divs.addClass("hide");
            divs.eq(0).removeClass("hide");
        }
    }));

    ol.append(JQ("<li>Results</li>").click(function ()
    {
        if (!JQ(this).hasClass("mlactive"))
        {
            var ol = JQ(this).parent();
            ol.children().removeClass("mlactive");
            JQ(this).addClass("mlactive");

            var divs = JQ("div.DTableContainer", ol.parent());
            divs.addClass("hide");
            divs.eq(2).removeClass("hide");
        }
    }));


    divdetails.append(ol);
    if (data.Caption.length > 0)
    {
        var enlarge = $("<div class='EnImage'><a href='" + data.Link + "' class='sb' >" + data.Caption + "</a></div>");
        divdetails.append(enlarge);
    }

    arr.push(img);
    arr.push(divoverlay);

    return arr;
}

function BuildReviewMarkup(data)
{
    var arr = new Array();

    if (data.Name.length != 0)
    {
        var div = JQ("<div class='ImgCaption' />").html(data.Name);
        arr.push(div);
    }

    var img = JQ("<img width='530' height='175' />").attr("src", data.Medium);

    arr.push(img);

    var t = $(this.container.selector + "det").html();

    var det = $(t);

    arr.push(det);

    return arr;
}

function BuildQualifierVenueMarkup(data)
{
    var arr = new Array();
    var img = JQ("<img width='530' height='175' />").attr("src", data.Medium);

    img.hover(function ()
    {
        $(this).parent().find("div.overlay").animate({ right: -260 }, { duration: 500, queue: false }, "easeOutCubic");
    }, function ()
    {
        $(this).parent().find("div.overlay").animate({ right: 0 }, { duration: 500, queue: false }, "easeOutCubic");
    });

    var divoverlay = JQ("<div class='overlay'></div>");
    divoverlay.append(JQ("<div class='bg'></div>"));
    var divdetails = JQ("<div class='details'></div>");
    divoverlay.append(divdetails);
    divdetails.append(JQ("<h3></h3>").html(data.Location));

    var div = JQ("<div class='DTableContainer flexcroll'></div>");
    divdetails.append(div);

    var tbl = JQ("<table class='desc' cellpadding='0' cellspacing='0' border='0'></table>");
    var tr = JQ("<tr></tr>");
    tr.append(JQ("<td width='100'>Date:</td>"));
    tr.append(JQ("<td></td>").html(data.FromDate));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td>Venue:</td>"));
    tr.append(JQ("<td></td>").html(data.Venue));
    tbl.append(tr);

    tr = JQ("<tr></tr>");
    tr.append(JQ("<td>Time:</td>"));
    tr.append(JQ("<td></td>").html(data.FromTime));
    tbl.append(tr);

    div.append(tbl);

    divdetails.append(JQ("<h4><a href='/golden-ticket/registration/'>Pre Register</a></h4>"));

    arr.push(img);
    arr.push(divoverlay);

    return arr;

}

function BuildCharityMarkup(data)
{
    var arr = new Array();

    var div = JQ("<div class='PContents'></div>");
    div.append(JQ("<p class='CharityText'></p>").html(data.Description));
    var divimg = JQ("<div class='PartnerThumb'></div>");
    div.append(divimg);
    var img = $("<img width='125' height='125'>").attr("src", data.Logo);
    divimg.append(img);

    div.append(JQ("<span class='CharityURL'>").append(JQ("<a target='_blank'></a>").attr("href", data.Url).html("Visit Website")));

    arr.push(div);

    return arr;
}