Add hooks to add details to annotation popovers.

Author: manthey

histomicsui/web_client/templates/popover/annotationPopover.pug

@@ -2,7 +2,7 @@
   - var annotationCount = 0;
     each annotation in annotations
 
-      // show at most 4 annotations
+      //- show at most 4 annotations
       if annotationCount < 4
         - annotationCount += 1;
           - var id = annotation.id;
@@ -23,15 +23,18 @@
             - var elementCount = 0;
               each element in elements[id]
 
-                // show at most 10 elements per annotation
+                //- show at most 10 elements per annotation
                 if elementCount < 10
                   - elementCount += 1;
-                    - var type = element.get('type');
-                    - var props = elementProperties(element);
-                    .h-element-type
-                      = type
-                    table
-                      for value, key in props
-                        tr
-                          td #{key}
-                            td #{value}
+                  - var type = element.get('type');
+                  - var props = elementProperties(element);
+                  .h-element-type
+                    = type
+                  table
+                    for value, key in props
+                      tr
+                        td #{key}
+                          td #{value}
+                  - var add = elementAdditionalValues(element, annotation)
+                  if add
+                    | !{add}

histomicsui/web_client/views/popover/AnnotationPopover.js

@@ -106,7 +106,8 @@ var AnnotationPopover = View.extend({
                     elements: {[annotation.id]: [element]},
                     formatDate,
                     users: this._users,
-                    elementProperties: (element) => this._elementProperties(element)
+                    elementProperties: (element) => this._elementProperties(element),
+                    elementAdditionalValues: (element, annotation) => this._elementAdditionalValues(element, annotation)
                 })
             );
         }
@@ -158,10 +159,9 @@ var AnnotationPopover = View.extend({
     },
 
     /**
-     * Get an object containing elements that are to be
-     * displayed to the user in a popover.  This object is
-     * cached on the model to avoid recomputing these properties
-     * every time they are displayed.
+     * Get an object containing elements that are to be displayed to the user
+     * in a popover.  This object is cached on the model to avoid recomputing
+     * these properties every time they are displayed.
      */
     _elementProperties(element) {
         // cache the popover properties to reduce
@@ -240,6 +240,17 @@ var AnnotationPopover = View.extend({
         return props;
     },
 
+    /**
+     * Return additional HTML to add to element popovers.
+     *a
+     * @param {object} element The annotation element under the cursor.
+     * @param {object} annotation The backbone annotation model.
+     * @returns {string} An HTML string that will be added to the popover or
+     *   undefined.
+     */
+    _elementAdditionalValues(element, annotation) {
+    },
+
     /**
      * Remove the hidden class on the popover element if this._visible()
      * returns true.

tox.ini

@@ -43,7 +43,7 @@ extras =
 skipsdist = true
 skip_install = true
 deps =
-  flake8<6
+  flake8
   flake8-bugbear
   flake8-docstrings
   flake8-isort