notebook

demo/todo_list_js/run.ipynb

@@ -0,0 +1 @@
+{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: todo_list_js"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["\"\"\"\n", "This is a simple todo list app that allows you to add, remove, and mark tasks as complete.\n", "All actions are performed on the client side.\n", "\"\"\"\n", "import gradio as gr\n", "\n", "tasks = [\"Get a job\", \"Marry rich\", \"\", \"\", \"\", \"\"]\n", "textboxes = []\n", "\n", "with gr.Blocks() as demo:\n", "    with gr.Row():\n", "        with gr.Column(scale=3):\n", "            gr.Markdown(\"# A Simple Interactive Todo List\")\n", "        with gr.Column(scale=2):\n", "            with gr.Row():\n", "                freeze_button = gr.Button(\"Freeze tasks\", variant=\"stop\")\n", "                edit_button = gr.Button(\"Edit tasks\")\n", "    for i in range(6):\n", "        with gr.Row() as r:\n", "            t = gr.Textbox(tasks[i], placeholder=\"Enter a task\", show_label=False, container=False, scale=7, interactive=True)\n", "            b = gr.Button(\"\u2714\ufe0f\", interactive=bool(tasks[i]), variant=\"primary\" if tasks[i] else \"secondary\")\n", "            textboxes.append(t)\n", "        t.change(lambda : gr.Button(interactive=True, variant=\"primary\"), None, b, js=True)\n", "        b.click(lambda : gr.Row(visible=False), None, r, js=True)\n", "    freeze_button.click(lambda : [gr.Textbox(interactive=False), gr.Textbox(interactive=False), gr.Textbox(interactive=False), gr.Textbox(interactive=False), gr.Textbox(interactive=False), gr.Textbox(interactive=False)], None, textboxes, js=True)\n", "    edit_button.click(lambda : [gr.Textbox(interactive=True), gr.Textbox(interactive=True), gr.Textbox(interactive=True), gr.Textbox(interactive=True), gr.Textbox(interactive=True), gr.Textbox(interactive=True)], None, textboxes, js=True)\n", "\n", "    # Add a button to add a new task\n", "\n", "\n", "demo.launch()"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}