hoverxref.js_t

var mathjax = {{ 'true' if hoverxref_mathjax else 'false' }};
var sphinxtabs = {{ 'true' if hoverxref_sphinxtabs else 'false' }};
{% set sphinx_rtd_theme = 'true' if html_theme == 'sphinx_rtd_theme' else 'false' %}


function reRenderTooltip (instance, helper) {
    // Check if the content is the same as the default content until
    // it's different. Once it's different, re renders its content
    // to show it properly (this may involve calling external JS
    // libraries like MathJax) and finally call tooltip.reposition().
    if (helper.tooltip.textContent !== '{{ hoverxref_tooltip_content }}') {
        // https://stackoverflow.com/questions/5200545/how-to-recall-or-restart-mathjax
        if (mathjax) {
            if (typeof MathJax !== 'undefined') {
                reLoadMathJax(helper.tooltip.id);
            } else {
                console.debug('Not triggering MathJax because it is not defined');
            };

        };
        instance.reposition();
    } else {
        setTimeout(reRenderTooltip, 100, instance, helper);
    };
}


function reLoadMathJax(elementId) {
    if (parseInt(MathJax.version[0]) >= 3) {
        console.debug('Typesetting for Mathjax3');
        MathJax.typeset();
    } else {
        console.debug('Typesetting for MathJax2');
        MathJax.Hub.Queue((["Typeset", MathJax.Hub, elementId]));
    }
}


function reLoadSphinxTabs() {
    if (sphinxtabs) {
        // https://github.com/djungelorm/sphinx-tabs
        console.debug('Triggering Sphinx Tabs rendering');
        (function(d, script) {
            // HACK: please, improve this code to call the content of "tab.js" without creating a script element

            // Get the URL from the current generated page since it's not always the same
            var older_tabs_src = $('script[src$="sphinx_tabs/tabs.js"]');
            if (older_tabs_src.length != 0) {
                // sphinx-tabs < 2
                older_tabs_src = older_tabs_src[0].older_tabs_src
                script = d.createElement('script');
                script.type = 'text/javascript';
                script.onload = function(){
                    // remote script has loaded
                };
                script.older_tabs_src = older_tabs_src;
                d.getElementsByTagName('head')[0].appendChild(script);

                // Once the script has been executed, we remove it from the DOM
                script.parentNode.removeChild(script);
            }
            var newer_tabs_src = $('script[src$="_static/tabs.js"]');
            if (newer_tabs_src.length != 0) {
                // sphinx-tabs > 2
                // Borrowed from
                // https://github.com/executablebooks/sphinx-tabs/blob/0f3cbbe/sphinx_tabs/static/tabs.js#L8-L17
                var allTabs = document.querySelectorAll('.sphinx-tabs-tab');
                var tabLists = document.querySelectorAll('[role="tablist"]');
                allTabs.forEach(tab => {
                    tab.addEventListener("click", changeTabs);
                });

                tabLists.forEach(tabList => {
                    tabList.addEventListener("keydown", keyTabs);
                });
            }

        }(document));
    };
};

function getEmbedURL(url) {
    var params = {
        'doctool': 'sphinx',
        'doctoolversion': '{{ hoverxref_sphinx_version }}',
        'url': url,
    }
    console.debug('Data: ' + JSON.stringify(params));
    var url = '{{ hoverxref_api_host }}' + '/api/v3/embed/?' + $.param(params);
    console.debug('URL: ' + url);
    return url
}


$(document).ready(function() {
    // Define a custom HTTP header to send the requests to the server
    $.ajaxSetup({
        beforeSend: function(request) {
            request.setRequestHeader('X-HoverXRef-Version', '{{ http_hoverxref_version }}');
        }
    });

    // Remove ``title=`` attribute for intersphinx nodes that have hoverxref enabled.
    // It doesn't make sense the browser shows the default tooltip (browser's built-in)
    // and immediately after that our tooltip was shown.
    $('.hoverxref.external').each(function () { $(this).removeAttr('title') });

    $('.hoverxref.tooltip').tooltipster({
        theme: {{ hoverxref_tooltip_theme }},
        interactive: {{ 'true' if hoverxref_tooltip_interactive else 'false' }},
        maxWidth: {{ hoverxref_tooltip_maxwidth }},
        animation: '{{ hoverxref_tooltip_animation }}',
        animationDuration: {{ hoverxref_tooltip_animation_duration }},
        side: '{{ hoverxref_tooltip_side }}',
        content: '{{ hoverxref_tooltip_content }}',
        contentAsHTML: true,

        functionBefore: function(instance, helper) {
            var $origin = $(helper.origin);
            var href = $origin.prop('href');

            // we set a variable so the data is only loaded once via Ajax, not every time the tooltip opens
            if ($origin.data('loaded') !== true) {
                var url = getEmbedURL(href);
                $.get(url, function(data) {
                    // call the 'content' method to update the content of our tooltip with the returned data.
                    // note: this content update will trigger an update animation (see the updateAnimation option)
                    instance.content(data['content']);

                    // to remember that the data has been loaded
                    $origin.data('loaded', true);
                });
            }
        },

        functionReady: function(instance, helper) {
            // most of Read the Docs Sphinx theme bases its style on "rst-content".
            // We add that class to the tooltipser HTML tag here by default or a user-defined one.
            helper.tooltip.classList.add('{{ hoverxref_tooltip_class }}');
            reLoadSphinxTabs();
            setTimeout(
                reRenderTooltip,
                50,
                instance,
                helper
            );
        }
    })

    var modalHtml = `
  <div class="modal micromodal-slide {{ hoverxref_modal_class }}" id="micromodal" aria-hidden="true">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
      <div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="micromodal-title">
        <header class="modal__header">
          <h1 class="modal__title" id="micromodal-title"></h1>
          <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
        </header>
        <hr/>
        <main class="modal__content" id="micromodal-content"></main>
        <footer class="modal__footer">
          <button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
        </footer>
      </div>
    </div>
  </div>
`
    $('body').append(modalHtml);

    {% if sphinx_rtd_theme %}
    function onShow(modal, element) {
        // This is a HACK to get some "smart" left position of the
        // modal depending its size.
        var container = $('#micromodal .modal__container')
        var maxWidth = $('.wy-nav-content').innerWidth() - 150;
        var contentLeft = $('.wy-nav-content').position().left;
        if (container.width() >= maxWidth) {
            var left = contentLeft - 150;
        }
        else {
            var left = contentLeft + 150;
        }
        console.debug('Container left position: ' + left);
        container.css('left', left);
    }
    {% endif %}

    function showModal(element) {
        var href = element.prop('href');
        var url = getEmbedURL(href);
        $.get(url, function(data) {
            var content = $('<div></div>');
            content.html(data['content']);

            var h1 = $('h1:first', content);
            var title = h1.text()
            if (title) {
                var link = $('a', h1).attr('href') || '#';

                // Remove permalink icon from the title
                var title = title.replace('¶', '').replace('', '');

                var a = $('<a></a>').attr('href', link).text('{{ hoverxref_modal_prefix_title }}' + title);
            }
            else {
                var a = '{{ hoverxref_modal_prefix_title }}{{ hoverxref_modal_default_title }}';
            }
            h1.replaceWith('');

            $('#micromodal-title').html(a);
            $('#micromodal-content').html(content);
            MicroModal.show('micromodal', {
                {% if sphinx_rtd_theme or hoverxref_modal_onshow_function %}
                onShow: {{ hoverxref_modal_onshow_function|default('onShow', true) }},
                {% endif %}
                openClass: '{{ hoverxref_modal_openclass }}',
                disableScroll: {{ 'true' if hoverxref_modal_disable_scroll else 'false' }},
                disableFocus: {{ 'true' if hoverxref_modal_disable_focus else 'false' }},
                awaitOpenAnimation: {{ 'true' if hoverxref_modal_awaitopenanimation else 'false' }},
                awaitCloseAnimation: {{ 'true' if hoverxref_modal_awaitcloseanimation else 'false' }},
                debugMode: {{ 'true' if hoverxref_modal_debugmode else 'false' }}
            });
            $('#micromodal .modal__container').scrollTop(0);
            reLoadSphinxTabs();
            if (mathjax) {
                if (typeof MathJax !== 'undefined') {
                    reLoadMathJax('micromodal');
                } else {
                    console.debug('Not triggering MathJax because it is not defined');
                };
            };
        });
    };

    var delay = {{ hoverxref_modal_hover_delay }}, setTimeoutConst;
    $('.hoverxref.modal').hover(function(event) {
        var element = $(this);
        console.debug('Event: ' + event + ' Element: ' + element);
        event.preventDefault();

        setTimeoutConst = setTimeout(function(){
            showModal(element);
        }, delay);
    }, function(){
        clearTimeout(setTimeoutConst);
    });
});