NIHVIVO-2783 NIHVIVO-2784 Tweaked JavaScript and CSS for URI (qTip) and QR code popups.

productMods/js/individual/individualUtils.js

@@ -11,34 +11,40 @@ $(document).ready(function(){
     // This function creates and styles the "qTip" tooltip that displays the resource uri when the user clicks the uri icon.
     $('#uriIcon').each(function()
     {
-       $(this).qtip(
-       {
-          content: {
-              title: { 
-                  text: 'URI',
-              },
-              text: '<br /><span id="uri-text">' + $("#uriIcon").attr("title") + '</span><br /><br />'
-          },
-          position: {
-              corner: {
-              target: 'leftBottom',
-              tooltip: 'bottomLeft'
-              }
-          },
-          show: {
-             when: {event: 'click'}
-          },
-          hide: {
-             fixed: true // Make it fixed so it can be hovered over
-          },
-          style: {
-              title: {'backgroundColor': '#2485AE', 'color': 'white', 'fontFamily': '"Lucida Sans Unicode","Lucida Grande", Geneva, helvetica, sans-serif'},
-             padding: '6px 6px', // Give it some extra padding
-             width: 380,
-             textAlign: 'center',
-             backgroundColor: '#f1f2ee'
-         }
-       });
+        $(this).qtip(
+        {
+            content: {
+                prerender: true, // We need this for the .click() event listener on 'a.close'
+                text: '<h5>share the URI for this profile</h5> <input id="uriLink" type="text" value="' + $('#uriIcon').attr('title') + '" /> <a class="close" href="#">close</a>'
+            },
+            position: {
+                corner: {
+                    target: 'bottomLeft',
+                    tooltip: 'topLeft'
+                }
+            },
+            show: {
+                when: {event: 'click'}
+            },
+            hide: {
+                fixed: true, // Make it fixed so it can be hovered over and interacted with
+                when: {
+                    target: $('a.close'),
+                    event: 'click'
+                }
+            },
+            style: {
+                padding: '6px',
+                width: 380,
+                backgroundColor: '#f1f2ee'
+            }
+        });
+    });
+    
+    // Prevent close link for URI qTip from requesting bogus '#' href
+    $('a.close').click(function() {
+        $('#uriIcon').qtip("hide");
+        return false;
     });
     
     // Reveal vCard QR code when QR icon is clicked