> For the complete documentation index, see [llms.txt](https://huddle01-2.gitbook.io/huddle01/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://huddle01-2.gitbook.io/huddle01/flutter-sdk/flutter-plugin-integration.md).

# Client

## Getting started

### 1. Installation

```
$ flutter pub add huddle01_flutter_sdk
```

OR

add this in your project's `pubspec.yaml`

```yaml
dependencies:
  flutter:
    sdk: flutter
  huddle01_flutter_sdk: ^0.1.0
```

and then run

```bash
$ flutter pub get
```

### 2. **Get your API Key**

You can get your access keys in the Developer section of the Huddle01 Dashboard**.**

### 3. Importing into your application 

```dart
import 'package:huddle01_flutter/huddle01_flutter.dart';
```

In this documentation we use flutter\_bloc package for state management.

### 4. Setup event listeners

Here we setup event emitters that are triggered at certain specific events from the package. These help with the global state management of the application.

```dart
_setupEventListeners({
    required ConsumersBloc consumersBloc,
    required ProducersBloc producersBloc,
    required PeersBloc peersBloc,
    required MeBloc meBloc,
  }) {
    // on adding a new consumer
    emitter.on('addConsumer', (consumer) {
      consumersBloc.add(ConsumerAdd(consumer: consumer));
    });
    // on removing an existing consumer
    emitter.on('removeConsumer', (consumerId) {
      consumersBloc.add(ConsumerRemove(consumerId: consumerId));
    });
    // adding a new producer 
    emitter.on('addProducer', (producer) {
      producersBloc.add(ProducerAdd(producer: producer));
      if (producer.source == 'webcam') {
        meBloc.add(MeSetWebcamInProgress(progress: true));
      }
    });
    // disable and remove an existing producer
    emitter.on('removeProducer', (source) {
      producersBloc.add(ProducerRemove(source: source));
      if (source == 'webcam') {
        meBloc.add(MeSetWebcamInProgress(progress: false));
      }
    });
    // adding a new peer
    emitter.on('addPeer', (peer) {
      peersBloc.add(PeerAdd(newPeer: peer));
    });
    // removing an existing peer
    emitter.on('removePeer', (peerId) {
      peersBloc.add(PeerRemove(peerId: peerId));
    });
    // adding new consumer of the selected peer
    emitter.on('addPeerConsumer', (consumer) {
      peersBloc.add(
          PeerAddConsumer(peerId: consumer.peerId, consumerId: consumer.id));
    });
    // removing an existing consumer of a selected peer
    emitter.on('removePeerConsumer', (peerId, consumerId) {
      peersBloc.add(PeerRemoveConsumer(peerId: peerId, consumerId: consumerId));
    });
  }
```

### 5. Initialising Client repository and using available methods:

Client repository initialisation using `RepositoryProvider` and using `join()` to join the room.

```dart
child: RepositoryProvider<HuddleClientRepository>(
  // provider to provide room client as an object to all the child widgets of this
  lazy: false,
  create: (context) {
    // setup event listeners
    _setupEventListeners(
      consumersBloc: context.read<ConsumersBloc>(),
      producersBloc: context.read<ProducersBloc>(),
      peersBloc: context.read<PeersBloc>(),
      meBloc: context.read<MeBloc>(),
    );
    // initialise blocs
    MediaDevicesBloc mediaDevicesBloc =
        context.read<MediaDevicesBloc>();
    String audioInputDeviceId =
        mediaDevicesBloc.state.selectedAudioInput!.deviceId;
    String videoInputDeviceId =
        mediaDevicesBloc.state.selectedVideoInput!.deviceId;
    final meState = context.read<MeBloc>().state;
    String displayName = meState.displayName;
    String id = meState.id;
    final roomState = context.read<RoomBloc>().state;
    // url for connection, uses Huddle 01's alpha server link in room state
    String url = roomState.url!;

    Uri uri = Uri.parse(url);

    return HuddleClientRepository(
      peerId: id,
      displayName: displayName,
      url: url != null
          ? 'wss://${uri.host}:4443'
          : 'wss://alpha.huddle01.com:4443',
      roomId: uri.queryParameters['roomId'] ??
          uri.queryParameters['roomid'] ??
          randomAlpha(8).toLowerCase(),
      audioInputDeviceId: audioInputDeviceId,
      videoInputDeviceId: videoInputDeviceId,
    )..join();
    // using join() to join room with the given config
  },
  // Room is the route of the application where the video chat takes place
  child: Room(),
)
```

#### Other methods available:

* **close()**

```dart
context.read<HuddleClientRepository>().close();
```

* **enableWebcam()**
* **disableWebcam()**

```dart
// enable webcam while initialising room to ask permission
context.read<HuddleClientRepository>().enableWebcam();
```

* **enableMic()**
* **disableMic()**
* **muteMic()**
* **unmuteMic()**

```dart
// enable mic while initialising room room to ask permission
context.read<HuddleClientRepository>().enableMic();

// mute and unmute mic
context.read<HuddleClientRepository>().unmuteMic();
```

For any help, reach out to us on Slack. We are available 24\*7 at: <https://bit.ly/3AsIsT7>.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://huddle01-2.gitbook.io/huddle01/flutter-sdk/flutter-plugin-integration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.