Spaces:
Running
Running
File size: 13,800 Bytes
9b0a8c5 1cfc9e8 9b0a8c5 3bc3503 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 1cfc9e8 9b0a8c5 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 |
import gradio as gr
from functools import partial
from gradio_modal import Modal
from data.lang2eng_map import lang2eng_mapping
from data.words_map import words_mapping
import datetime
from pyuca import Collator
def sort_with_pyuca(strings):
collator = Collator()
return sorted(strings, key=collator.sort_key)
def build_main_page(concepts_dict, metadata_dict, local_storage):
try:
country, lang, _, _ = local_storage.value
if not country and not lang:
country, lang = "USA", "English"
except (TypeError, ValueError):
country, lang = "USA", "English"
with gr.Column(visible=False, elem_id="main_page") as main_ui_placeholder:
# Read the markdown file
with open(metadata_dict["USA"]["English"]["Task"], "r", encoding="utf-8") as f:
TASK_TEXT = f.read()
with open(metadata_dict["USA"]["English"]["Instructions"], "r", encoding="utf-8") as f:
INST_TEXT = f.read()
gr.Markdown("# Wonders: Multicultural Images and Captions for Inclusive AI")
gr.Markdown("Help us collect culturally rich images and captions to improve AI for everyone!")
gr.Markdown("Choose a concept, upload an image showing it in a typical local situation, and write a detailed description about the image.<br> For more information, see the overviews below or click on 'Show instructions' for detailed guidelines.")
gr.Markdown(""" \
### Notes
- By participating in this task, you agree to donate images and captions under [CC BY license](https://creativecommons.org/licenses/by/4.0/), which will allow us to share the data with others to improve AI.
- You will be able to **update or remove** any provided data at any time if you wish so.
- Participants that provide more data, across more concepts and of high quality (see "Instructions" button) will be **rewarded** (see TODO).
"""
)
# with gr.Accordion("📘 Show task overview", open=False):
intro_text_inp = gr.Markdown(TASK_TEXT, visible=False)
# gr.Markdown("## Data Collection")
with gr.Row(equal_height=True):
country_inp = gr.Textbox(label="Country", elem_id="country_inp", interactive=False)
language_inp = gr.Textbox(label="Language", elem_id="language_inp", interactive=False)
username_inp = gr.Textbox(label="email (optional)", type="email", elem_id="username_inp", interactive=False)
password_inp = gr.Textbox(label="password (optional)", type="password", elem_id="password_inp", interactive=False)
exit_btn = gr.Button("⬅️ Change Language", elem_id="exit_btn", elem_classes=["compact-btn"])
with gr.Row(equal_height=True, ):
with gr.Column():
# Main category and concept row - SINGLE SELECTION
with gr.Group():
gr.Markdown("### Main Concept")
gr.Markdown("""\
Select the main concept and category for which you want to share data.<br>
If you want to add a new concept, you can just type it in the same box (after selecting its category).
"""
)
with gr.Row():
# Use concepts_dict to populate the dropdown
categories = concepts_dict["USA"]["English"]
category_btn = gr.Dropdown(choices=sort_with_pyuca(categories.keys()), interactive=True, label="Main Category",
allow_custom_value=False, elem_id="category_btn", multiselect=False, value=None)
concept_btn = gr.Dropdown(choices=[], interactive=True, label="Main Concept",
allow_custom_value=True, elem_id="concept_btn", multiselect=False)
with gr.Group():
gr.Markdown("### Image")
with gr.Accordion("📘 An image of the main concept in typical contexts (click to read more)", open=False):
gr.Markdown("""\=
An image where the *main concept is clearly visible*
- in typical contexts in your country, and
- with other objects/people when possible
Pictures taken by yourself are preferred.
If you want to use an image from the Web, directly add its URL below.
- Please use publicly-licensed images (e.g., from pexels.com or freepik.com)
For more details, click on “Show instructions” below.
"""
)
image_url_inp = gr.Textbox(label="Image URL (Optional, if not uploading an image)", type="text", elem_id="image_url_inp")
image_inp = gr.Image(label="Image", elem_id="image_inp", format="png", height=512, width=768)
with gr.Row():
hide_all_faces_btn = gr.Button("👤 Hide All Faces", elem_id="hide_all_faces_btn")
hide_faces_btn = gr.Button("👤 Hide Specific Faces", elem_id="hide_faces_btn")
unhide_faces_btn = gr.Button("👀 Unhide Faces", elem_id="unhide_faces_btn")
with gr.Column():
# short_caption_inp = gr.Textbox(lines=2, label="Short Description", elem_id="short_caption_inp")
with gr.Group():
gr.Markdown("### Description")
with gr.Accordion("📘 A detailed description (around 40 words covering who?, what? and where?) for the image (click to read more)", open=False):
gr.Markdown("""\
A long image description (around 40 words) with extensive and detailed visual information.<br>
Descriptions must be *objective*: focus on how you would describe the image to someone who can’t see it, without your own opinions/speculations.
The text needs to *include the main concept* and describes the content of the image in detail by including:
- **Who?** The visual *appearance* and observable *emotions* (e.g., “is smiling”) of persons and animals.
- **What?** The *actions* performed in the image.
- **Where?** The *setting* of the image, including the size, color and relationships between objects.
For more details, click on “Show instructions” below.
"""
)
long_caption_inp = gr.Textbox(lines=6, label="Description", elem_id="long_caption_inp")
num_words_inp = gr.Textbox(lines=1, label="Number of words", elem_id="num_words", interactive=False, value=0)
# num_words_inp = gr.Markdown("Number of words", elem_id="num_words")
categories_list = sort_with_pyuca(list(concepts_dict["USA"]["English"].keys()))
def create_category_dropdown(category, index):
original_category = category
if lang in words_mapping:
display_category = words_mapping[lang].get(original_category, original_category)
else:
display_category = original_category
category_choices = concepts_dict[country][lang2eng_mapping.get(lang, lang)][original_category]
sorted_choices = sort_with_pyuca(category_choices)
dropdown = gr.Dropdown(
choices=sorted_choices,
interactive=True,
label=display_category,
allow_custom_value=True,
elem_id=f"category_{index+1}_concepts_btn",
multiselect=True,
value=None
)
return dropdown
category_concept_dropdowns = []
with gr.Group():
gr.Markdown("### Additional concepts (optional)")
gr.Markdown("Tag any other concept that is visible in the image.")
# First row - categories 1 and 2
with gr.Row():
dropdown1 = create_category_dropdown(categories_list[0], 0)
category_concept_dropdowns.append(dropdown1)
dropdown2 = create_category_dropdown(categories_list[1], 1)
category_concept_dropdowns.append(dropdown2)
# Second row - categories 3 and 4
# with gr.Row():
dropdown3 = create_category_dropdown(categories_list[2], 2)
category_concept_dropdowns.append(dropdown3)
dropdown4 = create_category_dropdown(categories_list[3], 3)
category_concept_dropdowns.append(dropdown4)
dropdown5 = create_category_dropdown(categories_list[4], 4)
category_concept_dropdowns.append(dropdown5)
# Third row - category 5 and instructions button
with gr.Row(equal_height=True):
# dropdown5 = create_category_dropdown(categories_list[4], 4)
# category_concept_dropdowns.append(dropdown5)
instruct_btn = gr.Button("📘 Show Instructions")
with Modal(visible=False) as modal:
intro_text_inst_inp = gr.Markdown(INST_TEXT)
with gr.Column():
# with gr.Row():
# instruct_btn = gr.Button("📘 Show Instructions")
# with Modal(visible=False) as modal:
# intro_text_inst_inp = gr.Markdown(INST_TEXT)
with gr.Row(equal_height=True):
clear_btn = gr.Button("Clear", variant="huggingface", elem_id="clear_btn")
with Modal(visible=False, allow_user_close=False) as modal_saving:
modal_saving_text = gr.Markdown("⏳ Please wait while your submission is being saved.")
with Modal(visible=False) as modal_data_saved:
modal_data_saved_text = gr.Markdown("Your data has been saved successfully. The data in the table below will be updated shortly. You can now close this window.")
submit_btn = gr.Button("Submit", variant="primary", interactive=False, elem_id="submit_btn")
with Modal(visible=False) as modal_exclude_confirm:
gr.Markdown("## Are you sure you want to exclude this example?")
gr.Markdown("This action will permanently delete the example.")
with gr.Row():
cancel_exclude_btn = gr.Button("Cancel")
confirm_exclude_btn = gr.Button("Yes, delete", variant="stop")
exclude_btn = gr.Button("Exclude Selected Example", variant="stop", visible=True)
with gr.Column():
timestamp_btn = gr.Textbox(datetime.datetime.now(), label="Timestamp", visible=False, elem_id="timestamp_btn", interactive=False) # FIXME visible=False)
exampleid_btn = gr.Textbox(label="ID", visible=False, elem_id="example_id", interactive=False) # FIXME visible=False)
output_dict = {
"main_ui_placeholder": main_ui_placeholder,
"country_inp": country_inp,
"language_inp": language_inp,
"username_inp": username_inp,
"password_inp": password_inp,
"image_inp": image_inp,
"image_url_inp": image_url_inp,
"long_caption_inp": long_caption_inp,
"num_words_inp": num_words_inp,
"category_btn": category_btn,
"concept_btn": concept_btn,
"category_concept_dropdowns": category_concept_dropdowns,
"category_1_concepts": category_concept_dropdowns[0],
"category_2_concepts": category_concept_dropdowns[1],
"category_3_concepts": category_concept_dropdowns[2],
"category_4_concepts": category_concept_dropdowns[3],
"category_5_concepts": category_concept_dropdowns[4],
"instruct_btn": instruct_btn,
"clear_btn": clear_btn,
"submit_btn": submit_btn,
"modal": modal,
"modal_saving": modal_saving,
"modal_data_saved": modal_data_saved,
"timestamp_btn": timestamp_btn,
"exampleid_btn": exampleid_btn,
"exit_btn": exit_btn,
"intro_text_inp": intro_text_inp,
"intro_text_inst_inp": intro_text_inst_inp,
"modal_saving_text": modal_saving_text,
"modal_data_saved_text": modal_data_saved_text,
"hide_faces_btn": hide_faces_btn,
"hide_all_faces_btn": hide_all_faces_btn,
"unhide_faces_btn": unhide_faces_btn,
"exclude_btn": exclude_btn,
"modal_exclude_confirm": modal_exclude_confirm,
"cancel_exclude_btn": cancel_exclude_btn,
"confirm_exclude_btn": confirm_exclude_btn,
}
return output_dict
|