add more content

.vscode/settings.json

@@ -1,3 +1,3 @@
 {
-  "cSpell.words": ["PPSSPP"]
+  "cSpell.words": ["Miracast", "PPSSPP"]
 }

docs/screen-mirror/_pro.module.css

@@ -1,15 +1,14 @@
 .pro {
   display: inline-block;
   margin-right: 8px;
-  height: 16px;
-  line-height: 16px;
-  margin-left: 4px;
+  height: 18px;
+  line-height: 18px;
   vertical-align: middle;
   margin-top: -2px;
   padding-left: 5px;
   padding-right: 4px;
   border-radius: 4px;
-  font-size: 12px;
+  font-size: 14px;
   background-color: #447cf6;
   color: white;
 }

docs/screen-mirror/_pro.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 
-import styles from './_pro.module.css'
+import styles from './_pro.module.css';
 
 export default function Pro() {
   return (
     <p>
       <span className={styles.pro}>Pro</span>
-      <span>This feature requires Pro plan or higher.</span>
+      <span>This feature requires Pro or a higher plan.</span>
     </p>
   );
 }

docs/screen-mirror/virtual.mdx

@@ -8,16 +8,32 @@ import Pro from './_pro.tsx';
 
 <Pro/>
 
-On Android 11 and higher, Tango can create and mirror a virtual display. Virtual displays are similar to connecting multiple displays to the device. It can run apps and accept inputs independently from the main display, allowing you to use multiple apps at the same time.
+Android devices support connecting multiple displays via USB-C or Miracast, each display can show different content and accept touch input independently, allowing you to use multiple apps at the same time.
+
+On Android 11 and higher, Tango can create and mirror virtual displays, which is very similar to connecting a physical display to the device.
 
 To mirror a virtual display, scroll to **Video** section, then change **Source** to **Virtual**.  You can also customize the resolution and density of the virtual display below.
 
+## App launcher and app switcher
+
+On Android 13 and lower, due to system restrictions, your default app launcher and app switcher will not work on virtual displays. Instead, Tango provides a simple app launcher and app switcher for you.
+
+The app launcher should open automatically when there is no app running on the virtual display. You can also open it by tapping the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 16 16"><path fill="currentColor" d="M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12Zm0-1A5 5 0 1 1 8 3a5 5 0 0 1 0 10Z"></path></svg> button in the command bar.
+
+To hide the app launcher, tap the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 16 16" ><path fill="currentColor" d="M1.777 9.313a1.5 1.5 0 0 1 0-2.629l9.999-5.499A1.5 1.5 0 0 1 13.999 2.5v10.999a1.5 1.5 0 0 1-2.223 1.314l-9.999-5.5Zm.482-1.752a.5.5 0 0 0 0 .876l9.999 5.499a.5.5 0 0 0 .74-.438V2.499a.5.5 0 0 0-.74-.438l-9.999 5.5Z"></path></svg> button in the command bar.
+
+The [app switcher](./control.mdx#app-switcher) on the left side will only include apps running on the current virtual display. You can switch between apps by tapping on the app icons.
+
 ## Show PowerPoint presentation on virtual displays
 
-Some apps, like Microsoft Office, can display different content on multiple displays. For example, if Tango is mirroring a virtual display, start a PowerPoint presentation will show the presentation at full screen on the virtual display, while the main display shows the presentation controls.
+Android system has a feature that allows apps to show different contents on multiple screens. For example, in Microsoft Office app, starting a PowerPoint presentation will show the presentation in full screen on the second screen, while the main screen shows the controls.
 
-If the app launcher is showing on the virtual display and covers the presentation, you can tap **Back** button in the command bar to close it.
+This feature also works on virtual displays. If Tango is mirroring a virtual display, these apps can show their contents on the virtual display.
+
+If the app launcher is showing on the virtual display and covering the content, you can tap the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 16 16" ><path fill="currentColor" d="M1.777 9.313a1.5 1.5 0 0 1 0-2.629l9.999-5.499A1.5 1.5 0 0 1 13.999 2.5v10.999a1.5 1.5 0 0 1-2.223 1.314l-9.999-5.5Zm.482-1.752a.5.5 0 0 0 0 .876l9.999 5.499a.5.5 0 0 0 .74-.438V2.499a.5.5 0 0 0-.74-.438l-9.999 5.5Z"></path></svg> button in the command bar to hide it.
 
 ## Create multiple virtual displays
 
-On Desktop platforms, by opening multiple tabs of Tango, multiple virtual displays can be created and mirrored in each tab. Each virtual display is independent and can run different apps. Note that Android apps can't run on multiple virtual displays, but you can run different apps on each of them.
+On Desktop platforms, it's possible to create and mirror multiple virtual displays by opening multiple tabs of Tango. Each virtual display is independent and can run different apps. Note that one Android app can't have multiple instances on different displays, opening an app on one virtual display will close it on other displays.
+
+If the device is shared using a link or Remote Access, each sharing session will also create its own virtual display.

docs/share-device.mdx

@@ -2,19 +2,29 @@
 sidebar_position: 8
 ---
 
-# Share Device
+# Share Device By Link
 
-The share device feature allows you to access the device from another computer or mobile device. This is useful if you want someone else to help you with the device, or if you want to access the device remotely.
+The device sharing feature allows a remote computer to access and control the device. This is useful if you want someone else to help you with the device, or if you want to access the device remotely.
 
 ## Start sharing
 
-To share the device, click the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 20 20"><path fill="currentColor" d="M4.5 3A1.5 1.5 0 0 0 3 4.5v6A1.5 1.5 0 0 0 4.5 12H6v1H4.5A2.5 2.5 0 0 1 2 10.5v-6A2.5 2.5 0 0 1 4.5 2h6A2.5 2.5 0 0 1 13 4.5v6a2.5 2.5 0 0 1-2.5 2.5H9v-1h1.5a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 10.5 3h-6Zm5 4H11v1H9.5A1.5 1.5 0 0 0 8 9.5v6A1.5 1.5 0 0 0 9.5 17h6a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 15.5 8H14V7h1.5A2.5 2.5 0 0 1 18 9.5v6a2.5 2.5 0 0 1-2.5 2.5h-6A2.5 2.5 0 0 1 7 15.5v-6A2.5 2.5 0 0 1 9.5 7Z"></path></svg> button in the top right corner of the device page. A dialog will appear with some introductions and a **Start** button.
+To create a sharing link, follow these steps:
 
-Click the **Start** button to generate a link that you can share with others.
+1. Switch to the device you want to share
+2. Tap the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 20 20"><path fill="currentColor" d="M4.5 3A1.5 1.5 0 0 0 3 4.5v6A1.5 1.5 0 0 0 4.5 12H6v1H4.5A2.5 2.5 0 0 1 2 10.5v-6A2.5 2.5 0 0 1 4.5 2h6A2.5 2.5 0 0 1 13 4.5v6a2.5 2.5 0 0 1-2.5 2.5H9v-1h1.5a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 10.5 3h-6Zm5 4H11v1H9.5A1.5 1.5 0 0 0 8 9.5v6A1.5 1.5 0 0 0 9.5 17h6a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 15.5 8H14V7h1.5A2.5 2.5 0 0 1 18 9.5v6a2.5 2.5 0 0 1-2.5 2.5h-6A2.5 2.5 0 0 1 7 15.5v-6A2.5 2.5 0 0 1 9.5 7Z"></path></svg> button in the top right toolbar.
+3. Tap the **Start** button in the popup dialog.
 
-In the whole process, the device must remain plugged in, and Tango must be kept open. If you close Tango or unplug the device, the sharing session will be terminated.
+A share link will appear in the dialog. You can copy the link and send it to the person you want to share the device with.
 
-To stop, click the **Stop** button in the share dialog. It will disconnect all remote browsers that are using this sharing link, and the link will be invalidated. You can start a new sharing session by clicking the **Start** button again.
+The device must remain connected in Tango for the sharing link to work. If you disconnect the device or close the browser tab, the sharing link will be invalidated.
+
+## Stop sharing
+
+To stop, tap the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 20 20"><path fill="currentColor" d="M4.5 3A1.5 1.5 0 0 0 3 4.5v6A1.5 1.5 0 0 0 4.5 12H6v1H4.5A2.5 2.5 0 0 1 2 10.5v-6A2.5 2.5 0 0 1 4.5 2h6A2.5 2.5 0 0 1 13 4.5v6a2.5 2.5 0 0 1-2.5 2.5H9v-1h1.5a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 10.5 3h-6Zm5 4H11v1H9.5A1.5 1.5 0 0 0 8 9.5v6A1.5 1.5 0 0 0 9.5 17h6a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 15.5 8H14V7h1.5A2.5 2.5 0 0 1 18 9.5v6a2.5 2.5 0 0 1-2.5 2.5h-6A2.5 2.5 0 0 1 7 15.5v-6A2.5 2.5 0 0 1 9.5 7Z"></path></svg> button in the top right toolbar, then tap the **Stop** button in the popup dialog.
+
+Stopping a sharing will immediately disconnect all remote browser tabs that are using this sharing link, and the link will be invalidated.
+
+You can create a new share link by tapping the **Start** button again.
 
 ## Use the link
 
@@ -42,3 +52,5 @@ When the link is opened on another computer or mobile device, a peer-to-peer con
 Depending on the network conditions, the speed and latency of the connection may vary.
 
 In normal usage scenarios, it should only use less than 1Mbps of bandwidth, and the latency is usually not noticeable. However, if the network conditions are poor, some features like file transferring and screen mirroring may not work properly.
+
+At the remote side, you can tap the <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" style={{verticalAlign:"middle"}} viewBox="0 0 20 20"><path fill="currentColor" d="M4.5 3A1.5 1.5 0 0 0 3 4.5v6A1.5 1.5 0 0 0 4.5 12H6v1H4.5A2.5 2.5 0 0 1 2 10.5v-6A2.5 2.5 0 0 1 4.5 2h6A2.5 2.5 0 0 1 13 4.5v6a2.5 2.5 0 0 1-2.5 2.5H9v-1h1.5a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 10.5 3h-6Zm5 4H11v1H9.5A1.5 1.5 0 0 0 8 9.5v6A1.5 1.5 0 0 0 9.5 17h6a1.5 1.5 0 0 0 1.5-1.5v-6A1.5 1.5 0 0 0 15.5 8H14V7h1.5A2.5 2.5 0 0 1 18 9.5v6a2.5 2.5 0 0 1-2.5 2.5h-6A2.5 2.5 0 0 1 7 15.5v-6A2.5 2.5 0 0 1 9.5 7Z"></path></svg> button in the top right toolbar to check the latency and bandwidth usage of the connection.