From 736a806a8badcc58e98a0be4a5eb31b9793dcdf6 Mon Sep 17 00:00:00 2001
From: Luong Minh <ngocminhluong182@gmail.com>
Date: Fri, 26 Jan 2024 10:49:15 +0700
Subject: [PATCH] chore: update readme (#47)

---
 README.md | 86 +++++++++++++++++++++++++++++++++++++++++++++++++------
 1 file changed, 77 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 91eec48..f9646ff 100644
--- a/README.md
+++ b/README.md
@@ -1,21 +1,19 @@
 # Atm0s Media JS SDK
 
 [![Continuous Integrations](https://github.com/8xFF/media-sdk-js/actions/workflows/continuous-integrations.yaml/badge.svg?branch=main)](https://github.com/8xFF/media-sdk-js/actions/workflows/continuous-integrations.yaml)
-[![codecov](https://codecov.io/gh/8xFF/atm0s-media-sdk-js/graph/badge.svg?token=7kSkd0P72m)](https://codecov.io/gh/8xFF/atm0s-media-sdk-js)
-<!-- [![License](https://badgen.net/github/license/8xFF/media-sdk-js)](./LICENSE)
-[![Package tree-shaking](https://badgen.net/bundlephobia/tree-shaking/atm0s-sdk-js)](https://bundlephobia.com/package/atm0s-sdk-js)
-[![Package minified & gzipped size](https://badgen.net/bundlephobia/minzip/atm0s-sdk-js)](https://bundlephobia.com/package/atm0s-sdk-js)
-[![Package dependency count](https://badgen.net/bundlephobia/dependency-count/reactatm0s-sdk-js)](https://bundlephobia.com/package/atm0s-sdk-js) -->
+
+JS SDK for interacting with Atm0s Media Server
+This SDK is still in Alpha.
 
 ## Installation
 
 This library is published in the NPM registry and can be installed using any compatible package manager.
 
 ```sh
-npm install @8xff/atm0s-media-js --save
+npm install @8xff/atm0s-media-js@alpha --save
 
 # For Yarn, use the command below.
-yarn add @8xff/atm0s-media-js
+yarn add @8xff/atm0s-media-js@alpha
 ```
 
 ### Installation from CDN
@@ -24,7 +22,7 @@ This module has an UMD bundle available through JSDelivr and Unpkg CDNs.
 
 ```html
 <!-- For UNPKG use the code below. -->
-<script src="https://unpkg.com/@8xff/atm0s-media-js"></script>
+<script src="https://unpkg.com/@8xff/atm0s-media-js@alpha"></script>
 
 <!-- For JSDelivr use the code below. -->
 <script src="https://cdn.jsdelivr.net/npm/@8xff/atm0s-media-js"></script>
@@ -37,7 +35,77 @@ This module has an UMD bundle available through JSDelivr and Unpkg CDNs.
 
 ## Documentation
 
-[Documentation generated from source files by Typedoc](./docs/README.md).
+### Usage
+
+#### Connect to a Session
+
+```
+import { createSession } from "@8xff/atm0s-media-js";
+
+const url = "<YOUR SERVER URL>";
+const token = "<YOUR SERVER TOKEN IF NEEDED>";
+
+// This can be any MediaStream
+const stream = await navigator.mediaDevices.getUserMedia({
+  audio: true,
+  video: true,
+});
+
+const session = createSession(url, {
+  roomId: "Echo Room",
+  peerId: "echo-client",
+  token,
+  // You can optionally initialize the session with senders and receivers so we won't have to keep
+  // updating SDP every time we create a new senders and receivers
+  senders: [
+    { stream: stream, name: "audio_main", kind: "audio" },
+    {
+      stream: stream,
+      name: "video_main",
+      kind: "video",
+      // Optionally, you can add simulcast
+      simulcast: true,
+    },
+  ],
+  receivers: {
+    audio: 1,
+    video: 1,
+  },
+});
+
+// This will connect to the server and send the initialized MediaStream from above 
+session.connect();
+```
+
+#### Consume the stream
+By issued stream name
+```
+const consumer = session.createConsumerPair(peerId, "audio_main", "video_main");
+
+```
+
+Or listen to stream events:
+```
+// Note: In this specific case, we only have our own stream, so only `mystream_added` is triggered.
+// In the case of listening for an external stream, use `stream_added` instead
+session.on("mystream_added", (stream) => {
+  // The audio stream and video stream added events will be triggered separately
+
+  if (stream.kind === "video") {
+    const consumer = session.createConsumer(stream);
+    const stream = consumer.view();
+    // Do something with stream ...
+  }
+
+  if (stream.kind === "audio") {
+    const consumer = session.createConsumer(stream);
+    const stream = consumer.view();
+    // Do something with stream ...
+  }
+});
+```
+
+You can find more details about the SDK Documentation [here](https://8xff.github.io/media-docs/).
 
 ## License