Examples page and start script

README.md

@@ -28,10 +28,12 @@ The following agent listens to audio tracks and
 sends a DataChannel into the room whenever speaking has been detected.
 
 ```python
+import asyncio
+from typing import AsyncIterator
+
 from livekit.rtc as rtc
 from livekit.agents import Agent, Processor
 from livekit.processors.vad import VAD
-from typing import AsyncIterator
 
 
 class MyAgent(Agent):

examples/.env.example

@@ -0,0 +1,3 @@
+LIVEKIT_API_SECRET="<your livekit api secret>"
+LIVEKIT_API_KEY="<your livekit api key>"
+LIVEKIT_WS_URL="<your livekit ws url>"

examples/README.md

@@ -0,0 +1,33 @@
+# Python Agents Examples
+
+This directory contains a full app with different examples of Agents to interact with.
+
+# Run The Examples
+
+## Setup LiveKit
+
+First, create a [LiveKit Cloud](https://cloud.livekit.io). (There's a free tier that does not require payment information)
+
+Alternatively - you can run LiveKit Open Source.
+
+Fill the `.env` file with the keys and secrets you need for the examples you wish to run. See `.env.example` for a template.
+
+## Install Dependencies
+
+> **_OPTIONAL:_**  It's common practice to setup a virtual environment when running python projects so its dependencies don't conflict with other projects or global dependencies you've installed. To do this run `python -m venv venv` then `source venv/bin/activate`
+
+`pip install -r requirements.txt`
+
+## Start the example app
+
+To run the examples simply call
+
+```bash
+python main.py
+```
+
+After calling `main.py` a website will be running where you can interact with the various agents found in `agents/`
+
+This will do 3 things:
+- Spin up a web-frontend on localhost:3000
+- Spin up a python backend that instantiates and runs the agents (running on localhost:8000)

examples/main.py

@@ -0,0 +1,58 @@
+import asyncio
+import subprocess
+import threading
+from dataclasses import dataclass
+
+import dotenv
+import uuid
+import aiohttp
+import aiohttp_cors
+
+dotenv.load_dotenv()
+
+@dataclass
+class ConnectionDetails:
+    ws_url: str
+    token: str
+
+def start_web_frontend():
+    def start_process():
+        subprocess.Popen(["bash ./start.sh"], shell=True, cwd="./web-frontend")
+    threading.Thread(target=start_process, daemon=True).start()
+
+def generate_connection_details(identity: str) -> ConnectionDetails:
+    # TODO when livekit python sdk is released with the api namespace
+    pass
+
+async def add_agent(request):
+    data = await request.json()
+    agent_type = data['agent']
+    identity = f"{agent_type}-{uuid.uuid4()}"
+    details = generate_connection_details(identity)
+
+    # room = livekt.rtc.Room()
+    # await room.connect(details.ws_url, details.token)
+
+    if agent_type == "vad":
+        pass
+
+    return aiohttp.web.json_response({'success': True})
+
+app = aiohttp.web.Application()
+app.add_routes([aiohttp.web.post('/add_agent', add_agent)])
+cors = aiohttp_cors.setup(app, defaults={"*": aiohttp_cors.ResourceOptions(
+    allow_credentials=True, expose_headers="*", allow_headers="*")})
+for route in list(app.router.routes()):
+    cors.add(route)
+
+async def main():
+    start_web_frontend()
+    runner = aiohttp.web.AppRunner(app)
+    await runner.setup()
+    site = aiohttp.web.TCPSite(runner, host='0.0.0.0', port=8000)    
+    await site.start()
+    await asyncio.Event().wait()
+
+if __name__ == "__main__":
+    main_task = asyncio.ensure_future(main())
+    asyncio.get_event_loop().run_until_complete(main_task)

examples/requirements.txt

@@ -0,0 +1,11 @@
+aiohttp==3.8.6
+aiohttp-cors==0.7.0
+aiosignal==1.3.1
+async-timeout==4.0.3
+attrs==23.1.0
+charset-normalizer==3.3.1
+frozenlist==1.4.0
+idna==3.4
+multidict==6.0.4
+python-dotenv==1.0.0
+yarl==1.9.2

examples/web-frontend/.gitignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

examples/web-frontend/README.md

@@ -0,0 +1,47 @@
+# TypeScript Next.js example
+
+This is a really simple project that shows the usage of Next.js with TypeScript.
+
+## Deploy your own
+
+Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example) or preview live with [StackBlitz](https://stackblitz.com/github/vercel/next.js/tree/canary/examples/with-typescript)
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-typescript&project-name=with-typescript&repository-name=with-typescript)
+
+## How to use it?
+
+Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example:
+
+```bash
+npx create-next-app --example with-typescript with-typescript-app
+```
+
+```bash
+yarn create next-app --example with-typescript with-typescript-app
+```
+
+```bash
+pnpm create next-app --example with-typescript with-typescript-app
+```
+
+Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
+
+## Notes
+
+This example shows how to integrate the TypeScript type system into Next.js. Since TypeScript is supported out of the box with Next.js, all we have to do is to install TypeScript.
+
+```
+npm install --save-dev typescript
+```
+
+To enable TypeScript's features, we install the type declarations for React and Node.
+
+```
+npm install --save-dev @types/react @types/react-dom @types/node
+```
+
+When we run `next dev` the next time, Next.js will start looking for any `.ts` or `.tsx` files in our project and builds it. It even automatically creates a `tsconfig.json` file for our project with the recommended settings.
+
+Next.js has built-in TypeScript declarations, so we'll get autocompletion for Next.js' modules straight away.
+
+A `type-check` script is also added to `package.json`, which runs TypeScript's `tsc` CLI in `noEmit` mode to run type-checking separately. You can then include this, for example, in your `test` scripts.