diff --git a/src/public/assets/scripts/main.js b/src/public/assets/scripts/main.js index a8313ac..ea86357 100644 --- a/src/public/assets/scripts/main.js +++ b/src/public/assets/scripts/main.js @@ -1,3 +1,3 @@ -biigle.$viewModel("annotations-navbar",function(t){new Vue({el:t,mixins:[biigle.$require("annotations.mixins.imageFilenameTracker")],data:{defaultFilename:t.innerText,imageIds:biigle.$require("annotations.imagesIds").slice(),imageIdsLeft:biigle.$require("annotations.imagesIds").slice(),initialImageId:null,showIndicator:!0},computed:{progressPath:function(){return"M 2 1 A 1 1 0 "+(this.progress>=.5?1:0)+" 1 "+this.arcPosition(this.progress).join(" ")+"L 1 1"},initialProgressPath:function(){return"M 1 1 L "+this.arcPosition(this.initialProgress).join(" ")},progressTitle:function(){var t=["started at "+this.initialImageNumber];return this.hasSeenAllImages&&t.push("seen all"),"Image "+this.currentImageNumber+" of "+this.imageIds.length+" ("+t.join(", ")+")"},currentImageNumber:function(){return this.currentImageId?this.imageIds.indexOf(this.currentImageId)+1:0},progress:function(){return this.currentImageNumber/this.imageIds.length},initialImageNumber:function(){return null===this.initialImageId?1:this.imageIds.indexOf(this.initialImageId)+1},initialProgress:function(){return this.initialImageNumber/this.imageIds.length},hasSeenAllImages:function(){return 0===this.imageIdsLeft.length},showInitialProgressMarker:function(){return 1!==this.initialImageNumber},indicatorClass:function(){return this.hasSeenAllImages?"progress-indicator--all":""},filenameClass:function(){return this.hasSeenAllImages?"text-success":""},filenameTitle:function(){return this.hasSeenAllImages?"You have seen all images":""}},methods:{arcPosition:function(t){return[Math.cos(2*Math.PI*t)+1,Math.sin(2*Math.PI*t)+1]},setInitialImageId:function(t){this.initialImageId=t},updateShowIndicator:function(t){this.showIndicator=!1!==t}},watch:{currentImageId:function(t){for(var e=this.imageIdsLeft,n=e.length-1;n>=0;n--)if(e[n]===t){e.splice(n,1);break}},currentImageFilename:function(t){document.title="Annotate "+t}},created:function(){var t=this,e=biigle.$require("events");e.$on("images.sequence",function(e){t.imageIds=e.slice(),t.imageIdsLeft=e.slice()}),e.$once("images.change",this.setInitialImageId);var n=biigle.$require("annotations.stores.settings");this.updateShowIndicator(n.get("progressIndicator")),n.watch("progressIndicator",this.updateShowIndicator)}})}),biigle.$viewModel("annotator-container",function(t){var e=biigle.$require("events"),n=biigle.$require("annotations.volumeId"),i=biigle.$require("annotations.imagesIds"),o=biigle.$require("annotations.stores.images"),a=biigle.$require("annotations.stores.annotations"),s=biigle.$require("urlParams"),r=biigle.$require("messages.store"),l=biigle.$require("utils.debounce"),h=biigle.$require("annotations.stores.settings"),c=biigle.$require("annotations.models.LabelAnnotationFilter"),u=biigle.$require("annotations.models.UserAnnotationFilter"),d=biigle.$require("annotations.models.ShapeAnnotationFilter"),m=biigle.$require("annotations.models.SessionAnnotationFilter");new Vue({el:t,mixins:[biigle.$require("core.mixins.loader")],components:{sidebar:biigle.$require("core.components.sidebar"),sidebarTab:biigle.$require("core.components.sidebarTab"),annotationsTab:biigle.$require("annotations.components.siaAnnotationsTab"),labelsTab:biigle.$require("annotations.components.labelsTab"),annotationModesTab:biigle.$require("annotations.components.annotationModesTab"),colorAdjustmentTab:biigle.$require("annotations.components.colorAdjustmentTab"),imageLabelTab:biigle.$require("annotations.components.imageLabelTab"),settingsTab:biigle.$require("annotations.components.settingsTab"),annotationCanvas:biigle.$require("annotations.components.annotationCanvas")},data:{isEditor:biigle.$require("annotations.isEditor"),imageIndex:null,image:null,annotations:[],annotationFilter:null,annotationFilters:[new c,new u,new d({data:{shapes:biigle.$require("annotations.shapes")}}),new m({data:{sessions:biigle.$require("annotations.sessions")}})],lastCreatedAnnotation:null,lastCreatedAnnotationTimeout:null,annotationOpacity:1,mapCenter:void 0,mapResolution:void 0,selectedLabel:null,annotationMode:"default",focussedAnnotationIndex:null,annotationModeCarry:null,showMousePosition:!1,showZoomLevel:!1,showLabelTooltip:!1,showMeasureTooltip:!1,showMinimap:!0,showScaleLine:!1,imagesArea:null,openTab:null,userUpdatedVolareResolution:!1},computed:{imageId:function(){return this.imagesIds[this.imageIndex]},hasAnnotationFilter:function(){return null!==this.annotationFilter},filteredAnnotations:function(){var t=this.annotations.filter(function(t){return!t.markedForDeletion});return this.annotationFilter?this.annotationFilter.filter(t):t},selectedAnnotations:function(){return this.filteredAnnotations.filter(function(t){return t.selected})},supportsColorAdjustment:function(){return o.supportsColorAdjustment},focussedAnnotation:function(){return this.filteredAnnotations[this.focussedAnnotationIndex]},isDefaultAnnotationMode:function(){return"default"===this.annotationMode},isVolareAnnotationMode:function(){return"volare"===this.annotationMode},isLawnmowerAnnotationMode:function(){return"lawnmower"===this.annotationMode},isSamplingAnnotationMode:function(){return this.annotationMode.endsWith("Sampling")},imagesIds:function(){var t=window.localStorage.getItem("biigle.volumes."+n+".images");if(t){var e={};return i.forEach(function(t){e[t]=null}),JSON.parse(t).filter(function(t){return e.hasOwnProperty(t)})}return i}},methods:{getImageAndAnnotationsPromises:function(t){return[o.fetchAndDrawImage(t),a.fetchAnnotations(t)]},setCurrentImageAndAnnotations:function(t){t?(this.image=t[0],this.annotations=t[1]):(this.image=null,this.annotations=[])},updateUrlSlug:function(){s.setSlug(this.imageId)},getNextIndex:function(t){return(t+1)%this.imagesIds.length},getPreviousIndex:function(t){return(t+this.imagesIds.length-1)%this.imagesIds.length},handleNext:function(){if(!this.loading){if(this.isVolareAnnotationMode){if(this.focussedAnnotationIndex0)return void this.focussedAnnotationIndex--;this.focussedAnnotationIndex=1/0}else if(this.isLawnmowerAnnotationMode){if(this.$refs.canvas.showPreviousImageSection())return;this.annotationModeCarry=1/0}else if(this.isSamplingAnnotationMode){if(this.$refs.canvas.showPreviousSamplingLocation())return;this.annotationModeCarry=1/0}this.imageIndex=this.getPreviousIndex(this.imageIndex)}},maybeUpdateFocussedAnnotation:function(){this.isVolareAnnotationMode?this.filteredAnnotations.length>0?this.focussedAnnotationIndex===1/0?this.focussedAnnotationIndex=this.filteredAnnotations.length-1:this.focussedAnnotationIndex=0:(this.focussedAnnotationIndex=null,this.$refs.canvas.fitImage()):this.focussedAnnotationIndex=null},maybeUpdateShownImageSection:function(){this.isLawnmowerAnnotationMode&&(this.annotationModeCarry===1/0?this.$refs.canvas.showLastImageSection():this.$refs.canvas.showFirstImageSection())},maybeUpdateShownSampling:function(t){this.isSamplingAnnotationMode&&(this.$refs.canvas.setSamplingData(this.annotationMode,t),this.annotationModeCarry===1/0?this.$nextTick(this.$refs.canvas.showLastSamplingLocation):this.$nextTick(this.$refs.canvas.showFirstSamplingLocation))},maybeUpdateAnnotationMode:function(t){this.maybeUpdateFocussedAnnotation(),this.maybeUpdateShownImageSection(),this.maybeUpdateShownSampling(t)},handleMapMoveend:function(t){this.mapCenter=t.center,this.mapResolution=t.resolution,s.set({r:Math.round(100*t.resolution),x:Math.round(t.center[0]),y:Math.round(t.center[1])})},handleSelectAnnotation:function(t,e){if(!0===e||"object"==typeof e&&e.shiftKey)return void(t.selected=!0);this.annotations.forEach(function(e){e.selected=t.id===e.id})},handleSelectAnnotations:function(t,e){t.forEach(function(t){t.selected=!0}),e.forEach(function(t){t.selected=!1})},handleDeselectAnnotation:function(t){t?t.selected=!1:this.annotations.forEach(function(t){t.selected=!1})},focusAnnotation:function(t,e,n){this.$refs.canvas.focusAnnotation(t,e,n)},handleDetachAnnotationLabel:function(t,e){this.isEditor&&(t.labels.length>1?a.detachLabel(t,e).catch(r.handleErrorResponse):confirm("Detaching the last label of an annotation deletes the whole annotation. Do you want to delete the annotation?")&&this.handleDeleteAnnotation(t))},handleDeleteAnnotation:function(t){this.isEditor&&(this.lastCreatedAnnotation&&this.lastCreatedAnnotation.id===t.id&&(this.lastCreatedAnnotation=null),Vue.set(t,"markedForDeletion",!0),a.delete(t).catch(function(e){t.markedForDeletion=!1,r.handleErrorResponse(e)}))},handleDeleteAnnotations:function(t){t.forEach(this.handleDeleteAnnotation)},handleUpdateAnnotations:function(t){this.isEditor&&Vue.Promise.all(t.map(a.update)).catch(r.handleErrorResponse)},selectAndFocusAnnotation:function(t,e){this.selectedAnnotations.forEach(function(t){t.selected=!1}),t.selected=!0,this.focusAnnotation(t,!0,e)},handleFilter:function(t){this.annotationFilter=t},resetFilter:function(){this.annotationFilter&&this.annotationFilter.reset(),this.annotationFilter=null},handleSelectedLabel:function(t){this.selectedLabel=t},handleNewAnnotation:function(t,e){this.isEditor&&(t.label_id=this.selectedLabel.id,t.confidence=1,a.create(this.imageId,t).then(this.setLastCreatedAnnotation).catch(r.handleErrorResponse).finally(e))},handleAttachLabel:function(t,e){if(e=e||this.selectedLabel,this.isEditor&&e){var n={label_id:e.id,confidence:1};a.attachLabel(t,n).catch(r.handleErrorResponse)}},handleAttachAllSelected:function(){this.selectedAnnotations.forEach(this.handleAttachLabel)},emitImageChanged:function(){e.$emit("images.change",this.imageId,this.image)},cachePreviousAndNext:function(){var t=this.imagesIds[this.getPreviousIndex(this.imageIndex)],e=this.imagesIds[this.getNextIndex(this.imageIndex)];t!==this.imageId&&Vue.Promise.all([a.fetchAnnotations(e),o.fetchImage(e),a.fetchAnnotations(t),o.fetchImage(t)]).catch(function(){})},setLastCreatedAnnotation:function(t){this.lastCreatedAnnotationTimeout&&window.clearTimeout(this.lastCreatedAnnotationTimeout);var e=this;this.lastCreatedAnnotation=t,this.lastCreatedAnnotationTimeout=window.setTimeout(function(){e.lastCreatedAnnotation=null},1e4)},updateColorAdjustment:function(t){var e=this.$refs.canvas;l(function(){o.updateColorAdjustment(t),e.render()},100,"annotations.color-adjustment.update")},handleSettingsChange:function(t,e){switch(t){case"annotationOpacity":this.annotationOpacity=e;break;case"mousePosition":this.showMousePosition=e;break;case"zoomLevel":this.showZoomLevel=e;break;case"scaleLine":this.showScaleLine=e;break;case"labelTooltip":this.showLabelTooltip=e;break;case"measureTooltip":this.showMeasureTooltip=e;break;case"minimap":this.showMinimap=e}},handleAnnotationModeChange:function(t,e){this.annotationMode=t,this.annotationModeCarry=null,this.maybeUpdateAnnotationMode(e)},handleOpenedTab:function(t){h.set("openTab",t)},handleClosedTab:function(t){h.delete("openTab")},handleLoadingError:function(t){r.danger(t)},createSampledAnnotation:function(){this.$refs.canvas.createSampledAnnotation()},fetchImagesArea:function(){this.imagesArea||(this.imagesArea={},biigle.$require("annotations.api.volumeImageArea").get({id:n}).then(this.setImagesArea,r.handleErrorResponse))},setImagesArea:function(t){this.imagesArea=t.body},handleRequiresSelectedLabel:function(){r.info("Please select a label first."),this.$refs.sidebar.$emit("open","labels")}},watch:{imageId:function(t){t&&(this.startLoading(),Vue.Promise.all(this.getImageAndAnnotationsPromises(t)).catch(this.handleLoadingError).then(this.setCurrentImageAndAnnotations).then(this.updateUrlSlug).then(this.maybeUpdateAnnotationMode).then(this.emitImageChanged).then(this.cachePreviousAndNext).finally(this.finishLoading))},focussedAnnotation:function(t){t&&this.selectAndFocusAnnotation(t,this.userUpdatedVolareResolution)},annotationFilter:function(){this.maybeUpdateFocussedAnnotation()},showScaleLine:function(t){t&&this.fetchImagesArea()},showMeasureTooltip:function(t){t&&this.fetchImagesArea()},isVolareAnnotationMode:function(t){t||(this.userUpdatedVolareResolution=!1)},mapResolution:function(t){this.isVolareAnnotationMode&&(this.userUpdatedVolareResolution=!0)},annotations:function(t){this.annotationFilters[0].annotations=t,this.annotationFilters[1].annotations=t}},created:function(){if(0===this.imagesIds.length)return void r.info("Your current volume filtering contains no images.");var t=this.imagesIds.indexOf(biigle.$require("annotations.imageId"));if(-1===t&&(t=0,r.info("The requested image does not exist in your current volume filtering. Switching to the first image.")),this.imageIndex=t,e.$emit("images.sequence",this.imagesIds),void 0!==s.get("r")&&(this.mapResolution=parseInt(s.get("r"),10)/100),void 0!==s.get("x")&&void 0!==s.get("y")&&(this.mapCenter=[parseInt(s.get("x"),10),parseInt(s.get("y"),10)]),e.$on("annotations.select",this.handleSelectAnnotation),e.$on("annotations.deselect",this.handleDeselectAnnotation),e.$on("annotations.detachLabel",this.handleDetachAnnotationLabel),e.$on("annotations.delete",this.handleDeleteAnnotation),e.$on("annotations.focus",this.focusAnnotation),s.get("annotation")){var n=parseInt(s.get("annotation")),i=this;e.$once("images.change",function(){for(var t=i.annotations,e=t.length-1;e>=0;e--)if(t[e].id===n)return void i.selectAndFocusAnnotation(t[e])})}h.has("openTab")&&(this.openTab=h.get("openTab"))},mounted:function(){e.$emit("annotations.map.init",this.$refs.canvas.map)}})}),biigle.$declare("annotations.api.volumeImageArea",Vue.resource("api/v1/volumes{/id}/images/area")),biigle.$component("annotations.mixins.annotationFilter",{template:'',components:{typeahead:biigle.$require("core.components.typeahead")},data:function(){return{name:"",placeholder:"",selectedItem:null}},computed:{items:function(){return[]},selectedItemName:function(){return this.selectedItem?this.selectedItem.name:""}},methods:{select:function(t){this.selectedItem=t,this.$emit("select",this)},filter:function(t){return t},reset:function(){this.selectedItem=null}},created:function(){this.$mount()}}),biigle.$component("annotations.mixins.annotationTooltip",{props:{watch:{required:!0,type:String},position:{required:!0,type:Array},show:{required:!0,type:Boolean},positioning:{type:String,default:"top-left"}},data:function(){return{annotations:[]}},computed:{hasAnnotations:function(){return this.annotations.length>0},showThis:function(){return this.show&&this.hasAnnotations}},methods:{updateAnnotations:function(t){this.annotations=t.map(function(t){return t.get("annotation")})}},watch:{show:{immediate:!0,handler:function(t){t?this.$parent.$on(this.watch,this.updateAnnotations):this.$parent.$off(this.watch,this.updateAnnotations)}},position:function(t){this.overlay.setPosition(t)},showThis:function(t){t?this.$parent.map.addOverlay(this.overlay):this.$parent.map.removeOverlay(this.overlay)}},mounted:function(){this.overlay=new ol.Overlay({element:this.$el,offset:[15,0],positioning:this.positioning})},beforeDestroy:function(){this.$parent.map.removeOverlay(this.overlay)}}),biigle.$component("annotations.mixins.imageFilenameTracker",{data:function(){return{filenameMap:{},currentImageId:null,defaultFilename:""}},computed:{currentImageFilename:function(){return this.filenameMap[this.currentImageId]||this.defaultFilename}},methods:{updateImageId:function(t){this.currentImageId=t}},created:function(){var t=biigle.$require("events"),e=biigle.$require("annotations.imagesIds"),n=biigle.$require("annotations.imagesFilenames"),i=this.filenameMap;e.forEach(function(t,e){i[t]=n[e]}),t.$on("images.change",this.updateImageId)}}),biigle.$component("annotations.mixins.measureComponent",{props:{image:{required:!0},areas:{required:!0}},data:function(){return{unitMultipliers:[1e3,1,.01,.001,1e-6,1e-9],unitNames:["km","m","cm","mm","µm","nm"]}},computed:{area:function(){return this.areas&&this.image?this.areas[this.image.id]||-1:-1},hasArea:function(){return-1!==this.area},pxWidthInMeter:function(){return Math.sqrt(this.area/(this.image.width*this.image.height))}},methods:{powerOfTen:function(t){return Math.pow(10,Math.floor(Math.log10(t)))}}}),biigle.$component("annotations.components.annotationCanvas",{mixins:[biigle.$require("annotations.components.annotationCanvas.drawInteractions"),biigle.$require("annotations.components.annotationCanvas.magicWandInteraction"),biigle.$require("annotations.components.annotationCanvas.polygonBrushInteraction"),biigle.$require("annotations.components.annotationCanvas.translateInteraction"),biigle.$require("annotations.components.annotationCanvas.attachLabelInteraction"),biigle.$require("annotations.components.annotationCanvas.measureInteraction"),biigle.$require("annotations.components.annotationCanvas.lawnmower"),biigle.$require("annotations.components.annotationCanvas.mousePosition"),biigle.$require("annotations.components.annotationCanvas.zoomLevel"),biigle.$require("annotations.components.annotationCanvas.annotationTooltip"),biigle.$require("annotations.components.annotationCanvas.sampling"),biigle.$require("annotations.components.annotationCanvas.scaleLine")],components:{minimap:biigle.$require("annotations.components.minimap"),labelIndicator:biigle.$require("annotations.components.labelIndicator"),controlButton:biigle.$require("annotations.components.controlButton")},props:{canAdd:{type:Boolean,default:!1},canModify:{type:Boolean,default:!1},canDelete:{type:Boolean,default:!1},image:{type:Object,default:null},annotations:{type:Array,default:function(){return[]}},selectedAnnotations:{type:Array,default:function(){return[]}},center:{type:Array,default:void 0},resolution:{type:Number,default:void 0},selectedLabel:{default:null},lastCreatedAnnotation:{default:null},annotationOpacity:{type:Number,default:1},annotationMode:{type:String,default:"default"},showMinimap:{type:Boolean,default:!0},listenerSet:{type:String,default:"default"}},data:function(){return{initialized:!1,viewFitOptions:{padding:[50,50,50,50],minResolution:1},interactionMode:"default",mapSize:[0,0],mousePosition:[0,0]}},computed:{extent:function(){return this.image?[0,0,this.image.width,this.image.height]:[0,0,0,0]},viewExtent:function(){return this.initialized&&this.resolution&&this.map?this.map.getView().calculateExtent(this.mapSize):[0,0,0,0]},projection:function(){return new ol.proj.Projection({code:"biigle-image",units:"pixels",extent:this.extent})},selectedFeatures:function(){return this.selectInteraction?this.selectInteraction.getFeatures():[]},isDefaultInteractionMode:function(){return"default"===this.interactionMode},hasSelectedLabel:function(){return Boolean(this.selectedLabel)},hasSelectedAnnotations:function(){return this.selectedAnnotations.length>0},hasLastCreatedAnnotation:function(){return null!==this.lastCreatedAnnotation},previousButtonTitle:function(){switch(this.annotationMode){case"volare":return"Previous annotation";case"lawnmower":return"Previous image section";case"randomSampling":case"regularSampling":return"Previous sample location";default:return"Previous image"}},nextButtonTitle:function(){switch(this.annotationMode){case"volare":return"Next annotation";case"lawnmower":return"Next image section";case"randomSampling":case"regularSampling":return"Next sample location";default:return"Next image"}}},methods:{createMap:function(){var t=new ol.Map({controls:[new ol.control.Zoom,new ol.control.ZoomToExtent({tipLabel:"Zoom to show whole image",label:""})],interactions:ol.interaction.defaults({altShiftDragRotate:!1,doubleClickZoom:!1,keyboard:!1,shiftDragZoom:!1,pinchRotate:!1,pinchZoom:!1})}),e=biigle.$require("annotations.ol.ZoomToNativeControl");return t.addControl(new e({label:""})),t},declareNonReactiveProperties:function(){this.map=this.createMap(),this.styles=biigle.$require("annotations.stores.styles"),this.imageLayer=new ol.layer.Image,this.tiledImageLayer=new ol.layer.Tile,this.annotationFeatures=new ol.Collection,this.annotationSource=new ol.source.Vector({features:this.annotationFeatures}),this.annotationLayer=new ol.layer.Vector({source:this.annotationSource,zIndex:100,updateWhileAnimating:!0,updateWhileInteracting:!0,style:this.styles.features}),this.selectInteraction=new ol.interaction.Select({condition:ol.events.condition.click,style:this.styles.highlight,layers:[this.annotationLayer],multi:!0}),this.canModify&&(this.featureRevisionMap={},this.modifyInteraction=new ol.interaction.Modify({features:this.selectInteraction.getFeatures(),deleteCondition:function(t){return ol.events.condition.shiftKeyOnly(t)&&ol.events.condition.singleClick(t)}}))},updateMapSize:function(){this.mapSize=this.map.getSize()},updateMapView:function(t){var e=t.target.getView();this.$emit("moveend",{center:e.getCenter(),resolution:e.getResolution()})},invertPointsYAxis:function(t){for(var e=this.extent[3],n=1;n0&&e.set("color",t.labels[0].label.color),e},handleFeatureModifyStart:function(t){t.features.getArray().forEach(function(t){this.featureRevisionMap[t.getId()]=t.getRevision()},this)},handleFeatureModifyEnd:function(t){var e=this,n=t.features.getArray().filter(function(t){return e.featureRevisionMap[t.getId()]!==t.getRevision()}).map(function(t){return{id:t.getId(),image_id:t.get("annotation").image_id,points:e.getPoints(t.getGeometry())}});n.length>0&&this.$emit("update",n)},focusAnnotation:function(t,e,n){var i=this.annotationSource.getFeatureById(t.id);i&&(e?delete this.viewFitOptions.duration:this.viewFitOptions.duration=250,this.viewFitOptions.minResolution=n?this.resolution:1,this.map.getView().fit(i.getGeometry(),this.viewFitOptions))},fitImage:function(){this.map.getView().fit(this.extent,this.map.getSize())},extractAnnotationFromFeature:function(t){return t.get("annotation")},handleFeatureSelect:function(t){this.$emit("select",t.selected.map(this.extractAnnotationFromFeature),t.deselected.map(this.extractAnnotationFromFeature))},handlePrevious:function(){this.$emit("previous")},handleNext:function(){this.$emit("next")},resetInteractionMode:function(){this.interactionMode="default"},getPoints:function(t){var e;switch(t.getType()){case"Circle":e=[t.getCenter(),[t.getRadius()]];break;case"Polygon":case"Rectangle":case"Ellipse":e=t.getCoordinates()[0];break;case"Point":e=[t.getCoordinates()];break;default:e=t.getCoordinates()}return this.convertPointsFromOlToDb(e)},handleNewFeature:function(t){if(this.hasSelectedLabel){var e=t.feature.getGeometry(),n=this;t.feature.set("color",this.selectedLabel.color);var i=function(){try{n.annotationSource.removeFeature(t.feature)}catch(t){}};this.$emit("new",{shape:e.getType(),points:this.getPoints(e)},i)}else this.annotationSource.removeFeature(t.feature)},deleteSelectedAnnotations:function(){this.hasSelectedAnnotations&&confirm("Are you sure you want to delete all selected annotations?")&&this.$emit("delete",this.selectedAnnotations)},deleteLastCreatedAnnotation:function(){this.hasLastCreatedAnnotation&&this.$emit("delete",[this.lastCreatedAnnotation])},createPointAnnotationAt:function(t,e){if(this.hasSelectedLabel){var n=new ol.Feature(new ol.geom.Point([t,e]));this.annotationSource.addFeature(n),this.handleNewFeature({feature:n})}else this.requireSelectedLabel()},requireSelectedLabel:function(){this.$emit("requires-selected-label"),this.resetInteractionMode()},render:function(){this.map&&this.map.render()},handleRegularImage:function(t,e){t?this.imageLayer.setSource(new ol.source.Canvas({canvas:t.canvas,projection:this.projection,canvasExtent:this.extent,canvasSize:[t.width,t.height]})):this.imageLayer.setSource(null)},handleTiledImage:function(t,e){t?this.tiledImageLayer.setSource(new ol.source.Zoomify({url:t.url,size:[t.width,t.height],extent:[0,0,t.width,t.height],transition:100})):this.tiledImageLayer.setSource(null)},updateMousePosition:function(t){this.mousePosition=t.coordinate},refreshAnnotationSource:function(t,e){var n={};t.forEach(function(t){n[t.id]=null});var i={},o=e.getFeatures(),a=o.filter(function(t){return i[t.getId()]=null,!n.hasOwnProperty(t.getId())});a.length===o.length?e.clear(!0):(a.filter(function(t){return void 0!==t.getId()}).forEach(function(t){e.removeFeature(t)},this),t=t.filter(function(t){return!i.hasOwnProperty(t.id)})),e.addFeatures(t.map(this.createFeature))}},watch:{image:function(t,e){t?!0===t.tiled?(e&&!0===e.tiled||(this.map.removeLayer(this.imageLayer),this.map.addLayer(this.tiledImageLayer)),this.handleTiledImage(t,e)):(e&&!0!==e.tiled||(this.map.removeLayer(this.tiledImageLayer),this.map.addLayer(this.imageLayer)),this.handleRegularImage(t,e)):(this.map.removeLayer(this.tiledImageLayer),this.map.removeLayer(this.imageLayer))},annotations:function(t){this.refreshAnnotationSource(t,this.annotationSource),this.resetHoveredAnnotations()},selectedAnnotations:function(t){var e=this.annotationSource,n=this.selectedFeatures;n.clear(),t.forEach(function(t){n.push(e.getFeatureById(t.id))})},extent:function(t,e){if(t[2]!==e[2]||t[3]!==e[3]){var n=ol.extent.getCenter(t);this.initialized||(n=this.center||n),this.map.setView(new ol.View({projection:this.projection,center:n,resolution:this.resolution,zoomFactor:2,minResolution:.25,extent:t})),void 0===this.resolution&&this.map.getView().fit(t),this.initialized||(this.updateMapView({target:this.map}),this.initialized=!0)}},annotationOpacity:function(t){this.annotationLayer.setOpacity(t)},isDefaultInteractionMode:function(t){this.selectInteraction.setActive(t||this.isTranslating),this.canModify&&this.modifyInteraction.setActive(t)}},created:function(){var t=this;this.declareNonReactiveProperties(),this.annotationLayer.set("name","annotations"),this.map.addLayer(this.annotationLayer),this.imageLayer.set("name","imageRegular"),this.tiledImageLayer.set("name","imageTile"),biigle.$require("events").$on("sidebar.toggle",function(){t.$nextTick(function(){t.map.updateSize()})}),this.map.on("change:size",this.updateMapSize),this.map.on("moveend",this.updateMapView),this.map.on("pointermove",this.updateMousePosition),this.selectInteraction.on("select",this.handleFeatureSelect),this.map.addInteraction(this.selectInteraction);var e=biigle.$require("keyboard");e.on(" ",this.handleNext,0,this.listenerSet),e.on("ArrowRight",this.handleNext,0,this.listenerSet),e.on("ArrowLeft",this.handlePrevious,0,this.listenerSet),e.on("Escape",this.resetInteractionMode,0,this.listenerSet),this.canModify&&(this.modifyInteraction.on("modifystart",this.handleFeatureModifyStart),this.modifyInteraction.on("modifyend",this.handleFeatureModifyEnd),this.map.addInteraction(this.modifyInteraction)),this.canDelete&&(e.on("Delete",this.deleteSelectedAnnotations,0,this.listenerSet),e.on("Backspace",this.deleteLastCreatedAnnotation,0,this.listenerSet))},mounted:function(){this.map.setTarget(this.$el)}}),biigle.$component("annotations.components.annotationModesTab",{components:{powerToggle:biigle.$require("core.components.powerToggle")},data:function(){return{mode:"default",modes:["default","volare","lawnmower","randomSampling","regularSampling"],restoreKeys:["randomSamplingNumber","regularSamplingRows","regularSamplingColumns"],randomSamplingNumber:9,regularSamplingRows:3,regularSamplingColumns:3}},computed:{keyboard:function(){return biigle.$require("keyboard")},isVolareActive:function(){return"volare"===this.mode},isLawnmowerActive:function(){return"lawnmower"===this.mode},isRandomSamplingActive:function(){return"randomSampling"===this.mode},isRegularSamplingActive:function(){return"regularSampling"===this.mode},settings:function(){return biigle.$require("annotations.stores.settings")}},methods:{startVolare:function(){this.setMode("volare")},startLawnmower:function(){this.setMode("lawnmower")},startRandomSampling:function(){this.setMode("randomSampling")},startRegularSampling:function(){this.setMode("regularSampling")},setMode:function(t){-1!==this.modes.indexOf(t)&&(this.mode=t)},resetMode:function(){this.mode="default"},emitAttachLabel:function(){this.$emit("attach-label")},emitCreateSample:function(){this.$emit("create-sample")}},watch:{mode:function(t,e){switch(e){case"volare":this.keyboard.off("Enter",this.emitAttachLabel);break;case"randomSampling":case"regularSampling":this.keyboard.off("Enter",this.emitCreateSample)}switch(t){case"volare":this.keyboard.on("Enter",this.emitAttachLabel);break;case"randomSampling":case"regularSampling":this.keyboard.on("Enter",this.emitCreateSample)}switch(t){case"randomSampling":this.$emit("change",t,this.randomSamplingNumber);break;case"regularSampling":this.$emit("change",t,[this.regularSamplingRows,this.regularSamplingColumns]);break;default:this.$emit("change",t)}},randomSamplingNumber:function(t){this.settings.set("randomSamplingNumber",t)},regularSamplingRows:function(t){this.settings.set("regularSamplingRows",t)},regularSamplingColumns:function(t){this.settings.set("regularSamplingColumns",t)}},created:function(){this.restoreKeys.forEach(function(t){this[t]=this.settings.get(t)},this);var t=biigle.$require("urlParams").get("annotationMode");if(t){var e=this;biigle.$require("events").$once("images.change",function(){e.setMode(t)})}}}),biigle.$component("annotations.components.annotationsTab",{components:{filters:biigle.$require("annotations.components.annotationsTabFilters"),labelItem:biigle.$require("annotations.components.annotationsTabLabelItem")},props:{hasActiveFilter:{type:Boolean,default:!1},annotations:{type:Array,default:function(){return[]}},annotationFilters:{type:Array,default:function(){return[]}},canDetachOthers:{type:Boolean,default:!1},ownUserId:{type:Number,default:null},selectedAnnotations:{type:Array,default:function(){return[]}}},data:function(){return{}},computed:{labelItems:function(){var t={},e={},n={};return this.annotations.forEach(function(i){i.labels.forEach(function(o){t.hasOwnProperty(o.label.id)||(t[o.label_id]=o.label,e[o.label_id]=[]);var a=i.id+"-"+o.label_id;n.hasOwnProperty(a)||(n[a]=null,e[o.label_id].push(i))})}),Object.values(t).sort(function(t,e){return t.name.toLowerCase()>e.name.toLowerCase()?1:-1}).map(function(t){return{id:t.id,label:t,annotations:e[t.id]}})}},methods:{handleSelect:function(t,e){!1!==t.selected&&e?this.$emit("deselect",t):this.$emit("select",t,e)},emitDetach:function(t,e){this.$emit("detach",t,e)},emitSelectFilter:function(t){this.$emit("select-filter",t)},emitUnselectFilter:function(){this.$emit("unselect-filter")},emitFocus:function(t){this.$emit("focus",t)},scrollIntoView:function(t){var e,n=this.$refs.scrollList,i=n.scrollTop,o=n.offsetHeight,a=1/0,s=0;t.forEach(function(t){for(var i=n.querySelectorAll('[data-annotation-id="'+t.id+'"]'),o=i.length-1;o>=0;o--)e=i[o],a=Math.min(e.offsetTop,a),s=Math.max(e.offsetTop+e.offsetHeight,s)},this), -i>a?n.scrollTop=a:i+o=s-a?s-n.offsetHeight:a)}},watch:{selectedAnnotations:function(t){t.length>0&&this.$nextTick(function(){this.scrollIntoView(t)})}}}),biigle.$component("annotations.components.annotationsTabAnnotationItem",{template:'
    • ',props:{annotation:{type:Object,required:!0},annotationLabel:{type:Object,required:!0},canDetach:{type:Boolean,default:!1}},computed:{classObject:function(){return{selected:!1!==this.annotation.selected}},shapeClass:function(){return"icon-"+this.annotation.shape.toLowerCase()},username:function(){return this.annotationLabel.user?this.annotationLabel.user.firstname+" "+this.annotationLabel.user.lastname:"(user deleted)"}},methods:{emitSelect:function(t){this.$emit("select",this.annotation,t.shiftKey)},emitDetach:function(){this.$emit("detach",this.annotation,this.annotationLabel)},emitFocus:function(){this.$emit("focus",this.annotation)}}}),biigle.$component("annotations.components.annotationsTabFilters",{template:'
    ',props:{annotationFilters:{type:Array,default:function(){return[]}},hasActiveFilter:{type:Boolean,default:!1}},data:function(){return{chosenFilterIndex:null}},computed:{hasFilters:function(){return this.annotationFilters.length>0},chosenFilter:function(){return this.annotationFilters[this.chosenFilterIndex]},clearButtonClass:function(){return{"btn-info":this.hasActiveFilter}}},methods:{emitSelectFilter:function(t){this.$emit("select",t)},emitUnselectFilter:function(){this.$emit("unselect")}},watch:{chosenFilter:function(t,e){e&&(this.$refs.filterElement.removeChild(e.$el),e.$off("select",this.emitSelectFilter)),this.$refs.filterElement.appendChild(t.$el),t.$on("select",this.emitSelectFilter)}}}),biigle.$component("annotations.components.annotationsTabLabelItem",{template:'
    • ',components:{annotationItem:biigle.$require("annotations.components.annotationsTabAnnotationItem")},props:{label:{type:Object,default:function(){return{}}},annotations:{type:Array,default:function(){return[]}},canDetachOthers:{type:Boolean,default:!1},ownUserId:{type:Number,default:null}},data:function(){return{open:!1}},computed:{title:function(){return"Annotations with label "+this.label.name},classObject:function(){return{selected:this.isSelected}},count:function(){return this.annotationItems.length},countTitle:function(){return"There are "+this.count+" annotations with label "+this.label.name},colorStyle:function(){return"background-color: #"+this.label.color},isSelected:function(){return this.open||this.annotations.reduce(function(t,e){return t||!1!==e.selected},!1)},annotationItems:function(){var t=[];return this.annotations.forEach(function(e){e.labels.forEach(function(n){n.label_id===this.label.id&&t.push({annotation:e,annotationLabel:n,canDetach:this.canDetachAnnotationLabel(n)})},this)},this),t}},methods:{toggleOpen:function(){this.open=!this.open},emitSelect:function(t,e){this.$emit("select",t,e)},emitDetach:function(t,e){this.$emit("detach",t,e)},emitFocus:function(t){this.$emit("focus",t)},canDetachAnnotationLabel:function(t){return this.canDetachOthers||this.ownUserId===t.user_id}}}),biigle.$component("annotations.components.colorAdjustmentTab",{data:function(){return{isBrightnessRgbActive:!1,colorAdjustment:{brightnessContrast:[0,0],brightnessRGB:[0,0,0],hueSaturation:[0,0],vibrance:[0]}}},methods:{resetType:function(t,e){void 0!==e?this.colorAdjustment[t].splice(e,1,0):this.colorAdjustment[t]=this.colorAdjustment[t].map(function(){return 0})},reset:function(){for(var t in this.colorAdjustment)this.colorAdjustment.hasOwnProperty(t)&&this.resetType(t)},toggleBrightnessRgb:function(){this.isBrightnessRgbActive?this.resetType("brightnessRGB"):this.resetType("brightnessContrast",0),this.isBrightnessRgbActive=!this.isBrightnessRgbActive}},watch:{colorAdjustment:{handler:function(){this.$emit("change",this.colorAdjustment)},deep:!0}}}),biigle.$component("annotations.components.controlButton",{template:'',props:{title:{type:String,default:""},icon:{type:String,required:!0},active:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hover:{type:Boolean,default:!0},open:{type:Boolean,default:!1}},data:function(){return{mouseOver:!1,timeout:null,activeSubControls:0}},computed:{classObject:function(){return{active:this.active,"control-button--open":this.showSubControls}},iconClass:function(){return this.icon.startsWith("fa-")?"fa fa-fw "+this.icon:"icon icon-white "+this.icon},hasSubControls:function(){return this.$slots.hasOwnProperty("default")},showSubControls:function(){return this.mouseOver||this.hasActiveSubControl||this.open},hasActiveSubControl:function(){return this.activeSubControls>0}},methods:{handleClick:function(){this.disabled||this.$emit("click")},handleMouseEnter:function(){!this.disabled&&this.hover&&(this.mouseOver=!0),window.clearTimeout(this.timeout)},handleMouseLeave:function(){var t=this;window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){t.mouseOver=!1},200)},updateActiveSubControls:function(t){t?this.activeSubControls+=1:this.activeSubControls=Math.max(0,this.activeSubControls-1)}},watch:{active:function(t){this.$parent.$emit("control-button-active",t)}},created:function(){this.$on("control-button-active",this.updateActiveSubControls)},mounted:function(){this.active&&this.$parent.$emit("control-button-active",!0)}}),biigle.$component("annotations.components.imageLabelTab",{mixins:[biigle.$require("core.mixins.loader")],components:{imageLabelList:biigle.$require("volumes.components.imageLabelList")},props:{imageId:{required:!0,type:Number},selectedLabel:{type:Object,default:null}},data:function(){return{cache:{},open:!1,currentLabels:[],saving:!1}},computed:{userId:function(){return biigle.$require("annotations.userId")},isAdmin:function(){return biigle.$require("annotations.isAdmin")},imageLabelApi:function(){return biigle.$require("api.imageLabels")},hasLabels:function(){return this.currentLabels.length>0},hasSelectedLabel:function(){return null!==this.selectedLabel},canAttachSelectedLabel:function(){if(this.hasSelectedLabel){for(var t=this.currentLabels.length-1;t>=0;t--)if(this.currentLabels[t].label.id===this.selectedLabel.id)return!1;return!0}return!1},proposedLabelTitle:function(){return this.hasSelectedLabel?this.canAttachSelectedLabel?"Attach '"+this.selectedLabel.name+"' as new image label":"The selected label is already attached.":"Please select a label first."}},methods:{startSaving:function(){this.saving=!0},finishSaving:function(){this.saving=!1},showImageLabels:function(t){this.cache.hasOwnProperty(t)||(this.startLoading(),this.currentLabels=[],this.cache[t]=this.imageLabelApi.query({image_id:t}),this.cache[t].finally(this.finishLoading)),this.cache[t].then(this.updateCurrentLabels,biigle.$require("messages.store").handleErrorResponse)},updateCurrentLabels:function(t){this.currentLabels=t.body},handleDeletedLabel:function(t){for(var e=this.currentLabels.length-1;e>=0;e--)if(this.currentLabels[e].id===t.id){this.currentLabels.splice(e,1);break}},attachSelectedLabel:function(){this.startSaving();var t=this.currentLabels;this.imageLabelApi.save({image_id:this.imageId},{label_id:this.selectedLabel.id}).then(function(e){t.push(e.data)},biigle.$require("messages.store").handleErrorResponse).finally(this.finishSaving)}},watch:{imageId:function(t){this.open&&this.showImageLabels(t)},open:function(t){t&&this.showImageLabels(this.imageId)}},created:function(){var t=this;this.$parent.$watch("open",function(e){t.open=e})}}),biigle.$component("annotations.components.labelIndicator",{props:{label:{required:!0}}}),biigle.$component("annotations.components.labelTooltip",{mixins:[biigle.$require("annotations.mixins.annotationTooltip")],template:'
    ',computed:{annotationLabels:function(){return this.annotations.map(function(t){return t.labels.map(function(t){return t.label.name})})}}}),biigle.$component("annotations.components.labelsTab",{components:{labelTrees:biigle.$require("labelTrees.components.labelTrees")},data:function(){return{labelTrees:biigle.$require("annotations.labelTrees"),selectedLabel:null}},computed:{plugins:function(){return biigle.$require("annotations.components.labelsTabPlugins")}},methods:{handleSelectedLabel:function(t){this.selectedLabel=t,this.$emit("select",t)},handleDeselectedLabel:function(t){this.selectedLabel=null,this.$emit("select",null)}}}),biigle.$declare("annotations.components.labelsTabPlugins",{}),biigle.$component("annotations.components.measureTooltip",{template:'
    ',mixins:[biigle.$require("annotations.mixins.annotationTooltip"),biigle.$require("annotations.mixins.measureComponent")],data:function(){return{measuredGeometries:[]}},computed:{areaUnitMultipliers:function(){return this.unitMultipliers.map(function(t){return Math.pow(t,2)})}},methods:{updateGeometries:function(t){this.measuredGeometries=t.map(function(t){return t.getGeometry()}).filter(function(t){return this.isAeraGeometry(t)||this.isLengthGeometry(t)},this).map(function(t){return this.measure(t)},this)},measure:function(t){return t.getArea?this.formatArea(t.getArea()):t.getLength?this.formatLength(t.getLength()):t.getRadius?this.formatArea(Math.pow(t.getRadius(),2)*Math.PI):""},isAeraGeometry:function(t){return t instanceof ol.geom.Polygon||t instanceof ol.geom.Circle},isLengthGeometry:function(t){return t instanceof ol.geom.LineString},formatArea:function(t){var e="px²";if(this.hasArea){t*=Math.pow(this.pxWidthInMeter,2);var n=this.unitNearest(t,this.areaUnitMultipliers,.001);e=this.unitNames[n]+"²",t/=this.areaUnitMultipliers[n]}return this.formatMeasurement(t,e,3)},formatLength:function(t){var e="px";if(this.hasArea){t*=this.pxWidthInMeter;var n=this.unitNearest(t,this.unitMultipliers);e=this.unitNames[n],t/=this.unitMultipliers[n]}return this.formatMeasurement(t,e)},formatMeasurement:function(t,e,n){return n=Math.pow(10,n||1),Math.round(t*n)/n+" "+e},unitNearest:function(t,e,n){if(0===t)return e.length-1;n=n||1;for(var i,o=e.length-1;o>=0&&!((i=t/e[o])>=n&&i<1e3);o--);return o}},watch:{show:function(t){t?this.$parent.$on(this.watch,this.updateGeometries):this.$parent.$off(this.watch,this.updateGeometries)}}}),biigle.$component("annotations.components.minimap",function(){return{template:'
    ',props:{extent:{type:Array,required:!0},intendedWidth:{type:Number,default:250},intendedHeight:{type:Number,default:200}},data:function(){return{}},computed:{minimap:function(){return new ol.Map({controls:[],interactions:[]})},viewport:function(){return new ol.Feature}},methods:{updateViewport:function(){this.mapSize&&this.viewport.setGeometry(ol.geom.Polygon.fromExtent(this.mapView.calculateExtent(this.mapSize)))},dragViewport:function(t){this.mapView.setCenter(t.coordinate)},updateMapSize:function(t){this.mapSize=t.target.getSize()},updateMapView:function(t){this.mapView&&(this.mapView.un("change:center",this.updateViewport),this.mapView.un("change:resolution",this.updateViewport)),this.mapView=t.target.getView(),this.mapView.on("change:center",this.updateViewport),this.mapView.on("change:resolution",this.updateViewport)},updateElementSize:function(){var t=this.extent[2],e=this.extent[3],n=Math.max(t/this.intendedWidth,e/this.intendedHeight);this.minimap.setView(new ol.View({projection:this.mapView.getProjection(),center:ol.extent.getCenter(this.extent),resolution:n})),this.$el.style.width=Math.round(t/n)+"px",this.$el.style.height=Math.round(e/n)+"px",this.minimap.updateSize()},refreshImageLayer:function(t){var e=t.element.get("name");if(e&&e.startsWith("image")){var n=this.minimap.getLayers();n.getLength()>1?n.setAt(0,t.element):n.insertAt(0,t.element)}},initImageLayer:function(t){t.getArray().forEach(function(t){this.refreshImageLayer({element:t})},this)}},watch:{extent:function(){this.updateElementSize()}},created:function(){var t=new ol.source.Vector;t.addFeature(this.viewport);var e=this.$parent.map;this.mapSize=e.getSize(),this.updateMapView({target:e}),e.on("change:size",this.updateMapSize),e.on("change:view",this.updateMapView),e.once("postcompose",this.updateViewport),this.minimap.addLayer(new ol.layer.Vector({source:t,style:biigle.$require("annotations.stores.styles").viewport})),e.getLayers().on("add",this.refreshImageLayer),this.minimap.on("pointerdrag",this.dragViewport),this.minimap.on("click",this.dragViewport),this.initImageLayer(e.getLayers())},mounted:function(){this.updateElementSize(),this.minimap.setTarget(this.$el),this.updateViewport()},beforeDestroy:function(){var t=this.$parent.map;this.mapView.un("change:center",this.updateViewport),this.mapView.un("change:resolution",this.updateViewport),t.un("change:size",this.updateMapSize),t.un("change:view",this.updateMapView),t.getLayers().un("add",this.refreshImageLayer)}}}),biigle.$component("annotations.components.mousePositionIndicator",{template:'
    ',props:{position:{type:Array,required:!0}},computed:{positionText:function(){return this.position.join(" × ")}}}),biigle.$component("annotations.components.scaleLineIndicator",{mixins:[biigle.$require("annotations.mixins.measureComponent")],props:{resolution:{required:!0}},data:function(){return{targetWidth:100,leadingDigits:[1,2,5]}},computed:{scale:function(){return this.targetWidth*this.scaleMultiplier},scalePowerOfTen:function(){return this.powerOfTen(this.scale)},scaleMultiplier:function(){return this.hasArea?this.resolution*this.pxWidthInMeter:this.resolution||0},scaleNearest:function(){for(var t=0,e=1/0,n=this.leadingDigits.length-1;n>=0;n--){var i=this.leadingDigits[n]*this.scalePowerOfTen;Math.abs(this.scale-i)=0;n--)Math.abs(this.unitMultipliers[n]-this.scalePowerOfTen)1&&(t[t.length-1]="png"),"biigle_screenshot_"+(t=t.join(".").toLowerCase())}return"biigle_screenshot.png"}},methods:{trimCanvas:function(t){var e,n,i,o=t.getContext("2d"),a=document.createElement("canvas").getContext("2d"),s=o.getImageData(0,0,t.width,t.height),r=s.data.length,l={top:null,left:null,right:null,bottom:null};for(e=0;e0?this.annotationOpacity=0:this.annotationOpacity=1}},watch:{annotationOpacity:function(t){t=parseFloat(t),this.$emit("change","annotationOpacity",t),this.settings.set("annotationOpacity",t)},mousePosition:function(t){this.$emit("change","mousePosition",t),this.settings.set("mousePosition",t)},zoomLevel:function(t){this.$emit("change","zoomLevel",t),this.settings.set("zoomLevel",t)},scaleLine:function(t){this.$emit("change","scaleLine",t),this.settings.set("scaleLine",t)},labelTooltip:function(t){this.$emit("change","labelTooltip",t),this.settings.set("labelTooltip",t)},measureTooltip:function(t){this.$emit("change","measureTooltip",t),this.settings.set("measureTooltip",t)},minimap:function(t){this.$emit("change","minimap",t),this.settings.set("minimap",t)},progressIndicator:function(t){this.$emit("change","progressIndicator",t),this.settings.set("progressIndicator",t)}},created:function(){this.restoreKeys.forEach(function(t){this[t]=this.settings.get(t)},this),biigle.$require("keyboard").on("o",this.toggleAnnotationOpacity)}}),biigle.$declare("annotations.components.settingsTabPlugins",{}),biigle.$component("annotations.components.siaAnnotationsTab",{mixins:[biigle.$require("annotations.components.annotationsTab")],computed:{plugins:function(){return biigle.$require("annotations.components.annotationsTabPlugins")}}}),biigle.$declare("annotations.components.annotationsTabPlugins",{}),biigle.$component("annotations.components.zoomLevelIndicator",{props:{resolution:{required:!0}},computed:{zoomLevelText:function(){return(Math.round(100/this.resolution)/100||0)+"x"}}}),biigle.$declare("annotations.models.LabelAnnotationFilter",function(){return Vue.extend({mixins:[biigle.$require("annotations.mixins.annotationFilter")],components:{typeahead:biigle.$require("labelTrees.components.labelTypeahead")},data:function(){return{name:"label",annotations:[],placeholder:"label name"}},computed:{items:function(){var t={};return this.annotations.forEach(function(e){e.labels.forEach(function(e){t[e.label.id]=e.label})}),Object.values(t)}},methods:{filter:function(t){var e=this.selectedItem.id;return t.filter(function(t){return t.labels.reduce(function(t,n){return t||n.label.id===e},!1)})}}})}),biigle.$declare("annotations.models.SessionAnnotationFilter",function(){return Vue.extend({mixins:[biigle.$require("annotations.mixins.annotationFilter")],data:function(){return{name:"session",sessions:[],placeholder:"session name"}},computed:{items:function(){return this.sessions.map(function(t){return t.starts_at=new Date(t.starts_at),t.ends_at=new Date(t.ends_at),t})}},methods:{filter:function(t){var e=this.selectedItem,n={};return e.users.forEach(function(t){n[t.id]=null}),t.filter(function(t){for(var i=t.labels.length-1;i>=0;i--)if(n.hasOwnProperty(t.labels[i].user_id)){var o=new Date(t.created_at);return o>=e.starts_at&&o0){this.translating||(this.dispatchEvent({type:"translatestart",features:this.features}),this.translating=!0),this.features.forEach(function(n){var i=n.getGeometry();i.translate(t,e),n.setGeometry(i)});var n=this,i=function(){n.translating=!1,n.dispatchEvent({type:"translateend",features:n.features})};return this.debounce(i,500,"ol.interactions.Translate.translateend"),!1}return!0},t}),biigle.$declare("annotations.ol.MagicWandInteraction",function(){function t(t){ol.interaction.Pointer.call(this,{handleUpEvent:this.handleUpEvent,handleDownEvent:this.handleDownEvent,handleMoveEvent:this.handleMoveEvent,handleDragEvent:this.handleDragEvent}),this.on("change:active",this.toggleActive),this.layer=t.layer,this.colorThreshold=void 0===t.colorThreshold?15:t.colorThreshold,this.currentThreshold=this.colorThreshold,this.blurRadius=void 0===t.blurRadius?5:t.blurRadius,this.simplifyTolerant=void 0===t.simplifyTolerant?0:t.simplifyTolerant,this.simplifyCount=void 0===t.simplifyCount?3:t.simplifyCount,this.downPoint=[0,0],this.map=t.map,this.snapshotCanvas=document.createElement("canvas"),this.snapshotContext=this.snapshotCanvas.getContext("2d"),this.snapshot=null,this.updatingSnapshot=!1,this.discardRadius=void 0===t.discardRadius?20:t.discardRadius,this.sketchFeature=null,this.sketchSource=t.source,void 0===this.sketchSource&&(this.sketchSource=new ol.source.Vector,this.map.addLayer(new ol.layer.Vector({source:this.sketchSource,zIndex:200}))),this.sketchStyle=void 0===t.style?null:t.style,this.isShowingPoint=!1,this.indicatorPoint=new ol.Feature(new ol.geom.Point([20,20])),void 0!==t.indicatorPointStyle&&this.indicatorPoint.setStyle(t.indicatorPointStyle),this.isShowingCross=!1,this.indicatorCross=new ol.Feature(new ol.geom.Point([100,100])),void 0!==t.indicatorCrossStyle?this.indicatorCross.setStyle(t.indicatorCrossStyle):this.indicatorCross.setStyle([new ol.style.Style({image:new ol.style.RegularShape({stroke:new ol.style.Stroke({color:[0,153,255,1],width:3}),points:4,radius1:6,radius2:0,angle:Math.PI/4})}),new ol.style.Style({image:new ol.style.RegularShape({stroke:new ol.style.Stroke({color:[255,255,255,.75],width:1.5}),points:4,radius1:6,radius2:0,angle:Math.PI/4})})]),this.indicatorSource=new ol.source.Vector,this.map.addLayer(new ol.layer.Vector({source:this.indicatorSource,zIndex:200})),this.toggleActive()}return ol.inherits(t,ol.interaction.Pointer),t.prototype.getHighDpiScaling=function(){return this.snapshot.height/this.map.getSize()[1]},t.prototype.toSnapshotCoordinates=function(t){var e=this.map.getView().calculateExtent(this.map.getSize()),n=this.snapshot.height,i=this.getHighDpiScaling()/this.map.getView().getResolution();return t.map(function(t){return[Math.round((t[0]-e[0])*i),n-Math.round((t[1]-e[1])*i)]})},t.prototype.fromSnapshotCoordinates=function(t){var e=this.map.getView().calculateExtent(this.map.getSize()),n=this.snapshot.height,i=this.map.getView().getResolution()/this.getHighDpiScaling();return t.map(function(t){return[Math.round(t[0]*i+e[0]),Math.round((n-t[1])*i+e[1])]})},t.prototype.fromMagicWandCoordinates=function(t){return t.map(function(t){return[t.x,t.y]})},t.prototype.handleUpEvent=function(t){return this.currentThreshold=this.colorThreshold,this.isShowingCross?this.sketchSource.removeFeature(this.sketchFeature):this.dispatchEvent({type:"drawend",feature:this.sketchFeature}),this.sketchFeature=null,this.indicatorSource.clear(),this.isShowingPoint=!1,this.isShowingCross=!1,!1},t.prototype.handleDownEvent=function(t){return this.downPoint[0]=Math.round(t.coordinate[0]),this.downPoint[1]=Math.round(t.coordinate[1]),this.drawSketch(),this.indicatorPoint.getGeometry().setCoordinates(this.downPoint),this.indicatorCross.getGeometry().setCoordinates(this.downPoint),this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorCross),this.isShowingCross=!0,this.isShowingPoint=!1,!0},t.prototype.handleDragEvent=function(t){var e=this.toSnapshotCoordinates([t.coordinate]).shift(),n=Math.round(e[0]),i=Math.round(e[1]),o=this.toSnapshotCoordinates([this.downPoint]).shift(),a=o[0],s=o[1];if(n!==a||i!==s){var r=n-a,l=i-s,h=Math.sqrt(r*r+l*l);h<=this.discardRadius&&!t.originalEvent.shiftKey?this.isShowingCross||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorCross),this.isShowingCross=!0,this.isShowingPoint=!1):this.isShowingPoint||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorPoint),this.isShowingCross=!1,this.isShowingPoint=!0);var c=Math.min(Math.max(this.colorThreshold+Math.round(h/2-this.colorThreshold),1),255);c!=this.currentThreshold&&(this.currentThreshold=c,this.drawSketch())}},t.prototype.handleMoveEvent=function(t){this.isShowingPoint||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorPoint),this.isShowingPoint=!0,this.isShowingCross=!1),this.indicatorPoint.getGeometry().setCoordinates(t.coordinate)},t.prototype.toggleActive=function(){this.getActive()?(this.map.on(["moveend","change:size"],this.updateSnapshot.bind(this)),this.updateSnapshot()):(this.map.un(["moveend","change:size"],this.updateSnapshot.bind(this)),this.indicatorSource.clear(),this.isShowingPoint=!1,this.isShowingCross=!1,this.sketchFeature&&(this.sketchSource.removeFeature(this.sketchFeature),this.sketchFeature=null))},t.prototype.updateSnapshot=function(){ -!this.updatingSnapshot&&this.layer&&(this.layer.once("postcompose",this.updateSnapshotCanvas.bind(this)),this.updatingSnapshot=!0,this.map.renderSync(),this.updatingSnapshot=!1)},t.prototype.updateSnapshotCanvas=function(t){this.snapshotCanvas.width=t.context.canvas.width,this.snapshotCanvas.height=t.context.canvas.height,this.snapshotContext.drawImage(t.context.canvas,0,0),this.snapshot=this.snapshotContext.getImageData(0,0,this.snapshotCanvas.width,this.snapshotCanvas.height),this.snapshot.bytes=4},t.prototype.setLayer=function(t){this.layer=t},t.prototype.drawSketch=function(){var t=this.toSnapshotCoordinates([this.downPoint]).shift(),e=MagicWand.floodFill(this.snapshot,t[0],t[1],this.currentThreshold);this.blurRadius>0&&(e=MagicWand.gaussBlurOnlyBorder(e,this.blurRadius));for(var n=e.data,i=this.snapshot.data,o=n.length-1;o>=0;o--)0===i[4*o]&&(n[o]=0);var a=MagicWand.traceContours(e).filter(function(t){return!t.innner}).shift();if(a){this.simplifyTolerant>0&&(a=MagicWand.simplifyContours([a],this.simplifyTolerant,this.simplifyCount).shift());var s=this.fromSnapshotCoordinates(this.fromMagicWandCoordinates(a.points));this.sketchFeature?this.sketchFeature.getGeometry().setCoordinates([s]):(this.sketchFeature=new ol.Feature(new ol.geom.Polygon([s])),this.sketchStyle&&this.sketchFeature.setStyle(this.sketchStyle),this.sketchSource.addFeature(this.sketchFeature))}},t}),biigle.$declare("annotations.ol.ZoomToNativeControl",function(){function t(t){var e=t||{},n=e.label?e.label:"1",i=document.createElement("button"),o=this;i.innerHTML=n,i.title="Zoom to original resolution",i.addEventListener("click",function(){o.zoomToNative.call(o)});var a=document.createElement("div");a.className="zoom-to-native ol-unselectable ol-control",a.appendChild(i),ol.control.Control.call(this,{element:a,target:e.target}),this.duration_=void 0!==e.duration?e.duration:250}return ol.inherits(t,ol.control.Control),t.prototype.zoomToNative=function(){var t=this.getMap(),e=t.getView();if(e){e.getResolution()&&(this.duration_>0?e.animate({resolution:1,duration:this.duration_}):e.setResolution(1))}},t}),biigle.$declare("annotations.stores.annotations",function(){var t=(biigle.$require("events"),biigle.$require("api.images")),e=biigle.$require("api.annotations");return new Vue({data:{cache:{}},computed:{imageFileUri:function(){return biigle.$require("annotations.imageFileUri")},shapeMap:function(){return biigle.$require("annotations.shapes")},inverseShapeMap:function(){var t={};for(var e in this.shapeMap)t[this.shapeMap[e]]=parseInt(e,10);return t}},methods:{parseResponse:function(t){return t.data},resolveShape:function(t){return t.shape=this.shapeMap[t.shape_id],t},resolveAllShapes:function(t){return t.forEach(this.resolveShape,this),t},setDeselected:function(t){return t.selected=!1,t},setAllDeselected:function(t){return t.forEach(this.setDeselected),t},fetchAnnotations:function(e){return this.cache.hasOwnProperty(e)||(this.cache[e]=t.getAnnotations({id:e}).catch(function(){return Vue.Promise.reject("Failed to load annotations for image "+e+"!")}).then(this.parseResponse).then(this.resolveAllShapes)),this.cache[e].then(this.setAllDeselected)},create:function(e,n){n.shape_id=this.inverseShapeMap[n.shape],delete n.shape;var i=this;return t.saveAnnotations({id:e},n).then(this.parseResponse).then(this.resolveShape).then(this.setDeselected).then(function(t){return i.cache[e].then(function(e){e.unshift(t)}),t})},update:function(t){var n=this,i=e.update({id:t.id},{points:t.points});return i.then(function(){n.cache[t.image_id].then(function(e){for(var n=e.length-1;n>=0;n--)if(e[n].id===t.id)return void(e[n].points=t.points)})}),i},attachLabel:function(t,n){var i=e.attachLabel({id:t.id},n);return i.then(function(e){t.labels.unshift(e.data)}),i},detachLabel:function(t,n){var i=e.detachLabel({annotation_label_id:n.id});return i.then(function(){for(var e=t.labels.length-1;e>=0;e--)if(t.labels[e].id===n.id)return void t.labels.splice(e,1)}),i},delete:function(t){var n=e.delete({id:t.id}),i=this.cache[t.image_id];return n.then(function(){i.then(function(e){for(var n=e.length-1;n>=0;n--)if(e[n].id===t.id)return void e.splice(n,1)})}),n}}})}),biigle.$declare("annotations.stores.images",function(){var t,e=biigle.$require("events");if(window.hasOwnProperty("fx"))try{t=fx.canvas();var n=null,i=null}catch(t){console.log("WebGL not supported. Color adjustment disabled.")}return window.addEventListener("beforeunload",function(e){n&&(n.destroy(),t.width=1,t.height=1)}),new Vue({data:{cache:{},cachedIds:[],maxCacheSize:10,supportsColorAdjustment:!1,currentlyDrawnImage:null,colorAdjustment:{brightnessContrast:[0,0],brightnessRGB:[0,0,0],hueSaturation:[0,0],vibrance:[0]}},computed:{imageFileUri:function(){return biigle.$require("annotations.imageFileUri")},tilesUri:function(){return biigle.$require("annotations.tilesUri")},supportedTextureSize:function(){return t?t._.gl.getParameter(t._.gl.MAX_TEXTURE_SIZE):0},hasColorAdjustment:function(){for(var t in this.colorAdjustment)if(this.colorAdjustment.hasOwnProperty(t)&&this.isAdjustmentActive(t))return!0;return!1}},methods:{isTiledImage:function(t){return!0===t.tiled},isAdjustmentActive:function(t){return 0!==this.colorAdjustment[t].reduce(function(t,e){return t+e})},checkSupportsColorAdjustment:function(e){if(!t||e.crossOrigin)return!1;if(this.isTiledImage(e))return void(this.supportsColorAdjustment=!1);if(this.currentlyDrawnImage&&this.currentlyDrawnImage.width===e.width&&this.currentlyDrawnImage.height===e.height)return this.supportsColorAdjustment;var n=this.supportedTextureSize;if(n=0;n--)i[e].splice(n,1,t[e][n]);this.hasColorAdjustment?this.drawColorAdjustedImage(this.currentlyDrawnImage):o&&this.drawSimpleImage(this.currentlyDrawnImage)}}},watch:{cachedIds:function(t){if(t.length>this.maxCacheSize){var e=t.shift();this.cache[e];delete this.cache[e]}}}})}),biigle.$declare("annotations.stores.settings",function(){var t=biigle.$require("core.models.Settings"),e={annotationOpacity:1,mousePosition:!1,zoomLevel:!1,scaleLine:!1,labelTooltip:!1,measureTooltip:!1,minimap:!0,progressIndicator:!0,randomSamplingNumber:9,regularSamplingRows:3,regularSamplingColumns:3};return new t({data:{urlParams:Object.keys(e),storageKey:"biigle.annotations.settings",defaults:e}})}),biigle.$declare("annotations.stores.styles",function(){var t={white:[255,255,255,1],blue:[0,153,255,1],orange:"#ff5e00"},e={},n=new ol.style.Stroke({color:t.white,width:5}),i=new ol.style.Stroke({color:t.white,width:6}),o=new ol.style.Stroke({color:t.blue,width:3}),a=new ol.style.Stroke({color:t.orange,width:3}),s=new ol.style.Fill({color:t.blue}),r=new ol.style.Fill({color:t.orange}),l=new ol.style.Stroke({color:t.white,width:2}),h=new ol.style.Stroke({color:t.white,width:3}),c=new ol.style.Stroke({color:t.white,width:2,lineDash:[3]}),u=new ol.style.Stroke({color:t.blue,width:3,lineDash:[5]});new ol.style.Fill({color:t.blue}),new ol.style.Fill({color:t.orange});return{colors:t,features:function(i,o){var a=i.get("color");return a=a?"#"+a:t.blue,e.hasOwnProperty(a)||(e[a]=[new ol.style.Style({stroke:n,image:new ol.style.Circle({radius:6,fill:new ol.style.Fill({color:a}),stroke:l}),fill:new ol.style.Fill({color:"transparent"})}),new ol.style.Style({stroke:new ol.style.Stroke({color:a,width:3})})]),e[a]},highlight:[new ol.style.Style({stroke:i,image:new ol.style.Circle({radius:6,fill:r,stroke:h}),zIndex:200}),new ol.style.Style({stroke:a,zIndex:200})],editing:[new ol.style.Style({stroke:n,image:new ol.style.Circle({radius:6,fill:s,stroke:c})}),new ol.style.Style({stroke:u})],viewport:[new ol.style.Style({stroke:o}),new ol.style.Style({stroke:new ol.style.Stroke({color:t.white,width:1})})],cross:[new ol.style.Style({image:new ol.style.RegularShape({stroke:i,points:4,radius1:6,radius2:0,angle:Math.PI/4})}),new ol.style.Style({image:new ol.style.RegularShape({stroke:a,points:4,radius1:6,radius2:0,angle:Math.PI/4})})]}}),biigle.$component("annotations.components.annotationCanvas.annotationTooltip",function(){return{components:{labelTooltip:biigle.$require("annotations.components.labelTooltip"),measureTooltip:biigle.$require("annotations.components.measureTooltip")},props:{showLabelTooltip:{type:Boolean,default:!1},showMeasureTooltip:{type:Boolean,default:!1}},computed:{showAnnotationTooltip:function(){return this.isDefaultInteractionMode&&(this.showLabelTooltip||this.showMeasureTooltip)}},data:function(){return{hoveredFeaturesHash:""}},methods:{annotationLayerFilter:function(t){return"annotations"===t.get("name")},updateHoveredAnnotations:function(t){var e=this.map.getFeaturesAtPixel(t.pixel,{layerFilter:this.annotationLayerFilter})||[],n=e.map(function(t){return t.getId()}).join("-");this.hoveredFeaturesHash!==n&&(this.hoveredFeaturesHash=n,this.$emit("hoverFeatures",e))},resetHoveredAnnotations:function(){this.hoveredFeaturesHash="",this.$emit("hoverFeatures",[])}},watch:{showAnnotationTooltip:function(t){t?this.map.on("pointermove",this.updateHoveredAnnotations):(this.map.un("pointermove",this.updateHoveredAnnotations),this.resetHoveredAnnotations())}}}}),biigle.$component("annotations.components.annotationCanvas.attachLabelInteraction",function(){var t;return{computed:{isAttaching:function(){return"attach"===this.interactionMode}},methods:{toggleAttaching:function(){this.isAttaching?this.resetInteractionMode():this.interactionMode="attach"},handleAttachLabel:function(t){this.$emit("attach",t.feature.get("annotation"),this.selectedLabel)}},watch:{isAttaching:function(e){this.canAdd&&(e&&!this.hasSelectedLabel?this.requireSelectedLabel():t.setActive(e))},selectedLabel:function(t){!t&&this.isAttaching&&this.resetInteractionMode()}},mounted:function(){if(this.canAdd){var e=biigle.$require("annotations.ol.AttachLabelInteraction");t=new e({features:this.annotationFeatures,map:this.map}),t.setActive(!1),t.on("attach",this.handleAttachLabel),this.map.addInteraction(t),biigle.$require("keyboard").on("l",this.toggleAttaching,0,this.listenerSet)}}}}),biigle.$component("annotations.components.annotationCanvas.drawInteractions",function(){var t,e=function(t){var e=t.pointerEvent;return!(!e||"pen"!==e.pointerType)||ol.events.condition.shiftKeyOnly(t)};return{computed:{isDrawing:function(){return this.interactionMode.startsWith("draw")},isDrawingPoint:function(){return"drawPoint"===this.interactionMode},isDrawingRectangle:function(){return"drawRectangle"===this.interactionMode},isDrawingCircle:function(){return"drawCircle"===this.interactionMode},isDrawingLineString:function(){return"drawLineString"===this.interactionMode},isDrawingPolygon:function(){return"drawPolygon"===this.interactionMode},isDrawingEllipse:function(){return"drawEllipse"===this.interactionMode}},methods:{draw:function(t){this["isDrawing"+t]?this.resetInteractionMode():this.hasSelectedLabel?this.canAdd&&(this.interactionMode="draw"+t):this.requireSelectedLabel()},drawPoint:function(){this.draw("Point")},drawRectangle:function(){this.draw("Rectangle")},drawCircle:function(){this.draw("Circle")},drawLineString:function(){this.draw("LineString")},drawPolygon:function(){this.draw("Polygon")},drawEllipse:function(){this.draw("Ellipse")},maybeUpdateDrawInteractionMode:function(n){t&&(this.map.removeInteraction(t),t=void 0),this.isDrawing&&(t=new ol.interaction.Draw({source:this.annotationSource,type:n.slice(4),style:this.styles.editing,freehandCondition:e}),t.on("drawend",this.handleNewFeature),this.map.addInteraction(t))}},watch:{selectedLabel:function(t){this.isDrawing&&!t&&this.resetInteractionMode()}},created:function(){if(this.canAdd){var t=biigle.$require("keyboard");t.on("a",this.drawPoint,0,this.listenerSet),t.on("s",this.drawRectangle,0,this.listenerSet),t.on("d",this.drawCircle,0,this.listenerSet),t.on("Shift+d",this.drawEllipse,0,this.listenerSet),t.on("f",this.drawLineString,0,this.listenerSet),t.on("g",this.drawPolygon,0,this.listenerSet),this.$watch("interactionMode",this.maybeUpdateDrawInteractionMode)}}}}),biigle.$component("annotations.components.annotationCanvas.lawnmower",function(){return{data:function(){return{imageSection:[0,0],imageSectionCenter:[0,0]}},computed:{imageSectionSteps:function(){return[Math.ceil(this.image.width/(this.viewExtent[2]-this.viewExtent[0])),Math.ceil(this.image.height/(this.viewExtent[3]-this.viewExtent[1]))]},imageSectionStepSize:function(){var t,e=[this.viewExtent[2]-this.viewExtent[0],this.viewExtent[3]-this.viewExtent[1]];return this.imageSectionSteps[0]>1?(t=e[0]*this.imageSectionSteps[0]-this.image.width,e[0]-=t/(this.imageSectionSteps[0]-1)):e[0]=this.viewExtent[2],this.imageSectionSteps[1]>1?(t=e[1]*this.imageSectionSteps[1]-this.image.height,e[1]-=t/(this.imageSectionSteps[1]-1)):e[1]=this.viewExtent[3],e},imageSectionStartCenter:function(){var t=[(this.viewExtent[2]-this.viewExtent[0])/2,(this.viewExtent[3]-this.viewExtent[1])/2];return this.imageSectionSteps[0]<=1&&(t[0]=this.extent[2]/2),this.imageSectionSteps[1]<=1&&(t[1]=this.extent[3]/2),t},isLawnmowerAnnotationMode:function(){return"lawnmower"===this.annotationMode}},methods:{getImageSectionCenter:function(t){return[t[0]*this.imageSectionStepSize[0]+this.imageSectionStartCenter[0],t[1]*this.imageSectionStepSize[1]+this.imageSectionStartCenter[1]]},showImageSection:function(t){return t[0]=0&&t[1]>=0&&(this.imageSection=t,this.imageSectionCenter=this.getImageSectionCenter(t),this.map.getView().setCenter(this.imageSectionCenter),!0)},showLastImageSection:function(){this.showImageSection([this.imageSectionSteps[0]-1,this.imageSectionSteps[1]-1])},showFirstImageSection:function(){this.showImageSection([0,0])},showPreviousImageSection:function(){var t=this.imageSection[0]-1;return t>=0?this.showImageSection([t,this.imageSection[1]]):this.showImageSection([this.imageSectionSteps[0]-1,this.imageSection[1]-1])},showNextImageSection:function(){var t=this.imageSection[0]+1;return t=0;i--)for(var o=this.regularSamplingColumns-1;o>=0;o--)n.unshift([e[0]+o*t[0],e[1]+i*t[1]]);return n},randomSamplingLocations:function(){if(!this.randomLocationMemory.hasOwnProperty(this.image.id)){for(var t=[],e=this.image.width,n=this.image.height,i=this.randomSamplingCount;i>0;i--)t.push([Math.round(Math.random()*e),Math.round(Math.random()*n)]);this.randomLocationMemory[this.image.id]=t}return this.randomLocationMemory[this.image.id]},samplingLocations:function(){return this[this.annotationMode+"Locations"]},isSamplingAnnotationMode:function(){return this.annotationMode.endsWith("Sampling")}},methods:{setSamplingData:function(t,e){"regularSampling"===t?Array.isArray(e)&&e[0]>0&&e[1]>0&&(this.regularSamplingRows=e[0],this.regularSamplingColumns=e[1]):"randomSampling"===t&&e>0&&(this.randomSamplingCount=e)},updateShownSamplingLocation:function(){var t=this.currentSamplingIndex;null!==t&&t>=0&&t=this.samplingLocations.length)&&(this.currentSamplingIndex=t,this.updateShownSamplingLocation(),!0)},createSampledAnnotation:function(){var t=this.samplingLocations[this.currentSamplingIndex];this.createPointAnnotationAt(t[0],t[1])}},watch:{isSamplingAnnotationMode:function(e){e?this.map.addLayer(t):this.map.removeLayer(t)},randomSamplingCount:function(){this.randomLocationMemory={}}}}}),biigle.$component("annotations.components.annotationCanvas.scaleLine",function(){return{components:{scaleLineIndicator:biigle.$require("annotations.components.scaleLineIndicator")},props:{showScaleLine:{type:Boolean,default:!1},imagesArea:{type:Object,default:null}}}}),biigle.$component("annotations.components.annotationCanvas.translateInteraction",function(){var t;return{computed:{isTranslating:function(){return"translate"===this.interactionMode}},methods:{toggleTranslating:function(){this.isTranslating?this.resetInteractionMode():this.interactionMode="translate"}},watch:{isTranslating:function(e){this.canModify&&t.setActive(e)}},mounted:function(){if(this.canModify){var e=biigle.$require("annotations.ol.ExtendedTranslateInteraction");t=new e({features:this.selectInteraction.getFeatures(),map:this.map}),t.setActive(!1),t.on("translatestart",this.handleFeatureModifyStart),t.on("translateend",this.handleFeatureModifyEnd),this.map.addInteraction(t),biigle.$require("keyboard").on("m",this.toggleTranslating,0,this.listenerSet)}}}}),biigle.$component("annotations.components.annotationCanvas.zoomLevel",function(){return{components:{zoomLevelIndicator:biigle.$require("annotations.components.zoomLevelIndicator")},props:{showZoomLevel:{type:Boolean,default:!1}}}}); \ No newline at end of file +biigle.$viewModel("annotations-navbar",function(t){new Vue({el:t,mixins:[biigle.$require("annotations.mixins.imageFilenameTracker")],data:{defaultFilename:t.innerText,imageIds:biigle.$require("annotations.imagesIds").slice(),imageIdsLeft:biigle.$require("annotations.imagesIds").slice(),initialImageId:null,showIndicator:!0},computed:{progressPath:function(){return"M 2 1 A 1 1 0 "+(this.progress>=.5?1:0)+" 1 "+this.arcPosition(this.progress).join(" ")+"L 1 1"},initialProgressPath:function(){return"M 1 1 L "+this.arcPosition(this.initialProgress).join(" ")},progressTitle:function(){var t=["started at "+this.initialImageNumber];return this.hasSeenAllImages&&t.push("seen all"),"Image "+this.currentImageNumber+" of "+this.imageIds.length+" ("+t.join(", ")+")"},currentImageNumber:function(){return this.currentImageId?this.imageIds.indexOf(this.currentImageId)+1:0},progress:function(){return this.currentImageNumber/this.imageIds.length},initialImageNumber:function(){return null===this.initialImageId?1:this.imageIds.indexOf(this.initialImageId)+1},initialProgress:function(){return this.initialImageNumber/this.imageIds.length},hasSeenAllImages:function(){return 0===this.imageIdsLeft.length},showInitialProgressMarker:function(){return 1!==this.initialImageNumber},indicatorClass:function(){return this.hasSeenAllImages?"progress-indicator--all":""},filenameClass:function(){return this.hasSeenAllImages?"text-success":""},filenameTitle:function(){return this.hasSeenAllImages?"You have seen all images":""}},methods:{arcPosition:function(t){return[Math.cos(2*Math.PI*t)+1,Math.sin(2*Math.PI*t)+1]},setInitialImageId:function(t){this.initialImageId=t},updateShowIndicator:function(t){this.showIndicator=!1!==t}},watch:{currentImageId:function(t){for(var e=this.imageIdsLeft,n=e.length-1;n>=0;n--)if(e[n]===t){e.splice(n,1);break}},currentImageFilename:function(t){document.title="Annotate "+t}},created:function(){var t=this,e=biigle.$require("events");e.$on("images.sequence",function(e){t.imageIds=e.slice(),t.imageIdsLeft=e.slice()}),e.$once("images.change",this.setInitialImageId);var n=biigle.$require("annotations.stores.settings");this.updateShowIndicator(n.get("progressIndicator")),n.watch("progressIndicator",this.updateShowIndicator)}})}),biigle.$viewModel("annotator-container",function(t){var e=biigle.$require("events"),n=biigle.$require("annotations.volumeId"),i=biigle.$require("annotations.imagesIds"),o=biigle.$require("annotations.stores.images"),a=biigle.$require("annotations.stores.annotations"),s=biigle.$require("urlParams"),r=biigle.$require("messages.store"),l=biigle.$require("utils.debounce"),h=biigle.$require("annotations.stores.settings"),c=biigle.$require("annotations.models.LabelAnnotationFilter"),u=biigle.$require("annotations.models.UserAnnotationFilter"),d=biigle.$require("annotations.models.ShapeAnnotationFilter"),m=biigle.$require("annotations.models.SessionAnnotationFilter");new Vue({el:t,mixins:[biigle.$require("core.mixins.loader")],components:{sidebar:biigle.$require("core.components.sidebar"),sidebarTab:biigle.$require("core.components.sidebarTab"),annotationsTab:biigle.$require("annotations.components.siaAnnotationsTab"),labelsTab:biigle.$require("annotations.components.labelsTab"),annotationModesTab:biigle.$require("annotations.components.annotationModesTab"),colorAdjustmentTab:biigle.$require("annotations.components.colorAdjustmentTab"),imageLabelTab:biigle.$require("annotations.components.imageLabelTab"),settingsTab:biigle.$require("annotations.components.settingsTab"),annotationCanvas:biigle.$require("annotations.components.annotationCanvas")},data:{isEditor:biigle.$require("annotations.isEditor"),imageIndex:null,image:null,annotations:[],annotationFilter:null,annotationFilters:[new c,new u,new d({data:{shapes:biigle.$require("annotations.shapes")}}),new m({data:{sessions:biigle.$require("annotations.sessions")}})],lastCreatedAnnotation:null,lastCreatedAnnotationTimeout:null,annotationOpacity:1,mapCenter:void 0,mapResolution:void 0,selectedLabel:null,annotationMode:"default",focussedAnnotationIndex:null,annotationModeCarry:null,showMousePosition:!1,showZoomLevel:!1,showLabelTooltip:!1,showMeasureTooltip:!1,showMinimap:!0,showScaleLine:!1,imagesArea:null,openTab:null,userUpdatedVolareResolution:!1},computed:{imageId:function(){return this.imagesIds[this.imageIndex]},hasAnnotationFilter:function(){return null!==this.annotationFilter},filteredAnnotations:function(){var t=this.annotations.filter(function(t){return!t.markedForDeletion});return this.annotationFilter?this.annotationFilter.filter(t):t},selectedAnnotations:function(){return this.filteredAnnotations.filter(function(t){return t.selected})},supportsColorAdjustment:function(){return o.supportsColorAdjustment},focussedAnnotation:function(){return this.filteredAnnotations[this.focussedAnnotationIndex]},isDefaultAnnotationMode:function(){return"default"===this.annotationMode},isVolareAnnotationMode:function(){return"volare"===this.annotationMode},isLawnmowerAnnotationMode:function(){return"lawnmower"===this.annotationMode},isSamplingAnnotationMode:function(){return this.annotationMode.endsWith("Sampling")},imagesIds:function(){var t=window.localStorage.getItem("biigle.volumes."+n+".images");if(t){var e={};return i.forEach(function(t){e[t]=null}),JSON.parse(t).filter(function(t){return e.hasOwnProperty(t)})}return i}},methods:{getImageAndAnnotationsPromises:function(t){return[o.fetchAndDrawImage(t),a.fetchAnnotations(t)]},setCurrentImageAndAnnotations:function(t){t?(this.image=t[0],this.annotations=t[1]):(this.image=null,this.annotations=[])},updateUrlSlug:function(){s.setSlug(this.imageId)},getNextIndex:function(t){return(t+1)%this.imagesIds.length},getPreviousIndex:function(t){return(t+this.imagesIds.length-1)%this.imagesIds.length},handleNext:function(){if(!this.loading){if(this.isVolareAnnotationMode){if(this.focussedAnnotationIndex0)return void this.focussedAnnotationIndex--;this.focussedAnnotationIndex=1/0}else if(this.isLawnmowerAnnotationMode){if(this.$refs.canvas.showPreviousImageSection())return;this.annotationModeCarry=1/0}else if(this.isSamplingAnnotationMode){if(this.$refs.canvas.showPreviousSamplingLocation())return;this.annotationModeCarry=1/0}this.imageIndex=this.getPreviousIndex(this.imageIndex)}},maybeUpdateFocussedAnnotation:function(){this.isVolareAnnotationMode?this.filteredAnnotations.length>0?this.focussedAnnotationIndex===1/0?this.focussedAnnotationIndex=this.filteredAnnotations.length-1:this.focussedAnnotationIndex=0:(this.focussedAnnotationIndex=null,this.$refs.canvas.fitImage()):this.focussedAnnotationIndex=null},maybeUpdateShownImageSection:function(){this.isLawnmowerAnnotationMode&&(this.annotationModeCarry===1/0?this.$refs.canvas.showLastImageSection():this.$refs.canvas.showFirstImageSection())},maybeUpdateShownSampling:function(t){this.isSamplingAnnotationMode&&(this.$refs.canvas.setSamplingData(this.annotationMode,t),this.annotationModeCarry===1/0?this.$nextTick(this.$refs.canvas.showLastSamplingLocation):this.$nextTick(this.$refs.canvas.showFirstSamplingLocation))},maybeUpdateAnnotationMode:function(t){this.maybeUpdateFocussedAnnotation(),this.maybeUpdateShownImageSection(),this.maybeUpdateShownSampling(t)},handleMapMoveend:function(t){this.mapCenter=t.center,this.mapResolution=t.resolution,s.set({r:Math.round(100*t.resolution),x:Math.round(t.center[0]),y:Math.round(t.center[1])})},handleSelectAnnotation:function(t,e){if(!0===e||"object"==typeof e&&e.shiftKey)return void(t.selected=!0);this.annotations.forEach(function(e){e.selected=t.id===e.id})},handleSelectAnnotations:function(t,e){t.forEach(function(t){t.selected=!0}),e.forEach(function(t){t.selected=!1})},handleDeselectAnnotation:function(t){t?t.selected=!1:this.annotations.forEach(function(t){t.selected=!1})},focusAnnotation:function(t,e,n){this.$refs.canvas.focusAnnotation(t,e,n)},handleDetachAnnotationLabel:function(t,e){this.isEditor&&(t.labels.length>1?a.detachLabel(t,e).catch(r.handleErrorResponse):confirm("Detaching the last label of an annotation deletes the whole annotation. Do you want to delete the annotation?")&&this.handleDeleteAnnotation(t))},handleDeleteAnnotation:function(t){this.isEditor&&(this.lastCreatedAnnotation&&this.lastCreatedAnnotation.id===t.id&&(this.lastCreatedAnnotation=null),Vue.set(t,"markedForDeletion",!0),a.delete(t).catch(function(e){t.markedForDeletion=!1,r.handleErrorResponse(e)}))},handleDeleteAnnotations:function(t){t.forEach(this.handleDeleteAnnotation)},handleUpdateAnnotations:function(t){this.isEditor&&Vue.Promise.all(t.map(a.update)).catch(r.handleErrorResponse)},selectAndFocusAnnotation:function(t,e){this.selectedAnnotations.forEach(function(t){t.selected=!1}),t.selected=!0,this.focusAnnotation(t,!0,e)},handleFilter:function(t){this.annotationFilter=t},resetFilter:function(){this.annotationFilter&&this.annotationFilter.reset(),this.annotationFilter=null},handleSelectedLabel:function(t){this.selectedLabel=t},handleNewAnnotation:function(t,e){this.isEditor&&(t.label_id=this.selectedLabel.id,t.confidence=1,a.create(this.imageId,t).then(this.setLastCreatedAnnotation).catch(r.handleErrorResponse).finally(e))},handleAttachLabel:function(t,e){if(e=e||this.selectedLabel,this.isEditor&&e){var n={label_id:e.id,confidence:1};a.attachLabel(t,n).catch(r.handleErrorResponse)}},handleAttachAllSelected:function(){this.selectedAnnotations.forEach(this.handleAttachLabel)},emitImageChanged:function(){e.$emit("images.change",this.imageId,this.image)},cachePreviousAndNext:function(){var t=this.imagesIds[this.getPreviousIndex(this.imageIndex)],e=this.imagesIds[this.getNextIndex(this.imageIndex)];t!==this.imageId&&Vue.Promise.all([a.fetchAnnotations(e),o.fetchImage(e),a.fetchAnnotations(t),o.fetchImage(t)]).catch(function(){})},setLastCreatedAnnotation:function(t){this.lastCreatedAnnotationTimeout&&window.clearTimeout(this.lastCreatedAnnotationTimeout);var e=this;this.lastCreatedAnnotation=t,this.lastCreatedAnnotationTimeout=window.setTimeout(function(){e.lastCreatedAnnotation=null},1e4)},updateColorAdjustment:function(t){var e=this.$refs.canvas;l(function(){o.updateColorAdjustment(t),e.render()},100,"annotations.color-adjustment.update")},handleSettingsChange:function(t,e){switch(t){case"annotationOpacity":this.annotationOpacity=e;break;case"mousePosition":this.showMousePosition=e;break;case"zoomLevel":this.showZoomLevel=e;break;case"scaleLine":this.showScaleLine=e;break;case"labelTooltip":this.showLabelTooltip=e;break;case"measureTooltip":this.showMeasureTooltip=e;break;case"minimap":this.showMinimap=e}},handleAnnotationModeChange:function(t,e){this.annotationMode=t,this.annotationModeCarry=null,this.maybeUpdateAnnotationMode(e)},handleOpenedTab:function(t){h.set("openTab",t)},handleClosedTab:function(t){h.delete("openTab")},handleLoadingError:function(t){r.danger(t)},createSampledAnnotation:function(){this.$refs.canvas.createSampledAnnotation()},fetchImagesArea:function(){this.imagesArea||(this.imagesArea={},biigle.$require("annotations.api.volumeImageArea").get({id:n}).then(this.setImagesArea,r.handleErrorResponse))},setImagesArea:function(t){this.imagesArea=t.body},handleRequiresSelectedLabel:function(){r.info("Please select a label first."),this.$refs.sidebar.$emit("open","labels")}},watch:{imageId:function(t){t&&(this.startLoading(),Vue.Promise.all(this.getImageAndAnnotationsPromises(t)).catch(this.handleLoadingError).then(this.setCurrentImageAndAnnotations).then(this.updateUrlSlug).then(this.maybeUpdateAnnotationMode).then(this.emitImageChanged).then(this.cachePreviousAndNext).finally(this.finishLoading))},focussedAnnotation:function(t){t&&this.selectAndFocusAnnotation(t,this.userUpdatedVolareResolution)},annotationFilter:function(){this.maybeUpdateFocussedAnnotation()},showScaleLine:function(t){t&&this.fetchImagesArea()},showMeasureTooltip:function(t){t&&this.fetchImagesArea()},isVolareAnnotationMode:function(t){t||(this.userUpdatedVolareResolution=!1)},mapResolution:function(t){this.isVolareAnnotationMode&&(this.userUpdatedVolareResolution=!0)},annotations:function(t){this.annotationFilters[0].annotations=t,this.annotationFilters[1].annotations=t}},created:function(){if(0===this.imagesIds.length)return void r.info("Your current volume filtering contains no images.");var t=this.imagesIds.indexOf(biigle.$require("annotations.imageId"));if(-1===t&&(t=0,r.info("The requested image does not exist in your current volume filtering. Switching to the first image.")),this.imageIndex=t,e.$emit("images.sequence",this.imagesIds),void 0!==s.get("r")&&(this.mapResolution=parseInt(s.get("r"),10)/100),void 0!==s.get("x")&&void 0!==s.get("y")&&(this.mapCenter=[parseInt(s.get("x"),10),parseInt(s.get("y"),10)]),e.$on("annotations.select",this.handleSelectAnnotation),e.$on("annotations.deselect",this.handleDeselectAnnotation),e.$on("annotations.detachLabel",this.handleDetachAnnotationLabel),e.$on("annotations.delete",this.handleDeleteAnnotation),e.$on("annotations.focus",this.focusAnnotation),s.get("annotation")){var n=parseInt(s.get("annotation")),i=this;e.$once("images.change",function(){for(var t=i.annotations,e=t.length-1;e>=0;e--)if(t[e].id===n)return void i.selectAndFocusAnnotation(t[e])})}h.has("openTab")&&(this.openTab=h.get("openTab"))},mounted:function(){e.$emit("annotations.map.init",this.$refs.canvas.map)}})}),biigle.$declare("annotations.api.volumeImageArea",Vue.resource("api/v1/volumes{/id}/images/area")),biigle.$component("annotations.components.annotationCanvas",{mixins:[biigle.$require("annotations.components.annotationCanvas.drawInteractions"),biigle.$require("annotations.components.annotationCanvas.magicWandInteraction"),biigle.$require("annotations.components.annotationCanvas.polygonBrushInteraction"),biigle.$require("annotations.components.annotationCanvas.translateInteraction"),biigle.$require("annotations.components.annotationCanvas.attachLabelInteraction"),biigle.$require("annotations.components.annotationCanvas.measureInteraction"),biigle.$require("annotations.components.annotationCanvas.lawnmower"),biigle.$require("annotations.components.annotationCanvas.mousePosition"),biigle.$require("annotations.components.annotationCanvas.zoomLevel"),biigle.$require("annotations.components.annotationCanvas.annotationTooltip"),biigle.$require("annotations.components.annotationCanvas.sampling"),biigle.$require("annotations.components.annotationCanvas.scaleLine")],components:{minimap:biigle.$require("annotations.components.minimap"),labelIndicator:biigle.$require("annotations.components.labelIndicator"),controlButton:biigle.$require("annotations.components.controlButton")},props:{canAdd:{type:Boolean,default:!1},canModify:{type:Boolean,default:!1},canDelete:{type:Boolean,default:!1},image:{type:Object,default:null},annotations:{type:Array,default:function(){return[]}},selectedAnnotations:{type:Array,default:function(){return[]}},center:{type:Array,default:void 0},resolution:{type:Number,default:void 0},selectedLabel:{default:null},lastCreatedAnnotation:{default:null},annotationOpacity:{type:Number,default:1},annotationMode:{type:String,default:"default"},showMinimap:{type:Boolean,default:!0},listenerSet:{type:String,default:"default"}},data:function(){return{initialized:!1,viewFitOptions:{padding:[50,50,50,50],minResolution:1},interactionMode:"default",mapSize:[0,0],mousePosition:[0,0]}},computed:{extent:function(){return this.image?[0,0,this.image.width,this.image.height]:[0,0,0,0]},viewExtent:function(){return this.initialized&&this.resolution&&this.map?this.map.getView().calculateExtent(this.mapSize):[0,0,0,0]},projection:function(){return new ol.proj.Projection({code:"biigle-image",units:"pixels",extent:this.extent})},selectedFeatures:function(){return this.selectInteraction?this.selectInteraction.getFeatures():[]},isDefaultInteractionMode:function(){return"default"===this.interactionMode},hasSelectedLabel:function(){return Boolean(this.selectedLabel)},hasSelectedAnnotations:function(){return this.selectedAnnotations.length>0},hasLastCreatedAnnotation:function(){return null!==this.lastCreatedAnnotation},previousButtonTitle:function(){switch(this.annotationMode){case"volare":return"Previous annotation";case"lawnmower":return"Previous image section";case"randomSampling":case"regularSampling":return"Previous sample location";default:return"Previous image"}},nextButtonTitle:function(){switch(this.annotationMode){case"volare":return"Next annotation";case"lawnmower":return"Next image section";case"randomSampling":case"regularSampling":return"Next sample location";default:return"Next image"}}},methods:{createMap:function(){var t=new ol.Map({controls:[new ol.control.Zoom,new ol.control.ZoomToExtent({tipLabel:"Zoom to show whole image",label:""})],interactions:ol.interaction.defaults({altShiftDragRotate:!1,doubleClickZoom:!1,keyboard:!1,shiftDragZoom:!1,pinchRotate:!1,pinchZoom:!1})}),e=biigle.$require("annotations.ol.ZoomToNativeControl");return t.addControl(new e({label:""})),t},declareNonReactiveProperties:function(){this.map=this.createMap(),this.styles=biigle.$require("annotations.stores.styles"),this.imageLayer=new ol.layer.Image,this.tiledImageLayer=new ol.layer.Tile,this.annotationFeatures=new ol.Collection,this.annotationSource=new ol.source.Vector({features:this.annotationFeatures}),this.annotationLayer=new ol.layer.Vector({source:this.annotationSource,zIndex:100,updateWhileAnimating:!0,updateWhileInteracting:!0,style:this.styles.features}),this.selectInteraction=new ol.interaction.Select({condition:ol.events.condition.click,style:this.styles.highlight,layers:[this.annotationLayer],multi:!0}),this.canModify&&(this.featureRevisionMap={},this.modifyInteraction=new ol.interaction.Modify({features:this.selectInteraction.getFeatures(),deleteCondition:function(t){return ol.events.condition.shiftKeyOnly(t)&&ol.events.condition.singleClick(t)}}))},updateMapSize:function(){this.mapSize=this.map.getSize()},updateMapView:function(t){var e=t.target.getView();this.$emit("moveend",{center:e.getCenter(),resolution:e.getResolution()})},invertPointsYAxis:function(t){for(var e=this.extent[3],n=1;n0&&e.set("color",t.labels[0].label.color),e},handleFeatureModifyStart:function(t){t.features.getArray().forEach(function(t){this.featureRevisionMap[t.getId()]=t.getRevision()},this)},handleFeatureModifyEnd:function(t){var e=this,n=t.features.getArray().filter(function(t){return e.featureRevisionMap[t.getId()]!==t.getRevision()}).map(function(t){return{id:t.getId(),image_id:t.get("annotation").image_id,points:e.getPoints(t.getGeometry())}});n.length>0&&this.$emit("update",n)},focusAnnotation:function(t,e,n){var i=this.annotationSource.getFeatureById(t.id);i&&(e?delete this.viewFitOptions.duration:this.viewFitOptions.duration=250,this.viewFitOptions.minResolution=n?this.resolution:1,this.map.getView().fit(i.getGeometry(),this.viewFitOptions))},fitImage:function(){this.map.getView().fit(this.extent,this.map.getSize())},extractAnnotationFromFeature:function(t){return t.get("annotation")},handleFeatureSelect:function(t){this.$emit("select",t.selected.map(this.extractAnnotationFromFeature),t.deselected.map(this.extractAnnotationFromFeature))},handlePrevious:function(){this.$emit("previous")},handleNext:function(){this.$emit("next")},resetInteractionMode:function(){this.interactionMode="default"},getPoints:function(t){var e;switch(t.getType()){case"Circle":e=[t.getCenter(),[t.getRadius()]];break;case"Polygon":case"Rectangle":case"Ellipse":e=t.getCoordinates()[0];break;case"Point":e=[t.getCoordinates()];break;default:e=t.getCoordinates()}return this.convertPointsFromOlToDb(e)},handleNewFeature:function(t){if(this.hasSelectedLabel){var e=t.feature.getGeometry(),n=this;t.feature.set("color",this.selectedLabel.color);var i=function(){try{n.annotationSource.removeFeature(t.feature)}catch(t){}};this.$emit("new",{shape:e.getType(),points:this.getPoints(e)},i)}else this.annotationSource.removeFeature(t.feature)},deleteSelectedAnnotations:function(){this.hasSelectedAnnotations&&confirm("Are you sure you want to delete all selected annotations?")&&this.$emit("delete",this.selectedAnnotations)},deleteLastCreatedAnnotation:function(){this.hasLastCreatedAnnotation&&this.$emit("delete",[this.lastCreatedAnnotation])},createPointAnnotationAt:function(t,e){if(this.hasSelectedLabel){var n=new ol.Feature(new ol.geom.Point([t,e]));this.annotationSource.addFeature(n),this.handleNewFeature({feature:n})}else this.requireSelectedLabel()},requireSelectedLabel:function(){this.$emit("requires-selected-label"),this.resetInteractionMode()},render:function(){this.map&&this.map.render()},handleRegularImage:function(t,e){t?this.imageLayer.setSource(new ol.source.Canvas({canvas:t.canvas,projection:this.projection,canvasExtent:this.extent,canvasSize:[t.width,t.height]})):this.imageLayer.setSource(null)},handleTiledImage:function(t,e){t?this.tiledImageLayer.setSource(new ol.source.Zoomify({url:t.url,size:[t.width,t.height],extent:[0,0,t.width,t.height],transition:100})):this.tiledImageLayer.setSource(null)},updateMousePosition:function(t){this.mousePosition=t.coordinate},refreshAnnotationSource:function(t,e){var n={};t.forEach(function(t){n[t.id]=null});var i={},o=e.getFeatures(),a=o.filter(function(t){return i[t.getId()]=null,!n.hasOwnProperty(t.getId())});a.length===o.length?e.clear(!0):(a.filter(function(t){return void 0!==t.getId()}).forEach(function(t){e.removeFeature(t)},this),t=t.filter(function(t){return!i.hasOwnProperty(t.id)})),e.addFeatures(t.map(this.createFeature))}},watch:{image:function(t,e){t?!0===t.tiled?(e&&!0===e.tiled||(this.map.removeLayer(this.imageLayer),this.map.addLayer(this.tiledImageLayer)),this.handleTiledImage(t,e)):(e&&!0!==e.tiled||(this.map.removeLayer(this.tiledImageLayer),this.map.addLayer(this.imageLayer)),this.handleRegularImage(t,e)):(this.map.removeLayer(this.tiledImageLayer),this.map.removeLayer(this.imageLayer))},annotations:function(t){this.refreshAnnotationSource(t,this.annotationSource),this.resetHoveredAnnotations()},selectedAnnotations:function(t){var e=this.annotationSource,n=this.selectedFeatures;n.clear(),t.forEach(function(t){n.push(e.getFeatureById(t.id))})},extent:function(t,e){if(t[2]!==e[2]||t[3]!==e[3]){var n=ol.extent.getCenter(t);this.initialized||(n=this.center||n),this.map.setView(new ol.View({projection:this.projection,center:n,resolution:this.resolution,zoomFactor:2,minResolution:.25,extent:t})),void 0===this.resolution&&this.map.getView().fit(t),this.initialized||(this.updateMapView({target:this.map}),this.initialized=!0)}},annotationOpacity:function(t){this.annotationLayer.setOpacity(t)},isDefaultInteractionMode:function(t){this.selectInteraction.setActive(t||this.isTranslating),this.canModify&&this.modifyInteraction.setActive(t)}},created:function(){var t=this;this.declareNonReactiveProperties(),this.annotationLayer.set("name","annotations"),this.map.addLayer(this.annotationLayer),this.imageLayer.set("name","imageRegular"),this.tiledImageLayer.set("name","imageTile"),biigle.$require("events").$on("sidebar.toggle",function(){t.$nextTick(function(){t.map.updateSize()})}),this.map.on("change:size",this.updateMapSize),this.map.on("moveend",this.updateMapView),this.map.on("pointermove",this.updateMousePosition),this.selectInteraction.on("select",this.handleFeatureSelect),this.map.addInteraction(this.selectInteraction);var e=biigle.$require("keyboard");e.on(" ",this.handleNext,0,this.listenerSet),e.on("ArrowRight",this.handleNext,0,this.listenerSet),e.on("ArrowLeft",this.handlePrevious,0,this.listenerSet),e.on("Escape",this.resetInteractionMode,0,this.listenerSet),this.canModify&&(this.modifyInteraction.on("modifystart",this.handleFeatureModifyStart),this.modifyInteraction.on("modifyend",this.handleFeatureModifyEnd),this.map.addInteraction(this.modifyInteraction)),this.canDelete&&(e.on("Delete",this.deleteSelectedAnnotations,0,this.listenerSet),e.on("Backspace",this.deleteLastCreatedAnnotation,0,this.listenerSet))},mounted:function(){this.map.setTarget(this.$el)}}),biigle.$component("annotations.components.annotationModesTab",{components:{powerToggle:biigle.$require("core.components.powerToggle")},data:function(){return{mode:"default",modes:["default","volare","lawnmower","randomSampling","regularSampling"],restoreKeys:["randomSamplingNumber","regularSamplingRows","regularSamplingColumns"],randomSamplingNumber:9,regularSamplingRows:3,regularSamplingColumns:3}},computed:{keyboard:function(){return biigle.$require("keyboard")},isVolareActive:function(){return"volare"===this.mode},isLawnmowerActive:function(){return"lawnmower"===this.mode},isRandomSamplingActive:function(){return"randomSampling"===this.mode},isRegularSamplingActive:function(){return"regularSampling"===this.mode},settings:function(){return biigle.$require("annotations.stores.settings")}},methods:{startVolare:function(){this.setMode("volare")},startLawnmower:function(){this.setMode("lawnmower")},startRandomSampling:function(){this.setMode("randomSampling")},startRegularSampling:function(){this.setMode("regularSampling")},setMode:function(t){-1!==this.modes.indexOf(t)&&(this.mode=t)},resetMode:function(){this.mode="default"},emitAttachLabel:function(){this.$emit("attach-label")},emitCreateSample:function(){this.$emit("create-sample")}},watch:{mode:function(t,e){switch(e){case"volare":this.keyboard.off("Enter",this.emitAttachLabel);break;case"randomSampling":case"regularSampling":this.keyboard.off("Enter",this.emitCreateSample)}switch(t){case"volare":this.keyboard.on("Enter",this.emitAttachLabel);break;case"randomSampling":case"regularSampling":this.keyboard.on("Enter",this.emitCreateSample)}switch(t){case"randomSampling":this.$emit("change",t,this.randomSamplingNumber);break;case"regularSampling":this.$emit("change",t,[this.regularSamplingRows,this.regularSamplingColumns]);break;default:this.$emit("change",t)}},randomSamplingNumber:function(t){this.settings.set("randomSamplingNumber",t)},regularSamplingRows:function(t){this.settings.set("regularSamplingRows",t)},regularSamplingColumns:function(t){this.settings.set("regularSamplingColumns",t)}},created:function(){this.restoreKeys.forEach(function(t){this[t]=this.settings.get(t)},this);var t=biigle.$require("urlParams").get("annotationMode");if(t){var e=this;biigle.$require("events").$once("images.change",function(){e.setMode(t)})}}}),biigle.$component("annotations.components.annotationsTab",{components:{filters:biigle.$require("annotations.components.annotationsTabFilters"),labelItem:biigle.$require("annotations.components.annotationsTabLabelItem")},props:{hasActiveFilter:{type:Boolean,default:!1},annotations:{type:Array,default:function(){return[]}},annotationFilters:{type:Array,default:function(){return[]}},canDetachOthers:{type:Boolean,default:!1},ownUserId:{type:Number,default:null},selectedAnnotations:{type:Array,default:function(){return[]}}},data:function(){return{}},computed:{labelItems:function(){var t={},e={},n={};return this.annotations.forEach(function(i){i.labels.forEach(function(o){t.hasOwnProperty(o.label.id)||(t[o.label_id]=o.label,e[o.label_id]=[]);var a=i.id+"-"+o.label_id;n.hasOwnProperty(a)||(n[a]=null,e[o.label_id].push(i))})}),Object.values(t).sort(function(t,e){return t.name.toLowerCase()>e.name.toLowerCase()?1:-1}).map(function(t){return{id:t.id,label:t,annotations:e[t.id]}})}},methods:{handleSelect:function(t,e){!1!==t.selected&&e?this.$emit("deselect",t):this.$emit("select",t,e)},emitDetach:function(t,e){this.$emit("detach",t,e)},emitSelectFilter:function(t){this.$emit("select-filter",t)},emitUnselectFilter:function(){this.$emit("unselect-filter")},emitFocus:function(t){this.$emit("focus",t)},scrollIntoView:function(t){var e,n=this.$refs.scrollList,i=n.scrollTop,o=n.offsetHeight,a=1/0,s=0;t.forEach(function(t){for(var i=n.querySelectorAll('[data-annotation-id="'+t.id+'"]'),o=i.length-1;o>=0;o--)e=i[o],a=Math.min(e.offsetTop,a),s=Math.max(e.offsetTop+e.offsetHeight,s)},this),i>a?n.scrollTop=a:i+o=s-a?s-n.offsetHeight:a)}},watch:{selectedAnnotations:function(t){t.length>0&&this.$nextTick(function(){this.scrollIntoView(t)})}}}),biigle.$component("annotations.components.annotationsTabAnnotationItem",{template:'
    • ',props:{annotation:{type:Object,required:!0},annotationLabel:{type:Object,required:!0},canDetach:{type:Boolean,default:!1}},computed:{classObject:function(){return{selected:!1!==this.annotation.selected}},shapeClass:function(){return"icon-"+this.annotation.shape.toLowerCase()},username:function(){return this.annotationLabel.user?this.annotationLabel.user.firstname+" "+this.annotationLabel.user.lastname:"(user deleted)"}},methods:{emitSelect:function(t){this.$emit("select",this.annotation,t.shiftKey)},emitDetach:function(){this.$emit("detach",this.annotation,this.annotationLabel)},emitFocus:function(){this.$emit("focus",this.annotation)}}}),biigle.$component("annotations.components.annotationsTabFilters",{template:'
    ',props:{annotationFilters:{type:Array,default:function(){return[]}},hasActiveFilter:{type:Boolean,default:!1}},data:function(){return{chosenFilterIndex:null}},computed:{hasFilters:function(){return this.annotationFilters.length>0},chosenFilter:function(){return this.annotationFilters[this.chosenFilterIndex]},clearButtonClass:function(){return{"btn-info":this.hasActiveFilter}}},methods:{emitSelectFilter:function(t){this.$emit("select",t)},emitUnselectFilter:function(){this.$emit("unselect")}},watch:{chosenFilter:function(t,e){e&&(this.$refs.filterElement.removeChild(e.$el),e.$off("select",this.emitSelectFilter)),this.$refs.filterElement.appendChild(t.$el),t.$on("select",this.emitSelectFilter)}}}), +biigle.$component("annotations.components.annotationsTabLabelItem",{template:'
    • ',components:{annotationItem:biigle.$require("annotations.components.annotationsTabAnnotationItem")},props:{label:{type:Object,default:function(){return{}}},annotations:{type:Array,default:function(){return[]}},canDetachOthers:{type:Boolean,default:!1},ownUserId:{type:Number,default:null}},data:function(){return{open:!1}},computed:{title:function(){return"Annotations with label "+this.label.name},classObject:function(){return{selected:this.isSelected}},count:function(){return this.annotationItems.length},countTitle:function(){return"There are "+this.count+" annotations with label "+this.label.name},colorStyle:function(){return"background-color: #"+this.label.color},isSelected:function(){return this.open||this.annotations.reduce(function(t,e){return t||!1!==e.selected},!1)},annotationItems:function(){var t=[];return this.annotations.forEach(function(e){e.labels.forEach(function(n){n.label_id===this.label.id&&t.push({annotation:e,annotationLabel:n,canDetach:this.canDetachAnnotationLabel(n)})},this)},this),t}},methods:{toggleOpen:function(){this.open=!this.open},emitSelect:function(t,e){this.$emit("select",t,e)},emitDetach:function(t,e){this.$emit("detach",t,e)},emitFocus:function(t){this.$emit("focus",t)},canDetachAnnotationLabel:function(t){return this.canDetachOthers||this.ownUserId===t.user_id}}}),biigle.$component("annotations.components.colorAdjustmentTab",{data:function(){return{isBrightnessRgbActive:!1,colorAdjustment:{brightnessContrast:[0,0],brightnessRGB:[0,0,0],hueSaturation:[0,0],vibrance:[0]}}},methods:{resetType:function(t,e){void 0!==e?this.colorAdjustment[t].splice(e,1,0):this.colorAdjustment[t]=this.colorAdjustment[t].map(function(){return 0})},reset:function(){for(var t in this.colorAdjustment)this.colorAdjustment.hasOwnProperty(t)&&this.resetType(t)},toggleBrightnessRgb:function(){this.isBrightnessRgbActive?this.resetType("brightnessRGB"):this.resetType("brightnessContrast",0),this.isBrightnessRgbActive=!this.isBrightnessRgbActive}},watch:{colorAdjustment:{handler:function(){this.$emit("change",this.colorAdjustment)},deep:!0}}}),biigle.$component("annotations.components.controlButton",{template:'',props:{title:{type:String,default:""},icon:{type:String,required:!0},active:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hover:{type:Boolean,default:!0},open:{type:Boolean,default:!1}},data:function(){return{mouseOver:!1,timeout:null,activeSubControls:0}},computed:{classObject:function(){return{active:this.active,"control-button--open":this.showSubControls}},iconClass:function(){return this.icon.startsWith("fa-")?"fa fa-fw "+this.icon:"icon icon-white "+this.icon},hasSubControls:function(){return this.$slots.hasOwnProperty("default")},showSubControls:function(){return this.mouseOver||this.hasActiveSubControl||this.open},hasActiveSubControl:function(){return this.activeSubControls>0}},methods:{handleClick:function(){this.disabled||this.$emit("click")},handleMouseEnter:function(){!this.disabled&&this.hover&&(this.mouseOver=!0),window.clearTimeout(this.timeout)},handleMouseLeave:function(){var t=this;window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){t.mouseOver=!1},200)},updateActiveSubControls:function(t){t?this.activeSubControls+=1:this.activeSubControls=Math.max(0,this.activeSubControls-1)}},watch:{active:function(t){this.$parent.$emit("control-button-active",t)}},created:function(){this.$on("control-button-active",this.updateActiveSubControls)},mounted:function(){this.active&&this.$parent.$emit("control-button-active",!0)}}),biigle.$component("annotations.components.imageLabelTab",{mixins:[biigle.$require("core.mixins.loader")],components:{imageLabelList:biigle.$require("volumes.components.imageLabelList")},props:{imageId:{required:!0,type:Number},selectedLabel:{type:Object,default:null}},data:function(){return{cache:{},open:!1,currentLabels:[],saving:!1}},computed:{userId:function(){return biigle.$require("annotations.userId")},isAdmin:function(){return biigle.$require("annotations.isAdmin")},imageLabelApi:function(){return biigle.$require("api.imageLabels")},hasLabels:function(){return this.currentLabels.length>0},hasSelectedLabel:function(){return null!==this.selectedLabel},canAttachSelectedLabel:function(){if(this.hasSelectedLabel){for(var t=this.currentLabels.length-1;t>=0;t--)if(this.currentLabels[t].label.id===this.selectedLabel.id)return!1;return!0}return!1},proposedLabelTitle:function(){return this.hasSelectedLabel?this.canAttachSelectedLabel?"Attach '"+this.selectedLabel.name+"' as new image label":"The selected label is already attached.":"Please select a label first."}},methods:{startSaving:function(){this.saving=!0},finishSaving:function(){this.saving=!1},showImageLabels:function(t){this.cache.hasOwnProperty(t)||(this.startLoading(),this.currentLabels=[],this.cache[t]=this.imageLabelApi.query({image_id:t}),this.cache[t].finally(this.finishLoading)),this.cache[t].then(this.updateCurrentLabels,biigle.$require("messages.store").handleErrorResponse)},updateCurrentLabels:function(t){this.currentLabels=t.body},handleDeletedLabel:function(t){for(var e=this.currentLabels.length-1;e>=0;e--)if(this.currentLabels[e].id===t.id){this.currentLabels.splice(e,1);break}},attachSelectedLabel:function(){this.startSaving();var t=this.currentLabels;this.imageLabelApi.save({image_id:this.imageId},{label_id:this.selectedLabel.id}).then(function(e){t.push(e.data)},biigle.$require("messages.store").handleErrorResponse).finally(this.finishSaving)}},watch:{imageId:function(t){this.open&&this.showImageLabels(t)},open:function(t){t&&this.showImageLabels(this.imageId)}},created:function(){var t=this;this.$parent.$watch("open",function(e){t.open=e})}}),biigle.$component("annotations.components.labelIndicator",{props:{label:{required:!0}}}),biigle.$component("annotations.components.labelTooltip",{mixins:[biigle.$require("annotations.mixins.annotationTooltip")],template:'
    ',computed:{annotationLabels:function(){return this.annotations.map(function(t){return t.labels.map(function(t){return t.label.name})})}}}),biigle.$component("annotations.components.labelsTab",{components:{labelTrees:biigle.$require("labelTrees.components.labelTrees")},data:function(){return{labelTrees:biigle.$require("annotations.labelTrees"),selectedLabel:null}},computed:{plugins:function(){return biigle.$require("annotations.components.labelsTabPlugins")}},methods:{handleSelectedLabel:function(t){this.selectedLabel=t,this.$emit("select",t)},handleDeselectedLabel:function(t){this.selectedLabel=null,this.$emit("select",null)}}}),biigle.$declare("annotations.components.labelsTabPlugins",{}),biigle.$component("annotations.components.measureTooltip",{template:'
    ',mixins:[biigle.$require("annotations.mixins.annotationTooltip"),biigle.$require("annotations.mixins.measureComponent")],data:function(){return{measuredGeometries:[]}},computed:{areaUnitMultipliers:function(){return this.unitMultipliers.map(function(t){return Math.pow(t,2)})}},methods:{updateGeometries:function(t){this.measuredGeometries=t.map(function(t){return t.getGeometry()}).filter(function(t){return this.isAeraGeometry(t)||this.isLengthGeometry(t)},this).map(function(t){return this.measure(t)},this)},measure:function(t){return t.getArea?this.formatArea(t.getArea()):t.getLength?this.formatLength(t.getLength()):t.getRadius?this.formatArea(Math.pow(t.getRadius(),2)*Math.PI):""},isAeraGeometry:function(t){return t instanceof ol.geom.Polygon||t instanceof ol.geom.Circle},isLengthGeometry:function(t){return t instanceof ol.geom.LineString},formatArea:function(t){var e="px²";if(this.hasArea){t*=Math.pow(this.pxWidthInMeter,2);var n=this.unitNearest(t,this.areaUnitMultipliers,.001);e=this.unitNames[n]+"²",t/=this.areaUnitMultipliers[n]}return this.formatMeasurement(t,e,3)},formatLength:function(t){var e="px";if(this.hasArea){t*=this.pxWidthInMeter;var n=this.unitNearest(t,this.unitMultipliers);e=this.unitNames[n],t/=this.unitMultipliers[n]}return this.formatMeasurement(t,e)},formatMeasurement:function(t,e,n){return n=Math.pow(10,n||1),Math.round(t*n)/n+" "+e},unitNearest:function(t,e,n){if(0===t)return e.length-1;n=n||1;for(var i,o=e.length-1;o>=0&&!((i=t/e[o])>=n&&i<1e3);o--);return o}},watch:{show:function(t){t?this.$parent.$on(this.watch,this.updateGeometries):this.$parent.$off(this.watch,this.updateGeometries)}}}),biigle.$component("annotations.components.minimap",function(){return{template:'
    ',props:{extent:{type:Array,required:!0},intendedWidth:{type:Number,default:250},intendedHeight:{type:Number,default:200}},data:function(){return{}},computed:{minimap:function(){return new ol.Map({controls:[],interactions:[]})},viewport:function(){return new ol.Feature}},methods:{updateViewport:function(){this.mapSize&&this.viewport.setGeometry(ol.geom.Polygon.fromExtent(this.mapView.calculateExtent(this.mapSize)))},dragViewport:function(t){this.mapView.setCenter(t.coordinate)},updateMapSize:function(t){this.mapSize=t.target.getSize()},updateMapView:function(t){this.mapView&&(this.mapView.un("change:center",this.updateViewport),this.mapView.un("change:resolution",this.updateViewport)),this.mapView=t.target.getView(),this.mapView.on("change:center",this.updateViewport),this.mapView.on("change:resolution",this.updateViewport)},updateElementSize:function(){var t=this.extent[2],e=this.extent[3],n=Math.max(t/this.intendedWidth,e/this.intendedHeight);this.minimap.setView(new ol.View({projection:this.mapView.getProjection(),center:ol.extent.getCenter(this.extent),resolution:n})),this.$el.style.width=Math.round(t/n)+"px",this.$el.style.height=Math.round(e/n)+"px",this.minimap.updateSize()},refreshImageLayer:function(t){var e=t.element.get("name");if(e&&e.startsWith("image")){var n=this.minimap.getLayers();n.getLength()>1?n.setAt(0,t.element):n.insertAt(0,t.element)}},initImageLayer:function(t){t.getArray().forEach(function(t){this.refreshImageLayer({element:t})},this)}},watch:{extent:function(){this.updateElementSize()}},created:function(){var t=new ol.source.Vector;t.addFeature(this.viewport);var e=this.$parent.map;this.mapSize=e.getSize(),this.updateMapView({target:e}),e.on("change:size",this.updateMapSize),e.on("change:view",this.updateMapView),e.once("postcompose",this.updateViewport),this.minimap.addLayer(new ol.layer.Vector({source:t,style:biigle.$require("annotations.stores.styles").viewport})),e.getLayers().on("add",this.refreshImageLayer),this.minimap.on("pointerdrag",this.dragViewport),this.minimap.on("click",this.dragViewport),this.initImageLayer(e.getLayers())},mounted:function(){this.updateElementSize(),this.minimap.setTarget(this.$el),this.updateViewport()},beforeDestroy:function(){var t=this.$parent.map;this.mapView.un("change:center",this.updateViewport),this.mapView.un("change:resolution",this.updateViewport),t.un("change:size",this.updateMapSize),t.un("change:view",this.updateMapView),t.getLayers().un("add",this.refreshImageLayer)}}}),biigle.$component("annotations.components.mousePositionIndicator",{template:'
    ',props:{position:{type:Array,required:!0}},computed:{positionText:function(){return this.position.join(" × ")}}}),biigle.$component("annotations.components.scaleLineIndicator",{mixins:[biigle.$require("annotations.mixins.measureComponent")],props:{resolution:{required:!0}},data:function(){return{targetWidth:100,leadingDigits:[1,2,5]}},computed:{scale:function(){return this.targetWidth*this.scaleMultiplier},scalePowerOfTen:function(){return this.powerOfTen(this.scale)},scaleMultiplier:function(){return this.hasArea?this.resolution*this.pxWidthInMeter:this.resolution||0},scaleNearest:function(){for(var t=0,e=1/0,n=this.leadingDigits.length-1;n>=0;n--){var i=this.leadingDigits[n]*this.scalePowerOfTen;Math.abs(this.scale-i)=0;n--)Math.abs(this.unitMultipliers[n]-this.scalePowerOfTen)1&&(t[t.length-1]="png"),"biigle_screenshot_"+(t=t.join(".").toLowerCase())}return"biigle_screenshot.png"}},methods:{trimCanvas:function(t){var e,n,i,o=t.getContext("2d"),a=document.createElement("canvas").getContext("2d"),s=o.getImageData(0,0,t.width,t.height),r=s.data.length,l={top:null,left:null,right:null,bottom:null};for(e=0;e0?this.annotationOpacity=0:this.annotationOpacity=1}},watch:{annotationOpacity:function(t){t=parseFloat(t),this.$emit("change","annotationOpacity",t),this.settings.set("annotationOpacity",t)},mousePosition:function(t){this.$emit("change","mousePosition",t),this.settings.set("mousePosition",t)},zoomLevel:function(t){this.$emit("change","zoomLevel",t),this.settings.set("zoomLevel",t)},scaleLine:function(t){this.$emit("change","scaleLine",t),this.settings.set("scaleLine",t)},labelTooltip:function(t){this.$emit("change","labelTooltip",t),this.settings.set("labelTooltip",t)},measureTooltip:function(t){this.$emit("change","measureTooltip",t),this.settings.set("measureTooltip",t)},minimap:function(t){this.$emit("change","minimap",t),this.settings.set("minimap",t)},progressIndicator:function(t){this.$emit("change","progressIndicator",t),this.settings.set("progressIndicator",t)}},created:function(){this.restoreKeys.forEach(function(t){this[t]=this.settings.get(t)},this),biigle.$require("keyboard").on("o",this.toggleAnnotationOpacity)}}),biigle.$declare("annotations.components.settingsTabPlugins",{}),biigle.$component("annotations.components.siaAnnotationsTab",{mixins:[biigle.$require("annotations.components.annotationsTab")],computed:{plugins:function(){return biigle.$require("annotations.components.annotationsTabPlugins")}}}),biigle.$declare("annotations.components.annotationsTabPlugins",{}),biigle.$component("annotations.components.zoomLevelIndicator",{props:{resolution:{required:!0}},computed:{zoomLevelText:function(){return(Math.round(100/this.resolution)/100||0)+"x"}}}),biigle.$component("annotations.mixins.annotationFilter",{template:'',components:{typeahead:biigle.$require("core.components.typeahead")},data:function(){return{name:"",placeholder:"",selectedItem:null}},computed:{items:function(){return[]},selectedItemName:function(){return this.selectedItem?this.selectedItem.name:""}},methods:{select:function(t){this.selectedItem=t,this.$emit("select",this)},filter:function(t){return t},reset:function(){this.selectedItem=null}},created:function(){this.$mount()}}),biigle.$component("annotations.mixins.annotationTooltip",{props:{watch:{required:!0,type:String},position:{required:!0,type:Array},show:{required:!0,type:Boolean},positioning:{type:String,default:"top-left"}},data:function(){return{annotations:[]}},computed:{hasAnnotations:function(){return this.annotations.length>0},showThis:function(){return this.show&&this.hasAnnotations}},methods:{updateAnnotations:function(t){this.annotations=t.map(function(t){return t.get("annotation")})}},watch:{show:{immediate:!0,handler:function(t){t?this.$parent.$on(this.watch,this.updateAnnotations):this.$parent.$off(this.watch,this.updateAnnotations)}},position:function(t){this.overlay.setPosition(t)},showThis:function(t){t?this.$parent.map.addOverlay(this.overlay):this.$parent.map.removeOverlay(this.overlay)}},mounted:function(){this.overlay=new ol.Overlay({element:this.$el,offset:[15,0],positioning:this.positioning})},beforeDestroy:function(){this.$parent.map.removeOverlay(this.overlay)}}),biigle.$component("annotations.mixins.imageFilenameTracker",{data:function(){return{filenameMap:{},currentImageId:null,defaultFilename:""}},computed:{currentImageFilename:function(){return this.filenameMap[this.currentImageId]||this.defaultFilename}},methods:{updateImageId:function(t){this.currentImageId=t}},created:function(){var t=biigle.$require("events"),e=biigle.$require("annotations.imagesIds"),n=biigle.$require("annotations.imagesFilenames"),i=this.filenameMap;e.forEach(function(t,e){i[t]=n[e]}),t.$on("images.change",this.updateImageId)}}),biigle.$component("annotations.mixins.measureComponent",{props:{image:{required:!0},areas:{required:!0}},data:function(){return{unitMultipliers:[1e3,1,.01,.001,1e-6,1e-9],unitNames:["km","m","cm","mm","µm","nm"]}},computed:{area:function(){return this.areas&&this.image?this.areas[this.image.id]||-1:-1},hasArea:function(){return-1!==this.area},pxWidthInMeter:function(){return Math.sqrt(this.area/(this.image.width*this.image.height))}},methods:{powerOfTen:function(t){return Math.pow(10,Math.floor(Math.log10(t)))}}}),biigle.$declare("annotations.models.LabelAnnotationFilter",function(){return Vue.extend({mixins:[biigle.$require("annotations.mixins.annotationFilter")],components:{typeahead:biigle.$require("labelTrees.components.labelTypeahead")},data:function(){return{name:"label",annotations:[],placeholder:"label name"}},computed:{items:function(){var t={};return this.annotations.forEach(function(e){e.labels.forEach(function(e){t[e.label.id]=e.label})}),Object.values(t)}},methods:{filter:function(t){var e=this.selectedItem.id;return t.filter(function(t){return t.labels.reduce(function(t,n){return t||n.label.id===e},!1)})}}})}),biigle.$declare("annotations.models.SessionAnnotationFilter",function(){return Vue.extend({mixins:[biigle.$require("annotations.mixins.annotationFilter")],data:function(){return{name:"session",sessions:[],placeholder:"session name"}},computed:{items:function(){return this.sessions.map(function(t){return t.starts_at=new Date(t.starts_at),t.ends_at=new Date(t.ends_at),t})}},methods:{filter:function(t){var e=this.selectedItem,n={};return e.users.forEach(function(t){n[t.id]=null}),t.filter(function(t){for(var i=t.labels.length-1;i>=0;i--)if(n.hasOwnProperty(t.labels[i].user_id)){var o=new Date(t.created_at);return o>=e.starts_at&&o=0;n--)if(e[n].id===t.id)return void(e[n].points=t.points)})}),i},attachLabel:function(t,n){var i=e.attachLabel({id:t.id},n);return i.then(function(e){t.labels.unshift(e.data)}),i},detachLabel:function(t,n){var i=e.detachLabel({annotation_label_id:n.id});return i.then(function(){for(var e=t.labels.length-1;e>=0;e--)if(t.labels[e].id===n.id)return void t.labels.splice(e,1)}),i},delete:function(t){var n=e.delete({id:t.id}),i=this.cache[t.image_id];return n.then(function(){i.then(function(e){for(var n=e.length-1;n>=0;n--)if(e[n].id===t.id)return void e.splice(n,1)})}),n}}})}),biigle.$declare("annotations.stores.images",function(){var t,e=biigle.$require("events"),n=document.createElement("canvas");if(n.style.imageOrientation="none",n.style.visibility="hidden",n.style.position="fixed",document.body.appendChild(n),window.hasOwnProperty("fx"))try{t=fx.canvas();var i=null,o=null}catch(t){console.log("WebGL not supported. Color adjustment disabled.")}return window.addEventListener("beforeunload",function(e){i&&(i.destroy(),t.width=1,t.height=1)}),new Vue({data:{cache:{},cachedIds:[],maxCacheSize:10,supportsColorAdjustment:!1,currentlyDrawnImage:null,colorAdjustment:{brightnessContrast:[0,0],brightnessRGB:[0,0,0],hueSaturation:[0,0],vibrance:[0]}},computed:{imageFileUri:function(){return biigle.$require("annotations.imageFileUri")},tilesUri:function(){return biigle.$require("annotations.tilesUri")},supportedTextureSize:function(){return t?t._.gl.getParameter(t._.gl.MAX_TEXTURE_SIZE):0},hasColorAdjustment:function(){for(var t in this.colorAdjustment)if(this.colorAdjustment.hasOwnProperty(t)&&this.isAdjustmentActive(t))return!0;return!1}},methods:{isTiledImage:function(t){return!0===t.tiled},isAdjustmentActive:function(t){return 0!==this.colorAdjustment[t].reduce(function(t,e){return t+e})},checkSupportsColorAdjustment:function(e){if(!t||e.crossOrigin)return!1;if(this.isTiledImage(e))return void(this.supportsColorAdjustment=!1);if(this.currentlyDrawnImage&&this.currentlyDrawnImage.width===e.width&&this.currentlyDrawnImage.height===e.height)return this.supportsColorAdjustment;var n=this.supportedTextureSize;if(n=0;n--)i[e].splice(n,1,t[e][n]);this.hasColorAdjustment?this.drawColorAdjustedImage(this.currentlyDrawnImage):o&&this.drawSimpleImage(this.currentlyDrawnImage)}}},watch:{cachedIds:function(t){if(t.length>this.maxCacheSize){var e=t.shift();this.cache[e];delete this.cache[e]}}}})}),biigle.$declare("annotations.stores.settings",function(){var t=biigle.$require("core.models.Settings"),e={annotationOpacity:1,mousePosition:!1,zoomLevel:!1,scaleLine:!1,labelTooltip:!1,measureTooltip:!1,minimap:!0,progressIndicator:!0,randomSamplingNumber:9,regularSamplingRows:3,regularSamplingColumns:3};return new t({data:{urlParams:Object.keys(e),storageKey:"biigle.annotations.settings",defaults:e}})}),biigle.$declare("annotations.stores.styles",function(){var t={white:[255,255,255,1],blue:[0,153,255,1],orange:"#ff5e00"},e={},n=new ol.style.Stroke({color:t.white,width:5}),i=new ol.style.Stroke({color:t.white,width:6}),o=new ol.style.Stroke({color:t.blue,width:3}),a=new ol.style.Stroke({color:t.orange,width:3}),s=new ol.style.Fill({color:t.blue}),r=new ol.style.Fill({color:t.orange}),l=new ol.style.Stroke({color:t.white,width:2}),h=new ol.style.Stroke({color:t.white,width:3}),c=new ol.style.Stroke({color:t.white,width:2,lineDash:[3]}),u=new ol.style.Stroke({color:t.blue,width:3,lineDash:[5]});new ol.style.Fill({color:t.blue}),new ol.style.Fill({color:t.orange});return{colors:t,features:function(i,o){var a=i.get("color");return a=a?"#"+a:t.blue,e.hasOwnProperty(a)||(e[a]=[new ol.style.Style({stroke:n,image:new ol.style.Circle({radius:6, +fill:new ol.style.Fill({color:a}),stroke:l}),fill:new ol.style.Fill({color:"transparent"})}),new ol.style.Style({stroke:new ol.style.Stroke({color:a,width:3})})]),e[a]},highlight:[new ol.style.Style({stroke:i,image:new ol.style.Circle({radius:6,fill:r,stroke:h}),zIndex:200}),new ol.style.Style({stroke:a,zIndex:200})],editing:[new ol.style.Style({stroke:n,image:new ol.style.Circle({radius:6,fill:s,stroke:c})}),new ol.style.Style({stroke:u})],viewport:[new ol.style.Style({stroke:o}),new ol.style.Style({stroke:new ol.style.Stroke({color:t.white,width:1})})],cross:[new ol.style.Style({image:new ol.style.RegularShape({stroke:i,points:4,radius1:6,radius2:0,angle:Math.PI/4})}),new ol.style.Style({image:new ol.style.RegularShape({stroke:a,points:4,radius1:6,radius2:0,angle:Math.PI/4})})]}}),biigle.$declare("annotations.ol.AttachLabelInteraction",function(){function t(t){ol.interaction.Pointer.call(this,{handleUpEvent:this.handleUpEvent,handleDownEvent:this.handleDownEvent,handleMoveEvent:this.handleMoveEvent}),this.on("change:active",this.toggleActive),this.features=void 0!==t.features?t.features:null,this.currentFeature=void 0,this.map=t.map}return ol.inherits(t,ol.interaction.Pointer),t.prototype.toggleActive=function(t){if(t.oldValue){var e=this.map.getTargetElement();e&&(e.style.cursor="")}},t.prototype.handleDownEvent=function(t){return this.currentFeature=this.featuresAtPixel(t.pixel,t.map),!!this.currentFeature},t.prototype.handleUpEvent=function(t){this.currentFeature&&this.currentFeature.get("annotation")&&this.dispatchEvent({type:"attach",feature:this.currentFeature}),this.currentFeature=void 0},t.prototype.handleMoveEvent=function(t){var e=t.map.getTargetElement(),n=this.featuresAtPixel(t.pixel,t.map);e.style.cursor=n?"pointer":""},t.prototype.featuresAtPixel=function(t,e){var n=null,i=e.forEachFeatureAtPixel(t,function(t){return t},this);return this.handlesFeature(i)&&(n=i),n},t.prototype.handlesFeature=function(t){return!!this.features&&-1!==this.features.getArray().indexOf(t)},t}),biigle.$declare("annotations.ol.ExtendedTranslateInteraction",function(){function t(t){ol.interaction.Translate.call(this,t),this.features=void 0!==t.features?t.features:null,this.on("change:active",this.toggleListeners);var e=this;this.translateUp=function(){return e.translate(0,1)},this.translateDown=function(){return e.translate(0,-1)},this.translateLeft=function(){return e.translate(-1,0)},this.translateRight=function(){return e.translate(1,0)},this.keyboard=biigle.$require("keyboard"),this.debounce=biigle.$require("utils.debounce"),this.setMap(t.map),this.translating=!1}return ol.inherits(t,ol.interaction.Translate),t.prototype.toggleListeners=function(t){if(t.oldValue){this.keyboard.off("ArrowLeft",this.translateLeft),this.keyboard.off("ArrowUp",this.translateUp),this.keyboard.off("ArrowRight",this.translateRight),this.keyboard.off("ArrowDown",this.translateDown);var e=this.getMap().getTargetElement();e&&(e.style.cursor="")}else this.keyboard.on("ArrowLeft",this.translateLeft,10),this.keyboard.on("ArrowUp",this.translateUp,10),this.keyboard.on("ArrowRight",this.translateRight,10),this.keyboard.on("ArrowDown",this.translateDown,10)},t.prototype.translate=function(t,e){if(this.features&&this.features.getLength()>0){this.translating||(this.dispatchEvent({type:"translatestart",features:this.features}),this.translating=!0),this.features.forEach(function(n){var i=n.getGeometry();i.translate(t,e),n.setGeometry(i)});var n=this,i=function(){n.translating=!1,n.dispatchEvent({type:"translateend",features:n.features})};return this.debounce(i,500,"ol.interactions.Translate.translateend"),!1}return!0},t}),biigle.$declare("annotations.ol.MagicWandInteraction",function(){function t(t){ol.interaction.Pointer.call(this,{handleUpEvent:this.handleUpEvent,handleDownEvent:this.handleDownEvent,handleMoveEvent:this.handleMoveEvent,handleDragEvent:this.handleDragEvent}),this.on("change:active",this.toggleActive),this.layer=t.layer,this.colorThreshold=void 0===t.colorThreshold?15:t.colorThreshold,this.currentThreshold=this.colorThreshold,this.blurRadius=void 0===t.blurRadius?5:t.blurRadius,this.simplifyTolerant=void 0===t.simplifyTolerant?0:t.simplifyTolerant,this.simplifyCount=void 0===t.simplifyCount?3:t.simplifyCount,this.downPoint=[0,0],this.map=t.map,this.snapshotCanvas=document.createElement("canvas"),this.snapshotContext=this.snapshotCanvas.getContext("2d"),this.snapshot=null,this.updatingSnapshot=!1,this.discardRadius=void 0===t.discardRadius?20:t.discardRadius,this.sketchFeature=null,this.sketchSource=t.source,void 0===this.sketchSource&&(this.sketchSource=new ol.source.Vector,this.map.addLayer(new ol.layer.Vector({source:this.sketchSource,zIndex:200}))),this.sketchStyle=void 0===t.style?null:t.style,this.isShowingPoint=!1,this.indicatorPoint=new ol.Feature(new ol.geom.Point([20,20])),void 0!==t.indicatorPointStyle&&this.indicatorPoint.setStyle(t.indicatorPointStyle),this.isShowingCross=!1,this.indicatorCross=new ol.Feature(new ol.geom.Point([100,100])),void 0!==t.indicatorCrossStyle?this.indicatorCross.setStyle(t.indicatorCrossStyle):this.indicatorCross.setStyle([new ol.style.Style({image:new ol.style.RegularShape({stroke:new ol.style.Stroke({color:[0,153,255,1],width:3}),points:4,radius1:6,radius2:0,angle:Math.PI/4})}),new ol.style.Style({image:new ol.style.RegularShape({stroke:new ol.style.Stroke({color:[255,255,255,.75],width:1.5}),points:4,radius1:6,radius2:0,angle:Math.PI/4})})]),this.indicatorSource=new ol.source.Vector,this.map.addLayer(new ol.layer.Vector({source:this.indicatorSource,zIndex:200})),this.toggleActive()}return ol.inherits(t,ol.interaction.Pointer),t.prototype.getHighDpiScaling=function(){return this.snapshot.height/this.map.getSize()[1]},t.prototype.toSnapshotCoordinates=function(t){var e=this.map.getView().calculateExtent(this.map.getSize()),n=this.snapshot.height,i=this.getHighDpiScaling()/this.map.getView().getResolution();return t.map(function(t){return[Math.round((t[0]-e[0])*i),n-Math.round((t[1]-e[1])*i)]})},t.prototype.fromSnapshotCoordinates=function(t){var e=this.map.getView().calculateExtent(this.map.getSize()),n=this.snapshot.height,i=this.map.getView().getResolution()/this.getHighDpiScaling();return t.map(function(t){return[Math.round(t[0]*i+e[0]),Math.round((n-t[1])*i+e[1])]})},t.prototype.fromMagicWandCoordinates=function(t){return t.map(function(t){return[t.x,t.y]})},t.prototype.handleUpEvent=function(t){return this.currentThreshold=this.colorThreshold,this.isShowingCross?this.sketchSource.removeFeature(this.sketchFeature):this.dispatchEvent({type:"drawend",feature:this.sketchFeature}),this.sketchFeature=null,this.indicatorSource.clear(),this.isShowingPoint=!1,this.isShowingCross=!1,!1},t.prototype.handleDownEvent=function(t){return this.downPoint[0]=Math.round(t.coordinate[0]),this.downPoint[1]=Math.round(t.coordinate[1]),this.drawSketch(),this.indicatorPoint.getGeometry().setCoordinates(this.downPoint),this.indicatorCross.getGeometry().setCoordinates(this.downPoint),this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorCross),this.isShowingCross=!0,this.isShowingPoint=!1,!0},t.prototype.handleDragEvent=function(t){var e=this.toSnapshotCoordinates([t.coordinate]).shift(),n=Math.round(e[0]),i=Math.round(e[1]),o=this.toSnapshotCoordinates([this.downPoint]).shift(),a=o[0],s=o[1];if(n!==a||i!==s){var r=n-a,l=i-s,h=Math.sqrt(r*r+l*l);h<=this.discardRadius&&!t.originalEvent.shiftKey?this.isShowingCross||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorCross),this.isShowingCross=!0,this.isShowingPoint=!1):this.isShowingPoint||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorPoint),this.isShowingCross=!1,this.isShowingPoint=!0);var c=Math.min(Math.max(this.colorThreshold+Math.round(h/2-this.colorThreshold),1),255);c!=this.currentThreshold&&(this.currentThreshold=c,this.drawSketch())}},t.prototype.handleMoveEvent=function(t){this.isShowingPoint||(this.indicatorSource.clear(),this.indicatorSource.addFeature(this.indicatorPoint),this.isShowingPoint=!0,this.isShowingCross=!1),this.indicatorPoint.getGeometry().setCoordinates(t.coordinate)},t.prototype.toggleActive=function(){this.getActive()?(this.map.on(["moveend","change:size"],this.updateSnapshot.bind(this)),this.updateSnapshot()):(this.map.un(["moveend","change:size"],this.updateSnapshot.bind(this)),this.indicatorSource.clear(),this.isShowingPoint=!1,this.isShowingCross=!1,this.sketchFeature&&(this.sketchSource.removeFeature(this.sketchFeature),this.sketchFeature=null))},t.prototype.updateSnapshot=function(){!this.updatingSnapshot&&this.layer&&(this.layer.once("postcompose",this.updateSnapshotCanvas.bind(this)),this.updatingSnapshot=!0,this.map.renderSync(),this.updatingSnapshot=!1)},t.prototype.updateSnapshotCanvas=function(t){this.snapshotCanvas.width=t.context.canvas.width,this.snapshotCanvas.height=t.context.canvas.height,this.snapshotContext.drawImage(t.context.canvas,0,0),this.snapshot=this.snapshotContext.getImageData(0,0,this.snapshotCanvas.width,this.snapshotCanvas.height),this.snapshot.bytes=4},t.prototype.setLayer=function(t){this.layer=t},t.prototype.drawSketch=function(){var t=this.toSnapshotCoordinates([this.downPoint]).shift(),e=MagicWand.floodFill(this.snapshot,t[0],t[1],this.currentThreshold);this.blurRadius>0&&(e=MagicWand.gaussBlurOnlyBorder(e,this.blurRadius));for(var n=e.data,i=this.snapshot.data,o=n.length-1;o>=0;o--)0===i[4*o]&&(n[o]=0);var a=MagicWand.traceContours(e).filter(function(t){return!t.innner}).shift();if(a){this.simplifyTolerant>0&&(a=MagicWand.simplifyContours([a],this.simplifyTolerant,this.simplifyCount).shift());var s=this.fromSnapshotCoordinates(this.fromMagicWandCoordinates(a.points));this.sketchFeature?this.sketchFeature.getGeometry().setCoordinates([s]):(this.sketchFeature=new ol.Feature(new ol.geom.Polygon([s])),this.sketchStyle&&this.sketchFeature.setStyle(this.sketchStyle),this.sketchSource.addFeature(this.sketchFeature))}},t}),biigle.$declare("annotations.ol.ZoomToNativeControl",function(){function t(t){var e=t||{},n=e.label?e.label:"1",i=document.createElement("button"),o=this;i.innerHTML=n,i.title="Zoom to original resolution",i.addEventListener("click",function(){o.zoomToNative.call(o)});var a=document.createElement("div");a.className="zoom-to-native ol-unselectable ol-control",a.appendChild(i),ol.control.Control.call(this,{element:a,target:e.target}),this.duration_=void 0!==e.duration?e.duration:250}return ol.inherits(t,ol.control.Control),t.prototype.zoomToNative=function(){var t=this.getMap(),e=t.getView();if(e){e.getResolution()&&(this.duration_>0?e.animate({resolution:1,duration:this.duration_}):e.setResolution(1))}},t}),biigle.$component("annotations.components.annotationCanvas.annotationTooltip",function(){return{components:{labelTooltip:biigle.$require("annotations.components.labelTooltip"),measureTooltip:biigle.$require("annotations.components.measureTooltip")},props:{showLabelTooltip:{type:Boolean,default:!1},showMeasureTooltip:{type:Boolean,default:!1}},computed:{showAnnotationTooltip:function(){return this.isDefaultInteractionMode&&(this.showLabelTooltip||this.showMeasureTooltip)}},data:function(){return{hoveredFeaturesHash:""}},methods:{annotationLayerFilter:function(t){return"annotations"===t.get("name")},updateHoveredAnnotations:function(t){var e=this.map.getFeaturesAtPixel(t.pixel,{layerFilter:this.annotationLayerFilter})||[],n=e.map(function(t){return t.getId()}).join("-");this.hoveredFeaturesHash!==n&&(this.hoveredFeaturesHash=n,this.$emit("hoverFeatures",e))},resetHoveredAnnotations:function(){this.hoveredFeaturesHash="",this.$emit("hoverFeatures",[])}},watch:{showAnnotationTooltip:function(t){t?this.map.on("pointermove",this.updateHoveredAnnotations):(this.map.un("pointermove",this.updateHoveredAnnotations),this.resetHoveredAnnotations())}}}}),biigle.$component("annotations.components.annotationCanvas.attachLabelInteraction",function(){var t;return{computed:{isAttaching:function(){return"attach"===this.interactionMode}},methods:{toggleAttaching:function(){this.isAttaching?this.resetInteractionMode():this.interactionMode="attach"},handleAttachLabel:function(t){this.$emit("attach",t.feature.get("annotation"),this.selectedLabel)}},watch:{isAttaching:function(e){this.canAdd&&(e&&!this.hasSelectedLabel?this.requireSelectedLabel():t.setActive(e))},selectedLabel:function(t){!t&&this.isAttaching&&this.resetInteractionMode()}},mounted:function(){if(this.canAdd){var e=biigle.$require("annotations.ol.AttachLabelInteraction");t=new e({features:this.annotationFeatures,map:this.map}),t.setActive(!1),t.on("attach",this.handleAttachLabel),this.map.addInteraction(t),biigle.$require("keyboard").on("l",this.toggleAttaching,0,this.listenerSet)}}}}),biigle.$component("annotations.components.annotationCanvas.drawInteractions",function(){var t,e=function(t){var e=t.pointerEvent;return!(!e||"pen"!==e.pointerType)||ol.events.condition.shiftKeyOnly(t)};return{computed:{isDrawing:function(){return this.interactionMode.startsWith("draw")},isDrawingPoint:function(){return"drawPoint"===this.interactionMode},isDrawingRectangle:function(){return"drawRectangle"===this.interactionMode},isDrawingCircle:function(){return"drawCircle"===this.interactionMode},isDrawingLineString:function(){return"drawLineString"===this.interactionMode},isDrawingPolygon:function(){return"drawPolygon"===this.interactionMode},isDrawingEllipse:function(){return"drawEllipse"===this.interactionMode}},methods:{draw:function(t){this["isDrawing"+t]?this.resetInteractionMode():this.hasSelectedLabel?this.canAdd&&(this.interactionMode="draw"+t):this.requireSelectedLabel()},drawPoint:function(){this.draw("Point")},drawRectangle:function(){this.draw("Rectangle")},drawCircle:function(){this.draw("Circle")},drawLineString:function(){this.draw("LineString")},drawPolygon:function(){this.draw("Polygon")},drawEllipse:function(){this.draw("Ellipse")},maybeUpdateDrawInteractionMode:function(n){t&&(this.map.removeInteraction(t),t=void 0),this.isDrawing&&(t=new ol.interaction.Draw({source:this.annotationSource,type:n.slice(4),style:this.styles.editing,freehandCondition:e}),t.on("drawend",this.handleNewFeature),this.map.addInteraction(t))}},watch:{selectedLabel:function(t){this.isDrawing&&!t&&this.resetInteractionMode()}},created:function(){if(this.canAdd){var t=biigle.$require("keyboard");t.on("a",this.drawPoint,0,this.listenerSet),t.on("s",this.drawRectangle,0,this.listenerSet),t.on("d",this.drawCircle,0,this.listenerSet),t.on("Shift+d",this.drawEllipse,0,this.listenerSet),t.on("f",this.drawLineString,0,this.listenerSet),t.on("g",this.drawPolygon,0,this.listenerSet),this.$watch("interactionMode",this.maybeUpdateDrawInteractionMode)}}}}),biigle.$component("annotations.components.annotationCanvas.lawnmower",function(){return{data:function(){return{imageSection:[0,0],imageSectionCenter:[0,0]}},computed:{imageSectionSteps:function(){return[Math.ceil(this.image.width/(this.viewExtent[2]-this.viewExtent[0])),Math.ceil(this.image.height/(this.viewExtent[3]-this.viewExtent[1]))]},imageSectionStepSize:function(){var t,e=[this.viewExtent[2]-this.viewExtent[0],this.viewExtent[3]-this.viewExtent[1]];return this.imageSectionSteps[0]>1?(t=e[0]*this.imageSectionSteps[0]-this.image.width,e[0]-=t/(this.imageSectionSteps[0]-1)):e[0]=this.viewExtent[2],this.imageSectionSteps[1]>1?(t=e[1]*this.imageSectionSteps[1]-this.image.height,e[1]-=t/(this.imageSectionSteps[1]-1)):e[1]=this.viewExtent[3],e},imageSectionStartCenter:function(){var t=[(this.viewExtent[2]-this.viewExtent[0])/2,(this.viewExtent[3]-this.viewExtent[1])/2];return this.imageSectionSteps[0]<=1&&(t[0]=this.extent[2]/2),this.imageSectionSteps[1]<=1&&(t[1]=this.extent[3]/2),t},isLawnmowerAnnotationMode:function(){return"lawnmower"===this.annotationMode}},methods:{getImageSectionCenter:function(t){return[t[0]*this.imageSectionStepSize[0]+this.imageSectionStartCenter[0],t[1]*this.imageSectionStepSize[1]+this.imageSectionStartCenter[1]]},showImageSection:function(t){return t[0]=0&&t[1]>=0&&(this.imageSection=t,this.imageSectionCenter=this.getImageSectionCenter(t),this.map.getView().setCenter(this.imageSectionCenter),!0)},showLastImageSection:function(){this.showImageSection([this.imageSectionSteps[0]-1,this.imageSectionSteps[1]-1])},showFirstImageSection:function(){this.showImageSection([0,0])},showPreviousImageSection:function(){var t=this.imageSection[0]-1;return t>=0?this.showImageSection([t,this.imageSection[1]]):this.showImageSection([this.imageSectionSteps[0]-1,this.imageSection[1]-1])},showNextImageSection:function(){var t=this.imageSection[0]+1;return t=0;i--)for(var o=this.regularSamplingColumns-1;o>=0;o--)n.unshift([e[0]+o*t[0],e[1]+i*t[1]]);return n},randomSamplingLocations:function(){if(!this.randomLocationMemory.hasOwnProperty(this.image.id)){for(var t=[],e=this.image.width,n=this.image.height,i=this.randomSamplingCount;i>0;i--)t.push([Math.round(Math.random()*e),Math.round(Math.random()*n)]);this.randomLocationMemory[this.image.id]=t}return this.randomLocationMemory[this.image.id]},samplingLocations:function(){return this[this.annotationMode+"Locations"]},isSamplingAnnotationMode:function(){return this.annotationMode.endsWith("Sampling")}},methods:{setSamplingData:function(t,e){"regularSampling"===t?Array.isArray(e)&&e[0]>0&&e[1]>0&&(this.regularSamplingRows=e[0],this.regularSamplingColumns=e[1]):"randomSampling"===t&&e>0&&(this.randomSamplingCount=e)},updateShownSamplingLocation:function(){var t=this.currentSamplingIndex;null!==t&&t>=0&&t=this.samplingLocations.length)&&(this.currentSamplingIndex=t,this.updateShownSamplingLocation(),!0)},createSampledAnnotation:function(){var t=this.samplingLocations[this.currentSamplingIndex];this.createPointAnnotationAt(t[0],t[1])}},watch:{isSamplingAnnotationMode:function(e){e?this.map.addLayer(t):this.map.removeLayer(t)},randomSamplingCount:function(){this.randomLocationMemory={}}}}}),biigle.$component("annotations.components.annotationCanvas.scaleLine",function(){return{components:{scaleLineIndicator:biigle.$require("annotations.components.scaleLineIndicator")},props:{showScaleLine:{type:Boolean,default:!1},imagesArea:{type:Object,default:null}}}}),biigle.$component("annotations.components.annotationCanvas.translateInteraction",function(){var t;return{computed:{isTranslating:function(){return"translate"===this.interactionMode}},methods:{toggleTranslating:function(){this.isTranslating?this.resetInteractionMode():this.interactionMode="translate"}},watch:{isTranslating:function(e){this.canModify&&t.setActive(e)}},mounted:function(){if(this.canModify){var e=biigle.$require("annotations.ol.ExtendedTranslateInteraction");t=new e({features:this.selectInteraction.getFeatures(),map:this.map}),t.setActive(!1),t.on("translatestart",this.handleFeatureModifyStart),t.on("translateend",this.handleFeatureModifyEnd),this.map.addInteraction(t),biigle.$require("keyboard").on("m",this.toggleTranslating,0,this.listenerSet)}}}}),biigle.$component("annotations.components.annotationCanvas.zoomLevel",function(){return{components:{zoomLevelIndicator:biigle.$require("annotations.components.zoomLevelIndicator")},props:{showZoomLevel:{type:Boolean,default:!1}}}}); \ No newline at end of file diff --git a/src/resources/assets/js/annotations/stores/images.js b/src/resources/assets/js/annotations/stores/images.js index 3b12a11..4bc1273 100644 --- a/src/resources/assets/js/annotations/stores/images.js +++ b/src/resources/assets/js/annotations/stores/images.js @@ -6,6 +6,18 @@ biigle.$declare('annotations.stores.images', function () { var fxCanvas; + // This canvas is used as workaround to the auto-rotation of images according to EXIF + // in Chrome (and maybe other browsers). The canvas and image need CSS + // "image-orientation: none" to disable auto-rotation. For the style to be applied, + // the elements need to be placed in the DOM. This single canvas is used for all + // images so each image does not have to append a new canvas to the DOM. + // See: https://bugs.chromium.org/p/chromium/issues/detail?id=158753#c114 + var drawCanvas = document.createElement('canvas'); + drawCanvas.style.imageOrientation = 'none'; + drawCanvas.style.visibility = 'hidden'; + drawCanvas.style.position = 'fixed'; + document.body.appendChild(drawCanvas); + if (window.hasOwnProperty('fx')) { try { // If fxCanvas is not initialized WebGL is not supported at all. @@ -127,6 +139,13 @@ biigle.$declare('annotations.stores.images', function () { crossOrigin: false, }; + // Disable auto-rotation. Otherwise the canvas element might use the + // wrong values for width/height. + img.style.imageOrientation = 'none'; + img.style.visibility = 'hidden'; + img.style.position = 'fixed'; + document.body.appendChild(img); + var promise = new Vue.Promise(function (resolve, reject) { img.onload = function () { imageWrapper.width = img.width; @@ -139,6 +158,10 @@ biigle.$declare('annotations.stores.images', function () { }; }); + promise.finally(function () { + document.body.removeChild(img); + }); + // The image may be tiled, so we request the data from the endpoint and // check if it's an image or a JSON. If this is a cross origin request, // the preflight request is automatically performed. If CORS is blocked, @@ -173,18 +196,26 @@ biigle.$declare('annotations.stores.images', function () { }); }, drawSimpleImage: function (image) { + drawCanvas.width = image.width; + drawCanvas.height = image.height; + drawCanvas.getContext('2d').drawImage(image.source, 0, 0); + image.canvas.width = image.width; image.canvas.height = image.height; - image.canvas.getContext('2d').drawImage(image.source, 0, 0); + image.canvas.getContext('2d').drawImage(drawCanvas, 0, 0); return image; }, drawColorAdjustedImage: function (image) { if (loadedImageTexture !== image.source.src) { + drawCanvas.width = image.width; + drawCanvas.height = image.height; + drawCanvas.getContext('2d').drawImage(image.source, 0, 0); + if (fxTexture) { - fxTexture.loadContentsOf(image.source); + fxTexture.loadContentsOf(drawCanvas); } else { - fxTexture = fxCanvas.texture(image.source); + fxTexture = fxCanvas.texture(drawCanvas); } loadedImageTexture = image.source.src; }