jitsi_meet

This is a fork from https://github.com/gunschu/jitsi_meet

DO NOT USE IT UNLESS YOU KNOW WHAT YOU ARE DOING. THIS IS MODIFIED TO USE FOR vhglobal.org ONLY.

Jitsi Meet Plugin for Flutter. Supports Android, iOS, and Web platforms.

"Jitsi Meet is an open-source (Apache) WebRTC JavaScript application that uses Jitsi Videobridge to provide high quality, secure and scalable video conferences."

Find more information about Jitsi Meet here

Table of Contents

Configuration

IOS

  • Note: Example compilable with XCode 12.2 & Flutter 1.22.4.

Podfile

Ensure in your Podfile you have an entry like below declaring platform of 11.0 or above and disable BITCODE.

platform :ios, '11.0'

...

post_install do |installer|
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['ENABLE_BITCODE'] = 'NO'
    end
  end
end

Info.plist

Add NSCameraUsageDescription and NSMicrophoneUsageDescription to your Info.plist.

<key>NSCameraUsageDescription</key>
<string>$(PRODUCT_NAME) MyApp needs access to your camera for meetings.</string>
<key>NSMicrophoneUsageDescription</key>
<string>$(PRODUCT_NAME) MyApp needs access to your microphone for meetings.</string>

Android

Gradle

Set dependencies of build tools gradle to minimum 3.6.3:

dependencies {
    classpath 'com.android.tools.build:gradle:3.6.3' <!-- Upgrade this -->
    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
}

Set distribution gradle wrapper to minimum 5.6.4.

distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-5.6.4-all.zip <!-- Upgrade this -->

AndroidManifest.xml

Jitsi Meet's SDK AndroidManifest.xml will conflict with your project, namely the application:label field. To counter that, go into android/app/src/main/AndroidManifest.xml and add the tools library and tools:replace="android:label" to the application tag.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="yourpackage.com"
    xmlns:tools="http://schemas.android.com/tools"> <!-- Add this -->
    <application 
        tools:replace="android:label"  
        android:name="your.application.name"
        android:label="My Application"
        android:icon="@mipmap/ic_launcher">
        ...
    </application>
...
</manifest>

Minimum SDK Version 23

Update your minimum sdk version to 23 in android/app/build.gradle

defaultConfig {
    applicationId "com.gunschu.jitsi_meet_example"
    minSdkVersion 23 //Required for Jitsi
    targetSdkVersion 28
    versionCode flutterVersionCode.toInteger()
    versionName flutterVersionName
}

Proguard

Jitsi's SDK enables proguard, but without a proguard-rules.pro file, your release apk build will be missing the Flutter Wrapper as well as react-native code. In your Flutter project's android/app/build.gradle file, add proguard support

buildTypes {
    release {
        // TODO: Add your own signing config for the release build.
        // Signing with the debug keys for now, so `flutter run --release` works.
        signingConfig signingConfigs.debug
        
        // Add below 3 lines for proguard
        minifyEnabled true
        useProguard true
        proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
    }
}

Then add a file in the same directory called proguard-rules.pro. See the example app's proguard-rules.pro file to know what to paste in.

Note
If you do not create the proguard-rules.pro file, then your app will crash when you try to join a meeting or the meeting screen tries to open but closes immediately. You will see one of the below errors in logcat.

## App crashes ##
java.lang.RuntimeException: Parcel android.os.Parcel@8530c57: Unmarshalling unknown type code 7536745 at offset 104
    at android.os.Parcel.readValue(Parcel.java:2747)
    at android.os.Parcel.readSparseArrayInternal(Parcel.java:3118)
    at android.os.Parcel.readSparseArray(Parcel.java:2351)
    .....
## Meeting won't open and you go to previous screen ##
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.BV.LinearGradient.LinearGradientManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.uimanager.g
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTGroupViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.a
.....

WEB

To implement you need to include Jitsi Js library in the index.html of web section

<script src="https://meet.jit.si/external_api.js" type="application/javascript"></script>

Example:

<body>
  <!-- This script installs service_worker.js to provide PWA functionality to
       application. For more information, see:
       https://developers.google.com/web/fundamentals/primers/service-workers -->
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function () {
        navigator.serviceWorker.register('/flutter_service_worker.js');
      });
    }
  </script>
  <script src="https://meet.jit.si/external_api.js" type="application/javascript"></script>
  <script src="main.dart.js" type="application/javascript"></script>
</body>
</html>

Note See usage example in jitsi_meet plugin

Join A Meeting

_joinMeeting() async {
    try {
   FeatureFlag featureFlag = FeatureFlag();
   featureFlag.welcomePageEnabled = false;
   featureFlag.resolution = FeatureFlagVideoResolution.MD_RESOLUTION; // Limit video resolution to 360p
   
      var options = JitsiMeetingOptions()
        ..room = "myroom" // Required, spaces will be trimmed
        ..serverURL = "https://someHost.com"
        ..subject = "Meeting with Gunschu"
        ..userDisplayName = "My Name"
        ..userEmail = "myemail@email.com"
        ..userAvatarURL = "https://someimageurl.com/image.jpg" // or .png
        ..audioOnly = true
        ..audioMuted = true
        ..videoMuted = true
        ..featureFlag = featureFlag;

      await JitsiMeet.joinMeeting(options);
    } catch (error) {
      debugPrint("error: $error");
    }
  }

JitsiMeetingOptions

FieldRequiredDefaultDescription
roomYesN/AUnique room name that will be appended to serverURL. Valid characters: alphanumeric, dashes, and underscores.
subjectNo$roomMeeting name displayed at the top of the meeting. If null, defaults to room name where dashes and underscores are replaced with spaces and first characters are capitalized.
userDisplayNameNo"Fellow Jitster"User's display name.
userEmailNononeUser's email address.
audioOnlyNofalseStart meeting without video. Can be turned on in meeting.
audioMutedNofalseStart meeting with audio muted. Can be turned on in meeting.
videoMutedNofalseStart meeting with video muted. Can be turned on in meeting.
serverURLNomeet.jitsi.siSpecify your own hosted server. Must be a valid absolute URL of the format <scheme>://<host>[/path], i.e. someHost.com. Defaults to Jitsi Meet's servers.
userAvatarURLN/AnoneUser's avatar URL.
tokenN/AnoneJWT token used for authentication.
featureFlagNosee belowObject of FeatureFlag class used to enable/disable features and set video resolution of Jitsi Meet SDK.

FeatureFlag

Feature flag allows you to limit video resolution and enable/disable few features of Jitsi Meet SDK mentioned in the list below.
If you don't provide any flag to JitsiMeetingOptions, default values will be used.

We are using the official list of flags, taken from the Jitsi Meet repository

FlagDefault (Android)Default (iOS)Description
addPeopleEnabledtruetrueEnable the blue button "Add people", show up when you are alone in a call. Required for flag inviteEnabled to work.
calendarEnabledtrueautoEnable calendar integration.
callIntegrationEnabledtruetrueEnable call integration (CallKit on iOS, ConnectionService on Android). SEE REMARK BELOW
closeCaptionsEnabledtruetrueEnable close captions (subtitles) option in menu.
conferenceTimerEnabledtruetrueEnable conference timer.
chatEnabledtruetrueEnable chat (button and feature).
inviteEnabledtruetrueEnable invite option in menu.
iOSRecordingEnabledN/AfalseEnable recording in iOS.
kickOutEnabledtruetrueEnable kick-out option in video thumb of participants.
liveStreamingEnabledautoautoEnable live-streaming option in menu.
meetingNameEnabledtruetrueDisplay meeting name.
meetingPasswordEnabledtruetrueDisplay meeting password option in menu (if a meeting has a password set, the dialog will still show up).
pipEnabledautoautoEnable Picture-in-Picture mode.
raiseHandEnabledtruetrueEnable raise hand option in menu.
recordingEnabledautoN/AEnable recording option in menu.
resoulutionN/AN/ASet local and (maximum) remote video resolution. Overrides server configuration. Accepted values are: LD_RESOLUTION for 180p, MD_RESOLUTION for 360p, SD_RESOLUTION for 480p(SD), HD_RESOLUTION for 720p(HD) .
serverURLChangeEnabledtruetrueEnable server URL change.
tileViewEnabledtruetrueEnable tile view option in menu.
toolboxAlwaysVisibletruetrueToolbox (buttons and menus) always visible during call (if not, a single tap displays it).
videoShareButtonEnabledtruetrueEnable video share button.
welcomePageEnabledfalsefalseEnable welcome page. "The welcome page lists recent meetings and calendar appointments and it's meant to be used by standalone applications."

REMARK about Call integration Call integration on Android (known as ConnectionService) has been disabled on the official Jitsi Meet app because it creates a lot of issues. You should disable it too to avoid these issues.

JitsiMeetingResponse

FieldTypeDescription
isSuccessboolSuccess indicator.
messageStringSuccess message or error as a String.
errordynamicOptional, only exists if isSuccess is false. The error object.

Listening to Meeting Events

Events supported

NameDescription
onConferenceWillJoinMeeting is loading.
onConferenceJoinedUser has joined meeting.
onConferenceTerminatedUser has exited the conference.
onPictureInPictureWillEnterUser entered PIP mode.
onPictureInPictureTerminatedUser exited PIP mode.
onErrorError has occurred with listening to meeting events.

Per Meeting Events

To listen to meeting events per meeting, pass in a JitsiMeetingListener in joinMeeting. The listener will automatically be removed when an
onConferenceTerminated event is fired.

await JitsiMeet.joinMeeting(options,
  listener: JitsiMeetingListener(onConferenceWillJoin: ({message}) {
    debugPrint("${options.room} will join with message: $message");
  }, onConferenceJoined: ({message}) {
    debugPrint("${options.room} joined with message: $message");
  }, onConferenceTerminated: ({message}) {
    debugPrint("${options.room} terminated with message: $message");
  }, onPictureInPictureWillEnter: ({message}) {
 debugPrint("${options.room} entered PIP mode with message: $message");
  }, onPictureInPictureTerminated: ({message}) {
 debugPrint("${options.room} exited PIP mode with message: $message");
  }));

Global Meeting Events

To listen to global meeting events, simply add a JitsiMeetListener with
JitsiMeet.addListener(myListener). You can remove listeners using
JitsiMeet.removeListener(listener) or JitsiMeet.removeAllListeners().

@override
void initState() {
  super.initState();
  JitsiMeet.addListener(JitsiMeetingListener(
    onConferenceWillJoin: _onConferenceWillJoin,
    onConferenceJoined: _onConferenceJoined,
    onConferenceTerminated: _onConferenceTerminated,
    onPictureInPictureWillEnter: _onPictureInPictureWillEnter,
    onPictureInPictureTerminated: _onPictureInPictureTerminated,
    onError: _onError));
}

@override
void dispose() {
  super.dispose();
  JitsiMeet.removeAllListeners();
}

_onConferenceWillJoin({message}) {
  debugPrint("_onConferenceWillJoin broadcasted");
}

_onConferenceJoined({message}) {
  debugPrint("_onConferenceJoined broadcasted");
}

_onConferenceTerminated({message}) {
  debugPrint("_onConferenceTerminated broadcasted");
}

_onPictureInPictureWillEnter({message}) {
debugPrint("_onPictureInPictureWillEnter broadcasted with message: $message");
}

_onPictureInPictureTerminated({message}) {
debugPrint("_onPictureInPictureTerminated broadcasted with message: $message");
}

_onError(error) {
  debugPrint("_onError broadcasted");
}

Closing a Meeting Programmatically

JitsiMeet.closeMeeting();

Contributing

Send a pull request with as much information as possible clearly describing the issue or feature. Keep changes small and for one issue at a time.

Libraries

feature_flag
feature_flag_enum
feature_flag_helper
jitsi_meet
room_name_constraint
room_name_constraint_type