app.py

import gradio as gr

# # Define a list of word and translation pairs
# word_translations = [
#     {"word": "Hello", "translation": "Hola"},
#     {"word": "Goodbye", "translation": "Adiós"},
#     {"word": "Thank you", "translation": "Gracias"},
#     {"word": "Please", "translation": "Por favor"}
# ]

word_translations = [
  {
    "text": "Hello",
    "image_url": "https://example.com/image1.jpg",
    "translation": "Hola",
    "link": "https://www.google.com/"
  },
  {
    "text": "World",
    "image_url": "https://example.com/image2.jpg",
    "translation": "Mundo",
    "link": "https://en.wikipedia.org/wiki/World"
  },
  {
    "text": "Goodbye",
    "image_url": "https://example.com/image3.jpg",
    "translation": "Adiós",
    "link": "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
  }
]

# Initialize an index to keep track of the current word
current_index = 0

# Function to display the current word and translation
def display_word():
    global current_index
    word_translation = word_translations[current_index]
    current_index = (current_index + 1) % len(word_translations)
    return f"Word: {word_translation['word']}<br>Translation: {word_translation['translation']} {gr.HTML(f"<iframe src=\'{item['link']}\' width='100%' height='500px'></iframe>"))}" 

# Create a Gradio interface
iface = gr.Interface(
    fn=display_word,
    live=True,
    title="Word Translation App",
    description="Click 'Next' to view the next word and translation.",
    inputs=[],
    outputs=["html"],
    layout="vertical"
)

# Start the Gradio interface
iface.launch()

# import gradio as gr
# import random

# # Define your list of words and their translations
# word_translations = [
#     {"word": "Apple", "translation": "Manzana", "image_url": "apple_image.jpg"},
#     {"word": "Banana", "translation": "Plátano", "image_url": "banana_image.jpg"},
#     {"word": "Orange", "translation": "Naranja", "image_url": "orange_image.jpg"},
#     # Add more words and translations as needed
# ]

# # Initialize a variable to keep track of the current word index
# current_word_index = 0

# # Define a function to display the current word and translation
# def display_word():
#     word_info = word_translations[current_word_index]
#     word = word_info["word"]
#     translation = word_info["translation"]
#     image_url = word_info["image_url"]
#     return f"Word: {word}<br>Translation: {translation}<br><img src='{image_url}' width='200'>"

# # Define a function to handle the "Next" button click
# def next_word():
#     global current_word_index
#     current_word_index = (current_word_index + 1) % len(word_translations)
#     return display_word()

# # Create a Gradio interface
# iface = gr.Interface(
#     fn=display_word,
#     live=True,
#     title="Word Translation App",
#     description="Click 'Next' to view the next word and translation.",
#     inputs=[],
#     outputs="html",
#     layout="vertical",
#     wide=True
# )

# # Add a "Next" button to the interface
# iface.add_button("Next", next_word)

# # Launch the Gradio interface
# iface.launch()

# import gradio as gr
# import requests
# from PIL import Image



# def display_item(index, list_of_items):
#     """Displays a single item from a list of items.
    
#     Args:
#     index: The index of the item to display.
#     list_of_items: A list of Python dictionaries, where each dictionary has the following keys:
#       * text: The text.
#       * image_url: The URL of the image.
#       * translation: The translation of the text.
#       * link: The URL of the website link.
#     """
    
#     # Get the item from the list of items
#     item = list_of_items[index]
    
#     # Display the text
#     gr.Text(item["text"])
    
#     # Display the image
#     image = Image.open(requests.get(item["image_url"], stream=True).raw)
#     gr.Image(image)
    
#     # Display the translation
#     gr.Text(item["translation"])
    
#     # Display the website link
#     gr.Button("View website", onclick=lambda: gr.HTML(f"<iframe src='{item['link']}' width='100%' height='500px'></iframe>"))

# # Define a function to show the next item
# def show_next_item(index, list_of_items):
#     index += 1
    
#     # If the index is greater than the length of the list of items, then reset the index to 0
#     if index >= len(list_of_items):
#         index = 0
    
#     # Display the next item
#     display_item(index, list_of_items)

# # Create a Gradio interface
# interface = gr.Interface(display_item, inputs=["number", "list"], outputs="html")

# # Launch the Gradio interface
# # interface.launch(index=0, list_of_items=list_of_items, show_next_item=show_next_item)
# interface.launch()