Make popover text selectable

Previously, with 'focus', the popover would disappear after a
click. With 'click', it stays around until explicitly closed,
either by the close button within the popover, or by re-clicking
the info icon that opened it. This allows the user to select
text in the popover, and in the case of URLs, paste them into
new tabs to visit the relevant sites.

src/mmw/js/src/app.js

@@ -64,6 +64,11 @@ var App = new Marionette.Application({
 
         // Enable screenshot functionality
         initializeShutterbug();
+
+        // Enabling hiding popovers from within them
+        window.closePopover = function() {
+            $('[data-toggle="popover"]').popover('hide');
+        };
     },
 
     load: function(data) {

src/mmw/js/src/data_catalog/templates/resultDetailsCuahsi.html

@@ -11,7 +11,7 @@ <h2>
             <a data-toggle="popover" tabindex="0"
                data-html="true" data-container="body" role="button"
                data-content="{{ description }}"
-               data-template="<div class='popover'><div class='pull-right' id='popover-close-button'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
+               data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
                 <i class="fa fa-info-circle black"></i>
             </a>
         </p>

src/mmw/js/src/data_catalog/views.js

@@ -470,7 +470,7 @@ var ResultDetailsView = Marionette.ItemView.extend({
     onAttach: function() {
         this.$('[data-toggle="popover"]').popover({
             placement: 'right',
-            trigger: 'focus',
+            trigger: 'click',
         });
         this.$('[data-toggle="table"]').bootstrapTable();
     },