jQuery(document).ready(function () {
    (function (dev_mode, $) {
        "use strict";

        //Algolia Data Layers
        const algoliaDataLayers = {
            'collection_links': {
                selectors: '.search--item--library a:not(.search--item--eyebrow)',
                dataLayers: {
                    "ga-event-label": "Amazon",
                    "ga-event-non-interaction": false,
                    "ga-event": "GA Event Bookseller Exit",
                    "ga-event-category": "external link"
                }
            },

            'in_the_news': {
                selectors: '.search--item--in-the-news a:not(.search--item--eyebrow)',
                dataLayers: {
                    "ga-event-non-interaction": false,
                    "ga-event-action": "News Link",
                    "ga-event-category": "external link",
                    "ga-event": "GA Event News Exit"
                }
            },

            'resource_download': {
                selectors: '.search--item--resource .search--item--download',
                dataLayers: {
                    "ga-event-category": "Download",
                    "ga-event-non-interaction": false
                }
            },

            'all_episodes': {
                selectors: '.show__archive .search--item--episode .search--item--content > a:not(.search--item--eyebrow),.show__archive .search--item--episode .search--item--image a',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Podcast All Episodes',
                    'ga-event-non-interaction': false
                }
            }

        };
        const globalDataLayers = {

            'books': {
                selectors: '.purchase-options__link',
                dataLayers: {
                    'ga-event-category': 'external link',
                    'event': 'GA Event Bookseller Exit',
                    'ga-event-non-interaction': false
                }
            },
            'social_follow': {
                selectors: 'ul.social-list--follow .social-list__link',
                dataLayers: {
                    "ga-event-category": "Social",
                    "ga-event-action": "Exit",
                    "ga-event-non-interaction": false,
                    "event": "GA Event Social Exit"
                }
            },
            'social_share': {
                selectors: 'ul.social-list--share .social-list__link[data-bb-event-label]',
                dataLayers: {
                    "ga-event-category": "Social",
                    "ga-event-non-interaction": false,
                    "event": "GA Event Social Share"
                }
            },
            'resource_download': {
                selectors: '.resource-single__page__more .more__post .more__post-download__link,  .resource-single__actions .resource-single__download__button, .downloads__list .download__link, .resource-single__page__wrapper .resource-single__download__sticky, .resource-art-single__page__wrapper .resource-single__download__sticky,.page-template-page_resources-archive .download__link',
                dataLayers: {
                    "ga-event-category": "Download",
                    "ga-event-non-interaction": false
                }
            },
            'collection_links': {
                selectors: '.tease--vertical--library-book .tease__title__link, .tease--vertical--library-book .tease__image__link',

                dataLayers: {
                    "ga-event-label": "Amazon",
                    "ga-event-non-interaction": false,
                    "ga-event": "GA Event Bookseller Exit",
                    "ga-event-category": "external link"
                }
            },
            'newsletter_footer': {
                selectors: 'footer .newsletter-form [type=submit]',
                dataLayers: {
                    'ga-event-category': 'Newsletter Signup',
                    'ga-event-action': 'Footer',
                    'ga-event-non-interaction': false,
                    'event': 'GA Newsletter Signup'
                }
            },
            'newsletter_inline': {
                selectors: '.newsletter-form-inline [type=submit],.newsletter-email-page-form [type=submit], #mc-embedded-subscribe',
                dataLayers: {
                    'ga-event-category': 'Newsletter Signup',
                    'ga-event-action': 'Inline',
                    'ga-event-non-interaction': false,
                    'event': 'GA Newsletter Signup'
                }
            },
            'newsletter_popup': {
                selectors: '.newsletter-form-popup [type=submit]',
                dataLayers: {
                    'ga-event-category': 'Newsletter Signup',
                    'ga-event-action': 'Popup',
                    'ga-event-non-interaction': false,
                    'event': 'GA Newsletter Signup'
                }
            }
        };

        const hubDataLayers = {
            'hub_links': {
                selectors: '.hub__link-grid__list .hub__link-grid__item .hub__link-grid__item__link, .hub__episodes .hub__episode__cta__wrapper .hub__episode__cta',
                dataLayers: {
                    "ga-event-category": "internal link",
                    "ga-event-non-interaction": false,
                }
            }
        };


        const artDataLayers = {
            'resource_download': {
                selectors: '.resource__section--item .download__link',
                dataLayers: {
                    'ga-event-category': 'Download',
                    'ga-event-action': 'Download',
                    'ga-event-non-interaction': false
                }
            }
        };
        const articlesDataLayers = {
            'featured': {
                selectors: '.featured--articles--section .featured-article-link, .home-featured__articles .featured-article-link',
                dataLayers: {
                    "ga-event-non-interaction": false,
                    "event": "GA Event Dive In Link",
                    "ga-event-category": "internal link"
                }
            }
        };
        const homeDataLayers = {
            'internal_links': {
                selectors: '.home-featured-podcast__full a, .home-featured-podcast a,.featured--book a:not(.purchase-options__link), .featured-book a, .home-featured__hubs .hub a',
                dataLayers: {
                    "ga-event-non-interaction": false,
                    "event": "GA Event Dive In Link",
                    "ga-event-action": "Internal Link",
                    "ga-event-category": "internal link"
                }
            },
            'featured': {
                selectors: '.featured__content--full .featured__content--title--link,.featured__content--full .featured__content--image a, .featured__section__right .featured__section--list .featured__content--title--link, .featured__section__right .featured__section--list .featured__content--image a,.home-featured__articles .featured__article .featured__article--image a, .home-featured__articles .featured__article .featured__article--title--link',
                dataLayers: {
                    "ga-event-non-interaction": false,
                    "event": "GA Event Dive In Link",
                    "ga-event-category": "internal link"
                }

            }
        };

        const podcastDataLayers = {
            'spotify_link': {
                selectors: '.show__topper__button[data-bb-event-label], .podcast__section--listen .podcast__spotify-link',
                dataLayers: {
                    "ga-event-non-interaction": false,
                    "ga-event-category": "external link",
                    "ga-event-action": "Spotify Link",
                    "event": "Spotify External Link",
                }
            },
            'transcript': {
                selectors: '.js-transcript-agreement__submit',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Transcript Access',
                    'ga-event-non-interaction': false
                }
            },
            'featured_podcast': {
                selectors: '.show__featured-conversations .featured--conversation > a,.show__featured-conversations .featured--conversation .featured--content > a:not(.featured--show)',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Podcast Featured',
                    'ga-event-non-interaction': false
                }
            }
        };

        const singleArticleDataLayers = {
            'login': {
                selectors: '.join-conversation-actions .login-submit button[type=submit]',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Login Link',
                    'ga-event-non-interaction': false,
                    'event': 'GA Event Login Link'
                }
            },
            'create_account': {
                selectors: '.join-conversation-actions .action-register_link',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Create an Account Link',
                    'ga-event-non-interaction': false,
                    'event': 'GA Event Account Link'
                }
            },
            'post_comment': {
                selectors: '.bb-comment-form .button[type=submit], .bb-reply-form .button[type=submit]',
                dataLayers: {
                    'ga-event-category': 'internal link',
                    'ga-event-action': 'Post Comment',
                    'ga-event-non-interaction': false,
                    'event': 'GA Event Post Comment'
                }
            }
        };

        class BBDataLayers {

            supportDataLayers = [
                'books',
                'social_follow',
                'social_share',
                'resource_download',
                'hub_links',
                'collection_links',
                'internal_links',
                'spotify_link',
                'featured',
                'in_the_news',
                'login',
                'create_account',
                'post_comment',
                'newsletter_footer',
                'newsletter_inline',
                'newsletter_popup',
                'transcript',
                'featured_podcast',
                'all_episodes'
            ];


            constructor(_dataLayers, dev_mode, dynamic = false) {
                this.dev_mode = dev_mode;
                this.dataLayers = _dataLayers;
                this.dynamic = dynamic;
            }

            getDataLayers(type, element) {
                switch (type) {
                    case "books":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).html();
                        this.dataLayers[type].dataLayers['ga-event-action'] = $(element).attr('data-bb-event-action');
                        break;
                    case "featured":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).attr('data-bb-event-label') ? $(element).attr('data-bb-event-label').trim() : '';
                        this.dataLayers[type].dataLayers['ga-event-action'] = $(element).attr('data-bb-event-action') ? $(element).attr('data-bb-event-action').trim() : '';
                        break;
                    case "social_follow":
                    case "internal_links":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).attr('data-bb-event-label') ? $(element).attr('data-bb-event-label').trim() : '';
                        break;

                    case "in_the_news":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).closest('.bb-search--item').attr('data-bb-event-action') ? $(element).closest('.bb-search--item').attr('data-bb-event-action') : '';
                        break;
                    case "social_share":
                        this.dataLayers[type].dataLayers['ga-event-action'] = $(element).attr('data-bb-event-action');
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).attr('data-bb-event-label');
                        break;
                    case "resource_download":
                        let postType = $(element).attr('data-download-resource');
                        let postAction = "Resource";
                        let postEvent = "GA Event Download Small";

                        if (postType == 'art') {
                            postEvent = "GA Event Download Big";
                            postAction = "Art";
                        }

                        this.dataLayers[type].dataLayers['ga-event-action'] = postAction;
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).attr('data-download-title');
                        this.dataLayers[type].dataLayers['event'] = postEvent;
                        break;
                    case "hub_links":
                        let eventAction = $(element).attr('data-bb-event-action');
                        this.dataLayers[type].dataLayers['event'] = `GA Event ${eventAction} Link`;
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).attr('data-bb-event-label');
                        this.dataLayers[type].dataLayers['ga-event-action'] = $(element).attr('data-bb-event-action') + " Link";
                        break;
                    case "collection_links":
                        this.dataLayers[type].dataLayers['ga-event-action'] = $(element).closest('.tease--vertical, .bb-search--item').attr('data-bb-event-action') ? $(element).closest('.tease--vertical,.bb-search--item').attr('data-bb-event-action').trim() : '';
                        break;
                    case "spotify_link":
                        this.dataLayers[type].dataLayers['ga-event-label'] = "Spotify Link for " + $(element).attr('data-bb-event-label');
                        break;
                    case "login":
                        this.dataLayers[type].dataLayers['ga-event-label'] = "Login - " + $(element).closest('.bb-login-form').attr('data-post-title');
                        break;
                    case "create_account":
                        this.dataLayers[type].dataLayers['ga-event-label'] = "Create an Account - " + $(element).attr('data-post-title');
                        break;
                    case "post_comment":
                        this.dataLayers[type].dataLayers['ga-event-label'] = "Post Comment - " + $(element).closest('.bb-comments-ajax').attr('data-post-title');
                        break;
                    case "newsletter_popup":
                    case "newsletter_inline":
                    case "newsletter_footer":
                        this.dataLayers[type].dataLayers['ga-event-label'] = document.querySelector("title").innerText.replace(" - Brené Brown", "").replace(" | Brené Brown", "");
                        break;
                    case "transcript":
                        this.dataLayers[type].dataLayers['ga-event-label'] = "Transcript - " + $(element).attr('data-post-title');
                        break;
                    case "featured_podcast":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).closest('.featured--conversation').find('.featured--title').html().trim().replace(/(\r\n|\n|\r)/gm, " ");
                        break;

                    case "all_episodes":
                        this.dataLayers[type].dataLayers['ga-event-label'] = $(element).closest('.search--item--episode').find('.search--item--title').html().trim().replace(/(\r\n|\n|\r)/gm, " ");
                        break;
                }
                return this.dataLayers[type].dataLayers;
            }

            developerMode(selectors, layerType) {

                if (!this.dynamic) {
                    $(selectors).css('background-color', 'red').css('border', '2px solid red').css('display', 'block');

                    for (let i = 0; i < $(selectors).length; i++) {
                        $(selectors).addClass('datalayered');

                        tippy($(selectors)[i], {
                            content: "<pre style='font-size:14px;'>" + JSON.stringify(this.getDataLayers(layerType, $(selectors)[i]), null, 2) + "</pre>",
                            allowHTML: true
                        });
                    }
                } else {
                    let that = this;

                    $("body").on('mouseover', selectors, function () {
                        if ($(this).hasClass('datalayered'))
                            return;
                        $(this).addClass('datalayered');

                        $(this).css('background-color', 'red').css('border', '2px solid red').css('display', 'block');
                        tippy([this], {
                            content: "<pre style='font-size:14px;'>" + JSON.stringify(that.getDataLayers(layerType, $(this)), null, 2) + "</pre>",
                            allowHTML: true
                        });
                    });
                }
            }

            pushDataLayer(dataLayer) {
                window.dataLayer.push(dataLayer);
                console.log(JSON.stringify(dataLayer));
            }

            init() {
                for (const layerType in this.dataLayers) {
                    if (!this.supportDataLayers.includes(layerType)) {
                        console.log("ERROR: Unsupport BB Data Layer", layerType);
                        continue;
                    }

                    if (dev_mode)
                        this.developerMode(this.dataLayers[layerType].selectors, layerType);


                    $("body").on("click", this.dataLayers[layerType].selectors, (e) => {
                        console.log(layerType);
                        console.log(e);

                        this.pushDataLayer(this.getDataLayers(layerType, e.currentTarget));
                    });

                }
            }
        };

        let _globalDataLayer = new BBDataLayers(globalDataLayers, dev_mode);
        _globalDataLayer.init();

        let _algoliaDataLayers = new BBDataLayers(algoliaDataLayers, dev_mode, true);
        _algoliaDataLayers.init();


        //Hub Related Datalayers
        if (document.querySelector('.hub-template-default')) {
            let _hubDataLayer = new BBDataLayers(hubDataLayers, dev_mode);
            _hubDataLayer.init();
        }

        //Home Related Datalayers
        if (document.querySelector(".home")) {
            let _homeDataLayer = new BBDataLayers(homeDataLayers, dev_mode);
            _homeDataLayer.init();
        }

        //Article Archive Related Datalayers
        if (document.querySelector(".page-template-page_articles")) {
            let _articleArchiveDataLayer = new BBDataLayers(articlesDataLayers)
            _articleArchiveDataLayer.init();
        }

        //Single Article Related Datalayers
        if (document.querySelector(".single-post") || document.querySelector(".single-podcast-episode")) {
            let _singleArticleDataLayer = new BBDataLayers(singleArticleDataLayers, dev_mode, true);
            _singleArticleDataLayer.init();
        }

        //Art Archive Related Datalayers
        if (document.querySelector(".page-template-page_art-archive")) {
            let _artArchiveDataLayer = new BBDataLayers(artDataLayers)
            _artArchiveDataLayer.init();
        }

        //Podcast Related Datalayers

        if (document.querySelector('.tax-podcast-show, .single-podcast-episode')) {
            let _podcastShow = new BBDataLayers(podcastDataLayers, dev_mode);
            _podcastShow.init();
        }


        //Videos
        function bb_setup_iframe_tracking($) {

            /*
            Track iframe impressions using Google Analytics events
            (we cannot track events within the iframe)

            How it works:
            1. We can track mouse over/out events of an iframe
            2. Remember what iframe is hovered over, clear when hovered out
            3. Track window 'blur' events (when the user loses focus of the window)
            4. If the window blurs while an iframe is active, the user clicked into the iframe

            See:
            https://3.basecamp.com/3464450/buckets/3822167/todos/3578866791#__recording_3588334412
            */

            function getDatalayerByIframe($iframe) {
                var iframe_src = $iframe.attr('src');
                var iframe_title = $iframe.attr('data-title');
                var $meta = $iframe.siblings('meta[itemprop="name"]');
                if ($meta.length > 0) iframe_title = $meta.attr('content');
                if (!iframe_title) iframe_title = '[iframe url] ' + iframe_src;

                if (iframe_src.match(/(embed.ted.com)/gi) || iframe_src.match(/(youtube.com)/gi) || (iframe_src.match(/(player.vimeo.com)/gi) && $iframe.attr('title'))) {
                    var video_title = $iframe.closest('.video__container').attr('data-title') ? $iframe.closest('.video__container').attr('data-title') : $iframe.attr('title');

                    let dataLayer = {
                        'ga-event-category': 'Video',
                        'ga-event-action': 'Play',
                        'ga-event-label': video_title || iframe_title,
                        'ga-event-non-interaction': false,
                        'event': 'GA Event Video Played'
                    }
                    tippy(".video__container:not(.datalayered)", {
                        content: "<pre style='font-size:14px;'>" + JSON.stringify(dataLayer, null, 2) + "</pre>",
                        allowHTML: true
                    });

                    $(".video__container").addClass('datalayered').css('border', '2px solid red');
                }
            }

            $(function () {
                var hovered_iframe = false;
                var has_console = (typeof console === 'object' && typeof console.log === 'function');

                // Track mouse events over iframes to know which iframe is the current hovered target
                $(document.body).on('mouseover mouseout', 'iframe', function (e) {
                    if (e.type === 'mouseover') {
                        hovered_iframe = this;
                        getDatalayerByIframe($(hovered_iframe));
                    } else {
                        hovered_iframe = false;
                    }
                });

                // Track "window blur" to know when focus of the current webpage was lost
                // If an iframe is active when this happens, the user clicked on an iframe
                $(window).on('blur', function (e) {
                    var $iframe = !!hovered_iframe ? $(hovered_iframe) : [];
                    if ($iframe.length < 1) return;

                    var iframe_src = $iframe.attr('src');

                    // 1. Use the data-title attribute of the iframe.
                    var iframe_title = $iframe.attr('data-title');

                    // 2. Otherwise look for a sibling <meta itemprop="name" content=XXX> (for ARVE)
                    var $meta = $iframe.siblings('meta[itemprop="name"]');
                    if ($meta.length > 0) iframe_title = $meta.attr('content');

                    // 3. Otherwise fall back to the iframe url
                    if (!iframe_title) iframe_title = '[iframe url] ' + iframe_src;


                    window.dataLayer = window.dataLayer || [];

                    if (iframe_src.match(/(spotify.com)/gi)) {
                        var podcastEmbed = $iframe.closest('.podcast__embed');
                        if (podcastEmbed)
                            iframe_title = podcastEmbed.attr('data-ga-title')

                    } else if (iframe_src.match(/(embed.ted.com)/gi) || iframe_src.match(/(youtube.com)/gi) || iframe_src.match(/(player.vimeo.com)/gi)) {
                        var video_title = $iframe.attr('title');

                        window.dataLayer.push({
                            'ga-event-category': 'Video',
                            'ga-event-action': 'Play',
                            'ga-event-label': video_title || iframe_title,
                            'ga-event-non-interaction': false,
                            'event': 'GA Event Video Played'
                        });
                        console.log(video_title || iframe_title);
                        return;
                    }

                    var data = {
                        'event': 'iframe-click', // 'iFrame window clicked',
                        '_event': 'iframe-click', // 'iFrame window clicked',

                        'category': 'iframe',
                        'ga-event-category': 'iframe',

                        'action': 'iframe-click',
                        'ga-event-action': 'iframe-click',

                        'label': iframe_title,
                        'ga-event-label': iframe_title,

                        'non-interaction': false,
                        'ga-event-non-interaction': false,

                        'iframe_url': iframe_src,
                        'iframe_title': iframe_title
                    };

                    window.dataLayer.push(data);

                    if (has_console) {
                        console.log('iFrame impression:', data);
                    }
                });

            });
        }

        bb_setup_iframe_tracking($);
    })(bbdatalayers.developer_mode, jQuery);
});