Add structure info link and configuration

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

src/pages/detect.vue

@@ -16,6 +16,15 @@
           <f7-button @click="captureVidFrame()" style="position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%); z-index: 3;" fill large>Capture</f7-button>
         </div>
         <canvas id="im-draw" ref="image_cvs" @click="structureClick" :style="`display: ${(imageLoaded || videoAvailable) ? 'block' : 'none'}; flex: 1 1 0%; max-width: 100%; max-height: 100%; min-width: 0; min-height: 0; background-size: contain; background-position: center; background-repeat: no-repeat; z-index: 2;`" />
+        <f7-link v-if="getInfoUrl && (selectedChip > -1)"
+          :style="`left: ${infoLinkPos.x}px; top: ${infoLinkPos.y}px;`"
+          class="structure-info"
+          :icon-only="true"
+          icon-f7="info"
+          target="_blank"
+          :external="true"
+          :href="infoLinkTarget"
+        />
       </div>
       <div class="chip-results" style="grid-area: result-view; flex: 0 0 auto; align-self: center;">
         <f7-chip v-for="result in showResults.filter( r => { return r.aboveThreshold && r.isSearched && !r.isDeleted })"
@@ -157,7 +166,8 @@
         reloadModel: false,
         videoDeviceAvailable: false,
         videoAvailable: false,
-        cameraStream: null
+        cameraStream: null,
+        infoLinkPos: {}
       }
     },
     setup() {
@@ -254,6 +264,11 @@
       },
       demoEnabled () {
         return this.otherSettings.demo || this.demoMode
+      },
+      infoLinkTarget () {
+        if (!this.getInfoUrl) return ''
+        let structure = this.showResults.find( r => r.resultIndex == this.selectedChip)
+        return this.getInfoUrl + structure.label.replaceAll(' ','_')
       }
     },
     methods: {
@@ -343,10 +358,12 @@
         }
 
         const boxCoords = this.box2cvs(this.resultData.detections[iChip])[0]
+        this.infoLinkPos.x = boxCoords.cvsLeft
+        this.infoLinkPos.y = boxCoords.cvsTop
 
-        var boxLeft = boxCoords.cvsLeft
-        var boxTop = boxCoords.cvsTop
-        var boxWidth = boxCoords.cvsRight - boxCoords.cvsLeft
+        let boxLeft = boxCoords.cvsLeft
+        let boxTop = boxCoords.cvsTop
+        let boxWidth = boxCoords.cvsRight - boxCoords.cvsLeft
         var boxHeight = boxCoords.cvsBottom - boxCoords.cvsTop
         imageCtx.strokeRect(boxLeft,boxTop,boxWidth,boxHeight)
         this.selectedChip = iChip