Add auto scaling image

apps/mlm.py

@@ -50,8 +50,11 @@ def app(state):
     if mlm_state.mlm_image_file is None:
         mlm_state.mlm_image_file = dummy_data.loc[first_index, "image_file"]
         caption = dummy_data.loc[first_index, "caption"].strip("- ")
+        mlm_state.unmasked_caption = caption
         ids = bert_tokenizer.encode(caption)
-        ids[np.random.randint(1, len(ids) - 1)] = bert_tokenizer.mask_token_id
+        mask_index = np.random.randint(1, len(ids) - 1)
+        mlm_state.currently_masked_token = ids[mask_index]
+        ids[mask_index] = bert_tokenizer.mask_token_id
         mlm_state.caption = bert_tokenizer.decode(ids[1:-1])
         mlm_state.caption_lang_id = dummy_data.loc[first_index, "lang_id"]
 
@@ -72,8 +75,11 @@ def app(state):
         sample = dummy_data.sample(1).reset_index()
         mlm_state.mlm_image_file = sample.loc[0, "image_file"]
         caption = sample.loc[0, "caption"].strip("- ")
+        mlm_state.unmasked_caption = caption
         ids = bert_tokenizer.encode(caption)
-        ids[np.random.randint(1, len(ids) - 1)] = bert_tokenizer.mask_token_id
+        mask_index = np.random.randint(1, len(ids) - 1)
+        mlm_state.currently_masked_token = ids[mask_index]
+        ids[mask_index] = bert_tokenizer.mask_token_id
         mlm_state.caption = bert_tokenizer.decode(ids[1:-1])
         mlm_state.caption_lang_id = sample.loc[0, "lang_id"]
 
@@ -99,7 +105,7 @@ def app(state):
     new_col1, new_col2 = st.beta_columns([5, 5])
 
     # Display Image
-    new_col1.image(mlm_state.mlm_image, use_column_width="always")
+    new_col1.image(mlm_state.mlm_image, use_column_width="auto")
 
     # Display caption
     new_col2.write("Write your text with exactly one [MASK] token.")
@@ -109,9 +115,14 @@ def app(state):
         help="Type your masked caption regarding the image above in one of the four languages.",
     )
 
-    new_col2.markdown(
-        f"""**English Translation**: {caption if mlm_state.caption_lang_id == "en" else translate(caption, 'en')}"""
-    )
+    if caption == mlm_state.caption:
+        new_col2.markdown("**Masked Token**: "+mlm_state.currently_masked_token)
+        new_col2.markdown("**English Translation: " + mlm_state.unmasked_caption if mlm_state.caption_lang_id == "en" else translate(mlm_state.unmasked_caption, 'en'))
+
+    else:
+        new_col2.markdown(
+            f"""**English Translation**: {caption if mlm_state.caption_lang_id == "en" else translate(caption, 'en')}"""
+        )
     caption_inputs = get_text_attributes(caption)
 
     # Display Top-5 Predictions
@@ -119,6 +130,7 @@ def app(state):
         scores = predict(transformed_image, dict(caption_inputs))
     scores = softmax(scores)
     labels, values = get_top_5_predictions(scores)
+    print(labels)
     # newer_col1, newer_col2 = st.beta_columns([6,4])
     fig = plotly_express_horizontal_bar_plot(values, labels)
     st.dataframe(pd.DataFrame({"Tokens":labels, "English Translation": list(map(lambda x: translate(x),labels))}).T)

apps/vqa.py

@@ -109,7 +109,7 @@ def app(state):
     new_col1, new_col2 = st.beta_columns([5, 5])
 
     # Display Image
-    new_col1.image(vqa_state.vqa_image, use_column_width="always")
+    new_col1.image(vqa_state.vqa_image, use_column_width="auto")
 
     # Display Question
     question = new_col2.text_input(