Migrate the sample page to v3

.github/workflows/develop-publish-gh-pages.yml

@@ -14,6 +14,13 @@ jobs:
               uses: actions/setup-node@v2
               with:
                   node-version: 22
+            - name: Build AWS SDK
+              working-directory: ./aws-sdk-build
+              run: |
+                  npm install
+                  npm run build
+                  rm -rf ../examples/*-kvswebrtc.js
+                  mv dist/*-kvswebrtc.js ../examples
             - name: Install dependencies
               run: npm install
             - name: Run release

.github/workflows/master-publish-gh-pages-and-npm.yml

@@ -14,6 +14,13 @@ jobs:
               uses: actions/setup-node@v2
               with:
                   node-version: 22
+            - name: Build AWS SDK
+              working-directory: ./aws-sdk-build
+              run: |
+                  npm install
+                  npm run build
+                  rm -rf ../examples/*-kvswebrtc.js
+                  mv dist/*-kvswebrtc.js ../examples
             - name: Install dependencies
               run: npm install
             - name: Run release
@@ -25,8 +32,12 @@ jobs:
                   branch: gh-pages
                   clean: true
                   clean-exclude: develop/
-            - name: Delete examples directories
-              run: rm -rf examples dist/examples
+            - name: Delete extra directories
+              run: |
+                  # Delete the examples
+                  rm -rf examples dist/examples
+                  # Remove the infra to build the AWS SDK v3 browser script
+                  rm -rf aws-sdk-build
             - name: Deploy to npm packages
               uses: JS-DevTools/npm-publish@v1
               with:

README.md

@@ -3,8 +3,8 @@
     <br />
 </h1>
 
-<div align="center"> 
-    
+<div align="center">
+
 [![NPM version](https://img.shields.io/npm/v/amazon-kinesis-video-streams-webrtc.svg?style=flat-square)](https://www.npmjs.com/package/amazon-kinesis-video-streams-webrtc)
 [![NPM downloads](https://img.shields.io/npm/dm/amazon-kinesis-video-streams-webrtc.svg?style=flat-square)](https://www.npmjs.com/package/amazon-kinesis-video-streams-webrtc)
 [![NPM version](https://img.shields.io/npm/l/amazon-kinesis-video-streams-webrtc?style=flat-square)](https://www.npmjs.com/package/amazon-kinesis-video-streams-webrtc)
@@ -476,6 +476,10 @@ The source code for the test page is in the [`examples`](examples) directory.
 
 For advanced debugging, use the `WebRTC Internals` tool your browser provides.
 
+#### Building AWS SDK for JS v3
+
+Refer to the [aws-sdk-build](./aws-sdk-build) directory for more details.
+
 ## License
 
 This project is licensed under the [Apache-2.0 License](http://www.apache.org/licenses/LICENSE-2.0). See LICENSE.txt and NOTICE.txt for more information.

aws-sdk-build/.gitignore

@@ -0,0 +1,2 @@
+dist/
+node_modules/

aws-sdk-build/README.md

@@ -0,0 +1,77 @@
+# Building the browser script version of AWS SDK for JS v3
+
+This module bundles the **AWS SDK v3** clients into a single JavaScript file that can be imported in a `<script>` tag, similar to how AWS SDK v2 worked.
+* [Kinesis Video](https://docs.aws.amazon.com/kinesisvideostreams/latest/dg/API_Operations_Amazon_Kinesis_Video_Streams.html) client
+* [Kinesis Video Signaling Channels](https://docs.aws.amazon.com/kinesisvideostreams/latest/dg/API_Operations_Amazon_Kinesis_Video_Signaling_Channels.html) client
+* [Kinesis Video WebRTC Storage](https://docs.aws.amazon.com/kinesisvideostreams/latest/dg/API_Operations_Amazon_Kinesis_Video_WebRTC_Storage.html) client
+
+## **Installation**
+
+Before building, ensure you have **Node.js** installed.
+
+### **1. Install Dependencies**
+Run the following command in this directory:
+
+```sh
+npm install
+```
+
+### **2. Build the SDK**
+Generate the bundled JavaScript file by running:
+
+```sh
+npm run build
+```
+
+This creates the file:
+```
+dist/aws-sdk-VERSION-kvswebrtc.js
+```
+
+> [!NOTE]
+> `VERSION` will be replaced with the bundled AWS SDK version. For example: 3.758.0
+
+## **Usage in HTML**
+Once built, include the script in your HTML file:
+
+```html
+<script src="dist/aws-sdk-VERSION-kvswebrtc.js"></script>
+```
+
+After that, the `AWS` object is globally available, just like AWS SDK v2.
+
+> [!NOTE]
+> AWS SDK for JS v3 uses different syntax than v2. Refer to the [documentation](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/kinesis-video/) for the syntax and usage.
+
+## **Updating the AWS SDK for JS v3 to the latest**
+
+If you need to update the AWS SDK clients, modify `package.json` and run:
+
+```sh
+npm update
+```
+
+Then, rebuild the bundle:
+
+```sh
+npm run build
+```
+
+You can now move it to the `examples` to use it:
+```shell
+mv ./dist/aws-sdk-*-kvswebrtc.js ../examples
+```
+
+> [!NOTE]
+> You will also need to modify the `<script>` import in `examples/index.html` to pull the new file.
+
+## **Troubleshooting**
+- If `npm run build` fails, try deleting `node_modules` and `package-lock.json`, then reinstall:
+  ```sh
+  rm -rf node_modules package-lock.json
+  npm install
+  ```
+- Ensure Webpack is installed by running:
+  ```sh
+  npx webpack -v
+  ```

aws-sdk-build/index.js

@@ -0,0 +1,11 @@
+import * as KinesisVideo from "@aws-sdk/client-kinesis-video";
+import * as KinesisVideoSignaling from "@aws-sdk/client-kinesis-video-signaling";
+import * as KinesisVideoWebRTCStorage from "@aws-sdk/client-kinesis-video-webrtc-storage";
+
+// Webpack configuration places these into window.AWS object
+// Should be accessible: window.AWS.KinesisVideo.KinesisVideoClient(...)
+export {
+    KinesisVideo,
+    KinesisVideoSignaling,
+    KinesisVideoWebRTCStorage
+};