expomap/static/client/js/rejs/banners.js

(function () {
    "use strict";

    var API_URL_ROOT = "/expo-b/get-banners/";

    var getUrl = function () {
        var search = [];

        var parts = /^\/([^\/]+)(?:\/|$)/i.exec(location.pathname);
        if (parts) {
            search.push("catalog=" + encodeURIComponent(parts[1]));
        } else {
            search.push("catalog=");
        }

        var elements = $("[id^=\"expo_b_\"]");
        for (var j = 0; j < elements.length; j++) {
            search.push("places=" + encodeURIComponent($(elements[j]).attr("id")));
        }

        var data = window.sendData;
        if (data instanceof Object) {
            for (var key in data) {
                if (data.hasOwnProperty(key)) {
                    var value = data[key];

                    if (value instanceof Array) {
                        for (var i = 0, l = value.length; i < l; i++) {
                            search.push(encodeURIComponent(key) + "=" + encodeURIComponent(value[i]));
                        }
                    } else {
                        search.push(encodeURIComponent(key) + "=" + encodeURIComponent(value));
                    }
                }
            }
        }

        return API_URL_ROOT + "?" + search.join("&");
    };

    var runCallback = function (callback, arg) {
        try {
            callback(JSON.parse(arg));
        } catch (error) {
            // do nothing
        }
        console.info('callback Done');
    };

    var getBanners = function (url, callback) {
        var xhr = new XMLHttpRequest();
        xhr.open("GET", url, true);

        xhr.onreadystatechange = function (event) {
            if (event.target.readyState === 4) {
                if (event.target.status === 200) {
                    if (document.readyState === "loading") {
                        console.info('setting DOMContentLoaded event listener');
                        document.addEventListener("DOMContentLoaded", function() {
                            runCallback(callback, event.target.responseText);
                        });
                    } else {
                        runCallback(callback, event.target.responseText);
                    }
                }
            }
        };

        xhr.send();
    };

    var addBanner = function (banner) {
        var parent = document.getElementById(banner.id);

        if (parent) {
            if (banner.is_popup) {
                if (banner.is_img) {
                    parent.innerHTML =
                        "<header class=\"clearfix\"><div class=\"pw-title\"></div></header><div class=\"pw-body clearfix\">" +
                        "<a href=\""+ banner.url + "\"><img src=\"" + banner.img + "\" alt=\"" + banner.alt + "\" /></a></div>";
                } else if (banner.is_html) {
                    parent.innerHTML = banner.text;
                }

                $("#expo-form-popup").on("submit", function(e) {
                    e.preventDefault();
                    window.location = $("#expo-form-popup").attr("action");
                });

                setTimeout(function(){
                    $.fancybox.open([{"href": "#" + banner.id}], {});
                }, 5000);
            } else {
                if (banner.is_img) {
                    var a = document.createElement("a");
                    a.href = banner.url;

                    var img = document.createElement("img");
                    img.src = banner.img;
                    img.alt = banner.alt;

                    a.appendChild(img);
                    parent.appendChild(a);
                } else if (banner.is_html) {
                    parent.innerHTML = banner.text;
                }
            }
        }

    };

    var insertBanners = function (data) {
        if (data instanceof Array) {
            for (var i = 0, l = data.length; i < l; i++) {
                addBanner(data[i]);
            }
        }
    };

    var main = function () {
        getBanners(getUrl(), insertBanners);
    };

    // window.addEventListener("load", main);
    document.addEventListener("DOMContentLoaded", main);
})();