app.py

import time

# Logger Setup
logger = logging.getLogger(__name__)

# Streamlit settings
st.set_page_config(page_title="Virtual Keyboard", page_icon="🏋️")
st.title("Interactive Virtual Keyboard")
st.subheader('''Turn on the webcam and use hand gestures to interact with the virtual keyboard .''')

# Initialize MediaPipe and Background Segmentor
mp_hands = mp.solutions.hands
        ["Z", "X", "C", "V", "B", "N", "M", ",", ".", "/"]]

class Button:
    def __init__(self, pos, text, size=[100, 100]):
        self.pos = pos
        self.size = size
        self.text = text
    # Create the keyboard buttons
    buttonList = []
    h, w = img.shape[:2]
    key_width = int(0.07 * w)
    key_height = int(0.09 * h)
    font_scale = 0.0045 * w
    font_thickness = int(0.009 * h)

    for row, key_row in enumerate(keys):
        for col, key in enumerate(key_row):
            x = int(0.03 * w + col * (key_width + 5))
            y = int(0.03 * h + row * (key_height + 5))
            buttonList.append(Button([x, y], key, size=[key_width, key_height]))

    # Add special buttons for Backspace and Space
    buttonList.append(Button([int(0.9 * w), int(0.03 * h)], 'BS', size=[int(0.08 * w), key_height]))
    buttonList.append(Button([int(0.2 * w), int(0.4 * h)], 'SPACE', size=[int(0.6 * w), key_height]))

    # Draw Keyboard Buttons
    for button in buttonList:
            x4, y4 = int(hand_landmarks.landmark[mp_hands.HandLandmark.THUMB_TIP].x * w), int(hand_landmarks.landmark[mp_hands.HandLandmark.THUMB_TIP].y * h)
            x8, y8 = int(hand_landmarks.landmark[mp_hands.HandLandmark.INDEX_FINGER_TIP].x * w), int(hand_landmarks.landmark[mp_hands.HandLandmark.INDEX_FINGER_TIP].y * h)

            distance = np.sqrt((x8 - x4) ** 2 + (y8 - y4) ** 2)
            click_threshold = 0.2*np.sqrt(bbox[2] ** 2 + bbox[3] ** 2)
            
            for button in buttonList:
                x, y = button.pos
                if x < x8 < x + bw and y < y8 < y + bh:
                   cv2.rectangle(img, (x, y), (x + bw, y + bh), (0, 255, 160), -1)
                   cv2.putText(img, button.text, (x + int(0.2 * bw), y + int(0.7 * bh)), cv2.FONT_HERSHEY_PLAIN, font_scale, (255, 255, 255), font_thickness)
                   #  # Handle button press
                   if (distance)<click_threshold:
                        if time.time() - prev_key_time[0] > 2:
                            prev_key_time[0] = time.time()
                            if button.text != 'BS' and button.text != 'SPACE':
                                output_text += button.text  # Append key to output text 
                            elif button.text == 'BS':
                                output_text = output_text[:-1]   # Remove last character
                            else:
                                output_text += ' '  # Add space
    # Position and dimensions for the rectangle

    text_x = int(0.05 * w)
    text_y = int(0.70 * h)
    text_width = int(0.9 * w)  # Adjust width as needed
    text_height = int(0.1 * h)  # Adjust height as needed
    # Draw the rectangle

    cv2.rectangle(img, 
              (text_x, text_y - text_height),  # Top-left corner
              (text_x + text_width, text_y),  # Bottom-right corner
              (100, 100, 100),  # Background color (light gray)
              -1)  # Filled rectangle
    cv2.putText(img, output_text, (int(0.05 * w) , int(0.70 * h)), cv2.FONT_HERSHEY_PLAIN, 2, (255, 255, 255), 5)
                       
                       
                       

    result_queue.put(detections)
    
    return av.VideoFrame.from_ndarray(img, format="bgr24")

# WebRTC Streamer
    media_stream_constraints={"video": True, "audio": False},
    video_frame_callback=video_frame_callback,
    async_processing=True,
)