Enable mappings in volume/hybrid tracings (#3949)

* enable mappings in volume tracings that are based on an existing segmentation

* update changelog

* fix flow type

CHANGELOG.md

@@ -19,6 +19,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md).
 - Added the possibility to filter datasets in the dashboard according to their availability. By default, datasets which are missing on disk (e.g., when the datastore was deleted) are not shown anymore. This behavior can be configured via the settings icon next to the search box in the dashboard. [#3883](https://github.com/scalableminds/webknossos/pull/3883)
 - Added merger mode for skeleton and hybrid tracings. It allows to merge segments from e.g. generated segmentations. [#3619](https://github.com/scalableminds/webknossos/pull/3619)
 - The HTML template now includes SEO tags for demo instances and hides internal instances from search engines.
+- Segmentation ID mappings can now be used in volume and hybrid tracings. [#3949](https://github.com/scalableminds/webknossos/pull/3949)
 - A maximize-button was added to the viewports in the annotation view. Maximization can also be toggled with the `.` shortcut. [#3876](https://github.com/scalableminds/webknossos/pull/3876)
 - [webknossos-connect](https://github.com/scalableminds/webknossos-connect) now starts with webKnossos on local and development instances by default. [#3913](https://github.com/scalableminds/webknossos/pull/3913)
 - Paginated routes now send a `X-Total-Count` HTTP header which shows how many entries were found in total. [#3899](https://github.com/scalableminds/webknossos/pull/3899)

frontend/javascripts/admin/api_flow_types.js

@@ -41,14 +41,15 @@ type APIDataLayerBase = {|
 
 type APIColorLayer = {|
   ...APIDataLayerBase,
-  category: "color",
+  +category: "color",
 |};
 
 export type APISegmentationLayer = {|
   ...APIDataLayerBase,
-  category: "segmentation",
-  largestSegmentId: number,
+  +category: "segmentation",
+  +largestSegmentId: number,
   +mappings?: Array<string>,
+  +fallbackLayer?: ?string,
 |};
 
 export type APIDataLayer = APIColorLayer | APISegmentationLayer;

frontend/javascripts/oxalis/model/bucket_data_handling/mappings.js

@@ -64,13 +64,15 @@ class Mappings {
   mappingColorTexture: UpdatableTexture;
   progressCallback: ProgressCallback;
 
-  constructor(layerName: string) {
+  constructor(layerName: string, fallbackLayerName: ?string) {
     const { dataset } = Store.getState();
     const organizationName = dataset.owningOrganization;
     const datasetName = dataset.name;
     const dataStoreUrl = dataset.dataStore.url;
+    // If there is a fallbackLayer, request mappings for that instead of the tracing segmentation layer
+    const mappingLayerName = fallbackLayerName != null ? fallbackLayerName : layerName;
     this.layerName = layerName;
-    this.baseUrl = `${dataStoreUrl}/data/datasets/${organizationName}/${datasetName}/layers/${layerName}/mappings/`;
+    this.baseUrl = `${dataStoreUrl}/data/datasets/${organizationName}/${datasetName}/layers/${mappingLayerName}/mappings/`;
     this.progressCallback = noopProgressCallback;
   }
 

frontend/javascripts/oxalis/model/data_layer.js

@@ -40,14 +40,15 @@ class DataLayer {
 
     const { dataset } = Store.getState();
     const bitDepth = getBitDepth(getLayerByName(dataset, this.name));
+    const isSegmentation = layerInfo.category === "segmentation";
 
     ErrorHandling.assert(this.resolutions.length > 0, "Resolutions for layer cannot be empty");
 
     this.cube = new DataCube(
       getLayerBoundaries(dataset, this.name).upperBoundary,
       this.resolutions.length,
       bitDepth,
-      layerInfo.category === "segmentation",
+      isSegmentation,
     );
 
     this.pullQueue = new PullQueue(
@@ -58,15 +59,15 @@ class DataLayer {
     );
     this.pushQueue = new PushQueue(this.cube);
     this.cube.initializeWithQueues(this.pullQueue, this.pushQueue);
-    this.mappings = new Mappings(layerInfo.name);
-    this.activeMapping = null;
+    const fallbackLayerName = layerInfo.fallbackLayer != null ? layerInfo.fallbackLayer : null;
+    this.mappings = new Mappings(layerInfo.name, fallbackLayerName);
     this.layerRenderingManager = new LayerRenderingManager(
       this.name,
       this.pullQueue,
       this.cube,
       textureWidth,
       dataTextureCount,
-      layerInfo.category === "segmentation",
+      isSegmentation,
     );
   }
 

frontend/javascripts/oxalis/model_initialization.js

@@ -381,6 +381,8 @@ function setupLayerForVolumeTracing(
     // volume tracing can only be done for the first resolution
     resolutions: [[1, 1, 1]],
     mappings: fallbackLayer != null && fallbackLayer.mappings != null ? fallbackLayer.mappings : [],
+    // remember the name of the original layer, used to request mappings
+    fallbackLayer: tracing.fallbackLayer,
   };
 
   if (fallbackLayer != null) {

frontend/javascripts/oxalis/view/right-menu/mapping_info_view.js

@@ -216,7 +216,10 @@ class MappingInfoView extends React.Component<Props, State> {
     const mappings = await getMappingsForDatasetLayer(
       this.props.dataset.dataStore.url,
       this.props.dataset,
-      segmentationLayer.name,
+      // If there is a fallbackLayer, request mappings for that instead of the tracing segmentation layer
+      segmentationLayer.fallbackLayer != null
+        ? segmentationLayer.fallbackLayer
+        : segmentationLayer.name,
     );
 
     this.props.setAvailableMappingsForLayer(segmentationLayer.name, mappings);
@@ -254,7 +257,7 @@ class MappingInfoView extends React.Component<Props, State> {
     return (
       <div id="volume-mapping-info" className="padded-tab-content" style={{ maxWidth: 500 }}>
         {this.renderIdTable()}
-        {/* Only display the mapping selection when merger mode is not active 
+        {/* Only display the mapping selection when merger mode is not active
             to avoid conflicts in the logic of the UI. */
         !this.props.isMergerModeEnabled ? (
           <div style={{ marginTop: 24, width: "50%", marginLeft: 16 }}>