﻿jQuery.fn.DiamondsTable = function (settings) {

    var container = jQuery(this);

    var result = {
        Init: function () {

            this.SortLabel = settings["SortLabel"];
            this.SortDirection = settings["SortDirection"];
            this.Pairs = settings["pairs"];

            this.InitTable();
        },
        InitTable: function () {
            container.html("");

            this.Input = $("<table>")
                .attr("cellpadding", "0")
                .attr("cellspacing", "0")
                .attr("class", settings["cssClass"])
                .appendTo(container);

            var headerLables = new Array("Select", "Shape", "Carat", "Saturation", "Color", "Overtone", "Certificate #", "Price Range");

            var row = $("<tr>");

            $.each(headerLables, function (index, value) {
                var col = $("<th>").html(value).appendTo(row);
                col.css("cursor", "pointer");
                col.mouseup(function () {
                    result.Sort($(this), $(this).text(), result.SortLabel == $(this).text() && result.SortDirection == "ASC" ? "DESC" : "ASC");
                });

                if (result.SortLabel == value) {
                    result.SortElement = col;
                    if (result.SortDirection == "ASC") result.SortElement.html(result.SortElement.text() + "<img align='absmiddle' src='" + imagesPath + "ColorDiamonds/Images/asc.png' alert='Sort Ascending'>");
                    else result.SortElement.html(result.SortElement.text() + "<img align='absmiddle' src='" + imagesPath + "ColorDiamonds/Images/desc.png' alert='Sort Descending'>");
                }
            });

            row.appendTo(this.Input);

            if (this.Pairs) {
                for (var i = 0; i < 10; i++) {
                    var row = $("<tr>");
                    for (var j = 0; j < 8; j++) {
                        if (j == 0) { // || j == 7
                            if ((i + 1) % 2 == 1) {
                                var col = $("<td>").css("cursor", "default").attr("rowspan", "2").html("&nbsp;").appendTo(row);
                            }
                        }
                        else {
                            var col = $("<td>").css("cursor", "default").html("&nbsp;").appendTo(row);
                        }
                    }
                    row.appendTo(this.Input);
                }
            }
            else {
                for (var i = 0; i < 10; i++) {
                    var row = $("<tr>");
                    for (var j = 0; j < 8; j++) {
                        var col = $("<td>").css("cursor", "default").html("&nbsp;").appendTo(row);
                    }
                    row.appendTo(this.Input);
                }
            }
        },
        Input: null,
        SortLabel: "",
        Pairs: false,
        SortElement: null,
        SortDirection: "ASC",
        Sort: function (element, label, direction) {
            this.SortElement.html(this.SortElement.text());
            this.SortElement = element;

            if (direction == "ASC") element.html(element.text() + "<img align='absmiddle' src='" + imagesPath + "ColorDiamonds/Images/asc.png' alert='Sort Ascending'>");
            else element.html(element.text() + "<img align='absmiddle' src='" + imagesPath + "ColorDiamonds/Images/desc.png' alert='Sort Descending'>");

            this.SortLabel = label;
            this.SortDirection = direction;

            SendRequest();
        },
        ShowCompare: function (element, table, pages, page) {
            var self = this;
            var tableElement = table;
            var pagesElement = pages;

            if (this.Pairs) {
                $.post(defaultHandler, { comparePairsPage: page }, function (data) {

                    var diamonds = $(data).find("pair");

                    if (diamonds.length > 0) {
                        var pages = parseInt($(data).find("diamonds").attr('pages'));
                        $(pagesElement).html(pages);

                        // diamonds = $(data).find("diamond");

                        var rows = $(tableElement).find("tr");

                        $.each($(rows), function (ir, vr) {
                            $.each($($(vr).find("td")), function (it, vt) {
                                if (it > 0) {
                                    $(vt).html("&nbsp;");
                                }
                            });
                        });

                        var cellsRarity = $(rows[0]).find("td");
                        var colorQuality = $(rows[1]).find("td");
                        var collectability = $(rows[2]).find("td");
                        var overall = $(rows[3]).find("td");
                        var shape = $(rows[4]).find("td");
                        var carat = $(rows[5]).find("td");
                        var saturation = $(rows[6]).find("td");
                        var color = $(rows[7]).find("td");
                        var overtone = $(rows[8]).find("td");
                        var clarity = $(rows[9]).find("td");
                        var lab = $(rows[10]).find("td");
                        var fluorescence = $(rows[11]).find("td");
                        var argyleCertificate = $(rows[12]).find("td");
                        var depth = $(rows[13]).find("td");
                        var table = $(rows[14]).find("td");
                        var measurements = $(rows[15]).find("td");
                        var stock = $(rows[16]).find("td");
                        var price = $(rows[17]).find("td");

                        // ~ var certificateNumber = $(rows[12]).find("td");

                        $.each($(diamonds), function (index, value) {
                            //var diamond = self.GetDiamond($(value));

                            var row = index * 2 + 1;

                            var diamond1 = self.GetDiamond($($(diamonds[index]).find("diamond1")));
                            var diamond2 = self.GetDiamond($($(diamonds[index]).find("diamond2")));

                            $(cellsRarity[row]).html(diamond1["CrownHeight"]);
                            $(colorQuality[row]).html(diamond1["CrownAngle"]);
                            $(collectability[row]).html(diamond1["PavilionAngle"]);
                            $(overall[row]).html(diamond1["PavilionDepth"]);
                            $(shape[row]).html(diamond1["Shape"]);
                            $(carat[row]).html(diamond1["Weight"]);
                            $(saturation[row]).html(diamond1["FancyColorIntensity"]);
                            $(color[row]).html(diamond1["FancyColor"]);
                            $(overtone[row]).html(diamond1["FancyColorOvertone"]);
                            $(clarity[row]).html(diamond1["Clarity"]);
                            $(lab[row]).html(diamond1["Lab"]);
                            $(fluorescence[row]).html(diamond1["FluorescenceIntensity"]);
                            //$(certificateNumber[index + 1]).html(diamond["argyleCertificate"]);
                            $(argyleCertificate[row]).html(diamond1["LaserInscription"]);
                            $(depth[row]).html(diamond1["DepthPercents"]);
                            $(table[row]).html(diamond1["TablePercents"]);
                            $(measurements[row]).html(diamond1["Measurements"]);
                            $(stock[row]).html(diamond1["VendorStockNumber"]);
                            $(price[row]).html(diamond1["Price"]);

                            $(cellsRarity[row + 1]).html(diamond2["CrownHeight"]);
                            $(colorQuality[row + 1]).html(diamond2["CrownAngle"]);
                            $(collectability[row + 1]).html(diamond2["PavilionAngle"]);
                            $(overall[row + 1]).html(diamond2["PavilionDepth"]);
                            $(shape[row + 1]).html(diamond2["Shape"]);
                            $(carat[row + 1]).html(diamond2["Weight"]);
                            $(saturation[row + 1]).html(diamond2["FancyColorIntensity"]);
                            $(color[row + 1]).html(diamond2["FancyColor"]);
                            $(overtone[row + 1]).html(diamond2["FancyColorOvertone"]);
                            $(clarity[row + 1]).html(diamond2["Clarity"]);
                            $(lab[row + 1]).html(diamond2["Lab"]);
                            $(fluorescence[row + 1]).html(diamond2["FluorescenceIntensity"]);
                            //$(certificateNumber[index + 1]).html(diamond["argyleCertificate"]);
                            $(argyleCertificate[row + 1]).html(diamond2["LaserInscription"]);
                            $(depth[row + 1]).html(diamond2["DepthPercents"]);
                            $(table[row + 1]).html(diamond2["TablePercents"]);
                            $(measurements[row + 1]).html(diamond2["Measurements"]);
                            $(stock[row + 1]).html(diamond2["VendorStockNumber"]);
                            $(price[row + 1]).html(diamond2["Price"]);

                            $(cellsRarity[row + 1]).css("border-left-width", "0");
                            $(colorQuality[row + 1]).css("border-left-width", "0");
                            $(collectability[row + 1]).css("border-left-width", "0");
                            $(overall[row + 1]).css("border-left-width", "0");
                            $(shape[row + 1]).css("border-left-width", "0");
                            $(carat[row + 1]).css("border-left-width", "0");
                            $(saturation[row + 1]).css("border-left-width", "0");
                            $(color[row + 1]).css("border-left-width", "0");
                            $(overtone[row + 1]).css("border-left-width", "0");
                            $(clarity[row + 1]).css("border-left-width", "0");
                            $(lab[row + 1]).css("border-left-width", "0");
                            $(fluorescence[row + 1]).css("border-left-width", "0");
                            $(argyleCertificate[row + 1]).css("border-left-width", "0");
                            $(depth[row + 1]).css("border-left-width", "0");
                            $(table[row + 1]).css("border-left-width", "0");
                            $(measurements[row + 1]).css("border-left-width", "0");
                            $(stock[row + 1]).css("border-left-width", "0");
                            $(price[row + 1]).css("border-left-width", "0");
                        });

                        $(element).fadeIn(500);
                    }
                    else {
                        alert("Choose at least two stones to compare");
                    }
                });
            }
            else {
                $.post(defaultHandler, { comparePage: page }, function (data) {

                    var diamonds = $(data).find("diamonds");

                    var pages = parseInt(diamonds.attr('pages'));
                    $(pagesElement).html(pages);

                    diamonds = $(data).find("diamond");

                    if (diamonds.length > 0) {

                        var rows = $(tableElement).find("tr");

                        $.each($(rows), function (ir, vr) {
                            $.each($($(vr).find("td")), function (it, vt) {
                                if (it > 0) {
                                    $(vt).css("border-left-width", "1px");
                                    $(vt).html("&nbsp;");
                                }
                            });
                        });

                        var cellsRarity = $(rows[0]).find("td");
                        var colorQuality = $(rows[1]).find("td");
                        var collectability = $(rows[2]).find("td");
                        var overall = $(rows[3]).find("td");
                        var shape = $(rows[4]).find("td");
                        var carat = $(rows[5]).find("td");
                        var saturation = $(rows[6]).find("td");
                        var color = $(rows[7]).find("td");
                        var overtone = $(rows[8]).find("td");
                        var clarity = $(rows[9]).find("td");
                        var lab = $(rows[10]).find("td");
                        var fluorescence = $(rows[11]).find("td");
                        var argyleCertificate = $(rows[12]).find("td");
                        var depth = $(rows[13]).find("td");
                        var table = $(rows[14]).find("td");
                        var measurements = $(rows[15]).find("td");
                        var stock = $(rows[16]).find("td");
                        var price = $(rows[17]).find("td");

                        // ~ var certificateNumber = $(rows[12]).find("td");

                        $.each($(diamonds), function (index, value) {
                            var diamond = self.GetDiamond($(value));

                            $(cellsRarity[index + 1]).html(diamond["CrownHeight"]);
                            $(colorQuality[index + 1]).html(diamond["CrownAngle"]);
                            $(collectability[index + 1]).html(diamond["PavilionAngle"]);
                            $(overall[index + 1]).html(diamond["PavilionDepth"]);
                            $(shape[index + 1]).html(diamond["Shape"]);
                            $(carat[index + 1]).html(diamond["Weight"]);
                            $(saturation[index + 1]).html(diamond["FancyColorIntensity"]);
                            $(color[index + 1]).html(diamond["FancyColor"]);
                            $(overtone[index + 1]).html(diamond["FancyColorOvertone"]);
                            $(clarity[index + 1]).html(diamond["Clarity"]);
                            $(lab[index + 1]).html(diamond["Lab"]);
                            $(fluorescence[index + 1]).html(diamond["FluorescenceIntensity"]);
                            //$(certificateNumber[index + 1]).html(diamond["argyleCertificate"]);
                            $(argyleCertificate[index + 1]).html(diamond["LaserInscription"]);
                            $(depth[index + 1]).html(diamond["DepthPercents"]);
                            $(table[index + 1]).html(diamond["TablePercents"]);
                            $(measurements[index + 1]).html(diamond["Measurements"]);
                            $(stock[index + 1]).html(diamond["VendorStockNumber"]);
                            $(price[index + 1]).html(diamond["Price"]);
                        });

                        $(element).fadeIn(500);
                    }
                    else {
                        alert("Choose at least two stones to compare");
                    }
                });
            }
        },
        HideCompare: function (element) {
            $(element).fadeOut(500);
        },
        Refresh: function (data) {

            this.InitTable();

            var self = this;
            var diamonds = $(data).find("diamonds");
            var count = parseInt(diamonds.attr('count'));
            var pages = parseInt(diamonds.attr('pages'));

            $("#pages").html(pages);

            if (this.Pairs) { $(".results").html(" " + count + " Diamond pairs found."); }
            else { $(".results").html(" " + count + " Diamonds found."); }

            var value = parseInt($("#pagetext").val());
            if (value > pages) {
                if (pages == 0) $("#pagetext").val(1);
                else $("#pagetext").val(pages);
            }

            if (this.Pairs) {

                diamonds = $(data).find("pair");

                if (diamonds.length == 0) {
                    //$("#container-results").fadeOut(500, function () {
                    $("#container-no-results").fadeIn(500);
                    //});

                    $("#details").html("");
                }
                else {
                    $("#container-no-results").fadeOut(500, function () {
                        //$("#container-results").fadeIn(500);
                    });

                    var trs = this.Input.find("tr");

                    $.each($(diamonds), function (index, value) {

                        var row = index * 2 + 1;

                        var pair = $(diamonds[index]);
                        var diamond1 = self.GetDiamond($($(diamonds[index]).find("diamond1")));
                        var diamond2 = self.GetDiamond($($(diamonds[index]).find("diamond2")));

                        $(trs[row]).mouseleave(function () {

                            $(trs[row]).css("background-color", "#FFFFFF");
                            $(trs[row + 1]).css("background-color", "#FFFFFF");

                            var td = $(trs[row]).find("td").slice(2, 8);
                            $(td).css("background-color", "#FFFFFF");

                            var td2 = $(trs[row + 1]).find("td").slice(1, 7);
                            $(td2).css("background-color", "#FFFFFF");
                        });

                        $(trs[row + 1]).mouseleave(function () {

                            $(trs[row]).css("background-color", "#FFFFFF");
                            $(trs[row + 1]).css("background-color", "#FFFFFF");

                            var td = $(trs[row]).find("td").slice(2, 8);
                            $(td).css("background-color", "#FFFFFF");

                            var td2 = $(trs[row + 1]).find("td").slice(1, 7);
                            $(td2).css("background-color", "#FFFFFF");
                        });

                        $(trs[row]).mouseover(function () {

                            if ($(this).find("td").length > 0) {

                                $(trs[row]).css("background-color", "#EBEBEB");
                                $(trs[row + 1]).css("background-color", "#EBEBEB");

                                var td = $(trs[row]).find("td").slice(2, 8);
                                $(td).css("background-color", "#E0E0E0");

                                var td2 = $(trs[row + 1]).find("td").slice(1, 7);
                                $(td2).css("background-color", "#EBEBEB");

                                var details = "";

                                if (HasValue(diamond1["CrownHeight"])) details += "<div><b>Rarity:</b> " + diamond1["CrownHeight"] + "</div>";
                                if (HasValue(diamond1["CrownAngle"])) details += "<div><b>Color Quality:</b> " + diamond1["CrownAngle"] + "</div>";
                                if (HasValue(diamond1["PavilionAngle"])) details += "<div><b>Collectability:</b> " + diamond1["PavilionAngle"] + "</div>";
                                if (HasValue(diamond1["PavilionDepth"])) details += "<div><b>Overall:</b> " + diamond1["PavilionDepth"] + "</div>";
                                if (HasValue(diamond1["Shape"])) details += "<div><b>Shape:</b> " + diamond1["Shape"] + "</div>";
                                if (HasValue(diamond1["Weight"])) details += "<div><b>Carat:</b> " + diamond1["Weight"] + "</div>";
                                if (HasValue(diamond1["FancyColorIntensity"])) details += "<div><b>Saturation:</b> " + diamond1["FancyColorIntensity"] + "</div>";
                                if (HasValue(diamond1["FancyColor"])) details += "<div><b>Color:</b> " + diamond1["FancyColor"] + "</div>";
                                if (HasValue(diamond1["FancyColorOvertone"])) details += "<div><b>Overtone:</b> " + diamond1["FancyColorOvertone"] + "</div>";
                                if (HasValue(diamond1["Clarity"])) details += "<div><b>Clarity:</b> " + diamond1["Clarity"] + "</div>";
                                if (HasValue(diamond1["Lab"])) details += "<div><b>Lab:</b> " + diamond1["Lab"] + "</div>";
                                if (HasValue(diamond1["CertificateNumber"])) details += "<div><b>Certificate #:</b> " + diamond1["CertificateNumber"] + "</div>";
                                if (HasValue(diamond1["FluorescenceIntensity"])) details += "<div><b>Fluorescence:</b> " + diamond1["FluorescenceIntensity"] + "</div>";
                                if (HasValue(diamond1["LaserInscription"])) details += "<div><b>Argyle Certificate:</b> " + diamond1["LaserInscription"] + "</div>";
                                if (HasValue(diamond1["DepthPercents"])) details += "<div><b>Depth:</b> " + diamond1["DepthPercents"] + "</div>";
                                if (HasValue(diamond1["TablePercents"])) details += "<div><b>Table:</b> " + diamond1["TablePercents"] + "</div>";
                                if (HasValue(diamond1["Measurements"])) details += "<div><b>Measurements:</b> " + diamond1["Measurements"] + "</div>";
                                if (HasValue(diamond1["VendorStockNumber"])) details += "<div><b>Stock:</b> " + diamond1["VendorStockNumber"] + "</div>";
                                if (HasValue(diamond1["Price"])) details += "<div><b>Price Range:</b> " + diamond1["Price"].toString().replace("k", ",000").replace("k", ",000") + "</div>";

                                $("#details").html(details);
                            }
                        });

                        $(trs[row + 1]).mouseover(function () {

                            if ($(this).find("td").length > 0) {

                                $(trs[row]).css("background-color", "#EBEBEB");
                                $(trs[row + 1]).css("background-color", "#EBEBEB");

                                var td = $(trs[row]).find("td").slice(2, 8);
                                $(td).css("background-color", "#EBEBEB");

                                var td2 = $(trs[row + 1]).find("td").slice(1, 7);
                                $(td2).css("background-color", "#E0E0E0");

                                var details = "";

                                if (HasValue(diamond2["CrownHeight"])) details += "<div><b>Rarity:</b> " + diamond2["CrownHeight"] + "</div>";
                                if (HasValue(diamond2["CrownAngle"])) details += "<div><b>Color Quality:</b> " + diamond2["CrownAngle"] + "</div>";
                                if (HasValue(diamond2["PavilionAngle"])) details += "<div><b>Collectability:</b> " + diamond2["PavilionAngle"] + "</div>";
                                if (HasValue(diamond2["PavilionDepth"])) details += "<div><b>Overall:</b> " + diamond2["PavilionDepth"] + "</div>";
                                if (HasValue(diamond2["Shape"])) details += "<div><b>Shape:</b> " + diamond2["Shape"] + "</div>";
                                if (HasValue(diamond2["Weight"])) details += "<div><b>Carat:</b> " + diamond2["Weight"] + "</div>";
                                if (HasValue(diamond2["FancyColorIntensity"])) details += "<div><b>Saturation:</b> " + diamond2["FancyColorIntensity"] + "</div>";
                                if (HasValue(diamond2["FancyColor"])) details += "<div><b>Color:</b> " + diamond2["FancyColor"] + "</div>";
                                if (HasValue(diamond2["FancyColorOvertone"])) details += "<div><b>Overtone:</b> " + diamond2["FancyColorOvertone"] + "</div>";
                                if (HasValue(diamond2["Clarity"])) details += "<div><b>Clarity:</b> " + diamond2["Clarity"] + "</div>";
                                if (HasValue(diamond2["Lab"])) details += "<div><b>Lab:</b> " + diamond2["Lab"] + "</div>";
                                if (HasValue(diamond2["CertificateNumber"])) details += "<div><b>Certificate #:</b> " + diamond2["CertificateNumber"] + "</div>";
                                if (HasValue(diamond2["FluorescenceIntensity"])) details += "<div><b>Fluorescence:</b> " + diamond2["FluorescenceIntensity"] + "</div>";
                                if (HasValue(diamond2["LaserInscription"])) details += "<div><b>Argyle Certificate:</b> " + diamond2["LaserInscription"] + "</div>";
                                if (HasValue(diamond2["DepthPercents"])) details += "<div><b>Depth:</b> " + diamond2["DepthPercents"] + "</div>";
                                if (HasValue(diamond2["TablePercents"])) details += "<div><b>Table:</b> " + diamond2["TablePercents"] + "</div>";
                                if (HasValue(diamond2["Measurements"])) details += "<div><b>Measurements:</b> " + diamond2["Measurements"] + "</div>";
                                if (HasValue(diamond2["VendorStockNumber"])) details += "<div><b>Stock:</b> " + diamond2["VendorStockNumber"] + "</div>";
                                if (HasValue(diamond2["Price"])) details += "<div><b>Price Range:</b> " + diamond2["Price"].toString().replace("k", ",000").replace("k", ",000") + "</div>";

                                $("#details").html(details);
                            }
                        });

                        var cells1 = $(trs[row]).find("td");
                        var cells2 = $(trs[row + 1]).find("td");

                        var check = $(document.createElement("input")).attr({
                            id: 'topicFilter-' + diamond1["ColorDiamondID"],
                            type: 'checkbox', checked: $(pair).attr("compare") == "1"
                        })
                        .mouseup(function () {
                            $.post(defaultHandler, {
                                comparepair: diamond1["CertificateNumber"], check: !$(this).is(':checked')
                            });
                        });

                        $(cells1[0]).html(check);

                        var src1 = result.GetShapeImage(diamond1["Shape"]);
                        var src2 = result.GetShapeImage(diamond2["Shape"]);

                        $(cells1[1]).css("background", "url(" + src1 + ") no-repeat center center #FFF");
                        $(cells2[0]).css("background", "url(" + src2 + ") no-repeat center center #FFF");

                        $(cells1[1]).attr("title", diamond1["Shape"]);
                        $(cells2[0]).attr("title", diamond2["Shape"]);

                        $(cells1[2]).html(diamond1["Weight"]);
                        $(cells2[1]).html(diamond2["Weight"]);

                        $(cells1[3]).html(diamond1["FancyColorIntensity"]);
                        $(cells2[2]).html(diamond2["FancyColorIntensity"]);

                        $(cells1[4]).html(diamond1["FancyColor"]);
                        $(cells2[3]).html(diamond2["FancyColor"]);

                        $(cells1[5]).html(diamond1["FancyColorOvertone"]);
                        $(cells2[4]).html(diamond2["FancyColorOvertone"]);

                        $(cells1[6]).html(diamond1["CertificateNumber"]);
                        $(cells2[5]).html(diamond2["CertificateNumber"]);

                        $(cells1[7]).html(diamond1["Price"]);
                        $(cells2[6]).html(diamond2["Price"]);
                    });
                }
            }
            else {

                diamonds = $(data).find("diamond");

                if (diamonds.length == 0) {
                    //$("#container-results").fadeOut(500, function () {
                    $("#container-no-results").fadeIn(500);
                    //});

                    $("#details").html("");
                }
                else {
                    $("#container-no-results").fadeOut(500, function () {
                        //$("#container-results").fadeIn(500);
                    });

                    $.each(this.Input.find("tr"), function (index, value) {

                        $(value).mouseleave(function () {
                            $(this).css("background-color", "#FFFFFF");
                        });

                        $(value).mouseover(function () {

                            if ($(this).find("td").length > 0) {
                                $(this).css("background-color", "#EAEAEA");

                                var details = "";

                                if (HasValue(diamond["CrownHeight"])) details += "<div><b>Rarity:</b> " + diamond["CrownHeight"] + "</div>";
                                if (HasValue(diamond["CrownAngle"])) details += "<div><b>Color Quality:</b> " + diamond["CrownAngle"] + "</div>";
                                if (HasValue(diamond["PavilionAngle"])) details += "<div><b>Collectability:</b> " + diamond["PavilionAngle"] + "</div>";
                                if (HasValue(diamond["PavilionDepth"])) details += "<div><b>Overall:</b> " + diamond["PavilionDepth"] + "</div>";
                                if (HasValue(diamond["Shape"])) details += "<div><b>Shape:</b> " + diamond["Shape"] + "</div>";
                                if (HasValue(diamond["Weight"])) details += "<div><b>Carat:</b> " + diamond["Weight"] + "</div>";
                                if (HasValue(diamond["FancyColorIntensity"])) details += "<div><b>Saturation:</b> " + diamond["FancyColorIntensity"] + "</div>";
                                if (HasValue(diamond["FancyColor"])) details += "<div><b>Color:</b> " + diamond["FancyColor"] + "</div>";
                                if (HasValue(diamond["FancyColorOvertone"])) details += "<div><b>Overtone:</b> " + diamond["FancyColorOvertone"] + "</div>";
                                if (HasValue(diamond["Clarity"])) details += "<div><b>Clarity:</b> " + diamond["Clarity"] + "</div>";
                                if (HasValue(diamond["Lab"])) details += "<div><b>Lab:</b> " + diamond["Lab"] + "</div>";
                                if (HasValue(diamond["CertificateNumber"])) details += "<div><b>Certificate #:</b> " + diamond["CertificateNumber"] + "</div>";
                                if (HasValue(diamond["FluorescenceIntensity"])) details += "<div><b>Fluorescence:</b> " + diamond["FluorescenceIntensity"] + "</div>";
                                if (HasValue(diamond["LaserInscription"])) details += "<div><b>Argyle Certificate:</b> " + diamond["LaserInscription"] + "</div>";
                                if (HasValue(diamond["DepthPercents"])) details += "<div><b>Depth:</b> " + diamond["DepthPercents"] + "</div>";
                                if (HasValue(diamond["TablePercents"])) details += "<div><b>Table:</b> " + diamond["TablePercents"] + "</div>";
                                if (HasValue(diamond["Measurements"])) details += "<div><b>Measurements:</b> " + diamond["Measurements"] + "</div>";
                                if (HasValue(diamond["VendorStockNumber"])) details += "<div><b>Stock:</b> " + diamond["VendorStockNumber"] + "</div>";
                                if (HasValue(diamond["Price"])) details += "<div><b>Price Range:</b> " + diamond["Price"].toString().replace("k", ",000").replace("k", ",000") + "</div>";

                                $("#details").html(details);
                            }
                        });

                        if (index > 0) {
                            var diamond = self.GetDiamond($(diamonds[index - 1]));

                            var cells = $(value).find("td");

                            if (HasValue(diamond["CertificateNumber"])) {
                                var check = $(document.createElement("input")).attr({
                                    id: 'topicFilter-' + diamond["ColorDiamondID"],
                                    type: 'checkbox', checked: diamond["Compare"] == "1"
                                })
                                .mouseup(function () {
                                    $.post(defaultHandler, { compare: diamond["CertificateNumber"], check: !$(this).is(':checked') });
                                });

                                $(cells[0]).html(check);
                            }

                            var src = result.GetShapeImage(diamond["Shape"]);

                            $(cells[1]).css("background", "url(" + src + ") no-repeat center center #FFF");
                            $(cells[1]).attr("title", diamond["Shape"]);

                            //$(cells[1]).html("<img src='" + src + "' alt='" + diamond["Shape"] + "' title='" + diamond["Shape"] + "' />");
                            $(cells[2]).html(diamond["Weight"]);
                            $(cells[3]).html(diamond["FancyColorIntensity"]);
                            $(cells[4]).html(diamond["FancyColor"]);
                            $(cells[5]).html(diamond["FancyColorOvertone"]);
                            $(cells[6]).html(diamond["CertificateNumber"]);
                            $(cells[7]).html(diamond["Price"]);

                            if (index == 1) {
                                $(value).mouseover();
                                $(value).css("background-color", "#FFFFFF");
                            }
                        }
                    });
                }
            }
        },
        GetDiamond: function (diamond) {

            var diamond = $(diamond);

            var result = {
                'Compare': $(diamond).find("Compare").text(),
                'ColorDiamondID': $(diamond).find("ColorDiamondID").text(),
                'BrandMiniColorDiamond': $(diamond).find("BrandMiniColorDiamond").text(),
                'Shape': $(diamond).find("Shape").text(),
                'FancyColor': $(diamond).find("FancyColor").text(),
                'Clarity': $(diamond).find("Clarity").text(),
                'FancyColorIntensity': $(diamond).find("FancyColorIntensity").text(),
                'FancyColorOvertone': $(diamond).find("FancyColorOvertone").text(),
                'Weight': $(diamond).find("Weight").text(),
                'Measurements': $(diamond).find("Measurements").text(),
                'Lab': $(diamond).find("Lab").text(),
                'Price': $(diamond).find("Price").text(),
                'DepthPercents': $(diamond).find("DepthPercents").text(),
                'TablePercents': $(diamond).find("TablePercents").text(),
                'FluorescenceIntensity': $(diamond).find("FluorescenceIntensity").text(),
                'FluorescenceColor': $(diamond).find("FluorescenceColor").text(),
                'CrownHeight': $(diamond).find("CrownHeight").text(),
                'CrownAngle': $(diamond).find("CrownAngle").text(),
                'PavilionDepth': $(diamond).find("PavilionDepth").text(),
                'PavilionAngle': $(diamond).find("PavilionAngle").text(),
                'LaserInscription': $(diamond).find("LaserInscription").text(),
                'CertificateNumber': $(diamond).find("CertificateNumber").text(),
                'CertificateImage': $(diamond).find("CertificateImage").text(),
                'VendorStockNumber': $(diamond).find("VendorStockNumber").text(),
                'MatchedPairStockNumber': $(diamond).find("MatchedPairStockNumber").text(),
                'IsMatchedPairSeparable': $(diamond).find("IsMatchedPairSeparable").text()
            };

            return result;
        },
        GetShapeImage: function (shape) {
            var src;

            if (shape == "Round") { src = imagesPath + "ColorDiamonds/Images/Shapes/round_m.jpg"; }
            else if (shape == "Radiant") { src = imagesPath + "ColorDiamonds/Images/Shapes/radiant_m.jpg"; }
            else if (shape == "Emerald") { src = imagesPath + "ColorDiamonds/Images/Shapes/emerald_m.jpg"; }
            else if (shape == "Heart") { src = imagesPath + "ColorDiamonds/Images/Shapes/heart_m.jpg"; }
            else if (shape == "Pear") { src = imagesPath + "ColorDiamonds/Images/Shapes/pear_m.jpg"; }
            else if (shape == "Oval") { src = imagesPath + "ColorDiamonds/Images/Shapes/oval_m.jpg"; }
            else if (shape == "Cushion") { src = imagesPath + "ColorDiamonds/Images/Shapes/cushion_m.jpg"; }
            else if (shape == "Marquise") { src = imagesPath + "ColorDiamonds/Images/Shapes/marquise_m.jpg"; }
            else if (shape == "Princess") { src = imagesPath + "ColorDiamonds/Images/Shapes/princess_m.jpg"; }
            else if (shape == "Baguette") { src = imagesPath + "ColorDiamonds/Images/Shapes/baguette_m.jpg"; }

            return src;
        }
    };

    result.Init();

    return result;
}

function HasValue(value) {
    return value != "" && value != "N/A" && value != "&nbsp;";
}
