Endoc-265 Web screen sharing updates (#1552)

* updates * review updates --------- Co-authored-by: saudsami <[email protected]>
AgoraIO · Jul 5, 2024 · a146b92 · a146b92
1 parent 3c19411
commit a146b92
Showing 1 changed file with 12 additions and 61 deletions.
diff --git a/shared/video-sdk/develop/screen-sharing/project-implementation/web.mdx b/shared/video-sdk/develop/screen-sharing/project-implementation/web.mdx
@@ -7,75 +7,26 @@ This section shows you how to implement <Vg k="SCR_SHR" /> in your <Vpl k="NAME"
 
 ### Chrome browser
 
-The <Vg k="COMPANY" /> Web SDK supports <Vg k="SCR_SHR" /> on Chrome 58 and higher with or without using a <Vg k="SCR_SHR" /> extension.
+The <Vg k="COMPANY" /> Web SDK supports <Vg k="SCR_SHR" /> on Chrome version 58 and higher. Follow these steps to share your screen.
 
-<Tabs groupId="extension">
-<TabItem value="withoutExtension" label="Screen sharing without using an extension" default>
+Call `createScreenVideoTrack` to create a <Vg k="SCR_SHR" /> track.
 
-<Admonition type="caution" title="Note">
-This method requires Chrome 74 or above. If the version you are targeting does not meet this requirement, use the <Vg k="SCR_SHR" /> extension to share the screen.
-</Admonition>
-
-Call `createScreenVideoTrack` directly to create a <Vg k="SCR_SHR" /> track.
+This method requires Chrome 74 or above. If you are using an older version, use the screen sharing plug-in to share the screen.
 
-<CodeBlock language="js" showLineNumbers>
-{`AgoraRTC.createScreenVideoTrack({
+```javascript
+AgoraRTC.createScreenVideoTrack({
     // Configure screen sharing encoding parameters, see API documentation for details
     encoderConfig: "1080p_1",
     // Set the video transmission optimization mode to prioritize quality ("detail"), or smoothness ("motion")
     optimizationMode: "detail"
 }).then(localScreenTrack => {
     /** ... **/
-});`}
-</CodeBlock>
-
-</TabItem>
-
-<TabItem value="withExtension" label="Use the Agora screen sharing extension" default>
-Take the following steps to download and set up the screen sharing extension:
-
-1. Download the [<Vg k="COMPANY" /> Chrome <Vg k="SCR_SHR" /> plug-in](http://download.agora.io/sdk/release/chrome-extension.zip) and unzip the package: 
-
-   ![Chrome Extension](/images/video-sdk/chrome-plugin-step1.png)
-
-1. Open the `manifest.json` file and add your web page domain name. For example, if you use `localhost`, add `*://localhost/*` to the `matches` field:
-
-    <CodeBlock language="json">
-    {`"matches": [
-      "*://localhost/*",
-      "*://*.agora.io/*",
-      "*://webdemo.agora.io/*",
-      "*://webdemo.agorabeckon.com/*",
-      "*://videocall.agora.io/*"
-    ]`}
-    </CodeBlock>
-
-1. Open your Chrome browser, click the settings button in the upper right corner of the screen, select **Extensions** > **Manage Extensions**. The extension page opens.
-
-1. On the extensions page, enable **Developer mode**.
-
-1. Click **Load unpacked** to load the unzipped extension. Navigate to the `chrome-extension` folder you just unzipped, and click **Select**. A message appears, indicating that the extension has been loaded.
-
-1. After installing the extension, find its ID directly on the extension page. You use this ID to configure the extension from your code:
-
-    ![Extension Id](/images/video-sdk/extension-id-step3.png)
-
-1. Use the extension ID to specify the `extensionId` parameter when creating the screen video track.
-
-    <CodeBlock language="js" showLineNumbers>
-    {`AgoraRTC.createScreenVideoTrack({
-        extensionId: 'minllpmhdgpndnkomcoccfekfegnlikg',
-    }).then(localScreenTrack => {
-        /** ... **/
-    });`}
-    </CodeBlock>
-
-</TabItem>
-</Tabs>
+});
+```
 
 #### Share audio
 
-The Web SDK supports simultaneous <Vg k="SCR_SHR" /> and locally played background sounds on Windows and macOS platforms with the Chrome browser version 74 and higher.
+The Web SDK supports simultaneous sharing the screen and locally played background sounds on Windows and macOS platforms with the Chrome browser version 74 and higher.
 
 When calling the `createScreenVideoTrack` method, set the `withAudio` parameter to `enable`.
 
@@ -92,13 +43,13 @@ AgoraRTC.createScreenVideoTrack({
 });
 ```
 
-##### Additional notes
+<Admonition title="Note">
+- After you call the method, the end user must check **Share Audio** in the <Vg k="SCR_SHR" /> popup box for the setting to take effect.
 
-- After the method is called, the end user must check **Share Audio** in the <Vg k="SCR_SHR" /> popup box for the setting to take effect.
+  ![Chrome Screen Share](/images/video-sdk/tmp_screen-sharing-web-chrome.png)
 
 - If you choose to share a single app window, the audio cannot be shared.
-
-![Chrome Screen Share](/images/video-sdk/tmp_screen-sharing-web-chrome.png)
+</Admonition>
 
 ### Edge browser