Merge pull request #22 from thiippal/dev

improve UI by replacing the min_width parameter with full_height
thiippal · Oct 21, 2022 · 31f473c · 31f473c
2 parents 139ec2e + bdd76cd
commit 31f473c
Showing 1 changed file with 46 additions and 25 deletions.
diff --git a/src/abulafia/task_specs/task_specs.py b/src/abulafia/task_specs/task_specs.py
@@ -181,8 +181,9 @@ def specify_task(configuration):
             # Set up the allowed shapes: note that their order will define the order in the UI
             shapes={'rectangle': True, 'polygon': True},
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Set up validation
             validation=tb.RequiredConditionV1(hint="Please select at least one area!"))
@@ -274,8 +275,12 @@ def specify_task(configuration):
                       value, label in configuration["interface"]["labels"].items()]
 
         except KeyError:
-            msg.warn(f"Key 'labels' needs to be configured in the configuration of pool {configuration['name']} "
-                     f"under key 'interface'", exits=1)
+
+            msg.warn(f"Please add the key 'labels' under the top-level key 'interface' to define "
+                     f"the labels for bounding boxes. The labels should be provided as key/value "
+                     f"pairs, e.g. cat: Cat. The key must correspond to the label defined for "
+                     f"the bounding box in the input JSON, whereas the value is the text displayed "
+                     f"in the user interface.", exits=1)
 
         # Create the task interface; start by setting up the image segmentation interface
         img_ui = tb.ImageAnnotationFieldV1(
@@ -290,20 +295,26 @@ def specify_task(configuration):
             # Set up the allowed shapes: note that their order will define the order in the UI
             shapes={'polygon': True, 'rectangle': True},
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Set up labels for the outlines
             labels=labels,
 
             disabled=False
         )
 
-        # Create a button for cases where a target does not exist
-        checkbox = tb.CheckboxFieldV1(
-            data=tb.OutputData(output_data['bool'], default=False),
-            label="Target does not exist"
-        )
+        # Create a checkbox for special cases
+        try:
+            checkbox = tb.CheckboxFieldV1(
+                data=tb.OutputData(output_data['bool'], default=False),
+                label=configuration['interface']['checkbox'])
+
+        except KeyError:
+            msg.warn(f"Please add the key 'checkbox' under the top-level key 'interface' to "
+                     f"define a text that is displayed above the checkbox. Define the text as a "
+                     f"string e.g. checkbox: There is nothing to outline.", exits=1)
 
         # Define the text prompt below the segmentation UI
         prompt = tb.TextViewV1(content=configuration['interface']['prompt'])
@@ -314,7 +325,7 @@ def specify_task(configuration):
             validation=tb.AnyConditionV1(conditions=[tb.SchemaConditionV1(data=tb.OutputData(output_data['json']),
                                                                           schema={'type': 'array', 'minItems': 2}),
                                                      tb.EqualsConditionV1(data=tb.OutputData(output_data['bool']), to=True)],
-                                                     hint="Outline at least one target of specify if target does not exist."),
+                                                     hint="Outline at least one target or check the box if target does not exist."),
             )
         )
 
@@ -399,10 +410,12 @@ def specify_task(configuration):
             # Set up the input data field
             image=tb.InputData(path=input_data['url']),
 
+            # Set labels
             labels=labels,
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Disable annotation interface
             disabled=True)
@@ -514,8 +527,12 @@ def specify_task(configuration):
                       value, label in configuration["interface"]["labels"].items()]
 
         except KeyError:
-            msg.warn(f"Key 'labels' needs to be configured in the configuration of pool "
-                     f"{configuration['name']} under key 'interface'", exits=1)
+
+            msg.warn(f"Please add the key 'labels' under the top-level key 'interface' to define "
+                     f"the labels for bounding boxes. The labels should be provided as key/value "
+                     f"pairs, e.g. cat: Cat. The key must correspond to the label defined for "
+                     f"the bounding box in the input JSON, whereas the value is the text displayed "
+                     f"in the user interface.", exits=1)
 
         # Create the task interface; start by setting up the image segmentation interface
         img_ui = tb.ImageAnnotationFieldV1(
@@ -527,8 +544,9 @@ def specify_task(configuration):
             # Set up the input data field
             image=tb.InputData(path=input_data['url']),
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Set labels
             labels=labels,
@@ -586,7 +604,7 @@ def specify_task(configuration):
 
         # Return the task specification
         return task_spec
-        
+
 
 class FixImageSegmentation(CrowdsourcingTask):
     """
@@ -658,8 +676,9 @@ def specify_task(configuration):
             # Set up the allowed shapes: note that their order will define the order in the UI
             shapes={'rectangle': True, 'polygon': True},
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Set up validation
             validation=tb.RequiredConditionV1(hint="Please select at least one area!"),
@@ -752,8 +771,9 @@ def specify_task(configuration):
             # Set up the input data field
             image=tb.InputData(path=input_data['url']),
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Disable annotation interface
             disabled=True)
@@ -869,8 +889,9 @@ def specify_task(configuration):
             # Set up the input data field
             image=tb.InputData(path=input_data['url']),
 
-            # Set minimum width in pixels
-            min_width=500,
+            # Set this element to use all available vertical space on the page. This should ensure
+            # that all UI elements are visible.
+            full_height=True,
 
             # Disable annotation interface
             disabled=True)