Create Volumetric Task (#7227)

* Create Volumetric Task
* Clean up based on PR feedback

app/classifier/tasks/generic-editor.cjsx

@@ -47,6 +47,7 @@ module.exports = createReactClass
       when 'slider' then ['instruction']
       when 'highlighter' then ['instruction', 'highlighterLabels']
       when 'dataVisAnnotation' then ['instruction', 'tools']
+      when 'volumetric' then ['instruction']
 
     isAQuestion = @props.task.type in ['single', 'multiple']
     canBeRequired = @props.task.type in ['single', 'multiple', 'text']

app/classifier/tasks/index.js

@@ -13,6 +13,7 @@ import Highlighter from './highlighter';
 import TranscriptionTask from './transcription';
 import SubjectGroupComparisonTask from './subjectGroupComparison';
 import DataVisAnnotationTask from './dataVisAnnotation'
+import VolumetricTask from './volumetric';
 
 const tasks = {
   combo: ComboTask,
@@ -29,7 +30,8 @@ const tasks = {
   highlighter: Highlighter,
   transcription: TranscriptionTask,
   subjectGroupComparison: SubjectGroupComparisonTask,
-  dataVisAnnotation: DataVisAnnotationTask
+  dataVisAnnotation: DataVisAnnotationTask,
+  volumetric: VolumetricTask
 };
 
 export default tasks;

app/classifier/tasks/volumetric/index.jsx

@@ -0,0 +1,44 @@
+import PropTypes from "prop-types";
+import React from "react";
+import GenericTaskEditor from "../generic-editor";
+
+export default class VolumetricTask extends React.Component {
+  render() {
+    return <div>This is a placeholder for the Volumetric Task, which is only visible in the FEM Classifier</div>;
+  }
+}
+
+VolumetricTask.Editor = GenericTaskEditor;
+
+VolumetricTask.getDefaultTask = () => ({
+  help: "",
+  instruction: "Describe how to use this tool",
+  type: "volumetric",
+});
+
+VolumetricTask.getTaskText = (task) => task.instruction;
+
+VolumetricTask.getDefaultAnnotation = () => ({ value: [] });
+
+VolumetricTask.defaultProps = {
+  showRequiredNotice: false,
+  task: {
+    help: "",
+    required: false,
+    type: "volumetric",
+    instruction: "Describe how to use this tool",
+  },
+  workflow: {
+    tasks: [],
+  },
+};
+
+VolumetricTask.propTypes = {
+  showRequiredNotice: PropTypes.bool,
+  task: PropTypes.shape({
+    help: PropTypes.string,
+    instruction: PropTypes.string,
+    required: PropTypes.bool,
+    type: PropTypes.string,
+  })
+};

app/pages/admin/project-status/experimental-features.jsx

@@ -34,7 +34,7 @@ const experimentalFeatures = [
   'textFromSubject', // textFromSubject task only works in FEM!
   'transcription-task',
   'translator-role',
-  'volumetricViewer',
+  'volumetricProject', // Turns a project into a Volumetric-enabled Project
   'wildcam classroom', // Indicates a Project is linked to a "WildCam Lab"-type Zooniverse Classroom. Allows the classifier to select a workflow (i.e. "classroom assignment") directly via ID.
   'workflow assignment',
   'worldwide telescope'

app/pages/lab-fem/workflow.jsx

@@ -151,7 +151,7 @@ class EditWorkflowPage extends Component {
     } = this.props.workflow.configuration;
     if (hide_classification_summaries === undefined) { hide_classification_summaries = true; }
 
-	  const isCaesarDataFetchingEnabled = this.props.workflow?.configuration?.enable_caesar_data_fetching ?? false;
+    const isCaesarDataFetchingEnabled = this.props.workflow?.configuration?.enable_caesar_data_fetching ?? false;
 
     return (
       <div className="edit-workflow-page">
@@ -301,6 +301,14 @@ class EditWorkflowPage extends Component {
                             <small><strong>Data annotation</strong></small>
                           </button>
                         </AutoSave> : undefined}{' '}
+                      {this.canUseTask(this.props.project, "volumetricProject") ?
+                        <AutoSave resource={this.props.workflow}>
+                          <button type="button" className="minor-button" onClick={this.addNewTask.bind(this, 'volumetric')} title="Volumetric Task: the volunteer looks at a volumetric viewer, and selects the point of the volume to be annotated.">
+                            <i className="fa fa-th fa-2x"></i>
+                            <br />
+                            <small><strong>Volumetric Task</strong></small>
+                          </button>
+                        </AutoSave> : undefined}{' '}
                       </div> : undefined}
                 </div>