Index: lams_central/web/includes/javascript/doc-popover.js =================================================================== diff -u -rc911e2db50e914ea8a7b2740d02d53522eff6c15 -rcfc56a1f900aa4094d83dc5b1aff03c1eca0bf7e --- lams_central/web/includes/javascript/doc-popover.js (.../doc-popover.js) (revision c911e2db50e914ea8a7b2740d02d53522eff6c15) +++ lams_central/web/includes/javascript/doc-popover.js (.../doc-popover.js) (revision cfc56a1f900aa4094d83dc5b1aff03c1eca0bf7e) @@ -14,9 +14,10 @@ } }) .popover({ - 'html' : true, - 'container' : 'body', + 'html' : true, 'trigger' : 'click', + // without this option the close button in popover title does not show up + 'sanitize' : false, 'title' : function(){ // first try to get the title straight from element attributes let popover = $(this), @@ -45,7 +46,14 @@ } // if content found then try to extract title from it, if any title = content.children('.doc-popover-title'); - return title.length === 0 ? "" : title.html(); + title = title.length === 0 ? "" : title.html(); + if (title) { + // put title text on the left and a close button on the right + title = '
' + title + + ''; + } + + return title; }, 'content' : function(){ // first try to get content straight from element attributes @@ -74,6 +82,14 @@ return contentBody.length === 0 ? "" : contentBody.html(); } }); + + // when a close button is clicked, close the popover + $(document).on('keypress click', '.popover .popover-title .close', function(e){ + if (e.type == "click" || e.keyCode === 32 || e.keyCode == 13) { + var popoverId = $(this).closest('.popover').attr('id'); + $('[data-original-title], [data-toggle="doc-popover"][aria-describedby="' + popoverId + '"]').popover('hide'); + } + }); // Dismiss popover on a click outside an open popover // Taken from https://stackoverflow.com/a/33953365