Account for scale-to-fit in image stream

Clicking the image was being scaled incorrectly, because the code assumed the image filled
the <img> element.  However, with CSS scale-to-fit
(content-fit: contain), that's not a good assumption.
This commit adds logic to scale the click coordinates properly.

src/components/viewComponents/streamDisplay.vue

@@ -132,14 +132,18 @@ export default {
       let xCoordinate = event.offsetX;
       let yCoordinate = event.offsetY;
 
+      // Simply scaling by naturalHeight/offsetHeight may give the wrong answer!
+      // because we use content-fit: contain in the stylesheet, the img element
+      // may be larger than the picture.  So, we must determine whether the
+      // width or height is setting the scaling factor, and use a uniform scale 
+      // factor.
+      let scale = Math.max(event.target.naturalWidth/event.target.offsetWidth,
+                           event.target.naturalHeight/event.target.offsetHeight);
+
       let xRelative =
-        ((0.5 * event.target.offsetWidth - xCoordinate) /
-          event.target.offsetWidth) *
-        event.target.naturalWidth;
+        (0.5 * event.target.offsetWidth - xCoordinate) * scale;
       let yRelative =
-        ((0.5 * event.target.offsetHeight - yCoordinate) /
-          event.target.offsetHeight) *
-        event.target.naturalHeight;
+        (0.5 * event.target.offsetHeight - yCoordinate) * scale;
 
       // Emit a signal to move, acted on by panelNavigate.vue
       this.$root.$emit(