millicast · juanpiquerez · Oct 21, 2024 · Oct 14, 2024 · Oct 16, 2024 · Oct 17, 2024
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -75,53 +75,64 @@ npm run start
 > Please note that before you run `npm run start`, you need to have built the solution first using `npm run build`
 
 This command opens the following demo apps in your browser:
+
 - millicast-publisher-demo
 - millicast-viewer-demo
 - millicast-sdk
 
 It keeps watching for changes in these packages. You only need to refresh both pages if you modify the code.
 
 ### Running tests
+
 If you want to run all tests, run:
+
 ```sh
 npm run test
 ```
 
 > Note: There are some requirements to take into account before running E2E tests. Make sure to take a look at [those](#e2e-testing).
 
 #### Unit testing
-If you want to run only unit tests, navigate to the `millicast-sdk` package. 
+
+If you want to run only unit tests, navigate to the `millicast-sdk` package.
+
 ```sh
 cd packages/millicast-sdk
 npm run test-unit
 ```
 
 #### E2E testing
+
 The first step before running E2E tests is setting some environment variables and adjusting the director URL desired.
 
 1. You have to set three variables in the environment based on the token environment you are.
-  * In **MacOS/Linux**:
-  ```sh
-  export PUBLISH_TOKEN=<your_publish_token>
-  export ACCOUNT_ID=<your_account_id>
-  export STREAM_NAME=<your_stream_name>
-  ```
-
-  * In **Windows (Powershell)**:
-  ```sh
-  $env:PUBLISH_TOKEN="<your_publish_token>"
-  $env:ACCOUNT_ID="<your_account_id>"
-  $env:STREAM_NAME="<your_stream_name>"
-  ```
-
-  * In **Windows (CMD)**:
-  ```sh
-  set PUBLISH_TOKEN=<your_publish_token>
-  set ACCOUNT_ID=<your_account_id>
-  set STREAM_NAME=<your_stream_name>
-  ```
+
+- In **MacOS/Linux**:
+
+```sh
+export PUBLISH_TOKEN=<your_publish_token>
+export ACCOUNT_ID=<your_account_id>
+export STREAM_NAME=<your_stream_name>
+```
+
+- In **Windows (Powershell)**:
+
+```sh
+$env:PUBLISH_TOKEN="<your_publish_token>"
+$env:ACCOUNT_ID="<your_account_id>"
+$env:STREAM_NAME="<your_stream_name>"
+```
+
+- In **Windows (CMD)**:
+
+```sh
+set PUBLISH_TOKEN=<your_publish_token>
+set ACCOUNT_ID=<your_account_id>
+set STREAM_NAME=<your_stream_name>
+```
 
 If you only want to run E2E tests, in the command line run:
+
 ```sh
 npm run test-e2e
 ```
@@ -194,8 +205,10 @@ classDiagram
   }
   class Director {
     <<Singleton>>
+    const optionsPublish: DirectorPublisherOptions = { token, streamName }
     +getPublisher(publishToken, streamName, streamType?)
-    +getSubscriber(streamName, streamAccountId, subscribeToken?)
+    const options: DirectorSubscriberOptions = { streamName, streamAccountId, subscriberToken? }
+    +getSubscriber(options)
   }
   class SdpParser {
     <<Singleton>>

diff --git a/README.md b/README.md
@@ -19,16 +19,16 @@ This Software Development Kit (SDK) for JavaScript allows developers to simplify
 - [SDK developer information](#sdk-developer-information)
 - [License](#license)
 
-
 ## Installation
+
 You can use the CDN version of the SDK adding this tag to your document's `<head>`. Then `millicast` global variable will be available to use it.
+
 ```html
-<script src='https://cdn.jsdelivr.net/npm/@millicast/sdk@latest/dist/millicast.umd.js'></script>
+<script src="https://cdn.jsdelivr.net/npm/@millicast/sdk@latest/dist/millicast.umd.js"></script>
 ```
 
 Or if you are building an application with Node.js, you can install the SDK package to your dependencies.
 
-
 ```sh
 npm i --save @millicast/sdk
 ```
@@ -56,14 +56,13 @@ In vanilla JavaScript:
 
   <body>
     <script type="module">
-      const yourPublishingToken = "..."
-      const yourStreamName = "..."
+      const yourPublishingToken = '...'
+      const yourStreamName = '...'
 
       // Define callback for generate new tokens
-      const tokenGenerator = () => millicast.Director.getPublisher({
-        token: yourPublishingToken,
-        streamName: yourStreamName
-      })
+      const tokenGenerator = () =>
+        const options : DirectorPublisherOptions = {token: yourPublishingToken, streamName: yourStreamName}
+        millicast.Director.getPublisher(options)
 
       // Create a new instance
       const millicastPublish = new millicast.Publish(yourStreamName, tokenGenerator)
@@ -73,7 +72,7 @@ In vanilla JavaScript:
 
       // Publishing options
       const broadcastOptions = {
-        mediaStream
+        mediaStream,
       }
 
       // Start broadcast
@@ -87,7 +86,6 @@ In vanilla JavaScript:
 </html>
 ```
 
-
 ### Viewer app
 
 Please be sure to set up the credentials filling up the `yourStreamName` and `yourStreamAccountId` fields.
@@ -111,14 +109,12 @@ In vanilla JavaScript:
       const video = document.getElementById('my-video')
 
       // Set the credentials for the streaming
-      const yourStreamName = "..."
-      const yourStreamAccountId = "..."
+      const yourStreamName = '...'
+      const yourStreamAccountId = '...'
 
       // Define callback for generate new token
-      const tokenGenerator = () => millicast.Director.getSubscriber({
-        streamName: yourStreamName,
-        streamAccountId: yourStreamAccountId
-      })
+      const options: DirectorSubscriberOptions = { streamName, streamAccountId }
+      const tokenGenerator = () => millicast.Director.getSubscriber(options)
 
       // Create a new instance
       const millicastView = new millicast.View(yourStreamName, tokenGenerator, video)
@@ -138,30 +134,33 @@ In vanilla JavaScript:
 
 The [Documentation](https://docs.dolby.io/streaming-apis/docs/introduction-to-streaming-apis) provides an overview of the Dolby Millicast services. This includes a [Getting Started](https://docs.dolby.io/streaming-apis/docs/getting-started) guide as a quick start.
 
-The [SDK Documentation](https://millicast.github.io/millicast-sdk/) details the Modules, Classes, and APIs you can use during development. 
+The [SDK Documentation](https://millicast.github.io/millicast-sdk/) details the Modules, Classes, and APIs you can use during development.
 
 ### Samples
 
 There are several packages that implement a publisher and viewer. These samples can be run and inspected for examples of how to implement various features.
 
-* [millicast-publisher-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-publisher-demo#readme)
-* [millicast-viewer-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-viewer-demo#readme)
-* [millicast-webaudio-delay-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-webaudio-delay-demo#readme)
-* [millicast-multiview-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-multiview-demo#readme)
+- [millicast-publisher-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-publisher-demo#readme)
+- [millicast-viewer-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-viewer-demo#readme)
+- [millicast-webaudio-delay-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-webaudio-delay-demo#readme)
+- [millicast-multiview-demo](https://github.com/millicast/millicast-sdk/tree/main/packages/millicast-multiview-demo#readme)
 
 ## JS Frameworks
 
-This section is intended to explain how properly integrate this SDK with different JS frameworks, with links to official guides that will contain a more step by step oriented explanation on how to do it. 
+This section is intended to explain how properly integrate this SDK with different JS frameworks, with links to official guides that will contain a more step by step oriented explanation on how to do it.
 
 Right now, we only have a React Native guide.
 
 ### React Native
-This SDK can be used for React Native based projects. In order to accomplish this integration, some configuration steps are needed. This library assumes all webRTC methods are natively defined (usually, inside web browsers). However this is not the case for native Android/iOS native applications. In order to solve this, we have tested and worked along with [React Native webRTC project](https://github.com/react-native-webrtc/react-native-webrtc) for this purpose. 
+
+This SDK can be used for React Native based projects. In order to accomplish this integration, some configuration steps are needed. This library assumes all webRTC methods are natively defined (usually, inside web browsers). However this is not the case for native Android/iOS native applications. In order to solve this, we have tested and worked along with [React Native webRTC project](https://github.com/react-native-webrtc/react-native-webrtc) for this purpose.
 
 Check out this guide on [how to integrate Millicast JS SDK with React Native webRTC](https://docs.dolby.io/streaming-apis/docs/rn)!
 
 ## SDK developer information
+
 To develop and contribute to this project, there are some instructions of how to set up your environment to start contributing. [Follow this link.](https://github.com/millicast/millicast-sdk/blob/main/CONTRIBUTING.md)
 
 ## License
+
 Please refer to [LICENSE](https://github.com/millicast/millicast-sdk/blob/main/LICENSE) file.
diff --git a/packages/millicast-chromecast-receiver/src/viewer.ts b/packages/millicast-chromecast-receiver/src/viewer.ts
@@ -1,4 +1,5 @@
 import { View, Director, Logger } from '@nx-millicast/millicast-sdk'
+import { DirectorSubscriberOptions } from 'packages/millicast-sdk/src/types/Director.types'
 
 window.Logger = Logger
 
@@ -19,7 +20,8 @@ const removeStream = () => {
 }
 
 const subscribe = async (streamName, streamAccountId) => {
-  const tokenGenerator = () => Director.getSubscriber(streamName, streamAccountId)
+  const options: DirectorSubscriberOptions = { streamName, streamAccountId }
+  const tokenGenerator = () => Director.getSubscriber(options)
   const millicastView = new View(tokenGenerator)
   millicastView.on('broadcastEvent', (event) => {
     const layers = event.data.layers !== null ? event.data.layers : {}
@@ -60,18 +62,17 @@ player.setMediaElement(document.querySelector('#player'))
 /**
  * Intercept the LOAD request to be able to read in a contentId and get data.
  */
-player.setMessageInterceptor(
-  cast.framework.messages.MessageType.LOAD, loadRequestData => {
-    const media = loadRequestData.media
-    const { streamName, streamAccountId } = media.customData
+player.setMessageInterceptor(cast.framework.messages.MessageType.LOAD, (loadRequestData) => {
+  const media = loadRequestData.media
+  const { streamName, streamAccountId } = media.customData
 
-    subscribe(streamName, streamAccountId)
+  subscribe(streamName, streamAccountId)
 
-    loadRequestData.media.contentUrl = 'https://www.sample-videos.com/video123/mp4/720/big_buck_bunny_720p_1mb.mp4'
-    loadRequestData.media.contentType = 'video/mp4'
+  loadRequestData.media.contentUrl =
+    'https://www.sample-videos.com/video123/mp4/720/big_buck_bunny_720p_1mb.mp4'
+  loadRequestData.media.contentType = 'video/mp4'
 
-    return loadRequestData
-  }
-)
+  return loadRequestData
+})
 
 context.start()