feat: docs v1.0 (WIP).

docs/flutter-webrtc/api-docs/_category_.json

@@ -0,0 +1,4 @@
+{
+  "label": "API Docs",
+  "position": 1
+}

docs/flutter-webrtc/api-docs/get-display-media.md

@@ -0,0 +1,23 @@
+---
+sidebar_position: 3
+---
+
+# GetDisplayMedia
+
+The `getDisplayMedia` method of the `MediaDevices` interface prompts the user to select and grant permission to capture the contents of a display or portion thereof (such as a window or screen) as a `MediaStream`.
+
+The corresponding JS API docs is here [MediaDevices.getDisplayMedia()](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia).
+
+## Usage
+
+```dart
+MediaStream stream = await navigator.mediaDevices.getDisplayMedia({
+  'video': true,
+  'audio': true,
+});
+```
+
+## Parameters
+
+- audio: A Boolean value that indicates whether the `MediaStream` should include an audio track.
+         audio is optional, default is false. only chrome tabs can support audio caputre.

docs/flutter-webrtc/api-docs/get-user-media.md

@@ -0,0 +1,67 @@
+---
+sidebar_position: 2
+---
+
+# GetUserMedia
+
+The corresponding JS API docs is here
+[MediaDevices.getUserMedia()](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia).
+
+## Usage
+
+basic usage:
+
+```dart
+await navigator.mediaDevices.getUserMedia({'audio': true, 'video': true});
+```
+
+advanced usage:
+
+```dart
+await navigator.mediaDevices.getUserMedia({
+  'audio': true,
+  'video': {
+    'facingMode': 'user', // or 'environment' for mobile devices
+    'width': 1280,
+    'height': 720,
+    'frameRate': 30,
+  }
+});
+```
+
+## Parameters
+
+- mediaConstraints: A dictionary object that specifies the media constraints for the requested media types.
+refer to the [MediaStreamConstraints](https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints) for more details.
+
+sub options:
+
+- audio: A Boolean value that indicates whether the MediaStream should include an audio track.
+
+or a dictionary object that specifies the audio track's media constraints.
+
+```json
+{
+    'deviceId': 'audio_device_id',
+}
+```
+
+- video: A Boolean value that indicates whether the MediaStream should include a video track.
+
+or a dictionary object that specifies the video track's media constraints.
+
+```json
+{
+    'deviceId': 'video_device_id',
+    'facingMode': 'user', // or 'environment' for mobile devices
+    'width': 1280,
+    'height': 720,
+    'frameRate': 30,
+}
+```
+
+## Return value
+
+A Promise that resolves to a MediaStream object.
+
+Note: The `deviceId` parameter is used to specify the device to use. If you want to use the default device, you can omit this parameter. If you want to use a specific device, you can get the device ID by calling `navigator.mediaDevices.enumerateDevices` [here](./media-devices) and then pass it to the `deviceId` parameter.

docs/flutter-webrtc/api-docs/media-devices.md

@@ -0,0 +1,62 @@
+---
+sidebar_position: 1
+---
+
+# MediaDevices
+
+The corresponding JS API docs is here [MediaDevices](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices).
+
+## Usage
+
+```dart
+MediaDevices mediaDevices = await navigator.mediaDevices;
+
+MediaStream stream = await mediaDevices.getUserMedia({
+  'audio': true,
+  'video': true,
+});
+
+MediaStream displayStream = await mediaDevices.getDisplayMedia({
+  'video': true,
+  'audio': true,
+});
+
+List<MediaDeviceInfo> devices = await mediaDevices.enumerateDevices();
+
+```
+
+## Methods
+
+- `getUserMedia`: Returns a Promise that resolves to a `MediaStream` object. The `MediaStream` object represents a stream of media content, typically (but not necessarily) including both audio and video.
+
+```dart
+MediaStream stream = await mediaDevices.getUserMedia({
+  'audio': true,
+  'video': true,
+});
+```
+
+- `getDisplayMedia`: Returns a Promise that resolves to a `MediaStream` object. The `MediaStream` object represents a stream of media content, typically (but not necessarily) including both audio and video.
+
+```dart
+MediaStream stream = await mediaDevices.getDisplayMedia({
+  'video': true,
+  'audio': true,
+});
+```
+
+- `enumerateDevices`: Returns a Promise that resolves to an array of `MediaDeviceInfo` objects, each of which represents a media input or output device.
+
+```dart
+List<MediaDeviceInfo> devices = await mediaDevices.enumerateDevices();
+```
+
+- `getSupportedConstraints`: Returns a dictionary object that specifies the media constraints supported by the user agent.
+    only support for web platform.
+
+- `selectAudioOutput`: select audio output device.
+    support platforms: macOS/Windows/Linux/Web.
+
+## Event Callbacks
+
+- `onDeviceChange`: The `ondevicechange` event handler for the `MediaDevices` interface. It is called when a media input or output device is attached or removed.

docs/flutter-webrtc/api-docs/rtc-factory.md

@@ -0,0 +1,39 @@
+---
+sidebar_position: 4
+---
+
+# RTCFactory
+
+## Methods
+
+- `createPeerConnection`: Creates a new `RTCPeerConnection` object with the specified `RTCConfiguration`.
+
+```dart
+RTCPeerConnection pc = await createPeerConnection({
+  'iceServers': [
+    {'urls': 'stun:stun.l.google.com:19302'},
+  ]
+});
+```
+
+- `createLocalMediaStream`: Creates a new `MediaStream` object with the specified `lable`.
+
+```dart
+MediaStream stream = factory.createLocalMediaStream('new_stream_label');
+```
+
+- `getRtpSenderCapabilities`: Returns a `RTCRtpCapabilities` object that represents the capabilities of the sender for the given `kind`.
+
+```dart
+RTCRtpCapabilities capabilities = getRtpSenderCapabilities('video'); // or 'audio'
+```
+
+- `getRtpReceiverCapabilities`: Returns a `RTCRtpCapabilities` object that represents the capabilities of the receiver for the given `kind`.
+
+```dart
+RTCRtpCapabilities capabilities = getRtpReceiverCapabilities('video'); // or 'audio'
+```
+
+## Properties
+
+- `frameCryptorFactory`: Returns a `FrameCryptorFactory` object for End to End Encryption.

docs/flutter-webrtc/api-docs/rtc-peerconnection.md

@@ -0,0 +1,7 @@
+---
+sidebar_position: 5
+---
+
+# RTCPeerConnection
+
+## Methods

docs/flutter-webrtc/first-app.md

@@ -0,0 +1,81 @@
+---
+sidebar_position: 4
+---
+
+# First App
+
+## Step 1
+
+Create or use an existing flutter app project and add `flutter_webrtc` to your `pubspec.yaml` file
+
+```shell
+flutter create myapp
+```
+
+- Add `flutter_webrtc` to your `pubspec.yaml` file
+
+```shell
+flutter pub add flutter_webrtc
+```
+
+## Step 2
+
+Setup required permissions for audio and video, link to [Project Settings](./project-settings)
+
+Using `navigator.mediaDevices.getUserMedia` to get access to the camera and microphone.
+
+you can view getUserMedia docs [here](./api-docs/get-user-media)
+
+```dart
+class _MyHomePageState extends State<MyHomePage> {
+  RTCVideoRenderer? _renderer;
+  MediaStream? _stream;
+
+  void _openCamera() async {
+    // create and initialize renderer
+    _renderer ??= RTCVideoRenderer();
+    await _renderer!.initialize();
+
+    // 
+    try {
+      _stream = await navigator.mediaDevices
+          .getUserMedia({'audio': false, 'video': true});
+    } catch (e) {
+      //if you get an error, please check the permissions in the project settings.
+      print(e.toString());
+    }
+
+    // set the MediaStream to the video renderer
+    _renderer!.srcObject = _stream;
+    setState(() {});
+  }
+```
+
+## Step 3
+
+render the video renderer in the widget tree
+
+```dart
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+        title: Text(widget.title),
+      ),
+      body: Center(
+        child: SizedBox(
+          width: 320,
+          height: 240,
+          // render the video renderer in the widget tree
+          child: _renderer != null ? RTCVideoView(_renderer!) : Container(),
+        ),
+      ),
+      floatingActionButton: FloatingActionButton(
+        onPressed: _setup,
+        tooltip: 'open camera',
+        child: const Icon(Icons.camera_alt),
+      ),
+    );
+  }
+```