Add extra bundle for enable video effect

2024-07-16 21:20:53 +00:00 · 2024-07-16 21:20:53 +00:00 · 3e1ea7c59f
--- a/samples/StaticHtmlComposites/callComposite.html
+++ b/samples/StaticHtmlComposites/callComposite.html
@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>

 <head>
  <meta charset="utf-8" />
@ -16,6 +16,7 @@
  <div id="call-composite-container"></div>
  <!-- replace with https://github.com/Azure/communication-ui-library/releases/latest/download/callComposite.js for development and prototyping -->
  <script src="./callComposite.js"></script>
+  <script src="./videoEffectDependency.js"></script>
  <script src="./service.js"></script>
  <script type="module">
    const testParams = service.loadConfigFromUrlQuery();
@ -31,7 +32,10 @@
        userId: user,
        token: token,
        displayName: displayName,
-        locator: { groupId: groupId } // Provide any GUID to join a group
+        locator: { groupId: groupId }, // Provide any GUID to join a group
+        options: {
+          videoBackgroundOptions: { onResolveDependency: videoEffectDependency.onResolveVideoEffectDependency }
+        }
      },
      document.getElementById('call-composite-container')
    );
--- a/samples/StaticHtmlComposites/src/videoEffectDependency.js
+++ b/samples/StaticHtmlComposites/src/videoEffectDependency.js
@ -0,0 +1,6 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { onResolveVideoEffectDependency } from '@azure/communication-react';
+
+export { onResolveVideoEffectDependency };
--- a/samples/StaticHtmlComposites/webpack.config.js
+++ b/samples/StaticHtmlComposites/webpack.config.js
@ -9,6 +9,7 @@ const config = {
    callComposite: './src/callComposite.js',
    outboundCallComposite: './src/outboundCallComposite.js',
    callWithChatComposite: './src/callWithChatComposite.js',
+    videoEffectDependency: './src/videoEffectDependency.js',
    service: './src/service.js'
  },
  mode: 'development', // change to 'production' for optimization