tgs.classifieds = {
    init: function () {
        if ($("[data-listing]")) {
            tgs.classifieds.listings(0.66);
        };
        if ($(".classifieds.single")) {
            tgs.classifieds.single.photos(0.66);
        }
        if ($(".classifieds-search .search-bar").length > 0) {
            tgs.classifieds.searchBar();
        };
        if ($("[name=\"view\"]")) {
            tgs.classifieds.view.init();
        };
    },
    searchBar: function () {
        $(".classifieds-search .search-bar").do(function () {
            $(this).css({
                "position": "absolute",
                "top": "50%",
                "margin-top": -($(this).get(0).offsetHeight / 2)
            });
        });
    },
    listings: function (masterRatio) {

        // temp code to show difference between premium/non
        var listings = document.querySelectorAll("[data-listing]");
        if (listings.length) {
            for (var i = 0; i < 10; i++) {
                listings[i].setAttribute("data-listing", "premium");
            }; // end temp code
        };

        $("[data-listing]").each(function () {

            //$(this).click(function () {
            //  window.location.href += "/view/" + $(this).attr("data-id");
            //});

            //var masterRatio = 0.66; // Parameter of 'tgs.classifieds.listings()'

            // Find the photo within the listing
            var photo = $(this).find(".photo");
            var width = photo.width();
            photo.width(width);
            photo.height(width * masterRatio);

            // Find the anchor tag
            var a = photo.find("a");
            a.attr("href", window.location.href + "/view/" + $(this).attr("data-id"));
            a.width(photo.width());
            a.height(photo.height());

            // Find the actual photo
            var img = a.find("img");
            img.load(function () {
                // Detect image dimensions
                if (img.width() > img.height()) {
                    var ratio = img.height() / img.width();
                    if (ratio > masterRatio) { // How wide is the image?
                        img.width(photo.width());
                        img.css({ // Vertically center photo inside of link
                            "position": "relative",
                            "top": (-img.height() / 2) + (photo.height() / 2) + "px",
                        });
                    } else {
                        img.height(photo.height());
                        img.css({ // Horizontally center photo inside of link
                            "position": "relative",
                            "left": (-img.width() / 2) + (photo.width() / 2) + "px",
                        });
                    };
                } else {
                    var ratio = img.width() / img.height();
                    img.width(photo.width());
                    img.css({ // Vertically center photo inside of link
                        "position": "relative",
                        "top": (-img.height() / 2) + (photo.height() / 2) + "px",
                    });
                };
            });


        });
    },
    single: {
        photos: function (masterRatio) {
            $(".classifieds.single").find(".photo").each(function (i) {

                var photo = $(this);
                photo.addClass("grid");

                // Create "grid" depending on which image this is
                if (i === 0) {
                    photo.addClass("full");
                } else if (i >= 1 && i <= 2) {
                    photo.addClass("half");
                } else if (i >= 3 && i <= 5) {
                    photo.addClass("third");
                } else if (i >= 6) {
                    photo.addClass("fourth");
                };

                photo.height(photo.width() * masterRatio);

                var a = photo.find("a");
                a.click(function (e) {
                    e.preventDefault();
                });

                var img = a.find("> img");

                img.load(function () {

                    tgs.classifieds.single.viewer.each(img, i);

                    // Detect image dimensions
                    if (img.width() > img.height()) {
                        var ratio = img.height() / img.width();
                        if (ratio > masterRatio) { // How wide is the image?
                            img.width(photo.width());
                            img.css({ // Vertically center photo inside of link
                                "position": "relative",
                                "top": (-img.height() / 2) + (photo.height() / 2) + "px",
                            });
                        } else {
                            img.height(photo.height());
                            img.css({ // Horizontally center photo inside of link
                                "position": "relative",
                                "left": (-img.width() / 2) + (photo.width() / 2) + "px",
                            });
                        };
                    } else {
                        var ratio = img.width() / img.height();
                        img.width(photo.width());
                        img.css({ // Vertically center photo inside of link
                            "position": "relative",
                            "top": (-img.height() / 2) + (photo.height() / 2) + "px",
                        });
                    };
                });

                img.promise().done(function () {

                    img.siblings().click(function () {
                        tgs.classifieds.single.viewer.lightbox();
                        tgs.classifieds.single.viewer.nav(i);
                    });

                });

            });

        },
        viewer: {
            each: function (img, i) {

                var collection = $("#photoCollection");

                var caption = $("<div>");
                caption.addClass("caption");
                caption.html(img.attr("alt"));
                caption.hide();

                collection.find(".captions").append(caption);

                collection.find(".viewer").do(function () {

                    imgClone = img.clone();
                    imgClone.width(img.width());
                    imgClone.height(img.height());

                    img = imgClone;

                    $(this).append(img);
                    img.hide();

                    img.load(function () {

                        img = $(this);

                        if (img.width() > img.height()) {

                            var ratio = img.height() / img.width();
                            if (img.width() > img.parent().width()) {
                                img.width(img.parent().width());
                                img.height(img.width() * ratio);
                            };
                            img.css({ // Vertically center photo inside of link
                                "position": "relative",
                                "top": (-img.height() / 2) + (img.parent().height() / 2) + "px",
                                "left": (-img.width() / 2) + (img.parent().width() / 2) + "px"
                            });

                        } else {

                            var ratio = img.width() / img.height();
                            if (img.height() > img.parent().height()) {
                                img.height(img.parent().height());
                                img.width(img.height() * ratio);
                            };
                            img.css({ // Horizontally center photo inside of link
                                "position": "relative",
                                "left": (-img.width() / 2) + (img.parent().width() / 2) + "px",
                                "top": (-img.height() / 2) + (img.parent().height() / 2) + "px"
                            });

                        };

                    });

                });
            },
            nav: function (i) {
                $("#photoCollection .viewer").find("img").do(function () {

                    var captions = $("#photoCollection").find(".caption");

                    var clicked = $(this)[i];
                    $(clicked).show();

                    if ($(captions[i]).html()) {
                        $(captions[i]).show();
                    };

                    var count = $(this).length;
                    var first = $(this).first();
                    var last = $(this).last();

                    $(".which").text(i + 1 + " / " + count);

                    var images = $(".viewer").find("img");

                    // Next:
                    $("#photoCollection .next").click(function () {
                        $(images[i]).hide();
                        $(captions[i]).hide();
                        if (i < count - 1) {
                            i++;
                        } else {
                            i = 0;
                        };
                        $(".which").text(i + 1 + " / " + count);
                        $(images[i]).show();
                        if ($(captions[i]).html()) {
                            $(captions[i]).show();
                        };
                    });

                    // Previous:
                    $("#photoCollection .previous").click(function () {
                        $(images[i]).hide();
                        $(captions[i]).hide();
                        if (i === 0) {
                            i = count - 1;
                        } else {
                            i--;
                        };
                        $(".which").text(i + 1 + " / " + count);
                        $(images[i]).show();
                        if ($(captions[i]).html()) {
                            $(captions[i]).show();
                        };
                    });

                });
            },
            lightbox: function (i) {

                var collection = $("#photoCollection");
                var cover = $("#photoCover");

                collection.show();
                cover.show();

                collection.find(".close").click(function () {

                    collection.hide();
                    cover.hide();

                    var captions = collection.find(".captions");
                    captions.find(".caption").each(function () {
                        $(this).hide();
                    });

                    var viewer = collection.find(".viewer");
                    viewer.find("img").each(function () {
                        $(this).hide();
                    });

                });

            }
        }
    },
    view: {
        init: function () {
            // TODO:
            // first get value stored in cookie (call it: classifiedsView)
            // then check correct radio button, accordingly
            $("[name=\"view\"]").each(function () {
                var radio = $(this).get(0);
                $(this).parent().click(function () {
                    if (!$(this).hasClass("checked")) {
                        radio.checked = true;
                        $(this).parent().get(0).submit();
                    };
                });
            });
        }
    }
}
tgs.classifieds.init();