Skip to content

Commit

Permalink
created a notebook explaining how to run the ui
Browse files Browse the repository at this point in the history
  • Loading branch information
Mohamed-Dhouioui committed Oct 11, 2024
1 parent cd3cd4b commit 248169c
Show file tree
Hide file tree
Showing 2 changed files with 161 additions and 0 deletions.
File renamed without changes.
161 changes: 161 additions & 0 deletions examples/basics/using_GUI.ipynb
Original file line number Diff line number Diff line change
@@ -0,0 +1,161 @@
{
"cells": [
{
"metadata": {},
"cell_type": "markdown",
"source": "# Getting Started with usign the Nanover Python GUI",
"id": "beb56299f3b9906b"
},
{
"metadata": {},
"cell_type": "markdown",
"source": [
"In this notebook, we will show you how to use the Nanover Python GUI to create a simple user interface for Nanover.\n",
"\n",
"We will assume that you have already installed the Nanover Python package. If you haven't, you can install it by following the instructions in the [documentation](https://irl2.github.io/nanover-docs/installation.html#user-installation-guide).\n",
"\n",
"Another package that needs to be installed is Gradio. You can install it by running the following command in the terminal:\n",
"```bash\n",
"pip install gradio\n",
"```"
],
"id": "857248a0412b141d"
},
{
"metadata": {},
"cell_type": "markdown",
"source": [
"First, we need to import the necessary module.\n",
"\n",
"**Note that this UI module can also be run as a script to create a web based user interface by running `gradio UI.py` in the terminal.**\n"
],
"id": "50d98309ad788518"
},
{
"cell_type": "code",
"id": "initial_id",
"metadata": {
"collapsed": true,
"ExecuteTime": {
"end_time": "2024-10-11T13:35:28.883101Z",
"start_time": "2024-10-11T13:35:25.758411Z"
}
},
"source": "import UI",
"outputs": [],
"execution_count": 1
},
{
"metadata": {},
"cell_type": "markdown",
"source": "We used Gradio as a library for creating the user interface. The magic command `%load_ext` is used to load the extension.",
"id": "a2108d73ad2a1077"
},
{
"metadata": {
"ExecuteTime": {
"end_time": "2024-10-11T13:35:39.085137Z",
"start_time": "2024-10-11T13:35:39.081539Z"
}
},
"cell_type": "code",
"source": "%load_ext gradio",
"id": "15d478612a761c6",
"outputs": [],
"execution_count": 2
},
{
"metadata": {},
"cell_type": "markdown",
"source": "Next we can create the user interface using the `create_ui` function from the `UI` module. This will both create the user interface and display it in the notebook, as well as run a local server to host the user interface as a web page.",
"id": "c17f7d44ec3beaf6"
},
{
"metadata": {
"ExecuteTime": {
"end_time": "2024-10-11T13:35:47.484682Z",
"start_time": "2024-10-11T13:35:46.947312Z"
}
},
"cell_type": "code",
"source": [
"%%blocks\n",
"demo = UI.create_ui()\n",
"demo"
],
"id": "bb921017722d2c94",
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"* Running on local URL: http://127.0.0.1:7860\n",
"\n",
"To create a public link, set `share=True` in `launch()`.\n"
]
},
{
"data": {
"text/plain": [
"<IPython.core.display.HTML object>"
],
"text/html": [
"<div><iframe src=\"http://127.0.0.1:7860/\" width=\"100%\" height=\"500\" allow=\"autoplay; camera; microphone; clipboard-read; clipboard-write;\" frameborder=\"0\" allowfullscreen></iframe></div>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"execution_count": 3
},
{
"metadata": {},
"cell_type": "markdown",
"source": "Before exiting the notebook, make sure to close the web ui server by running the `close` method, otherwise the web ui will continue running in the background.",
"id": "4eae29298b7ae81e"
},
{
"metadata": {
"ExecuteTime": {
"end_time": "2024-10-11T13:36:10.396516Z",
"start_time": "2024-10-11T13:36:10.216379Z"
}
},
"cell_type": "code",
"source": "demo.close()",
"id": "209f8c2fa6f4e002",
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"Closing server running on port: 7860\n"
]
}
],
"execution_count": 4
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 2
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython2",
"version": "2.7.6"
}
},
"nbformat": 4,
"nbformat_minor": 5
}

0 comments on commit 248169c

Please sign in to comment.