Add muteAudio function to load test JS. (#8802)

fix(vpaas) send jitsiMeetId instead of billingId

.eslintignore

@@ -5,6 +5,8 @@ build/*
 # modify as little as possible.
 flow-typed/*
 libs/*
+resources/*
+react/features/stream-effects/virtual-background/vendor/*
 
 # ESLint will by default ignore its own configuration file. However, there does
 # not seem to be a reason why we will want to risk being inconsistent with our

.github/workflows/ci.yml

@@ -12,5 +12,6 @@ jobs:
       with:
         node-version: '12.x'
     - run: npm install
+    - run: git status -s --untracked-files=no
     - run: npm run lint
     - run: make

Makefile

@@ -5,6 +5,8 @@ LIBJITSIMEET_DIR = node_modules/lib-jitsi-meet/
 LIBFLAC_DIR = node_modules/libflacjs/dist/min/
 OLM_DIR = node_modules/olm
 RNNOISE_WASM_DIR = node_modules/rnnoise-wasm/dist/
+TFLITE_WASM = react/features/stream-effects/virtual-background/vendor/tflite
+MEET_MODELS_DIR  = react/features/stream-effects/virtual-background/vendor/models/
 NODE_SASS = ./node_modules/.bin/sass
 NPM = npm
 OUTPUT_DIR = .
@@ -16,14 +18,17 @@ WEBPACK_DEV_SERVER = ./node_modules/.bin/webpack-dev-server
 
 all: compile deploy clean
 
-compile:
+compile: compile-load-test
 	$(WEBPACK) -p
 
+compile-load-test:
+	${NPM} install --prefix resources/load-test && ${NPM} run build --prefix resources/load-test
+
 clean:
 	rm -fr $(BUILD_DIR)
 
 .NOTPARALLEL:
-deploy: deploy-init deploy-appbundle deploy-rnnoise-binary deploy-lib-jitsi-meet deploy-libflac deploy-olm deploy-css deploy-local
+deploy: deploy-init deploy-appbundle deploy-rnnoise-binary deploy-tflite deploy-meet-models deploy-lib-jitsi-meet deploy-libflac deploy-olm deploy-css deploy-local
 
 deploy-init:
 	rm -fr $(DEPLOY_DIR)
@@ -39,8 +44,6 @@ deploy-appbundle:
 		$(BUILD_DIR)/external_api.min.map \
 		$(BUILD_DIR)/flacEncodeWorker.min.js \
 		$(BUILD_DIR)/flacEncodeWorker.min.map \
-		$(BUILD_DIR)/device_selection_popup_bundle.min.js \
-		$(BUILD_DIR)/device_selection_popup_bundle.min.map \
 		$(BUILD_DIR)/dial_in_info_bundle.min.js \
 		$(BUILD_DIR)/dial_in_info_bundle.min.map \
 		$(BUILD_DIR)/alwaysontop.min.js \
@@ -48,10 +51,6 @@ deploy-appbundle:
 		$(OUTPUT_DIR)/analytics-ga.js \
 		$(BUILD_DIR)/analytics-ga.min.js \
 		$(BUILD_DIR)/analytics-ga.min.map \
-		$(BUILD_DIR)/video-blur-effect.min.js \
-		$(BUILD_DIR)/video-blur-effect.min.map \
-		$(BUILD_DIR)/rnnoise-processor.min.js \
-		$(BUILD_DIR)/rnnoise-processor.min.map \
 		$(BUILD_DIR)/close3.min.js \
 		$(BUILD_DIR)/close3.min.map \
 		$(DEPLOY_DIR)
@@ -81,6 +80,16 @@ deploy-rnnoise-binary:
 		$(RNNOISE_WASM_DIR)/rnnoise.wasm \
 		$(DEPLOY_DIR)
 
+deploy-tflite:
+	cp \
+		$(TFLITE_WASM)/*.wasm \
+		$(DEPLOY_DIR)		
+
+deploy-meet-models:
+	cp \
+		$(MEET_MODELS_DIR)/*.tflite \
+		$(DEPLOY_DIR)	
+
 deploy-css:
 	$(NODE_SASS) $(STYLES_MAIN) $(STYLES_BUNDLE) && \
 	$(CLEANCSS) --skip-rebase $(STYLES_BUNDLE) > $(STYLES_DESTINATION) ; \
@@ -90,7 +99,7 @@ deploy-local:
 	([ ! -x deploy-local.sh ] || ./deploy-local.sh)
 
 .NOTPARALLEL:
-dev: deploy-init deploy-css deploy-rnnoise-binary deploy-lib-jitsi-meet deploy-libflac deploy-olm
+dev: deploy-init deploy-css deploy-rnnoise-binary deploy-tflite deploy-meet-models deploy-lib-jitsi-meet deploy-libflac deploy-olm
 	$(WEBPACK_DEV_SERVER) --detect-circular-deps
 
 source-package:

README.md

@@ -6,6 +6,8 @@ The Jitsi Meet client runs in your browser, without installing anything else on
 
 Jitsi Meet allows very efficient collaboration. Users can stream their desktop or only some windows. It also supports shared document editing with Etherpad.
 
+**NOTE:** If you are looking for Jitsi as a Service (JaaS) please start [here](https://jaas.8x8.vc).
+
 ## Installation
 
 On the client side, no installation is necessary. You just point your browser to the URL of your deployment. This section is about installing a Jitsi Meet suite on your server and hosting your own conferencing service.

android/build.gradle

@@ -10,17 +10,17 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:4.0.2'
-        classpath 'com.google.gms:google-services:4.3.3'
-        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.3.0'
+        classpath 'com.android.tools.build:gradle:4.1.2'
+        classpath 'com.google.gms:google-services:4.3.4'
+        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.4.1'
     }
 }
 
 ext {
-    buildToolsVersion = "29.0.3"
-    compileSdkVersion = 29
+    buildToolsVersion = "30.0.3"
+    compileSdkVersion = 30
     minSdkVersion    = 23
-    targetSdkVersion = 29
+    targetSdkVersion = 30
     supportLibVersion = "28.0.0"
 
     // The Maven artifact groupdId of the third-party react-native modules which

android/gradle.properties

@@ -26,4 +26,4 @@ android.useAndroidX=true
 android.enableJetifier=true
 
 appVersion=21.0.0
-sdkVersion=3.0.0
+sdkVersion=3.2.0

android/sdk/build.gradle

@@ -47,6 +47,7 @@ dependencies {
     implementation 'com.dropbox.core:dropbox-core-sdk:3.0.8'
     implementation 'com.jakewharton.timber:timber:4.7.1'
     implementation 'com.squareup.duktape:duktape-android:1.3.0'
+    implementation 'com.google.code.gson:gson:2.8.6'
 
     if (rootProject.ext.libreBuild) {
         implementation(project(':react-native-device-info')) {

android/sdk/src/main/java/org/jitsi/meet/sdk/BroadcastAction.java

@@ -60,7 +60,13 @@ public class BroadcastAction {
 
     enum Type {
         SET_AUDIO_MUTED("org.jitsi.meet.SET_AUDIO_MUTED"),
-        HANG_UP("org.jitsi.meet.HANG_UP");
+        HANG_UP("org.jitsi.meet.HANG_UP"),
+        SEND_ENDPOINT_TEXT_MESSAGE("org.jitsi.meet.SEND_ENDPOINT_TEXT_MESSAGE"),
+        TOGGLE_SCREEN_SHARE("org.jitsi.meet.TOGGLE_SCREEN_SHARE"),
+        RETRIEVE_PARTICIPANTS_INFO("org.jitsi.meet.RETRIEVE_PARTICIPANTS_INFO"),
+        OPEN_CHAT("org.jitsi.meet.OPEN_CHAT"),
+        CLOSE_CHAT("org.jitsi.meet.CLOSE_CHAT"),
+        SEND_CHAT_MESSAGE("org.jitsi.meet.SEND_CHAT_MESSAGE");
 
         private final String action;
 

android/sdk/src/main/java/org/jitsi/meet/sdk/BroadcastEvent.java

@@ -80,7 +80,12 @@ public class BroadcastEvent {
         CONFERENCE_WILL_JOIN("org.jitsi.meet.CONFERENCE_WILL_JOIN"),
         AUDIO_MUTED_CHANGED("org.jitsi.meet.AUDIO_MUTED_CHANGED"),
         PARTICIPANT_JOINED("org.jitsi.meet.PARTICIPANT_JOINED"),
-        PARTICIPANT_LEFT("org.jitsi.meet.PARTICIPANT_LEFT");
+        PARTICIPANT_LEFT("org.jitsi.meet.PARTICIPANT_LEFT"),
+        ENDPOINT_TEXT_MESSAGE_RECEIVED("org.jitsi.meet.ENDPOINT_TEXT_MESSAGE_RECEIVED"),
+        SCREEN_SHARE_TOGGLED("org.jitsi.meet.SCREEN_SHARE_TOGGLED"),
+        PARTICIPANTS_INFO_RETRIEVED("org.jitsi.meet.PARTICIPANTS_INFO_RETRIEVED"),
+        CHAT_MESSAGE_RECEIVED("org.jitsi.meet.CHAT_MESSAGE_RECEIVED"),
+        CHAT_TOGGLED("org.jitsi.meet.CHAT_TOGGLED");
 
         private static final String CONFERENCE_WILL_JOIN_NAME = "CONFERENCE_WILL_JOIN";
         private static final String CONFERENCE_JOINED_NAME = "CONFERENCE_JOINED";
@@ -88,6 +93,11 @@ public class BroadcastEvent {
         private static final String AUDIO_MUTED_CHANGED_NAME = "AUDIO_MUTED_CHANGED";
         private static final String PARTICIPANT_JOINED_NAME = "PARTICIPANT_JOINED";
         private static final String PARTICIPANT_LEFT_NAME = "PARTICIPANT_LEFT";
+        private static final String ENDPOINT_TEXT_MESSAGE_RECEIVED_NAME = "ENDPOINT_TEXT_MESSAGE_RECEIVED";
+        private static final String SCREEN_SHARE_TOGGLED_NAME = "SCREEN_SHARE_TOGGLED";
+        private static final String PARTICIPANTS_INFO_RETRIEVED_NAME = "PARTICIPANTS_INFO_RETRIEVED";
+        private static final String CHAT_MESSAGE_RECEIVED_NAME = "CHAT_MESSAGE_RECEIVED";
+        private static final String CHAT_TOGGLED_NAME = "CHAT_TOGGLED";
 
         private final String action;
 
@@ -122,6 +132,16 @@ public class BroadcastEvent {
                     return PARTICIPANT_JOINED;
                 case PARTICIPANT_LEFT_NAME:
                     return PARTICIPANT_LEFT;
+                case ENDPOINT_TEXT_MESSAGE_RECEIVED_NAME:
+                    return ENDPOINT_TEXT_MESSAGE_RECEIVED;
+                case SCREEN_SHARE_TOGGLED_NAME:
+                    return SCREEN_SHARE_TOGGLED;
+                case PARTICIPANTS_INFO_RETRIEVED_NAME:
+                    return PARTICIPANTS_INFO_RETRIEVED;
+                case CHAT_MESSAGE_RECEIVED_NAME:
+                    return CHAT_MESSAGE_RECEIVED;
+                case CHAT_TOGGLED_NAME:
+                    return CHAT_TOGGLED;
             }
 
             return null;

android/sdk/src/main/java/org/jitsi/meet/sdk/BroadcastIntentHelper.java

@@ -12,4 +12,32 @@ public class BroadcastIntentHelper {
     public static Intent buildHangUpIntent() {
         return new Intent(BroadcastAction.Type.HANG_UP.getAction());
     }
+
+    public static Intent buildSendEndpointTextMessageIntent(String to, String message) {
+        Intent intent = new Intent(BroadcastAction.Type.SEND_ENDPOINT_TEXT_MESSAGE.getAction());
+        intent.putExtra("to", to);
+        intent.putExtra("message", message);
+        return intent;
+    }
+
+    public static Intent buildToggleScreenShareIntent() {
+        return new Intent(BroadcastAction.Type.TOGGLE_SCREEN_SHARE.getAction());
+    }
+
+    public static Intent buildOpenChatIntent(String participantId) {
+        Intent intent = new Intent(BroadcastAction.Type.OPEN_CHAT.getAction());
+        intent.putExtra("to", participantId);
+        return intent;
+    }
+
+    public static Intent buildCloseChatIntent() {
+        return new Intent(BroadcastAction.Type.CLOSE_CHAT.getAction());
+    }
+
+    public static Intent buildSendChatMessageIntent(String participantId, String message) {
+        Intent intent = new Intent(BroadcastAction.Type.SEND_CHAT_MESSAGE.getAction());
+        intent.putExtra("to", participantId);
+        intent.putExtra("message", message);
+        return intent;
+    }
 }

android/sdk/src/main/java/org/jitsi/meet/sdk/BroadcastReceiver.java

@@ -16,8 +16,10 @@ public class BroadcastReceiver extends android.content.BroadcastReceiver {
         LocalBroadcastManager localBroadcastManager = LocalBroadcastManager.getInstance(context);
 
         IntentFilter intentFilter = new IntentFilter();
-        intentFilter.addAction(BroadcastAction.Type.SET_AUDIO_MUTED.getAction());
-        intentFilter.addAction(BroadcastAction.Type.HANG_UP.getAction());
+
+        for (BroadcastAction.Type type : BroadcastAction.Type.values()) {
+            intentFilter.addAction(type.getAction());
+        }
 
         localBroadcastManager.registerReceiver(this, intentFilter);
     }

android/sdk/src/main/java/org/jitsi/meet/sdk/ExternalAPIModule.java

@@ -53,6 +53,8 @@ class ExternalAPIModule
 
         broadcastEmitter = new BroadcastEmitter(reactContext);
         broadcastReceiver = new BroadcastReceiver(reactContext);
+
+        ParticipantsService.init(reactContext);
     }
 
     /**
@@ -77,6 +79,12 @@ class ExternalAPIModule
 
         constants.put("SET_AUDIO_MUTED", BroadcastAction.Type.SET_AUDIO_MUTED.getAction());
         constants.put("HANG_UP", BroadcastAction.Type.HANG_UP.getAction());
+        constants.put("SEND_ENDPOINT_TEXT_MESSAGE", BroadcastAction.Type.SEND_ENDPOINT_TEXT_MESSAGE.getAction());
+        constants.put("TOGGLE_SCREEN_SHARE", BroadcastAction.Type.TOGGLE_SCREEN_SHARE.getAction());
+        constants.put("RETRIEVE_PARTICIPANTS_INFO", BroadcastAction.Type.RETRIEVE_PARTICIPANTS_INFO.getAction());
+        constants.put("OPEN_CHAT", BroadcastAction.Type.OPEN_CHAT.getAction());
+        constants.put("CLOSE_CHAT", BroadcastAction.Type.CLOSE_CHAT.getAction());
+        constants.put("SEND_CHAT_MESSAGE", BroadcastAction.Type.SEND_CHAT_MESSAGE.getAction());
 
         return constants;
     }

android/sdk/src/main/java/org/jitsi/meet/sdk/JitsiMeetActivity.java

@@ -266,11 +266,10 @@ public class JitsiMeetActivity extends FragmentActivity
 
     private void registerForBroadcastMessages() {
         IntentFilter intentFilter = new IntentFilter();
-        intentFilter.addAction(BroadcastEvent.Type.CONFERENCE_JOINED.getAction());
-        intentFilter.addAction(BroadcastEvent.Type.CONFERENCE_WILL_JOIN.getAction());
-        intentFilter.addAction(BroadcastEvent.Type.CONFERENCE_TERMINATED.getAction());
-        intentFilter.addAction(BroadcastEvent.Type.PARTICIPANT_JOINED.getAction());
-        intentFilter.addAction(BroadcastEvent.Type.PARTICIPANT_LEFT.getAction());
+
+        for (BroadcastEvent.Type type : BroadcastEvent.Type.values()) {
+            intentFilter.addAction(type.getAction());
+        }
 
         LocalBroadcastManager.getInstance(this).registerReceiver(broadcastReceiver, intentFilter);
     }

android/sdk/src/main/java/org/jitsi/meet/sdk/OngoingNotification.java

@@ -24,6 +24,7 @@ import android.content.Context;
 import android.content.Intent;
 import android.os.Build;
 
+import androidx.annotation.StringRes;
 import androidx.core.app.NotificationCompat;
 
 import org.jitsi.meet.sdk.log.JitsiMeetLogger;
@@ -96,11 +97,11 @@ class OngoingNotification {
             .setOnlyAlertOnce(true)
             .setSmallIcon(context.getResources().getIdentifier("ic_notification", "drawable", context.getPackageName()));
 
-        NotificationCompat.Action hangupAction = createAction(context, JitsiMeetOngoingConferenceService.Action.HANGUP, "Hang up");
+        NotificationCompat.Action hangupAction = createAction(context, JitsiMeetOngoingConferenceService.Action.HANGUP, R.string.ongoing_notification_action_hang_up);
 
         JitsiMeetOngoingConferenceService.Action toggleAudioAction = isMuted
             ? JitsiMeetOngoingConferenceService.Action.UNMUTE : JitsiMeetOngoingConferenceService.Action.MUTE;
-        String toggleAudioTitle = isMuted ? "Unmute" : "Mute";
+        int toggleAudioTitle = isMuted ? R.string.ongoing_notification_action_unmute : R.string.ongoing_notification_action_mute;
         NotificationCompat.Action audioAction = createAction(context, toggleAudioAction, toggleAudioTitle);
 
         builder.addAction(hangupAction);
@@ -109,11 +110,12 @@ class OngoingNotification {
         return builder.build();
     }
 
-    private static NotificationCompat.Action createAction(Context context, JitsiMeetOngoingConferenceService.Action action, String title) {
+    private static NotificationCompat.Action createAction(Context context, JitsiMeetOngoingConferenceService.Action action, @StringRes int titleId) {
         Intent intent = new Intent(context, JitsiMeetOngoingConferenceService.class);
         intent.setAction(action.getName());
         PendingIntent pendingIntent
             = PendingIntent.getService(context, 0, intent, PendingIntent.FLAG_UPDATE_CURRENT);
+        String title = context.getString(titleId);
         return new NotificationCompat.Action(0, title, pendingIntent);
     }
 }

android/sdk/src/main/java/org/jitsi/meet/sdk/ParticipantInfo.java

@@ -0,0 +1,27 @@
+package org.jitsi.meet.sdk;
+
+import com.google.gson.annotations.SerializedName;
+
+public class ParticipantInfo {
+
+    @SerializedName("participantId")
+    public String id;
+
+    @SerializedName("displayName")
+    public String displayName;
+
+    @SerializedName("avatarUrl")
+    public String avatarUrl;
+
+    @SerializedName("email")
+    public String email;
+
+    @SerializedName("name")
+    public String name;
+
+    @SerializedName("isLocal")
+    public boolean isLocal;
+
+    @SerializedName("role")
+    public String role;
+}

android/sdk/src/main/java/org/jitsi/meet/sdk/ParticipantsService.java

@@ -0,0 +1,90 @@
+package org.jitsi.meet.sdk;
+
+import android.content.Context;
+import android.content.Intent;
+import android.content.IntentFilter;
+
+import androidx.localbroadcastmanager.content.LocalBroadcastManager;
+
+import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.WritableMap;
+import com.google.gson.Gson;
+import com.google.gson.reflect.TypeToken;
+
+import org.jitsi.meet.sdk.log.JitsiMeetLogger;
+
+import java.lang.ref.WeakReference;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.UUID;
+
+import javax.annotation.Nullable;
+
+public class ParticipantsService extends android.content.BroadcastReceiver {
+
+    private static final String TAG = ParticipantsService.class.getSimpleName();
+    private static final String REQUEST_ID = "requestId";
+
+    private final Map<String, WeakReference<ParticipantsInfoCallback>> participantsInfoCallbackMap = new HashMap<>();
+
+    private static ParticipantsService instance;
+
+    @Nullable
+    public static ParticipantsService getInstance() {
+        return instance;
+    }
+
+    private ParticipantsService(Context context) {
+        LocalBroadcastManager localBroadcastManager = LocalBroadcastManager.getInstance(context);
+
+        IntentFilter intentFilter = new IntentFilter();
+        intentFilter.addAction(BroadcastEvent.Type.PARTICIPANTS_INFO_RETRIEVED.getAction());
+        localBroadcastManager.registerReceiver(this, intentFilter);
+    }
+
+    static void init(Context context) {
+        instance = new ParticipantsService(context);
+    }
+
+    public void retrieveParticipantsInfo(ParticipantsInfoCallback participantsInfoCallback) {
+        String callbackKey = UUID.randomUUID().toString();
+        this.participantsInfoCallbackMap.put(callbackKey, new WeakReference<>(participantsInfoCallback));
+
+        String actionName = BroadcastAction.Type.RETRIEVE_PARTICIPANTS_INFO.getAction();
+        WritableMap data = Arguments.createMap();
+        data.putString(REQUEST_ID, callbackKey);
+        ReactInstanceManagerHolder.emitEvent(actionName, data);
+    }
+
+    @Override
+    public void onReceive(Context context, Intent intent) {
+        BroadcastEvent event = new BroadcastEvent(intent);
+
+        switch (event.getType()) {
+            case PARTICIPANTS_INFO_RETRIEVED:
+                try {
+                    List<ParticipantInfo> participantInfoList = new Gson().fromJson(
+                        event.getData().get("participantsInfo").toString(),
+                        new TypeToken<ArrayList<ParticipantInfo>>() {
+                        }.getType());
+
+                    ParticipantsInfoCallback participantsInfoCallback = this.participantsInfoCallbackMap.get(event.getData().get(REQUEST_ID).toString()).get();
+
+                    if (participantsInfoCallback != null) {
+                        participantsInfoCallback.onReceived(participantInfoList);
+                        this.participantsInfoCallbackMap.remove(participantsInfoCallback);
+                    }
+                } catch (Exception e) {
+                    JitsiMeetLogger.w(TAG + "error parsing participantsList", e);
+                }
+
+                break;
+        }
+    }
+
+    public interface ParticipantsInfoCallback {
+        void onReceived(List<ParticipantInfo> participantInfoList);
+    }
+}

android/sdk/src/main/res/values/strings.xml

@@ -3,4 +3,7 @@
     <string name="dropbox_app_key"></string>
     <string name="ongoing_notification_title">Ongoing meeting</string>
     <string name="ongoing_notification_text">You are currently in a meeting. Tap to return to it.</string>
+    <string name="ongoing_notification_action_hang_up">Hang up</string>
+    <string name="ongoing_notification_action_mute">Mute</string>
+    <string name="ongoing_notification_action_unmute">Unmute</string>
 </resources>

conference.js

@@ -33,6 +33,7 @@ import {
     conferenceLeft,
     conferenceSubjectChanged,
     conferenceTimestampChanged,
+    conferenceUniqueIdSet,
     conferenceWillJoin,
     conferenceWillLeave,
     dataChannelOpened,
@@ -98,6 +99,7 @@ import {
     destroyLocalTracks,
     getLocalJitsiAudioTrack,
     getLocalJitsiVideoTrack,
+    getLocalTracks,
     isLocalCameraTrackMuted,
     isLocalTrackMuted,
     isUserInteractionRequiredForUnmute,
@@ -114,7 +116,7 @@ import {
     submitFeedback
 } from './react/features/feedback';
 import { showNotification } from './react/features/notifications';
-import { mediaPermissionPromptVisibilityChanged } from './react/features/overlay';
+import { mediaPermissionPromptVisibilityChanged, toggleSlowGUMOverlay } from './react/features/overlay';
 import { suspendDetected } from './react/features/power-monitor';
 import {
     initPrejoin,
@@ -124,7 +126,7 @@ import {
 } from './react/features/prejoin';
 import { disableReceiver, stopReceiver } from './react/features/remote-control';
 import { toggleScreenshotCaptureEffect } from './react/features/screenshot-capture';
-import { setSharedVideoStatus } from './react/features/shared-video';
+import { setSharedVideoStatus } from './react/features/shared-video/actions';
 import { AudioMixerEffect } from './react/features/stream-effects/audio-mixer/AudioMixerEffect';
 import { createPresenterEffect } from './react/features/stream-effects/presenter';
 import { endpointMessageReceived } from './react/features/subtitles';
@@ -472,18 +474,13 @@ export default {
      */
     createInitialLocalTracks(options = {}) {
         const errors = {};
+
+        // Always get a handle on the audio input device so that we have statistics (such as "No audio input" or
+        // "Are you trying to speak?" ) even if the user joins the conference muted.
         const initialDevices = config.disableInitialGUM ? [] : [ 'audio' ];
         const requestedAudio = !config.disableInitialGUM;
         let requestedVideo = false;
 
-        // Always get a handle on the audio input device so that we have statistics even if the user joins the
-        // conference muted. Previous implementation would only acquire the handle when the user first unmuted,
-        // which would results in statistics ( such as "No audio input" or "Are you trying to speak?") being available
-        // only after that point.
-        if (options.startWithAudioMuted) {
-            this.muteAudio(true, true);
-        }
-
         if (!config.disableInitialGUM
                 && !options.startWithVideoMuted
                 && !options.startAudioOnly
@@ -501,8 +498,18 @@ export default {
             );
         }
 
+        JitsiMeetJS.mediaDevices.addEventListener(
+            JitsiMediaDevicesEvents.SLOW_GET_USER_MEDIA,
+            () => APP.store.dispatch(toggleSlowGUMOverlay(true))
+        );
+
         let tryCreateLocalTracks;
 
+        // On Electron there is no permission prompt for granting permissions. That's why we don't need to
+        // spend much time displaying the overlay screen. If GUM is not resolved withing 15 seconds it will
+        // probably never resolve.
+        const timeout = browser.isElectron() ? 15000 : 60000;
+
         // FIXME is there any simpler way to rewrite this spaghetti below ?
         if (options.startScreenSharing) {
             tryCreateLocalTracks = this._createDesktopTrack()
@@ -511,7 +518,12 @@ export default {
                         return [ desktopStream ];
                     }
 
-                    return createLocalTracksF({ devices: [ 'audio' ] }, true)
+                    return createLocalTracksF({
+                        devices: [ 'audio' ],
+                        timeout,
+                        firePermissionPromptIsShownEvent: true,
+                        fireSlowPromiseEvent: true
+                    })
                         .then(([ audioStream ]) =>
                             [ desktopStream, audioStream ])
                         .catch(error => {
@@ -525,7 +537,12 @@ export default {
                     errors.screenSharingError = error;
 
                     return requestedAudio
-                        ? createLocalTracksF({ devices: [ 'audio' ] }, true)
+                        ? createLocalTracksF({
+                            devices: [ 'audio' ],
+                            timeout,
+                            firePermissionPromptIsShownEvent: true,
+                            fireSlowPromiseEvent: true
+                        })
                         : [];
                 })
                 .catch(error => {
@@ -537,15 +554,37 @@ export default {
             // Resolve with no tracks
             tryCreateLocalTracks = Promise.resolve([]);
         } else {
-            tryCreateLocalTracks = createLocalTracksF({ devices: initialDevices }, true)
+            tryCreateLocalTracks = createLocalTracksF({
+                devices: initialDevices,
+                timeout,
+                firePermissionPromptIsShownEvent: true,
+                fireSlowPromiseEvent: true
+            })
                 .catch(err => {
                     if (requestedAudio && requestedVideo) {
 
                         // Try audio only...
                         errors.audioAndVideoError = err;
 
+                        if (err.name === JitsiTrackErrors.TIMEOUT && !browser.isElectron()) {
+                            // In this case we expect that the permission prompt is still visible. There is no point of
+                            // executing GUM with different source. Also at the time of writting the following
+                            // inconsistency have been noticed in some browsers - if the permissions prompt is visible
+                            // and another GUM is executed the prompt does not change its content but if the user
+                            // clicks allow the user action isassociated with the latest GUM call.
+                            errors.audioOnlyError = err;
+                            errors.videoOnlyError = err;
+
+                            return [];
+                        }
+
                         return (
-                            createLocalTracksF({ devices: [ 'audio' ] }, true));
+                            createLocalTracksF({
+                                devices: [ 'audio' ],
+                                timeout,
+                                firePermissionPromptIsShownEvent: true,
+                                fireSlowPromiseEvent: true
+                            }));
                     } else if (requestedAudio && !requestedVideo) {
                         errors.audioOnlyError = err;
 
@@ -566,7 +605,11 @@ export default {
 
                     // Try video only...
                     return requestedVideo
-                        ? createLocalTracksF({ devices: [ 'video' ] }, true)
+                        ? createLocalTracksF({
+                            devices: [ 'video' ],
+                            firePermissionPromptIsShownEvent: true,
+                            fireSlowPromiseEvent: true
+                        })
                         : [];
                 })
                 .catch(err => {
@@ -586,6 +629,7 @@ export default {
         // the user inputs their credentials, but the dialog would be
         // overshadowed by the overlay.
         tryCreateLocalTracks.then(tracks => {
+            APP.store.dispatch(toggleSlowGUMOverlay(false));
             APP.store.dispatch(mediaPermissionPromptVisibilityChanged(false));
 
             return tracks;
@@ -776,12 +820,16 @@ export default {
             return this._setLocalAudioVideoStreams(tracks);
         }
 
-        const [ tracks, con ] = await this.createInitialLocalTracksAndConnect(
-            roomName, initialOptions);
+        const [ tracks, con ] = await this.createInitialLocalTracksAndConnect(roomName, initialOptions);
+        let localTracks = tracks;
 
         this._initDeviceList(true);
 
-        return this.startConference(con, tracks);
+        if (initialOptions.startWithAudioMuted) {
+            localTracks = localTracks.filter(track => track.getType() !== MEDIA_TYPE.AUDIO);
+        }
+
+        return this.startConference(con, localTracks);
     },
 
     /**
@@ -849,7 +897,7 @@ export default {
                 showUI && APP.store.dispatch(notifyMicError(error));
             };
 
-            createLocalTracksF({ devices: [ 'audio' ] }, false)
+            createLocalTracksF({ devices: [ 'audio' ] })
                 .then(([ audioTrack ]) => audioTrack)
                 .catch(error => {
                     maybeShowErrorDialog(error);
@@ -963,7 +1011,7 @@ export default {
             //
             // FIXME when local track creation is moved to react/redux
             // it should take care of the use case described above
-            createLocalTracksF({ devices: [ 'video' ] }, false)
+            createLocalTracksF({ devices: [ 'video' ] })
                 .then(([ videoTrack ]) => videoTrack)
                 .catch(error => {
                     // FIXME should send some feedback to the API on error ?
@@ -972,7 +1020,11 @@ export default {
                     // Rollback the video muted status by using null track
                     return null;
                 })
-                .then(videoTrack => this.useVideoStream(videoTrack));
+                .then(videoTrack => {
+                    logger.debug(`muteVideo: calling useVideoStream for track: ${videoTrack}`);
+
+                    return this.useVideoStream(videoTrack);
+                });
         } else {
             // FIXME show error dialog if it fails (should be handled by react)
             muteLocalVideo(mute);
@@ -1272,7 +1324,11 @@ export default {
                 this._getConferenceOptions());
 
         APP.store.dispatch(conferenceWillJoin(room));
-        this._setLocalAudioVideoStreams(localTracks);
+
+        // Filter out the tracks that are muted.
+        const tracks = localTracks.filter(track => !track.isMuted());
+
+        this._setLocalAudioVideoStreams(tracks);
         this._room = room; // FIXME do not use this
 
         sendLocalParticipant(APP.store, room);
@@ -1291,8 +1347,11 @@ export default {
             if (track.isAudioTrack()) {
                 return this.useAudioStream(track);
             } else if (track.isVideoTrack()) {
+                logger.debug(`_setLocalAudioVideoStreams is calling useVideoStream with track: ${track}`);
+
                 return this.useVideoStream(track);
             }
+
             logger.error(
                     'Ignored not an audio nor a video track: ', track);
 
@@ -1312,6 +1371,8 @@ export default {
      * @returns {Promise}
      */
     useVideoStream(newTrack) {
+        logger.debug(`useVideoStream: ${newTrack}`);
+
         return new Promise((resolve, reject) => {
             _replaceLocalVideoTrackQueue.enqueue(onFinish => {
                 const state = APP.store.getState();
@@ -1321,14 +1382,20 @@ export default {
                 if (isPrejoinPageVisible(state)) {
                     const oldTrack = getLocalJitsiVideoTrack(state);
 
+                    logger.debug(`useVideoStream on the prejoin screen: Replacing ${oldTrack} with ${newTrack}`);
+
                     return APP.store.dispatch(replaceLocalTrack(oldTrack, newTrack))
                         .then(resolve)
-                        .catch(reject)
+                        .catch(error => {
+                            logger.error(`useVideoStream failed on the prejoin screen: ${error}`);
+                            reject(error);
+                        })
                         .then(onFinish);
                 }
 
+                logger.debug(`useVideoStream: Replacing ${this.localVideo} with ${newTrack}`);
                 APP.store.dispatch(
-                replaceLocalTrack(this.localVideo, newTrack, room))
+                    replaceLocalTrack(this.localVideo, newTrack, room))
                     .then(() => {
                         this.localVideo = newTrack;
                         this._setSharingScreen(newTrack);
@@ -1338,7 +1405,10 @@ export default {
                         this.setVideoMuteStatus(this.isLocalVideoMuted());
                     })
                     .then(resolve)
-                    .catch(reject)
+                    .catch(error => {
+                        logger.error(`useVideoStream failed: ${error}`);
+                        reject(error);
+                    })
                     .then(onFinish);
             });
         });
@@ -1485,7 +1555,11 @@ export default {
 
         if (didHaveVideo) {
             promise = promise.then(() => createLocalTracksF({ devices: [ 'video' ] }))
-                .then(([ stream ]) => this.useVideoStream(stream))
+                .then(([ stream ]) => {
+                    logger.debug(`_turnScreenSharingOff using ${stream} for useVideoStream`);
+
+                    return this.useVideoStream(stream);
+                })
                 .catch(error => {
                     logger.error('failed to switch back to local video', error);
 
@@ -1496,7 +1570,11 @@ export default {
                     );
                 });
         } else {
-            promise = promise.then(() => this.useVideoStream(null));
+            promise = promise.then(() => {
+                logger.debug('_turnScreenSharingOff using null for useVideoStream');
+
+                return this.useVideoStream(null);
+            });
         }
 
         return promise.then(
@@ -1507,6 +1585,8 @@ export default {
             },
             error => {
                 this.videoSwitchInProgress = false;
+                logger.error(`_turnScreenSharingOff failed: ${error}`);
+
                 throw error;
             });
     },
@@ -1527,6 +1607,7 @@ export default {
      * @return {Promise.<T>}
      */
     async toggleScreenSharing(toggle = !this._untoggleScreenSharing, options = {}) {
+        logger.debug(`toggleScreenSharing: ${toggle}`);
         if (this.videoSwitchInProgress) {
             return Promise.reject('Switch in progress.');
         }
@@ -1593,6 +1674,8 @@ export default {
                 desktopVideoStream.on(
                     JitsiTrackEvents.LOCAL_TRACK_STOPPED,
                     () => {
+                        logger.debug(`Local screensharing track stopped. ${this.isSharingScreen}`);
+
                         // If the stream was stopped during screen sharing
                         // session then we should switch back to video.
                         this.isSharingScreen
@@ -1757,6 +1840,7 @@ export default {
                 const desktopVideoStream = streams.find(stream => stream.getType() === MEDIA_TYPE.VIDEO);
 
                 if (desktopVideoStream) {
+                    logger.debug(`_switchToScreenSharing is using ${desktopVideoStream} for useVideoStream`);
                     await this.useVideoStream(desktopVideoStream);
                 }
 
@@ -1865,6 +1949,10 @@ export default {
                 APP.store.dispatch(conferenceLeft(room, ...args));
             });
 
+        room.on(
+            JitsiConferenceEvents.CONFERENCE_UNIQUE_ID_SET,
+            (...args) => APP.store.dispatch(conferenceUniqueIdSet(room, ...args)));
+
         room.on(
             JitsiConferenceEvents.AUTH_STATUS_CHANGED,
             (authEnabled, authLogin) =>
@@ -1956,7 +2044,11 @@ export default {
 
         room.on(JitsiConferenceEvents.TRACK_MUTE_CHANGED, (track, participantThatMutedUs) => {
             if (participantThatMutedUs) {
-                APP.store.dispatch(participantMutedUs(participantThatMutedUs));
+                APP.store.dispatch(participantMutedUs(participantThatMutedUs, track));
+                if (this.isSharingScreen && track.isVideoTrack()) {
+                    logger.debug('TRACK_MUTE_CHANGED while screen sharing');
+                    this._turnScreenSharingOff(false);
+                }
             }
         });
 
@@ -2108,8 +2200,26 @@ export default {
             }
         );
         room.on(JitsiConferenceEvents.STARTED_MUTED, () => {
-            (room.isStartAudioMuted() || room.isStartVideoMuted())
-                && APP.UI.notifyInitiallyMuted();
+            const audioMuted = room.isStartAudioMuted();
+            const videoMuted = room.isStartVideoMuted();
+            const localTracks = getLocalTracks(APP.store.getState()['features/base/tracks']);
+            const promises = [];
+
+            APP.store.dispatch(setAudioMuted(audioMuted));
+            APP.store.dispatch(setVideoMuted(videoMuted));
+
+            // Remove the tracks from the peerconnection.
+            for (const track of localTracks) {
+                if (audioMuted && track.jitsiTrack?.getType() === MEDIA_TYPE.AUDIO) {
+                    promises.push(this.useAudioStream(null));
+                }
+                if (videoMuted && track.jitsiTrack?.getType() === MEDIA_TYPE.VIDEO) {
+                    promises.push(this.useVideoStream(null));
+                }
+            }
+
+            Promise.allSettled(promises)
+                .then(() => APP.UI.notifyInitiallyMuted());
         });
 
         room.on(
@@ -2160,7 +2270,7 @@ export default {
                         .then(effect => this.localVideo.setEffect(effect))
                         .then(() => {
                             this.setVideoMuteStatus(false);
-                            logger.log('switched local video device');
+                            logger.log('Switched local video device while screen sharing and the video is unmuted');
                             this._updateVideoDeviceId();
                         })
                         .catch(err => APP.store.dispatch(notifyCameraError(err)));
@@ -2169,7 +2279,7 @@ export default {
                 // id for video, dispose the existing presenter track and create a new effect
                 // that can be applied on un-mute.
                 } else if (this.isSharingScreen && videoWasMuted) {
-                    logger.log('switched local video device');
+                    logger.log('Switched local video device: while screen sharing and the video is muted');
                     const { height } = this.localVideo.track.getSettings();
 
                     this._updateVideoDeviceId();
@@ -2196,12 +2306,20 @@ export default {
 
                         return stream;
                     })
-                    .then(stream => this.useVideoStream(stream))
+                    .then(stream => {
+                        logger.log('Switching the local video device.');
+
+                        return this.useVideoStream(stream);
+                    })
                     .then(() => {
-                        logger.log('switched local video device');
+                        logger.log('Switched local video device.');
                         this._updateVideoDeviceId();
                     })
-                    .catch(err => APP.store.dispatch(notifyCameraError(err)));
+                    .catch(error => {
+                        logger.error(`Switching the local video device failed: ${error}`);
+
+                        return APP.store.dispatch(notifyCameraError(error));
+                    });
                 }
             }
         );
@@ -2248,7 +2366,7 @@ export default {
                     return this.useAudioStream(stream);
                 })
                 .then(() => {
-                    if (hasDefaultMicChanged) {
+                    if (this.localAudio && hasDefaultMicChanged) {
                         // workaround for the default device to be shown as selected in the
                         // settings even when the real device id was passed to gUM because of the
                         // above mentioned chrome bug.
@@ -2553,6 +2671,7 @@ export default {
             delete newDevices.videoinput;
 
             // Removing the current video track in order to force the unmute to select the preferred device.
+            logger.debug('_onDeviceListChanged: Removing the current video track.');
             this.useVideoStream(null);
 
         }
@@ -2588,7 +2707,7 @@ export default {
                                     // Use the new stream or null if we failed to obtain it.
                                     return useStream(tracks.find(track => track.getType() === mediaType) || null)
                                         .then(() => {
-                                            if (hasDefaultMicChanged) {
+                                            if (this.localAudio && hasDefaultMicChanged) {
                                                 // workaround for the default device to be shown as selected in the
                                                 // settings even when the real device id was passed to gUM because of
                                                 // the above mentioned chrome bug.

config.js

@@ -240,6 +240,12 @@ var config = {
     //     90: 2
     // },
 
+    // Provides a way to translate the legacy bridge signaling messages, 'LastNChangedEvent',
+    // 'SelectedEndpointsChangedEvent' and 'ReceiverVideoConstraint' into the new 'ReceiverVideoConstraints' message
+    // that invokes the new bandwidth allocation algorithm in the bridge which is described here
+    // - https://github.com/jitsi/jitsi-videobridge/blob/master/doc/allocation.md.
+    // useNewBandwidthAllocationStrategy: false,
+
     // Specify the settings for video quality optimizations on the client.
     // videoQuality: {
     //    // Provides a way to prevent a video codec from being negotiated on the JVB connection. The codec specified
@@ -261,9 +267,16 @@ var config = {
     //    // the available bandwidth calculated by the browser, but it will be capped by the values specified here.
     //    // This is currently not implemented on app based clients on mobile.
     //    maxBitratesVideo: {
-    //        low: 200000,
-    //        standard: 500000,
-    //        high: 1500000
+    //          VP8 : {
+    //              low: 200000,
+    //              standard: 500000,
+    //              high: 1500000
+    //          },
+    //          VP9: {
+    //              low: 100000,
+    //              standard: 300000,
+    //              high:  1200000
+    //          }
     //    },
     //
     //    // The options can be used to override default thresholds of video thumbnail heights corresponding to
@@ -318,6 +331,11 @@ var config = {
     // TCC sequence numbers starting from 0.
     // enableIceRestart: false,
 
+    // Enables forced reload of the client when the call is migrated as a result of
+    // the bridge going down. Currently enabled by default as call migration through
+    // session-terminate is causing siganling issues when Octo is enabled.
+    // enableForcedReload: true,
+
     // Use TURN/UDP servers for the jitsi-videobridge connection (by default
     // we filter out TURN/UDP because it is usually not needed since the
     // bridge itself is reachable via UDP)
@@ -326,6 +344,9 @@ var config = {
     // UI
     //
 
+    // Disables responsive tiles.
+    // disableResponsiveTiles: false,
+
     // Hides lobby button
     // hideLobbyButton: false,
 
@@ -391,7 +412,26 @@ var config = {
     // enableAutomaticUrlCopy: false,
 
     // Base URL for a Gravatar-compatible service. Defaults to libravatar.
-    // gravatarBaseURL: 'https://seccdn.libravatar.org/avatar/';
+    // gravatarBaseURL: 'https://seccdn.libravatar.org/avatar/',
+
+    // Moved from interfaceConfig(TOOLBAR_BUTTONS).
+    // The name of the toolbar buttons to display in the toolbar, including the
+    // "More actions" menu. If present, the button will display. Exceptions are
+    // "livestreaming" and "recording" which also require being a moderator and
+    // some other values in config.js to be enabled. Also, the "profile" button will
+    // not display for users with a JWT.
+    // Notes:
+    // - it's impossible to choose which buttons go in the "More actions" menu
+    // - it's impossible to control the placement of buttons
+    // - 'desktop' controls the "Share your screen" button
+    // - if `toolbarButtons` is undefined, we fallback to enabling all buttons on the UI
+    // toolbarButtons: [
+    //    'microphone', 'camera', 'closedcaptions', 'desktop', 'embedmeeting', 'fullscreen',
+    //    'fodeviceselection', 'hangup', 'profile', 'chat', 'recording',
+    //    'livestreaming', 'etherpad', 'sharedvideo', 'settings', 'raisehand',
+    //    'videoquality', 'filmstrip', 'invite', 'feedback', 'stats', 'shortcuts',
+    //    'tileview', 'select-background', 'download', 'help', 'mute-everyone', 'mute-video-everyone', 'security'
+    // ],
 
     // Stats
     //
@@ -645,6 +685,11 @@ var config = {
     // Sets the conference subject
     // subject: 'Conference Subject',
 
+    // This property is related to the use case when jitsi-meet is used via the IFrame API. When the property is true
+    // jitsi-meet will use the local storage of the host page instead of its own. This option is useful if the browser
+    // is not persisting the local storage inside the iframe.
+    // useHostPageLocalStorage: true,
+
     // List of undocumented settings used in jitsi-meet
     /**
      _immediateReloadThreshold
@@ -696,6 +741,8 @@ var config = {
      forceTurnRelay
      hiddenDomain
      ignoreStartMuted
+     websocketKeepAlive
+     websocketKeepAliveUrl
      */
 
     /**
@@ -720,6 +767,7 @@ var config = {
     //     'dialog.reservationError',
     //     'dialog.serviceUnavailable', // shown when server is not reachable
     //     'dialog.sessTerminated', // shown when there is a failed conference session
+    //     'dialog.sessionRestarted', // show when a client reload is initiated because of bridge migration
     //     'dialog.tokenAuthFailed', // show when an invalid jwt is used
     //     'dialog.transcribing', // transcribing notifications (pending, off)
     //     'dialOut.statusMessage', // shown when dial out status is updated.

connection.js

@@ -94,6 +94,10 @@ function connect(id, password, roomName) {
     //  in future). It's included for the time being for Jitsi Meet and lib-jitsi-meet versions interoperability.
     connectionConfig.serviceUrl = connectionConfig.bosh = serviceUrl;
 
+    if (connectionConfig.websocketKeepAliveUrl) {
+        connectionConfig.websocketKeepAliveUrl += `?room=${roomName}`;
+    }
+
     const connection = new JitsiMeetJS.JitsiConnection(null, jwt, connectionConfig);
 
     if (config.iAmRecorder) {

css/_atlaskit_overrides.scss

@@ -1,66 +1,131 @@
+/**
+ * Mixins that mimic the way Atlaskit fills the screen with modals at low screen widths.
+ */
+@mixin full-size-modal-positioner() {
+    height: 100%;
+    left: 0;
+    position: fixed;
+    top: 0;
+    max-width: 100%;
+    width: 100%;
+}
+
+@mixin full-size-modal-dialog() {
+    height: 100%;
+    max-height: 100%;
+    border-radius: 0;
+}
+
 /**
  * Move the @atlaskit/flag container up a little bit so it does not cover the
  * toolbar with the first notification.
  */
-.jIMojv{
+.atlaskit-portal > #notifications-container {
     bottom: calc(#{$newToolbarSizeWithPadding}) !important;
 }
 
-/**
- * Disable the slide-in animation for @atlaskit/flag due to the animation
- * repeating for each queued flag once it becomes the top flag.
- */
- .mIBKA:first-child {
-    animation: cbfRuT 0s !important;
-    -webkit-animation: cbfRuT 0s !important;
-}
-
 .modal-dialog-form {
-    /**
-     * Update the @atlaskit/dropdown-menu trigger wrapper to make sure it looks
-     * click-able.
-     */
-    .cjJUnw {
-        cursor: pointer;
-    }
-
     /**
      * Override @atlaskit/dropdown-menu styling when in a modal because the
      * dropdown backgrounds clash with the modal backgrounds.
      */
-    .cksvax[data-role=droplistContent] {
-        border: 1px solid #455166;
+    .dropdown-menu div[style*="transform"] {
+        outline: 1px solid #455166;
     }
 }
 
+/**
+ * Override @atlaskit/modal-dialog header styling
+ */
+.atlaskit-portal [role="dialog"] header {
+    .jitsi-icon {
+        cursor: pointer;
+    }
+
+    .jitsi-icon svg {
+        fill: #B8C7E0;
+    }
+}
+
+/**
+ * Make header close button more easily tappable on mobile.
+ */
+.mobile-browser .atlaskit-portal [role="dialog"] header .jitsi-icon {
+    display: grid;
+    place-items: center;
+    height: 48px;
+    width: 48px;
+    background: #2a3a4b;
+    border-radius: 3px;
+}
+
 /**
  * Override @atlaskit/theme styling for the top toolbar so it displays over
  * the video thumbnail while obscuring as little as possible.
  */
-.videocontainer .tOoji {
+.videocontainer__toptoolbar > div > div {
     background: none;
 }
 
-/**
- * Override @atlaskit/InlineDialog styling for the overflowmenu so it displays
- * with the correct height.
- */
-.toolbox-button-wth-dialog .eYJELv {
-    max-height: initial;
-}
-
-/**
- * Override @atlaskit/InlineDialog styling for the overflowmenu so it displays
- * a scrollable list of elements at small screen widths.
- */
-.sc-eNQAEJ {
-    overflow-y: auto;
-}
 
 /**
  * Keep overflow menu within screen vertical bounds and make it scrollable.
  */
-.toolbox-button-wth-dialog .sc-ckVGcZ.fdAqDG > :first-child {
-    max-height: calc(100vh - #{$newToolbarSizeWithPadding} - 16px);
+ .toolbox-button-wth-dialog > div:nth-child(2) {
+    max-height: calc(100vh - #{$newToolbarSizeWithPadding} - 46px);
+    margin-bottom: 4px;
     overflow-y: auto;
 }
+
+.audio-preview > div:nth-child(2),
+.video-preview > div:nth-child(2) {
+    margin-bottom: 4px;
+    outline: none;
+    padding: 0;
+}
+
+/**
+ * The following selectors keep the chat modal full-size anywhere between 100px
+ * and 580px for desktop or 680px for mobile.
+ */
+@media (min-width: 100px) and (max-width: 320px) {
+    .smiley-input {
+        display: none;
+    }
+    .shift-right .focus-lock > div > div {
+        @include full-size-modal-positioner();
+    }
+
+    .shift-right .focus-lock [role="dialog"] {
+        @include full-size-modal-dialog();
+    }
+}
+
+@media (min-width: 480px) and (max-width: 580px) {
+    .shift-right .focus-lock > div > div {
+        @include full-size-modal-positioner();
+    }
+
+    .shift-right .focus-lock [role="dialog"] {
+        @include full-size-modal-dialog();
+    }
+}
+
+@media (min-width: 580px) and (max-width: 680px) {
+    .mobile-browser {
+        &.shift-right .focus-lock > div > div {
+            @include full-size-modal-positioner();
+        }
+
+        &.shift-right .focus-lock [role="dialog"] {
+            @include full-size-modal-dialog();
+        }
+    }
+}
+
+div.Tooltip {
+    color: #fff;
+    font-size: 12px;
+    line-height: 14px;
+    padding: 8px;
+}

css/_audio-preview.scss

@@ -1,26 +1,37 @@
 .audio-preview {
+    display: inline-block;
+
     &-content {
-        background: #2A3A4B;
-        font-size: 15px;
+        background: $menuBG;
+        border-radius: 3px;
+        font-size: 14px;
         line-height: 24px;
         max-height: 456px;
         overflow: auto;
-        width: 328px;
+        width: 300px;
     }
 
     &-header {
         color: #fff;
+        align-items: center;
         display: flex;
-        padding: 16px;
+        margin-top: 8px;
+        padding: 8px 16px;
 
         &-icon {
-            color: #A4B8D1;
             display: inline-block;
+
+            svg {
+                fill: #fff;
+            }
+        }
+
+        &--bordered {
+            border-bottom: 1px solid #4C4D50;
         }
 
         &-text {
-            font-weight: bold;
-            margin-left: 8px;
+            margin-left: 12px;
         }
     }
 
@@ -29,19 +40,18 @@
         color: #fff;
         cursor: pointer;
         display: flex;
-        padding: 12px 0;
+        padding: 8px 0;
         margin-left: 48px;
 
         &--selected {
-            background: #1C2025;
+            background: #131519;
             cursor: initial;
             margin-left: 0;
-            padding-left: 21px;
+            padding-left: 18px;
         }
 
         &-text {
             color: #fff;
-            font-size: 15px;
             display: inline-block;
             line-height: 24px;
             text-overflow: ellipsis;
@@ -56,12 +66,13 @@
 
         &:hover {
             .audio-preview-entry {
-                background: #3F4E5E;
+                background: #36383C;
                 margin-left: 0;
                 padding-left: 48px;
 
                 &--selected {
-                    padding-left: 21px;
+                    padding-left: 18px;
+                    background: #131519;
                 }
             }
 
@@ -74,6 +85,10 @@
             }
         }
 
+        &:last-child {
+            padding-bottom: 8px;
+        }
+
         .audio-preview-entry-text {
             max-width: 256px;
         }
@@ -84,18 +99,19 @@
 
         &:hover {
             .audio-preview-entry {
-                background: #3F4E5E;
+                background: #36383C;
                 margin-left: 0;
                 padding-left: 48px;
 
                 &--selected {
-                    padding-left: 21px;
+                    background: #131519;
+                    padding-left: 18px;
                 }
             }
         }
 
         .audio-preview-entry-text {
-            max-width: 196px;
+            max-width: 178px;
         }
     }
 
@@ -110,7 +126,7 @@
 
         &--check {
             background: #31B76A;
-            margin-right: 13px;
+            margin-right: 16px;
         }
 
         &--exclamation {
@@ -121,6 +137,11 @@
         }
     }
 
+    &-hr {
+        border-top: 1px solid #4C4D50;
+        border-bottom: 0;
+    }
+
     &-test-button {
         display: none;
         background: #FFF;
@@ -129,23 +150,16 @@
         color: #1C2025;
         cursor: pointer;
         font-weight: 600;
-        font-size: 15px;
         line-height: 24px;
-        padding: 4px 16px;
+        padding: 2px 16px;
         position: absolute;
         right: 16px;
-        top: 8px;
+        top: 5px;
     }
 
     &-meter-mic {
         position: absolute;
         right: 16px;
-        top: 18px;
-    }
-
-   // Override @atlaskit/InlineDialog container which is made with styled components
-    & > div > div:nth-child(2) > div > div {
-        outline: none;
-        padding: 0;
+        top: 14px;
     }
 }

css/_base.scss

@@ -45,20 +45,12 @@ body {
  * pad the modal container in order for the modals to be centered
  * while also taking the chat size into consideration.
 */
-@media (min-width: 480px + $sidebarWidth) {
-    .shift-right [class^="Modal__FillScreen"] {
+@media (min-width: 581px) {
+    .shift-right .atlaskit-portal > div:not(.Tooltip) {
         padding-left: $sidebarWidth;
     }
 }
 
-/**
- * Similarly, we offset the notifications when the chat is open by
- * padding the container.
-*/
-.shift-right [class^="styledFlagGroup-"] {
-    padding-left: $sidebarWidth;
-}
-
 .jitsi-icon svg {
     fill: white;
 }

css/_chat.scss

@@ -32,6 +32,13 @@
     width: $sidebarWidth;
     word-wrap: break-word;
 
+    display: flex;
+    flex-direction: column;
+
+    & > :first-child {
+        margin-top: auto;
+    }
+
     a {
         display: block;
     }
@@ -103,38 +110,80 @@
     position: relative;
     width: 100%;
     z-index: 1;
+    display: flex;
+    justify-content: space-between;
+    padding: 16px;
+    align-items: center;
+    box-sizing: border-box;
+    color: #fff;
+    font-weight: 600;
+    font-size: 24px;
+    line-height: 32px;
 
-    .chat-close {
-        align-items: center;
-        bottom: 8px;
-        color: white;
+    .jitsi-icon {
         cursor: pointer;
-        display: flex;
-        font-size: 18px;
-        height: 40px;
-        justify-content: center;
-        line-height: 15px;
-        padding: 4px;
-        position: absolute;
-        right: 5px;
-        width: 40px;
+    }
 
-        &:hover {
-            color: rgba(255, 255, 255, 0.8);
+    .jitsi-icon > svg {
+        fill: #A4B8D1;
+    }
+}
+
+.chat-input-container {
+    padding: 0 16px 24px;
+
+    &.populated {
+        #chat-input {
+            border: 1px solid #619CF4;
+
+            .send-button {
+                background: #1B67EC;
+                cursor: pointer;
+
+                path {
+                    fill: #fff;
+                }
+            }
         }
     }
 }
 
 #chat-input {
-    border-top: 1px solid $chatInputSeparatorColor;
+    border: 1px solid $chatInputSeparatorColor;
     display: flex;
     padding: 5px 10px;
+    border-radius: 3px;
 
     * {
         background-color: transparent;
     }
 }
 
+.send-button-container {
+    display: flex;
+    align-items: center;
+}
+
+.send-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 40px;
+    width: 40px;
+    border-radius: 3px;
+
+    path {
+        fill: $chatInputSeparatorColor;
+    }
+}
+
+.mobile-browser {
+    .send-button {
+        height: 48px;
+        width: 48px;
+    }
+}
+
 .remoteuser {
     color: #B8C7E0;
 }
@@ -164,10 +213,47 @@
 #nickname {
     text-align: center;
     color: #9d9d9d;
-    font-size: 18px;
-    margin-top: 30px;
-    left: 5px;
-    right: 5px;
+    font-size: 16px;
+    margin: auto 0;
+    padding: 0 16px;
+
+    input {
+        height: 40px;
+    }
+
+    label {
+        line-height: 24px;
+    }
+
+    .enter-chat {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-top: 16px;
+        height: 40px;
+        background: #1B67EC;
+        border-radius: 3px;
+        color: #fff;
+        cursor: pointer;
+
+        &.disabled {
+            color: #757575;
+            background: #11336E;
+            pointer-events: none;
+        }
+    }
+}
+
+.mobile-browser {
+    #nickname {
+        input {
+            height: 48px;
+        }
+
+        .enter-chat {
+            height: 48px;
+        }
+    }
 }
 
 .sideToolbarContainer {
@@ -184,6 +270,10 @@
         text-overflow: ellipsis;
         overflow: hidden;
     }
+
+    @media (max-width: 580px) {
+        display: none !important;
+    }
 }
 
 .chatmessage {
@@ -389,6 +479,7 @@
     &-header {
         display: flex;
         justify-content: space-between;
+        align-items: center;
         margin: 16px 16px 24px;
         width: calc(100% - 32px);
         box-sizing: border-box;
@@ -397,8 +488,11 @@
         font-size: 24px;
         line-height: 32px;
 
-        .jitsi-icon > svg {
+        .jitsi-icon {
             cursor: pointer;
+        }
+
+        .jitsi-icon > svg {
             fill: #A4B8D1;
         }
     }
@@ -406,4 +500,26 @@
     #chatconversation {
         width: 100%;
     }
+
+    .chat-input-container {
+        padding: 0 0 24px;
+    }
+}
+
+.touchmove-hack {
+    display: flex;
+    flex: 1;
+    overflow: auto;
+}
+
+/**
+ * Make header close button more easily tappable on mobile.
+ */
+.mobile-browser .chat-dialog-header .jitsi-icon {
+    display: grid;
+    place-items: center;
+    height: 48px;
+    width: 48px;
+    background: #2a3a4b;
+    border-radius: 3px;
 }

css/_country-picker.scss

@@ -69,7 +69,7 @@
 }
 
 // Override @Atlaskit/inline-dialog styles
-.cpick-container > div > div:nth-child(2) > div > div {
+.cpick-container > div:nth-child(2) {
     outline: none;
     padding: 8px 0 0 0;
 }

css/_drawer.scss

@@ -7,7 +7,6 @@
 }
 
 .drawer-menu {
-    padding: 12px 16px;
     max-height: 50vh;
     background: #242528;
     border-radius: 16px 16px 0 0;
@@ -24,12 +23,8 @@
         height: 44px;
         cursor: pointer;
 
-        &:hover {
-            background-color: $overflowMenuItemHoverBG;
-        }
-
-        svg, path {
-            fill: #b8c7e0;
+        svg {
+            fill: none;
         }
     }
 
@@ -57,7 +52,7 @@
             color: $overflowMenuItemColor;
             cursor: pointer;
             display: flex;
-            font-size: 14px;
+            font-size: 16px;
 
             div {
                 display: flex;
@@ -65,16 +60,13 @@
                 align-items: center;
             }
 
-            &:hover {
-                background-color: $overflowMenuItemHoverBG;
-                color: $overflowMenuItemHoverColor;
-            }
-
             &.unclickable {
                 cursor: default;
             }
-            &.unclickable:hover {
-                background: inherit;
+            @media (hover: hover) and (pointer: fine) {
+                &.unclickable:hover {
+                    background: inherit;
+                }
             }
             &.disabled {
                 cursor: initial;
@@ -82,40 +74,8 @@
             }
         }
 
-        .beta-tag {
-            background: $overflowMenuItemColor;
-            border-radius: 2px;
-            color: $overflowMenuBG;
-            font-size: 11px;
-            font-weight: bold;
-            margin-left: 8px;
-            padding: 0 6px;
-        }
-
-        .overflow-menu-item-icon {
-            margin-right: 10px;
-
-            i {
-                display: inline;
-                font-size: 24px;
-            }
-
-            i:hover {
-                background-color: initial;
-            }
-
-            img {
-                max-width: 24px;
-                max-height: 24px;
-            }
-
-            svg {
-                fill: #B8C7E0 !important;
-            }
-        }
-
         .profile-text {
-            max-width: 150px;
+            max-width: 100%;
             text-overflow: ellipsis;
             overflow: hidden;
             white-space: nowrap;

css/_labels.scss

@@ -4,7 +4,7 @@
     top: 30px;
     right: 30px;
     transition: right 0.5s;
-    z-index: $filmstripVideosZ + 1;
+    z-index: $labelsZ;
 
     .circular-label {
         align-items: center;

css/_popover.scss

@@ -47,4 +47,5 @@
     border-radius: 3px;
     margin: -16px -24px;
     padding: 16px 24px;
+    z-index: $popoverZ;
 }

css/_popup_menu.scss

@@ -6,7 +6,6 @@
     min-width: 75px;
     text-align: left;
     padding: 0px;
-    width: 180px;
     white-space: nowrap;
 
     &__item {

css/_prejoin.scss

@@ -129,7 +129,7 @@
     }
 
     &-dropdown-container {
-        & > div > div:nth-child(2) > div > div {
+        & > div:nth-child(2) {
             background: #fff;
             padding: 0;
         }

css/_premeeting-screens.scss

@@ -25,7 +25,7 @@
         text {
             fill: black;
             font-size: 26px;
-            font-weight: 400;  
+            font-weight: 400;
         }
     }
 
@@ -197,14 +197,6 @@
         &> div {
             margin: 0 12px;
         }
-
-        .settings-button-small-icon {
-            right: -8px;
-
-            &--hovered {
-                right: -10px;
-            }
-        }
     }
 }
 

css/_responsive.scss

@@ -1,73 +1,3 @@
-@mixin small-button-size() {
-    .new-toolbox {
-        .toolbox-content {
-            .button-group-center, .button-group-left, .button-group-right {
-                .toolbox-button {
-                    .toolbox-icon {
-                        width: 28px;
-                        height: 28px;
-                        svg {
-                            width: 18px;
-                            height: 18px;
-                        }
-                    }
-
-                    &:nth-child(2) {
-                        .toolbox-icon {
-                            width: 30px;
-                            height: 30px;
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
-
-@mixin very-small-button-size() {
-    .new-toolbox {
-        .toolbox-content {
-            .button-group-center, .button-group-left, .button-group-right {
-                .settings-button-small-icon {
-                    display: none;
-                }
-                .toolbox-button {
-                    .toolbox-icon {
-                        width: 18px;
-                        height: 18px;
-                        svg {
-                            width: 12px;
-                            height: 12px;
-                        }
-                    }
-
-                    &:nth-child(2) {
-                        .toolbox-icon {
-                            width: 20px;
-                            height: 20px;
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
-
-@mixin full-size-modal-positioner() {
-    height: 100%;
-    left: 0;
-    position: fixed;
-    top: 0;
-    max-width: 100%;
-    width: 100%;
-}
-
-@mixin full-size-modal-dialog() {
-    height: 100%;
-    max-height: 100%;
-    border-radius: 0;
-}
-
 @media only screen and (max-width: $verySmallScreen) {
     .welcome {
         display: block;
@@ -137,31 +67,9 @@
 }
 
 .desktop-browser {
-    @media only screen and (max-width: $smallScreen) {
-        @include small-button-size();
-    }
-
-    @media only screen and (max-width: $verySmallScreen) {
-        @include very-small-button-size();
-
-        #videoResolutionLabel {
-            display: none;
-        }
-        .vertical-filmstrip .filmstrip {
-            display: none;
-        }
-        .chrome-extension-banner {
-            display: none;
-        }
-    }
-
     &.shift-right {
-        @media only screen and (max-width: $smallScreen + $sidebarWidth) {
-            @include small-button-size()
-        }
 
         @media only screen and (max-width: $verySmallScreen + $sidebarWidth) {
-            @include very-small-button-size();
 
             #videoResolutionLabel {
                 display: none;
@@ -175,25 +83,3 @@
         }
     }
 }
-
-@media (min-width: 480px) and (max-width: 580px) {
-    .shift-right [class^="Modal__PositionerAbsolute"] {
-        @include full-size-modal-positioner();
-    }
-
-    .shift-right [class^="Modal__Dialog-"] {
-        @include full-size-modal-dialog();
-    }
-}
-
-@media (min-width: 580px) and (max-width: 680px) {
-    .mobile-browser {
-        &.shift-right [class^="Modal__PositionerAbsolute"] {
-            @include full-size-modal-positioner();
-        }
-
-        &.shift-right [class^="Modal__Dialog-"] {
-            @include full-size-modal-dialog();
-        }
-    }
-}

css/_settings-button.scss

@@ -1,84 +1,60 @@
-.settings-button {
-    &-container {
-        position: relative;
+.settings-button-container {
+    position: relative;
 
-        .toolbox-icon {
-            align-items: center;
-            cursor: pointer;
-            display: flex;
-            background-color: #fff;
-            border-radius: 50%;
-            border: 1px solid #d1dbe8;
-            justify-content: center;
-            width: 38px;
-            height: 38px;
+    .toolbox-icon {
+        align-items: center;
+        border-radius: 3px;
+        cursor: pointer;
+        display: flex;
+        justify-content: center;
+
+        &.disabled, .disabled & {
+            cursor: initial;
+            color: #929292;
+            background-color: #36383c;
 
             &:hover {
-                background-color: #daebfa;
-                border: 1px solid #daebfa;
-            }
-
-            &.toggled {
-                background: #2a3a4b;
-                border: 1px solid #5e6d7a;
-
-                svg {
-                    fill: #fff;
-                }
-
-                &:hover {
-                    background-color: #5e6d7a;
-                }
-            }
-
-            &.disabled, .disabled & {
-                cursor: initial;
-                color: #fff;
-                background-color: #a4b8d1;
-
-                &:hover {
-                    background-color: #a4b8d1;
-                }
-            }
-
-            svg {
-                fill: #5e6d7a;
-            }
-        }
-    }
-
-    &-small-icon {
-        background: #FFF;
-        border: 1px solid rgba(0, 0, 0, 0.2);
-        border-radius: 50%;
-        bottom: 0;
-        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
-        cursor: pointer;
-        height: 16px;
-        position: absolute;
-        text-align: center;
-        right: 4px;
-        width: 16px;
-
-        &> svg {
-            fill: #5e6d7a;
-            margin-top: 5px;
-        }
-
-        &--disabled {
-            background-color: #a4b8d1;
-            cursor: default;
-        }
-
-        &--hovered {
-            bottom: -1px;
-            height: 20px;
-            right: 2px;
-            width: 20px;
-
-            &> svg {
-                margin-top: 6px;
+                background-color: #36383c;
             }
         }
     }
 }
+
+.settings-button-small-icon {
+    background: #36383C;
+    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+    border-radius: 3px;
+    cursor: pointer;
+    padding: 4px;
+    position: absolute;
+    right: -4px;
+    top: -3px;
+
+   &:hover {
+        background: #F2F3F4;
+        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+
+        &> svg {
+            fill: #000;
+        }
+
+        &.settings-button-small-icon--disabled {
+            &> svg {
+               fill: #929292;
+           }
+        }
+    }
+
+    &> svg {
+        fill: #fff;
+    }
+
+    &--disabled {
+        background-color: #36383c;
+        cursor: default;
+
+        &> svg {
+            fill: #929292;
+        }
+    }
+}

css/_subject.scss

@@ -14,12 +14,15 @@
     text-overflow: ellipsis;
     box-sizing: border-box;
     white-space: nowrap;
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
 
     &.visible {
         top: 0px;
     }
 
+    &.gradient {
+        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
+    }
+
     &-text {
         vertical-align: middle;
     }

css/_toolbars.scss

@@ -33,245 +33,233 @@
 
     &.visible {
         bottom: 0;
-        .toolbox-background {
-            bottom: 0px;
-        }
     }
 
     &.no-buttons {
         display: none;
     }
 
-    &.shift-right {
-        margin-left: $sidebarWidth;
-        width: calc(100% - #{$sidebarWidth});
+    @media (min-width: 581px) {
+        &.shift-right {
+            margin-left: $sidebarWidth;
+            width: calc(100% - #{$sidebarWidth});
+        }
+    }
+}
+
+.toolbox-content {
+    align-items: center;
+    box-sizing: border-box;
+    display: flex;
+    margin-bottom: 16px;
+    position: relative;
+    z-index: $toolbarZ;
+
+    .button-group-center,
+    .button-group-left,
+    .button-group-right {
+        display: flex;
+        width: 33%;
     }
 
-    .toolbox-background {
-        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
-        transition: bottom .3s ease-in;
-        height: 160px;
-        width: 100%;
-        bottom: -160px;
+    .button-group-center {
+        justify-content: center;
+    }
+
+    .button-group-right {
+        justify-content: flex-end;
+    }
+
+    .toolbox-button-wth-dialog {
+        display: inline-block;
+
+        &> div {
+            padding: 0;
+        }
+    }
+}
+
+.toolbox-button {
+    color: $toolbarButtonColor;
+    cursor: pointer;
+    display: inline-block;
+    line-height: $newToolbarSize;
+    text-align: center;
+}
+
+.toolbar-button-with-badge {
+    display: inline-block;
+    position: relative;
+
+    .badge-round {
+        bottom: -5px;
+        font-size: 12px;
+        line-height: 20px;
+        min-width: 20px;
         pointer-events: none;
         position: absolute;
-        z-index: $toolbarBackgroundZ;
+        right: -5px;
+    }
+}
+
+
+.toolbox-content-items {
+    background: #131519;
+    box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.15);
+    border-radius: 6px;
+    margin: 0 auto;
+    padding: 6px;
+    text-align: center;
+
+    >div {
+        margin-left: 8px;
+
+        &:first-child {
+            margin-left: 0;
+        }
+    }
+}
+
+.overflow-menu {
+    font-size: 14px;
+    list-style-type: none;
+    padding: 8px 0;
+    background-color: $menuBG;
+
+    .profile-text {
+        max-width: 150px;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: nowrap;
+    }
+}
+
+.overflow-menu-item {
+    align-items: center;
+    color: $overflowMenuItemColor;
+    cursor: pointer;
+    display: flex;
+    font-size: 14px;
+    font-weight: 400;
+    height: 40px;
+    line-height: 24px;
+    padding: 8px 16px;
+    box-sizing: border-box;
+
+    @media (hover: hover) and (pointer: fine) {
+        &:hover {
+            background: $overflowMenuItemBackground;
+        }
     }
 
-    .toolbox-content {
-        box-sizing: border-box;
+    div {
         display: flex;
-        justify-content: space-between;
-        margin-left: auto;
-        margin-right: auto;
-        padding: 20px 16px;
-        position: relative;
-        width: 100%;
-        z-index: $toolbarZ;
+        flex-direction: row;
+        align-items: center;
+    }
 
-        .button-group-center,
-        .button-group-left,
-        .button-group-right {
-            display: flex;
-            width: 33%;
+    &.unclickable {
+        cursor: default;
+    }
+    &.disabled {
+        cursor: initial;
+        color: #929292;
+
+        svg {
+            fill: #929292;
         }
+    }
 
-        .button-group-center {
-            justify-content: center;
-
-            .toolbox-button {
-
-                .toolbox-icon {
-                    background-color: #fff;
-                    border-radius: 50%;
-                    border: 1px solid #d1dbe8;
-                    margin: 0px 4px;
-                    width: 38px;
-                    height: 38px;
-        
-                    &:hover {
-                        background-color: #daebfa;
-                        border: 1px solid #daebfa;
-                    }
-        
-                    &.toggled {
-                        background: #2a3a4b;
-                        border: 1px solid #5e6d7a;
-    
-                        svg {
-                            fill: #fff;
-                        }
-        
-                        &:hover {
-                            background-color: #5e6d7a;
-                        }
-                    }
-        
-                    &.disabled, .disabled & {
-                        cursor: initial;
-                        color: #fff;
-                        background-color: #a4b8d1;
-                    }
-    
-                    svg {
-                        fill: #5e6d7a;
-                    }
-                }
-
-                &:nth-child(2) {
-                    .toolbox-icon {
-                        background-color: $hangupColor;
-                        border: 1px solid $hangupColor;
-                        width: 40px;
-                        height: 40px;
-                
-                        &:hover {
-                            background-color: $hangupColor;
-                        }
-
-                        svg {
-                            fill: #fff;
-                        }
-                    }
-                }
-            }
+    @media (hover: hover) and (pointer: fine) {
+        &.unclickable:hover {
+            background: inherit;
         }
+    }
+}
 
-        .button-group-right {
-            justify-content: flex-end;
+.beta-tag {
+    background: #36383C;
+    border-radius: 3px;
+    color: #fff;
+    font-size: 12px;
+    margin-left: 8px;
+    padding: 0 4px;
+    text-transform: uppercase;
+}
+
+.overflow-menu-item-icon {
+    margin-right: 16px;
+
+    i {
+        display: inline;
+        font-size: 24px;
+    }
+
+    @media (hover: hover) and (pointer: fine) {
+        i:hover {
+            background-color: initial;
         }
+    }
 
-        .overflow-menu {
-            font-size: 1.2em;
-            list-style-type: none;
-            background-color: $overflowMenuBG;
-            /**
-             * Undo atlaskit padding by reducing margins.
-             */
-            margin: -16px -24px;
-            padding: 4px 0;
+    img {
+        max-width: 24px;
+        max-height: 24px;
+    }
 
-            .overflow-menu-item {
-                align-items: center;
-                color: $overflowMenuItemColor;
-                cursor: pointer;
-                display: flex;
-                font-size: 14px;
-                height: 22px;
-                padding: 5px 12px;
+    svg {
+        fill: #fff;
+        height: 20px;
+        width: 20px;
+    }
+}
 
-                div {
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-                }
 
-                &:hover {
-                    background-color: $overflowMenuItemHoverBG;
-                    color: $overflowMenuItemHoverColor;
-                }
+.overflow-menu-hr {
+    border-top: 1px solid #4C4D50;
+    border-bottom: 0;
+    margin: 8px 0;
+}
 
-                &.unclickable {
-                    cursor: default;
-                }
-                &.unclickable:hover {
-                    background: inherit;
-                }
-                &.disabled {
-                    cursor: initial;
-                    color: #3b475c;
-                }
-            }
+.toolbox-icon {
+    display: flex;
+    border-radius: 3px;
+    flex-direction: column;
+    font-size: 24px;
+    height: $newToolbarSize;
+    justify-content: center;
+    width: $newToolbarSize;
 
-            .beta-tag {
-                background: $overflowMenuItemColor;
-                border-radius: 2px;
-                color: $overflowMenuBG;
-                font-size: 11px;
-                font-weight: bold;
-                margin-left: 8px;
-                padding: 0 6px;
-            }
-
-            .overflow-menu-item-icon {
-                margin-right: 10px;
-
-                i {
-                    display: inline;
-                    font-size: 24px;
-                }
-
-                i:hover {
-                    background-color: initial;
-                }
-
-                img {
-                    max-width: 24px;
-                    max-height: 24px;
-                }
-
-                svg {
-                    fill: #B8C7E0 !important;
-                }
-            }
-
-            .profile-text {
-                max-width: 150px;
-                text-overflow: ellipsis;
-                overflow: hidden;
-                white-space: nowrap;
-            }
+    @media (hover: hover) and (pointer: fine) {
+        &:hover {
+            background: $newToolbarButtonHoverColor;
         }
+    }
 
-        .toolbox-button {
-            color: $toolbarButtonColor;
-            cursor: pointer;
-            display: inline-block;
-            line-height: $newToolbarSize;
-            margin: 0 8px;
-            text-align: center;
+    &.toggled {
+        background: $newToolbarButtonToggleColor;
+    }
+
+    &.disabled {
+        cursor: initial !important;
+        background-color: #36383c !important;
+
+        svg {
+            fill: #929292 !important;
         }
+    }
+}
 
-        .toolbar-button-with-badge {
-            position: relative;
+.hangup-button {
+    background-color: $hangupColor;
 
-            .badge-round {
-                bottom: -5px;
-                font-size: 12px;
-                line-height: 20px;
-                min-width: 20px;
-                pointer-events: none;
-                position: absolute;
-                right: -5px;
-            }
+    @media (hover: hover) and (pointer: fine) {
+        &:hover {
+            background-color: $hangupHoverColor;
         }
+    }
 
-        .toolbox-button-wth-dialog {
-            display: inline-block;
-        }
-
-        .toolbox-icon {
-            display: flex;
-            border-radius: 5px;
-            flex-direction: column;
-            font-size: 24px;
-            height: $newToolbarSize;
-            justify-content: center;
-            width: $newToolbarSize;
-
-            &:hover, &.toggled {
-                background: $newToolbarButtonHoverColor;
-            }
-    
-            &.disabled {
-                cursor: initial !important;
-                background-color: #a4b8d1 !important;
-
-                svg {
-                    fill: #fff !important;
-                }
-            }
-        }
+    svg {
+        fill: #fff;
     }
 }
 
@@ -289,3 +277,35 @@
 
     @include transition(all .3s ease-out);
 }
+
+/**
+ * Audio and video buttons do not have toggled state.
+ */
+.audio-preview,
+.video-preview {
+    .toolbox-icon.toggled {
+        background: none;
+
+        &:hover {
+            background: $newToolbarButtonHoverColor;
+        }
+    }
+
+}
+
+/**
+ * On small mobile devices make the toolbar full width.
+ */
+.toolbox-content-mobile {
+    @media (max-width: 500px) {
+        margin-bottom: 0;
+
+        .toolbox-content-items {
+            border-radius: 0;
+            display: flex;
+            justify-content: space-evenly;
+            padding: 6px 0;
+            width: 100%;
+        }
+    }
+}

css/_transcription-subtitles.scss

@@ -12,7 +12,7 @@
     1px 0px 1px rgba(0,0,0,0.3),
     0px 0px 1px rgba(0,0,0,0.3);
     transform: translateX(-50%);
-    z-index: $filmstripVideosZ + 1;
+    z-index: $subtitlesZ;
 
     span {
         background: black;

css/_variables.scss

@@ -4,7 +4,8 @@
  * Style variables
  */
 $baseFontFamily: -apple-system, BlinkMacSystemFont, 'open_sanslight', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-$hangupColor: #bf2117;
+$hangupColor:#DD3849;
+$hangupHoverColor: #F25363;
 $hangupFontSize: 2em;
 
 /**
@@ -38,19 +39,19 @@ $presence-idle: rgb(172, 172, 172);
  * Toolbar
  */
 $newToolbarBackgroundColor: rgba(22, 38, 55, 0.8);
-$newToolbarButtonHoverColor: rgba(255, 255, 255, 0.15);
-$newToolbarButtonToggleColor: rgba(255, 255, 255, 0.2);
+$newToolbarButtonHoverColor: rgba(255, 255, 255, 0.2);
+$newToolbarButtonToggleColor: rgba(255, 255, 255, 0.15);
 $AOTToolbarButtonHoverColor: rgba(14, 20, 35, 0.6);
 $AOTToolbarButtonToggleColor: rgba(14, 20, 35, 1);
+$menuBG:#242528;
 $newToolbarFontSize: 24px;
 $newToolbarHangupFontSize: 32px;
-$newToolbarSize: 40px;
+$newToolbarSize: 48px;
 $newToolbarSizeWithPadding: calc(#{$newToolbarSize} + 24px);
 $toolbarTitleFontSize: 19px;
-$overflowMenuBG: initial;
-$overflowMenuItemHoverBG: #313D52;
-$overflowMenuItemHoverColor: #B8C7E0;
-$overflowMenuItemColor: #B8C7E0;
+$overflowMenuItemColor: #fff;
+$overflowMenuItemBackground: #36383C;
+
 
 /**
  * Video layout
@@ -114,19 +115,21 @@ $zindex1: 1;
 $zindex2: 2;
 $zindex3: 3;
 $toolbarBackgroundZ: 4;
-$filmstripVideosZ: 5;
+$labelsZ: 5;
+$filmstripVideosZ: 6;
+$subtitlesZ: 7;
+$popoverZ: 8;
 $zindex10: 10;
 $reloadZ: 20;
 $poweredByZ: 100;
 $ringingZ: 300;
-$sideToolbarContainerZ: 300;
-$toolbarZ: 350;
+$sideToolbarContainerZ: 200;
+$toolbarZ: 250;
 $drawerZ: 351;
 $tooltipsZ: 401;
 $dropdownMaskZ: 900;
 $dropdownZ: 901;
 $centeredVideoLabelZ: 1010;
-$popoverZ: 1015;
 $overlayZ: 1016;
 
 

css/_video-preview.scss

@@ -1,18 +1,21 @@
 .video-preview {
     background: none;
-    max-height: 290px;
+    display: inline-block;
+    max-height: 344px;
 
     &-container {
+        background: $menuBG;
+        border-radius: 3px;
         overflow: auto;
-        padding: 16px;
+        padding: 8px;
     }
 
     &-entry {
         cursor: pointer;
-        height: 135px;
-        margin-bottom: 16px;
+        height: 168px;
+        margin-bottom: 8px;
         position: relative;
-        width: 240px;
+        width: 284px;
 
         &:last-child {
             margin-bottom: 0;
@@ -20,13 +23,15 @@
 
         &--selected {
             border: 3px solid #31B76A;
+            border-radius: 3px;
             cursor: default;
-            height: 129px;
-            width: 234px;
+            height: 162px;
+            width: 278px;
         }
     }
 
     &-video {
+        border-radius: 3px;
         height: 100%;
         object-fit: cover;
         width: 100%;
@@ -50,21 +55,28 @@
     }
 
     &-label {
+        bottom: 8px;
         color: #fff;
-        font-size: 13px;
-        line-height: 20px;
-        overflow: hidden;
-        padding: 8px;
         position: absolute;
-        text-align: center;
-        text-overflow: ellipsis;
-        width: 220px;
+        width: 100%;
         z-index: 2;
-    }
 
-    // Override @atlaskit/InlineDialog container which is made with styled components
-    & > div > div:nth-child(2) > div > div {
-        outline: none;
-        padding: 0;
+        &-container {
+            margin: 0 16px;
+        }
+
+        &-text {
+            background-color: #131519;
+            border-radius: 3px;
+            padding: 2px 8px;
+            font-size: 13px;
+            line-height: 20px;
+            margin: 0 auto;
+            max-width: calc(100% - 16px);
+            overflow: hidden;
+            text-overflow: ellipsis;
+            width: fit-content;
+            white-space: nowrap;
+        }
     }
 }

css/_videolayout_default.scss

@@ -182,10 +182,12 @@
         z-index: $zindex2;
     }
 
-    &.shift-right {
-        &#largeVideoContainer {
-            margin-left: $sidebarWidth;
-            width: calc(100% - #{$sidebarWidth});
+    @media (min-width: 581px) {
+        &.shift-right {
+            &#largeVideoContainer {
+                margin-left: $sidebarWidth;
+                width: calc(100% - #{$sidebarWidth});
+            }
         }
     }
 }
@@ -478,14 +480,6 @@
     z-index: $reloadZ; /*The reload button should appear on top of the header!*/
 }
 
-.audiolevel {
-    display: inline-block;
-    position: absolute;
-    z-index: $zindex0;
-    border-radius:1px;
-    pointer-events: none;
-}
-
 #dominantSpeaker {
     visibility: hidden;
     width: 300px;

css/_welcome_page.scss

@@ -208,6 +208,11 @@ body.welcome-page {
             cursor: pointer;
             font-size: 32px;
         }
+
+        .toolbox-icon {
+            height: 24px;
+            width: 24px;
+        }
     }
 
     .welcome-watermark {

css/filmstrip/_horizontal_filmstrip.scss

@@ -6,7 +6,6 @@
 }
 
 .horizontal-filmstrip .filmstrip {
-    position: absolute;
     bottom: 0;
     right: 0;
     padding: 10px 5px;

css/filmstrip/_tile_view.scss

@@ -15,7 +15,7 @@
         box-sizing: border-box;
         display: flex;
         flex-direction: column;
-        height: 100vh;
+        height: 100%;
         width: 100vw;
     }
 
@@ -42,17 +42,18 @@
         height: 100%;
         justify-content: center;
         left: 0;
-        position: fixed;
+        position: absolute;
         top: 0;
         width: 100%;
-        z-index: $filmstripVideosZ;
 
-        &.shift-right {
-            margin-left: $sidebarWidth;
-            width: calc(100% - #{$sidebarWidth});
+        @media (min-width: 581px) {
+            &.shift-right {
+                margin-left: $sidebarWidth;
+                width: calc(100% - #{$sidebarWidth});
 
-            #filmstripRemoteVideos {
-                width: calc(100vw - #{$sidebarWidth});
+                #filmstripRemoteVideos {
+                    width: calc(100vw - #{$sidebarWidth});
+                }
             }
         }
     }
@@ -86,6 +87,7 @@
         box-sizing: border-box;
         display: flex;
         flex-wrap: wrap;
+        flex-shrink: 0;
         margin-top: auto;
         margin-bottom: auto;
         justify-content: center;
@@ -100,6 +102,15 @@
         video {
             object-fit: contain;
         }
+
+        /**
+         * Max-width corresponding to the ASPECT_RATIO_BREAKPOINT from features/filmstrip/constants.
+         */
+        @media only screen and (max-width: 500px) {
+            video {
+                object-fit: cover;
+            }
+        }
     }
 
     .has-overflow#filmstripRemoteVideosContainer {

css/filmstrip/_tile_view_overrides.scss

@@ -22,10 +22,6 @@
         display: none;
     }
 
-    #remoteConnectionMessage {
-        z-index: $filmstripVideosZ + 1;
-    }
-
     /**
      * The follow styling uses !important to override inline styles set with
      * javascript.

css/main.scss

@@ -43,6 +43,7 @@ $flagsImagePath: "../images/";
 @import 'modals/settings/settings';
 @import 'modals/speaker_stats/speaker_stats';
 @import 'modals/video-quality/video-quality';
+@import 'modals/virtual-background/virtual-background';
 @import 'modals/local-recording/local-recording';
 @import 'videolayout_default';
 @import 'notice';

css/modals/device-selection/_device-selection.scss

@@ -39,7 +39,7 @@
 
         .device-selector-trigger-text {
             overflow: hidden;
-            margin-left: 8px;
+            text-align: center;
             text-overflow: ellipsis;
             white-space: nowrap;
             width: 100%;

css/modals/embed-meeting/_embed-meeting.scss

@@ -2,22 +2,6 @@
     &-dialog {
         display: flex;
         flex-direction: column;
-
-        &-header {
-            display: flex;
-            justify-content: space-between;
-            margin: 16px 16px 24px;
-            width: calc(100% - 32px);
-            color: #fff;
-            font-weight: 600;
-            font-size: 24px;
-            line-height: 32px;
-
-            & > div > svg {
-                cursor: pointer;
-                fill: #A4B8D1;
-            }
-        }
     }
 
     &-copy {

css/modals/invite/_invite_more.scss

@@ -7,10 +7,6 @@
         text-align: center;
         z-index: $zindex2;
         background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
-
-        &.elevated {
-            z-index: $filmstripVideosZ + 1;
-        }
     }
 
     &-header {
@@ -32,8 +28,10 @@
         line-height: 24px;
         cursor: pointer;
 
-        &:hover {
-            background: #278ADF;
+        @media (hover: hover) and (pointer: fine) {
+            &:hover {
+                background: #278ADF;
+            }
         }
 
         &-text {
@@ -47,22 +45,6 @@
         font-size: 15px;
         line-height: 24px;
 
-        &.header {
-            display: flex;
-            justify-content: space-between;
-            margin: 16px 16px 24px;
-            width: calc(100% - 32px);
-            color: #fff;
-            font-weight: 600;
-            font-size: 24px;
-            line-height: 32px;
-
-            & > div > svg {
-                cursor: pointer;
-                fill: #A4B8D1;
-            }
-        }
-
         &.separator {
             margin: 24px 0 24px -20px;
             padding: 0 20px;
@@ -112,11 +94,11 @@
                     border-radius: 4px;
                     cursor: pointer;
                 }
-    
+
                 &:hover > div:hover {
                     background-color: rgba(255, 255, 255, 0.2);
                 }
-    
+
                 & > :not(:last-child) {
                     margin-right: 16px;
                 }

css/modals/settings/_settings.scss

@@ -23,6 +23,10 @@
         padding: 20px 0px 4px 0px;
     }
 
+    input[type="checkbox"] + svg + span {
+        color: #9FB0CC;
+    }
+
     .calendar-tab,
     .more-tab,
     .profile-edit {

css/modals/video-quality/_video-quality.scss

@@ -111,7 +111,3 @@
         display: none;
     }
 }
-
-#videoResolutionLabel {
-    z-index: $zindex3 + 1;
-}

css/modals/virtual-background/_virtual-background.scss

@@ -0,0 +1,44 @@
+.virtual-background-dialog{
+  display: inline-flex;
+  cursor: pointer;
+  .thumbnail{
+    object-fit: cover;
+    padding: 5px;
+    height: 40px;
+    width: 40px;
+  }
+  .thumbnail-selected{
+    object-fit: cover;
+    padding: 5px;
+    height: 40px;
+    width: 40px;
+    border: 2px solid #a4b8d1;
+  }
+  .blur-selected{
+    border: 2px solid #a4b8d1;
+  }
+  .virtual-background-none{
+    font-weight: bold;
+    padding: 5px;
+    height: 35px;
+    width: 35px;
+    border-radius: 10px;
+    border: 1px solid #a4b8d1;
+    text-align: center;
+    vertical-align: middle;
+    line-height: 35px;
+    margin-right: 5px;
+  }
+  .none-selected{
+    font-weight: bold;
+    padding: 5px;
+    height: 35px;
+    width: 35px;
+    border-radius: 10px;
+    border: 2px solid #a4b8d1;
+    text-align: center;
+    vertical-align: middle;
+    line-height: 35px;
+    margin-right: 5px;
+  }
+}

css/overlay/_overlay.scss

@@ -33,4 +33,12 @@
         bottom: 24px;
         width: 100%;
     }
+
+    &__spinner-container {
+        display: flex;
+        width: 100%;
+        height: 100%;
+        justify-content: center;
+        align-items: center;
+    }
 }

debian/control

@@ -33,7 +33,7 @@ Description: Configuration for web serving of Jitsi Meet
 
 Package: jitsi-meet-prosody
 Architecture: all
-Depends: openssl, prosody | prosody-trunk | prosody-0.11
+Depends: openssl, prosody | prosody-trunk | prosody-0.11, lua-sec
 Replaces: jitsi-meet-tokens
 Description: Prosody configuration for Jitsi Meet
  Jitsi Meet is a WebRTC JavaScript application that uses Jitsi

debian/jitsi-meet-prosody.postinst

@@ -35,7 +35,7 @@ case "$1" in
             db_input critical jitsi-videobridge/jvb-hostname || true
             db_go
         fi
-        JVB_HOSTNAME="$RET"
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
 
         db_get jitsi-videobridge/jvbsecret
         if [ -z "$RET" ] ; then
@@ -60,20 +60,11 @@ case "$1" in
             JICOFO_AUTH_PASSWORD="$RET"
         fi
 
-        db_get jicofo/jicofosecret
-        if [ -z "$RET" ] ; then
-            # if secret is missing generate it, and store it
-            JICOFO_SECRET=`generateRandomPassword`
-            db_set jicofo/jicofosecret "$JICOFO_SECRET"
-        else
-            JICOFO_SECRET="$RET"
-        fi
-
         JICOFO_AUTH_DOMAIN="auth.$JVB_HOSTNAME"
 
         # detect dpkg-reconfigure, just delete old links
         db_get jitsi-meet-prosody/jvb-hostname
-        JVB_HOSTNAME_OLD=$RET
+        JVB_HOSTNAME_OLD=$(echo "$RET" | xargs echo -n)
         if [ -n "$RET" ] && [ ! "$JVB_HOSTNAME_OLD" = "$JVB_HOSTNAME" ] ; then
             rm -f /etc/prosody/conf.d/$JVB_HOSTNAME_OLD.cfg.lua
             rm -f /etc/prosody/certs/$JVB_HOSTNAME_OLD.key
@@ -107,7 +98,6 @@ case "$1" in
             mkdir -p /etc/prosody/conf.d/
             cp /usr/share/jitsi-meet-prosody/prosody.cfg.lua-jvb.example $PROSODY_HOST_CONFIG
             sed -i "s/jitmeet.example.com/$JVB_HOSTNAME/g" $PROSODY_HOST_CONFIG
-            sed -i "s/focusSecret/$JICOFO_SECRET/g" $PROSODY_HOST_CONFIG
             sed -i "s/focusUser/$JICOFO_AUTH_USER/g" $PROSODY_HOST_CONFIG
             sed -i "s/__turnSecret__/$TURN_SECRET/g" $PROSODY_HOST_CONFIG
             if [ ! -f /etc/prosody/conf.d/$JVB_HOSTNAME.cfg.lua ]; then
@@ -156,7 +146,7 @@ case "$1" in
 
         # Old versions of jitsi-meet-prosody come with the extra plugin path commented out (https://github.com/jitsi/jitsi-meet/commit/e11d4d3101e5228bf956a69a9e8da73d0aee7949)
         # Make sure it is uncommented, as it contains required modules.
-        if grep -q '--plugin_paths = { "/usr/share/jitsi-meet/prosody-plugins/" }' ;then
+        if grep -q -- '--plugin_paths = { "/usr/share/jitsi-meet/prosody-plugins/" }' $PROSODY_HOST_CONFIG ;then
             sed -i 's#--plugin_paths = { "/usr/share/jitsi-meet/prosody-plugins/" }#plugin_paths = { "/usr/share/jitsi-meet/prosody-plugins/" }#g' $PROSODY_HOST_CONFIG
             PROSODY_CONFIG_PRESENT="false"
         fi

debian/jitsi-meet-prosody.postrm

@@ -31,7 +31,7 @@ case "$1" in
 
     purge)
         db_get jitsi-meet-prosody/jvb-hostname
-        JVB_HOSTNAME=$RET
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
         if [ -n "$RET" ]; then
             rm -f /etc/prosody/conf.avail/$JVB_HOSTNAME.cfg.lua
             rm -f /etc/prosody/conf.d/$JVB_HOSTNAME.cfg.lua

debian/jitsi-meet-prosody.templates

@@ -24,11 +24,6 @@ Type: password
 _Description: Jicofo user password:
  The secret used to connect to xmpp server as jicofo user.
 
-Template: jicofo/jicofosecret
-Type: password
-_Description: Jicofo Component secret:
- The secret used to connect to xmpp server as component
-
 Template: jitsi-meet-prosody/turn-secret
 Type: string
 _Description: The turn server secret

debian/jitsi-meet-tokens.postinst

@@ -25,7 +25,7 @@ case "$1" in
         . /usr/share/debconf/confmodule
 
         db_get jitsi-meet-prosody/jvb-hostname
-        JVB_HOSTNAME="$RET"
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
 
         db_get jitsi-meet-tokens/appid
         if [ "$RET" = "false" ] ; then

debian/jitsi-meet-turnserver.postinst

@@ -30,7 +30,7 @@ case "$1" in
             db_input critical jitsi-videobridge/jvb-hostname || true
             db_go
         fi
-        JVB_HOSTNAME="$RET"
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
 
         TURN_CONFIG="/etc/turnserver.conf"
         NGINX_CONFIG="/etc/nginx/sites-available/$JVB_HOSTNAME.conf"
@@ -44,7 +44,7 @@ case "$1" in
 
         # detect dpkg-reconfigure, just delete old links
         db_get jitsi-meet-turnserver/jvb-hostname
-        JVB_HOSTNAME_OLD=$RET
+        JVB_HOSTNAME_OLD=$(echo "$RET" | xargs echo -n)
         if [ -n "$RET" ] && [ ! "$JVB_HOSTNAME_OLD" = "$JVB_HOSTNAME" ] ; then
             if [[ -f $TURN_CONFIG ]] && grep -q "jitsi-meet coturn config" "$TURN_CONFIG" ; then
                 rm -f $TURN_CONFIG

debian/jitsi-meet-web-config.postinst

@@ -32,12 +32,12 @@ case "$1" in
             db_go
             db_get jitsi-videobridge/jvb-hostname
         fi
-        JVB_HOSTNAME="$RET"
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
 
         # detect dpkg-reconfigure
         RECONFIGURING="false"
         db_get jitsi-meet/jvb-hostname
-        JVB_HOSTNAME_OLD=$RET
+        JVB_HOSTNAME_OLD=$(echo "$RET" | xargs echo -n)
         if [ -n "$RET" ] && [ ! "$JVB_HOSTNAME_OLD" = "$JVB_HOSTNAME" ] ; then
             RECONFIGURING="true"
             rm -f /etc/jitsi/meet/$JVB_HOSTNAME_OLD-config.js
@@ -45,8 +45,9 @@ case "$1" in
 
         JVB_SERVE="false"
         # this detect only old installations
+        RET=""
         db_get jitsi-meet/jvb-serve || true
-        if [ -n "$RET" ] && [ "$RET" = "true" ] ; then
+        if [ "$RET" = "true" ] ; then
             JVB_SERVE="true"
         fi
 
@@ -68,14 +69,22 @@ case "$1" in
         if [ "$APACHE_INSTALL_CHECK" = "installed" ] || [ "$APACHE_INSTALL_CHECK" = "unpacked" ] ; then
             FORCE_APACHE="true"
         fi
+        # In case user enforces apache and if apache is available, unset nginx.
+        RET=""
+        db_get jitsi-meet/enforce_apache || RET="false"
+        if [ "$RET" = "true" ] && [ "$FORCE_APACHE" = "true" ]; then
+            FORCE_NGINX="false"
+        fi
 
         UPLOADED_CERT_CHOICE="I want to use my own certificate"
         # if first time config ask for certs, or if we are reconfiguring
         if [ -z "$JVB_HOSTNAME_OLD" ] || [ "$RECONFIGURING" = "true" ] ; then
+            RET=""
             db_get jitsi-meet/cert-choice
             CERT_CHOICE="$RET"
 
             if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
+                RET=""
                 db_get jitsi-meet/cert-path-key
                 if [ -z "$RET" ] ; then
                     db_set jitsi-meet/cert-path-key "/etc/ssl/$JVB_HOSTNAME.key"
@@ -84,6 +93,7 @@ case "$1" in
                     db_get jitsi-meet/cert-path-key
                 fi
                 CERT_KEY="$RET"
+                RET=""
                 db_get jitsi-meet/cert-path-crt
                 if [ -z "$RET" ] ; then
                     db_set jitsi-meet/cert-path-crt "/etc/ssl/$JVB_HOSTNAME.crt"
@@ -146,12 +156,15 @@ case "$1" in
                 # Removing this value will force nginx or apache to be locally configured
                 JVB_HOSTNAME_OLD=""
 
+                RET=""
                 db_get jitsi-meet/cert-choice
                 CERT_CHOICE="$RET"
                 # Fix certs on upgrade from jetty
                 if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
+                    RET=""
                     db_get jitsi-meet/cert-path-key
                     CERT_KEY="$RET"
+                    RET=""
                     db_get jitsi-meet/cert-path-crt
                     CERT_CRT="$RET"
                 else
@@ -205,7 +218,7 @@ case "$1" in
             # apache2 config
             if [ ! -f /etc/apache2/sites-available/$JVB_HOSTNAME.conf ] ; then
                 # when creating new config, make sure all needed modules are enabled
-                a2enmod rewrite ssl headers proxy_http include
+                a2enmod rewrite ssl headers proxy_http proxy_wstunnel include
                 cp /usr/share/jitsi-meet-web-config/jitsi-meet.example-apache /etc/apache2/sites-available/$JVB_HOSTNAME.conf
                 a2ensite $JVB_HOSTNAME.conf
                 sed -i "s/jitsi-meet.example.com/$JVB_HOSTNAME/g" /etc/apache2/sites-available/$JVB_HOSTNAME.conf

debian/jitsi-meet-web-config.postrm

@@ -33,7 +33,7 @@ case "$1" in
     ;;
     purge)
         db_get jitsi-meet/jvb-hostname
-        JVB_HOSTNAME=$RET
+        JVB_HOSTNAME=$(echo "$RET" | xargs echo -n)
         if [ -n "$RET" ]; then
             rm -f /etc/jitsi/meet/$JVB_HOSTNAME-config.js
             rm -f /etc/nginx/sites-available/$JVB_HOSTNAME.conf

debian/jitsi-meet-web.install

@@ -15,3 +15,5 @@ resources/robots.txt	/usr/share/jitsi-meet/
 resources/*.sh			/usr/share/jitsi-meet/scripts/
 pwa-worker.js			/usr/share/jitsi-meet/
 manifest.json			/usr/share/jitsi-meet/
+resources/load-test/*.html	/usr/share/jitsi-meet/load-test/
+resources/load-test/libs	/usr/share/jitsi-meet/load-test/

doc/debian/jitsi-meet-prosody/prosody.cfg.lua-jvb.example

@@ -3,12 +3,11 @@ plugin_paths = { "/usr/share/jitsi-meet/prosody-plugins/" }
 -- domain mapper options, must at least have domain base set to use the mapper
 muc_mapper_domain_base = "jitmeet.example.com";
 
-turncredentials_secret = "__turnSecret__";
-
-turncredentials = {
-    { type = "stun", host = "jitmeet.example.com", port = "3478" },
-    { type = "turn", host = "jitmeet.example.com", port = "3478", transport = "udp" },
-    { type = "turns", host = "jitmeet.example.com", port = "5349", transport = "tcp" }
+external_service_secret = "__turnSecret__";
+external_services = {
+     { type = "stun", host = "jitmeet.example.com", port = 3478 },
+     { type = "turn", host = "jitmeet.example.com", port = 3478, transport = "udp", secret = true, ttl = 86400, algorithm = "turn" },
+     { type = "turns", host = "jitmeet.example.com", port = 5349, transport = "tcp", secret = true, ttl = 86400, algorithm = "turn" }
 };
 
 cross_domain_bosh = false;
@@ -44,7 +43,7 @@ VirtualHost "jitmeet.example.com"
         "pubsub";
         "ping"; -- Enable mod_ping
         "speakerstats";
-        "turncredentials";
+        "external_services";
         "conference_duration";
         "muc_lobby_rooms";
     }
@@ -75,7 +74,7 @@ Component "internal.auth.jitmeet.example.com" "muc"
     muc_room_default_public_jids = true
 
 VirtualHost "auth.jitmeet.example.com"
-    authentication = "internal_plain"
+    authentication = "internal_hashed"
 
 -- Proxy to jicofo's user JID, so that it doesn't have to register as a component.
 Component "focus.jitmeet.example.com" "client_proxy"

doc/debian/jitsi-meet/jitsi-meet.example

@@ -1,5 +1,9 @@
 server_names_hash_bucket_size 64;
 
+types {
+# nginx's default mime.types doesn't include a mapping for wasm
+    application/wasm     wasm;
+}
 server {
     listen 80;
     listen [::]:80;
@@ -96,6 +100,15 @@ server {
         tcp_nodelay on;
     }
 
+    # load test minimal client, uncomment when used
+    #location ~ ^/_load-test/([^/?&:'"]+)$ {
+    #    rewrite ^/_load-test/(.*)$ /load-test/index.html break;
+    #}
+    #location ~ ^/_load-test/libs/(.*)$ {
+    #    add_header 'Access-Control-Allow-Origin' '*';
+    #    alias /usr/share/jitsi-meet/load-test/libs/$1;
+    #}
+
     location ~ ^/([^/?&:'"]+)$ {
         try_files $uri @root_path;
     }

doc/debian/jitsi-meet/jitsi-meet.example-apache

@@ -2,9 +2,6 @@
 <VirtualHost *:80>
     ServerName jitsi-meet.example.com
     Redirect permanent / https://jitsi-meet.example.com/
-    RewriteEngine On
-    RewriteCond %{HTTPS} off
-    RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
 </VirtualHost>
 
 <VirtualHost *:443>
@@ -42,8 +39,12 @@
     </Location>
 
     ProxyPreserveHost on
-    ProxyPass /http-bind http://localhost:5280/http-bind/
-    ProxyPassReverse /http-bind http://localhost:5280/http-bind/
+    ProxyPass /http-bind http://localhost:5280/http-bind
+    ProxyPassReverse /http-bind http://localhost:5280/http-bind
+    ProxyPass /xmpp-websocket ws://localhost:5280/xmpp-websocket
+    ProxyPassReverse /xmpp-websocket ws://localhost:5280/xmpp-websocket
+    ProxyPass /colibri-ws/default-id ws://localhost:9090/colibri-ws/default-id
+    ProxyPassReverse /colibri-ws/default-id ws://localhost:9090/colibri-ws/default-id
 
     RewriteEngine on
     RewriteRule ^/([a-zA-Z0-9]+)$ /index.html

doc/example-config-files/multidomain/prosody.cfg.multidomain.example

@@ -142,7 +142,6 @@ pidfile = "/var/run/prosody/prosody.pid"
 -- server please see http://prosody.im/doc/modules/mod_auth_internal_hashed
 -- for information about using the hashed backend.
 
--- authentication = "internal_plain"
 authentication = "internal_hashed"
 
 -- Select the storage backend to use. By default Prosody uses flat files
@@ -190,7 +189,7 @@ VirtualHost "auth.jitsi.example.com"
         key = "/var/lib/prosody/auth.jitsi.example.com.key";
         certificate = "/var/lib/prosody/auth.jitsi.example.com.crt";
     }
-    authentication = "internal_plain"
+    authentication = "internal_hashed"
 
 ------ Components ------
 -- You can specify components to add hosts that provide special services,

doc/example-config-files/prosody.cfg.lua.example

@@ -139,7 +139,6 @@ pidfile = "/var/run/prosody/prosody.pid"
 -- server please see http://prosody.im/doc/modules/mod_auth_internal_hashed
 -- for information about using the hashed backend.
 
--- authentication = "internal_plain"
 authentication = "internal_hashed"
 
 -- Select the storage backend to use. By default Prosody uses flat files
@@ -187,7 +186,7 @@ VirtualHost "auth.jitsi.example.com"
         key = "/var/lib/prosody/auth.jitsi.example.com.key";
         certificate = "/var/lib/prosody/auth.jitsi.example.com.crt";
     }
-    authentication = "internal_plain"
+    authentication = "internal_hashed"
 
 ------ Components ------
 -- You can specify components to add hosts that provide special services,

doc/example-config-files/scalable/meet.example.com.cfg.lua.scalable.example

@@ -67,7 +67,7 @@ VirtualHost "auth.meet.example.com"
         key = "/etc/prosody/certs/auth.meet.example.com.key";
         certificate = "/etc/prosody/certs/auth.meet.example.com.crt";
     }
-    authentication = "internal_plain"
+    authentication = "internal_hashed"
 
 Component "focus.meet.example.com"
     component_secret = "jicofo_secret_test"
@@ -83,5 +83,5 @@ VirtualHost "recorder.meet.example.com"
     modules_enabled = {
         "ping";
     }
-    authentication = "internal_plain"
+    authentication = "internal_hashed"
     c2s_require_encryption = false

index.html

@@ -3,7 +3,7 @@
     <!--#include virtual="head.html" -->
     <meta charset="utf-8">
     <meta http-equiv="content-type" content="text/html;charset=utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
     <meta name="theme-color" content="#2A3A4B">
     <!--#include virtual="base.html" -->
 

interface_config.js

@@ -168,6 +168,13 @@ var interfaceConfig = {
     REMOTE_THUMBNAIL_RATIO: 1, // 1:1
 
     SETTINGS_SECTIONS: [ 'devices', 'language', 'moderator', 'profile', 'calendar' ],
+
+    /**
+     * Specify which sharing features should be displayed. If the value is not set
+     * all sharing features will be shown. You can set [] to disable all.
+     */
+    // SHARING_FEATURES: ['email', 'url', 'dial-in', 'embed'],
+
     SHOW_BRAND_WATERMARK: false,
 
     /**
@@ -191,23 +198,16 @@ var interfaceConfig = {
     TOOLBAR_ALWAYS_VISIBLE: false,
 
     /**
-     * The name of the toolbar buttons to display in the toolbar, including the
-     * "More actions" menu. If present, the button will display. Exceptions are
-     * "livestreaming" and "recording" which also require being a moderator and
-     * some values in config.js to be enabled. Also, the "profile" button will
-     * not display for users with a JWT.
-     * Notes:
-     * - it's impossible to choose which buttons go in the "More actions" menu
-     * - it's impossible to control the placement of buttons
-     * - 'desktop' controls the "Share your screen" button
+     * DEPRECATED!
+     * This config was moved to config.js as `toolbarButtons`.
      */
-    TOOLBAR_BUTTONS: [
-        'microphone', 'camera', 'closedcaptions', 'desktop', 'embedmeeting', 'fullscreen',
-        'fodeviceselection', 'hangup', 'profile', 'chat', 'recording',
-        'livestreaming', 'etherpad', 'sharedvideo', 'settings', 'raisehand',
-        'videoquality', 'filmstrip', 'invite', 'feedback', 'stats', 'shortcuts',
-        'tileview', 'videobackgroundblur', 'download', 'help', 'mute-everyone', 'security'
-    ],
+    // TOOLBAR_BUTTONS: [
+    //     'microphone', 'camera', 'closedcaptions', 'desktop', 'embedmeeting', 'fullscreen',
+    //     'fodeviceselection', 'hangup', 'profile', 'chat', 'recording',
+    //     'livestreaming', 'etherpad', 'sharedvideo', 'settings', 'raisehand',
+    //     'videoquality', 'filmstrip', 'invite', 'feedback', 'stats', 'shortcuts',
+    //     'tileview', 'select-background', 'download', 'help', 'mute-everyone', 'mute-video-everyone', 'security'
+    // ],
 
     TOOLBAR_TIMEOUT: 4000,
 

ios/Podfile.lock

@@ -292,7 +292,7 @@ PODS:
     - React
   - react-native-splash-screen (3.2.0):
     - React
-  - react-native-webrtc (1.87.2):
+  - react-native-webrtc (1.87.3):
     - React-Core
   - react-native-webview (11.0.2):
     - React-Core
@@ -563,7 +563,7 @@ SPEC CHECKSUMS:
   react-native-keep-awake: eba3137546b10003361b37c761f6c429b59814ae
   react-native-netinfo: 8d8db463bcc5db66a8ac5c48a7d86beb3b92f61a
   react-native-splash-screen: 200d11d188e2e78cea3ad319964f6142b6384865
-  react-native-webrtc: e6fca8432542dd1c77afa6c59629f0176ed78ee6
+  react-native-webrtc: dc1208bdca2c4d091f7b57859e69332bff6f1986
   react-native-webview: b2542d6fd424bcc3e3b2ec5f854f0abb4ec86c87
   React-RCTActionSheet: bcbc311dc3b47bc8efb2737ff0940239a45789a9
   React-RCTAnimation: 65f61080ce632f6dea23d52e354ffac9948396c6
@@ -586,4 +586,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: 5be5132e41831a98362eeed760558227a4df89ae
 
-COCOAPODS: 1.10.0
+COCOAPODS: 1.10.1

ios/app/app.entitlements

@@ -8,6 +8,10 @@
 		<string>applinks:beta.meet.jit.si</string>
 		<string>applinks:meet.jit.si</string>
 	</array>
+	<key>com.apple.security.application-groups</key>
+	<array>
+		<string>group.org.jitsi.meet.appgroup</string>
+	</array>
 	<key>com.apple.developer.siri</key>
 	<true/>
 </dict>

ios/app/app.xcodeproj/project.pbxproj

@@ -23,6 +23,12 @@
 		13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; };
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
+		4E51B75E25E4115F0038575A /* DarwinNotificationCenter.m in Sources */ = {isa = PBXBuildFile; fileRef = 4E51B75D25E4115F0038575A /* DarwinNotificationCenter.m */; };
+		4EC49BB725BEDAC100E76218 /* ReplayKit.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 4EC49B8625BED71300E76218 /* ReplayKit.framework */; };
+		4EC49BBB25BEDAC100E76218 /* SampleHandler.m in Sources */ = {isa = PBXBuildFile; fileRef = 4EC49BBA25BEDAC100E76218 /* SampleHandler.m */; };
+		4EC49BBF25BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex in Embed App Extensions */ = {isa = PBXBuildFile; fileRef = 4EC49BB625BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex */; settings = {ATTRIBUTES = (RemoveHeadersOnCopy, ); }; };
+		4EC49BCB25BEDB6400E76218 /* SocketConnection.m in Sources */ = {isa = PBXBuildFile; fileRef = 4EC49BCA25BEDB6400E76218 /* SocketConnection.m */; };
+		4EC49BD125BF19CF00E76218 /* SampleUploader.m in Sources */ = {isa = PBXBuildFile; fileRef = 4EC49BD025BF19CF00E76218 /* SampleUploader.m */; };
 		55BEDABDA92D47D399A70A5E /* libPods-JitsiMeet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D878B07B3FBD6E305EAA6B27 /* libPods-JitsiMeet.a */; };
 		DE050389256E904600DEE3A5 /* WebRTC.xcframework in Frameworks */ = {isa = PBXBuildFile; fileRef = DE050388256E904600DEE3A5 /* WebRTC.xcframework */; };
 		DE05038A256E904600DEE3A5 /* WebRTC.xcframework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = DE050388256E904600DEE3A5 /* WebRTC.xcframework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
@@ -48,6 +54,13 @@
 			remoteGlobalIDString = 0BEA5C241F7B8F73000D0AB4;
 			remoteInfo = JitsiMeetCompanion;
 		};
+		4EC49BBD25BEDAC100E76218 /* PBXContainerItemProxy */ = {
+			isa = PBXContainerItemProxy;
+			containerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */;
+			proxyType = 1;
+			remoteGlobalIDString = 4EC49BB525BEDAC100E76218;
+			remoteInfo = "JitsiMeetBroadcast Extension";
+		};
 /* End PBXContainerItemProxy section */
 
 /* Begin PBXCopyFilesBuildPhase section */
@@ -85,6 +98,17 @@
 			name = "Embed Watch Content";
 			runOnlyForDeploymentPostprocessing = 0;
 		};
+		4EC49B9025BED71300E76218 /* Embed App Extensions */ = {
+			isa = PBXCopyFilesBuildPhase;
+			buildActionMask = 2147483647;
+			dstPath = "";
+			dstSubfolderSpec = 13;
+			files = (
+				4EC49BBF25BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex in Embed App Extensions */,
+			);
+			name = "Embed App Extensions";
+			runOnlyForDeploymentPostprocessing = 0;
+		};
 /* End PBXCopyFilesBuildPhase section */
 
 /* Begin PBXFileReference section */
@@ -115,6 +139,18 @@
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = main.m; sourceTree = "<group>"; };
 		4670A512A688E2DC34528282 /* Pods-jitsi-meet.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-jitsi-meet.debug.xcconfig"; path = "../Pods/Target Support Files/Pods-jitsi-meet/Pods-jitsi-meet.debug.xcconfig"; sourceTree = "<group>"; };
+		4E51B75C25E4115F0038575A /* DarwinNotificationCenter.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = DarwinNotificationCenter.h; sourceTree = "<group>"; };
+		4E51B75D25E4115F0038575A /* DarwinNotificationCenter.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = DarwinNotificationCenter.m; sourceTree = "<group>"; };
+		4EC49B8625BED71300E76218 /* ReplayKit.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = ReplayKit.framework; path = System/Library/Frameworks/ReplayKit.framework; sourceTree = SDKROOT; };
+		4EC49BB625BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex */ = {isa = PBXFileReference; explicitFileType = "wrapper.app-extension"; includeInIndex = 0; path = "JitsiMeetBroadcast Extension.appex"; sourceTree = BUILT_PRODUCTS_DIR; };
+		4EC49BB925BEDAC100E76218 /* SampleHandler.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = SampleHandler.h; sourceTree = "<group>"; };
+		4EC49BBA25BEDAC100E76218 /* SampleHandler.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = SampleHandler.m; sourceTree = "<group>"; };
+		4EC49BBC25BEDAC100E76218 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+		4EC49BC925BEDB6400E76218 /* SocketConnection.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = SocketConnection.h; sourceTree = "<group>"; };
+		4EC49BCA25BEDB6400E76218 /* SocketConnection.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = SocketConnection.m; sourceTree = "<group>"; };
+		4EC49BCF25BF19CF00E76218 /* SampleUploader.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = SampleUploader.h; sourceTree = "<group>"; };
+		4EC49BD025BF19CF00E76218 /* SampleUploader.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = SampleUploader.m; sourceTree = "<group>"; };
+		4EC49BDB25BF280A00E76218 /* extension.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = extension.entitlements; sourceTree = "<group>"; };
 		609CB2080B75F75A89923F3D /* Pods-JitsiMeet.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-JitsiMeet.debug.xcconfig"; path = "../Pods/Target Support Files/Pods-JitsiMeet/Pods-JitsiMeet.debug.xcconfig"; sourceTree = "<group>"; };
 		B3B083EB1D4955FF0069CEE7 /* app.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = app.entitlements; sourceTree = "<group>"; };
 		D878B07B3FBD6E305EAA6B27 /* libPods-JitsiMeet.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-JitsiMeet.a"; sourceTree = BUILT_PRODUCTS_DIR; };
@@ -153,6 +189,14 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
+		4EC49BB325BEDAC100E76218 /* Frameworks */ = {
+			isa = PBXFrameworksBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				4EC49BB725BEDAC100E76218 /* ReplayKit.framework in Frameworks */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
 /* End PBXFrameworksBuildPhase section */
 
 /* Begin PBXGroup section */
@@ -165,6 +209,7 @@
 				DEFDBBDB25656E3B00344B23 /* WebRTC.xcframework */,
 				0BD6B4361EF82A6B00D1F4CD /* WebRTC.framework */,
 				D878B07B3FBD6E305EAA6B27 /* libPods-JitsiMeet.a */,
+				4EC49B8625BED71300E76218 /* ReplayKit.framework */,
 			);
 			name = Frameworks;
 			sourceTree = "<group>";
@@ -216,6 +261,24 @@
 			path = src;
 			sourceTree = "<group>";
 		};
+		4EC49BB825BEDAC100E76218 /* JitsiMeetBroadcast Extension */ = {
+			isa = PBXGroup;
+			children = (
+				4EC49BDB25BF280A00E76218 /* extension.entitlements */,
+				4EC49BB925BEDAC100E76218 /* SampleHandler.h */,
+				4EC49BBA25BEDAC100E76218 /* SampleHandler.m */,
+				4EC49BC925BEDB6400E76218 /* SocketConnection.h */,
+				4EC49BCA25BEDB6400E76218 /* SocketConnection.m */,
+				4EC49BCF25BF19CF00E76218 /* SampleUploader.h */,
+				4EC49BD025BF19CF00E76218 /* SampleUploader.m */,
+				4EC49BBC25BEDAC100E76218 /* Info.plist */,
+				4E51B75C25E4115F0038575A /* DarwinNotificationCenter.h */,
+				4E51B75D25E4115F0038575A /* DarwinNotificationCenter.m */,
+			);
+			name = "JitsiMeetBroadcast Extension";
+			path = "broadcast-extension";
+			sourceTree = "<group>";
+		};
 		5E96ADD5E49F3B3822EF9A52 /* Pods */ = {
 			isa = PBXGroup;
 			children = (
@@ -236,6 +299,7 @@
 				13B07FAE1A68108700A75B9A /* src */,
 				5E96ADD5E49F3B3822EF9A52 /* Pods */,
 				0BEA5C261F7B8F73000D0AB4 /* Watch app */,
+				4EC49BB825BEDAC100E76218 /* JitsiMeetBroadcast Extension */,
 				0BEA5C351F7B8F73000D0AB4 /* WatchKit extension */,
 			);
 			indentWidth = 2;
@@ -248,6 +312,7 @@
 				13B07F961A680F5B00A75B9A /* jitsi-meet.app */,
 				0BEA5C251F7B8F73000D0AB4 /* JitsiMeetCompanion.app */,
 				0BEA5C311F7B8F73000D0AB4 /* JitsiMeetCompanion Extension.appex */,
+				4EC49BB625BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -305,17 +370,36 @@
 				DE11877A21EE09640078D059 /* Setup Google reverse URL handler */,
 				DE4F6D6E22005C0400DE699E /* Setup Dropbox */,
 				0BEA5C491F7B8F73000D0AB4 /* Embed Watch Content */,
+				4EC49B9025BED71300E76218 /* Embed App Extensions */,
 			);
 			buildRules = (
 			);
 			dependencies = (
 				0BEA5C401F7B8F73000D0AB4 /* PBXTargetDependency */,
+				4EC49BBE25BEDAC100E76218 /* PBXTargetDependency */,
 			);
 			name = JitsiMeet;
 			productName = "Jitsi Meet";
 			productReference = 13B07F961A680F5B00A75B9A /* jitsi-meet.app */;
 			productType = "com.apple.product-type.application";
 		};
+		4EC49BB525BEDAC100E76218 /* JitsiMeetBroadcast Extension */ = {
+			isa = PBXNativeTarget;
+			buildConfigurationList = 4EC49BC025BEDAC100E76218 /* Build configuration list for PBXNativeTarget "JitsiMeetBroadcast Extension" */;
+			buildPhases = (
+				4EC49BB225BEDAC100E76218 /* Sources */,
+				4EC49BB325BEDAC100E76218 /* Frameworks */,
+				4EC49BB425BEDAC100E76218 /* Resources */,
+			);
+			buildRules = (
+			);
+			dependencies = (
+			);
+			name = "JitsiMeetBroadcast Extension";
+			productName = "JitsiMeetBroadcast Extension";
+			productReference = 4EC49BB625BEDAC100E76218 /* JitsiMeetBroadcast Extension.appex */;
+			productType = "com.apple.product-type.app-extension";
+		};
 /* End PBXNativeTarget section */
 
 /* Begin PBXProject section */
@@ -336,8 +420,6 @@
 						ProvisioningStyle = Automatic;
 					};
 					13B07F861A680F5B00A75B9A = {
-						DevelopmentTeam = FC967L3QRG;
-						ProvisioningStyle = Automatic;
 						SystemCapabilities = {
 							com.apple.SafariKeychain = {
 								enabled = 1;
@@ -347,6 +429,9 @@
 							};
 						};
 					};
+					4EC49BB525BEDAC100E76218 = {
+						CreatedOnToolsVersion = 12.2;
+					};
 				};
 			};
 			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "app" */;
@@ -365,6 +450,7 @@
 				13B07F861A680F5B00A75B9A /* JitsiMeet */,
 				0BEA5C241F7B8F73000D0AB4 /* JitsiMeetCompanion */,
 				0BEA5C301F7B8F73000D0AB4 /* JitsiMeetCompanion Extension */,
+				4EC49BB525BEDAC100E76218 /* JitsiMeetBroadcast Extension */,
 			);
 		};
 /* End PBXProject section */
@@ -397,6 +483,13 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
+		4EC49BB425BEDAC100E76218 /* Resources */ = {
+			isa = PBXResourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
 /* End PBXResourcesBuildPhase section */
 
 /* Begin PBXShellScriptBuildPhase section */
@@ -532,6 +625,17 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
+		4EC49BB225BEDAC100E76218 /* Sources */ = {
+			isa = PBXSourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				4EC49BCB25BEDB6400E76218 /* SocketConnection.m in Sources */,
+				4EC49BBB25BEDAC100E76218 /* SampleHandler.m in Sources */,
+				4E51B75E25E4115F0038575A /* DarwinNotificationCenter.m in Sources */,
+				4EC49BD125BF19CF00E76218 /* SampleUploader.m in Sources */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
 /* End PBXSourcesBuildPhase section */
 
 /* Begin PBXTargetDependency section */
@@ -545,6 +649,11 @@
 			target = 0BEA5C241F7B8F73000D0AB4 /* JitsiMeetCompanion */;
 			targetProxy = 0BEA5C3F1F7B8F73000D0AB4 /* PBXContainerItemProxy */;
 		};
+		4EC49BBE25BEDAC100E76218 /* PBXTargetDependency */ = {
+			isa = PBXTargetDependency;
+			target = 4EC49BB525BEDAC100E76218 /* JitsiMeetBroadcast Extension */;
+			targetProxy = 4EC49BBD25BEDAC100E76218 /* PBXContainerItemProxy */;
+		};
 /* End PBXTargetDependency section */
 
 /* Begin PBXVariantGroup section */
@@ -718,7 +827,7 @@
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIconDebug;
 				CODE_SIGN_ENTITLEMENTS = app.entitlements;
-				CODE_SIGN_IDENTITY = "iPhone Developer";
+				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
 				CURRENT_PROJECT_VERSION = 1;
 				DEAD_CODE_STRIPPING = NO;
@@ -748,7 +857,7 @@
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIconRelease;
 				CODE_SIGN_ENTITLEMENTS = app.entitlements;
-				CODE_SIGN_IDENTITY = "iPhone Developer";
+				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = FC967L3QRG;
@@ -770,6 +879,70 @@
 			};
 			name = Release;
 		};
+		4EC49BC125BEDAC100E76218 /* Debug */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++14";
+				CLANG_ENABLE_OBJC_WEAK = YES;
+				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
+				CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE;
+				CODE_SIGN_ENTITLEMENTS = "broadcast-extension/extension.entitlements";
+				CODE_SIGN_IDENTITY = "iPhone Developer";
+				CODE_SIGN_STYLE = Automatic;
+				DEBUG_INFORMATION_FORMAT = dwarf;
+				DEVELOPMENT_TEAM = FC967L3QRG;
+				GCC_C_LANGUAGE_STANDARD = gnu11;
+				INFOPLIST_FILE = "broadcast-extension/Info.plist";
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+					"@executable_path/../../Frameworks",
+				);
+				MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE;
+				MTL_FAST_MATH = YES;
+				PRODUCT_BUNDLE_IDENTIFIER = org.jitsi.meet.broadcast.extension;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SKIP_INSTALL = YES;
+				TARGETED_DEVICE_FAMILY = "1,2";
+			};
+			name = Debug;
+		};
+		4EC49BC225BEDAC100E76218 /* Release */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++14";
+				CLANG_ENABLE_OBJC_WEAK = YES;
+				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
+				CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE;
+				CODE_SIGN_ENTITLEMENTS = "broadcast-extension/extension.entitlements";
+				CODE_SIGN_IDENTITY = "iPhone Developer";
+				CODE_SIGN_STYLE = Automatic;
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
+				DEVELOPMENT_TEAM = FC967L3QRG;
+				GCC_C_LANGUAGE_STANDARD = gnu11;
+				INFOPLIST_FILE = "broadcast-extension/Info.plist";
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+					"@executable_path/../../Frameworks",
+				);
+				MTL_FAST_MATH = YES;
+				PRODUCT_BUNDLE_IDENTIFIER = org.jitsi.meet.broadcast.extension;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SKIP_INSTALL = YES;
+				TARGETED_DEVICE_FAMILY = "1,2";
+			};
+			name = Release;
+		};
 		83CBBA201A601CBA00E9B192 /* Debug */ = {
 			isa = XCBuildConfiguration;
 			buildSettings = {
@@ -914,6 +1087,15 @@
 			defaultConfigurationIsVisible = 0;
 			defaultConfigurationName = Release;
 		};
+		4EC49BC025BEDAC100E76218 /* Build configuration list for PBXNativeTarget "JitsiMeetBroadcast Extension" */ = {
+			isa = XCConfigurationList;
+			buildConfigurations = (
+				4EC49BC125BEDAC100E76218 /* Debug */,
+				4EC49BC225BEDAC100E76218 /* Release */,
+			);
+			defaultConfigurationIsVisible = 0;
+			defaultConfigurationName = Release;
+		};
 		83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "app" */ = {
 			isa = XCConfigurationList;
 			buildConfigurations = (

ios/app/broadcast-extension/DarwinNotificationCenter.h

@@ -0,0 +1,31 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+extern NSNotificationName const kBroadcastStartedNotification;
+extern NSNotificationName const kBroadcastStoppedNotification;
+
+@interface DarwinNotificationCenter: NSObject
+
++ (instancetype)sharedInstance;
+- (void)postNotificationWithName:(NSNotificationName)name;
+
+@end
+
+NS_ASSUME_NONNULL_END

ios/app/broadcast-extension/DarwinNotificationCenter.m

@@ -0,0 +1,50 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import "DarwinNotificationCenter.h"
+
+NSNotificationName const kBroadcastStartedNotification = @"iOS_BroadcastStarted";
+NSNotificationName const kBroadcastStoppedNotification = @"iOS_BroadcastStopped";
+
+@implementation DarwinNotificationCenter {
+  CFNotificationCenterRef _notificationCenter;
+}
+
++ (instancetype)sharedInstance {
+  static DarwinNotificationCenter *sharedInstance = nil;
+  static dispatch_once_t onceToken;
+  dispatch_once(&onceToken, ^{
+      sharedInstance = [[self alloc] init];
+  });
+  
+  return sharedInstance;
+}
+
+- (instancetype)init {
+  self = [super init];
+  if (self) {
+    _notificationCenter = CFNotificationCenterGetDarwinNotifyCenter();
+  }
+  
+  return self;
+}
+
+- (void)postNotificationWithName:(NSString*)name {
+  CFNotificationCenterPostNotification(_notificationCenter, (__bridge CFStringRef)name, NULL, NULL, true);
+}
+
+@end
+

ios/app/broadcast-extension/Info.plist

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>$(DEVELOPMENT_LANGUAGE)</string>
+	<key>CFBundleDisplayName</key>
+	<string>JitsiMeet Broadcast Extension</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
+	<key>CFBundleShortVersionString</key>
+	<string>21.0.0</string>
+	<key>CFBundleVersion</key>
+	<string>1</string>
+	<key>NSExtension</key>
+	<dict>
+		<key>NSExtensionPointIdentifier</key>
+		<string>com.apple.broadcast-services-upload</string>
+		<key>NSExtensionPrincipalClass</key>
+		<string>SampleHandler</string>
+		<key>RPBroadcastProcessMode</key>
+		<string>RPBroadcastProcessModeSampleBuffer</string>
+	</dict>
+</dict>
+</plist>

ios/app/broadcast-extension/SampleHandler.h

@@ -0,0 +1,21 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <ReplayKit/ReplayKit.h>
+
+@interface SampleHandler : RPBroadcastSampleHandler
+
+@end

ios/app/broadcast-extension/SampleHandler.m

@@ -0,0 +1,123 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import "SampleHandler.h"
+#import "SocketConnection.h"
+#import "SampleUploader.h"
+#import "DarwinNotificationCenter.h"
+
+@interface SampleHandler ()
+
+@property (nonatomic, retain) SocketConnection *clientConnection;
+@property (nonatomic, retain) SampleUploader *uploader;
+
+@end
+
+@implementation SampleHandler
+
+- (instancetype)init {
+  self = [super init];
+  if (self) {
+    self.clientConnection = [[SocketConnection alloc] initWithFilePath:self.socketFilePath];
+    [self setupConnection];
+    
+    self.uploader = [[SampleUploader alloc] initWithConnection:self.clientConnection];    
+  }
+  
+  return self;
+}
+
+- (void)broadcastStartedWithSetupInfo:(NSDictionary<NSString *,NSObject *> *)setupInfo {
+  // User has requested to start the broadcast. Setup info from the UI extension can be supplied but optional.
+  NSLog(@"broadcast started");
+  
+  [[DarwinNotificationCenter sharedInstance] postNotificationWithName:kBroadcastStartedNotification];
+  [self openConnection];
+}
+
+- (void)broadcastPaused {
+    // User has requested to pause the broadcast. Samples will stop being delivered.
+}
+
+- (void)broadcastResumed {
+    // User has requested to resume the broadcast. Samples delivery will resume.
+}
+
+- (void)broadcastFinished {
+    // User has requested to finish the broadcast.
+  [[DarwinNotificationCenter sharedInstance] postNotificationWithName:kBroadcastStoppedNotification];
+  [self.clientConnection close];
+}
+
+- (void)processSampleBuffer:(CMSampleBufferRef)sampleBuffer withType:(RPSampleBufferType)sampleBufferType {
+  static NSUInteger frameCount = 0;
+  switch (sampleBufferType) {
+    case RPSampleBufferTypeVideo:
+      // adjust frame rate by using every third frame
+      if (++frameCount%3 == 0 && self.uploader.isReady) {
+        [self.uploader sendSample:sampleBuffer];
+      }
+      break;
+
+    default:
+      break;
+  }
+}
+
+// MARK: Private Methods
+
+- (NSString *)socketFilePath {
+    // the appGroupIdentifier must match the value provided in the app's info.plist for the RTCAppGroupIdentifier key
+    NSString *appGroupIdentifier = @"group.org.jitsi.meet.appgroup";
+    NSURL *sharedContainer = [[NSFileManager defaultManager] containerURLForSecurityApplicationGroupIdentifier:appGroupIdentifier];
+    NSString *socketFilePath = [[sharedContainer URLByAppendingPathComponent:@"rtc_SSFD"] path];
+      
+    return socketFilePath;
+}
+
+- (void)setupConnection {
+  __weak __typeof(self) weakSelf = self;
+  self.clientConnection.didClose = ^(NSError *error) {
+    NSLog(@"client connection did close: %@", error);
+    if (error) {
+      [weakSelf finishBroadcastWithError:error];
+    }
+    else {
+      NSInteger JMScreenSharingStopped = 10001;
+      NSError *customError = [NSError errorWithDomain:RPRecordingErrorDomain
+                                                 code:JMScreenSharingStopped
+                                             userInfo:@{NSLocalizedDescriptionKey: @"Screen sharing stopped"}];
+      [weakSelf finishBroadcastWithError:customError];
+    }
+  };
+}
+
+- (void)openConnection {
+  dispatch_queue_t queue = dispatch_queue_create("org.jitsi.meet.broadcast.connectTimer", 0);
+  dispatch_source_t timer = dispatch_source_create(DISPATCH_SOURCE_TYPE_TIMER, 0, 0, queue);
+  dispatch_source_set_timer(timer, dispatch_walltime(NULL, 0), 0.1 * NSEC_PER_SEC, 0.1 * NSEC_PER_SEC);
+  
+  dispatch_source_set_event_handler(timer, ^{
+    BOOL success = [self.clientConnection open];
+    if (success) {
+      dispatch_source_cancel(timer);
+    }
+  });
+
+  dispatch_resume(timer);
+}
+
+@end

ios/app/broadcast-extension/SampleUploader.h

@@ -0,0 +1,33 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <Foundation/Foundation.h>
+#import <ReplayKit/ReplayKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@class SocketConnection;
+
+@interface SampleUploader : NSObject
+
+@property (nonatomic, assign, readonly) BOOL isReady;
+
+- (instancetype)initWithConnection:(SocketConnection *)connection;
+- (void)sendSample:(CMSampleBufferRef)sampleBuffer;
+
+@end
+
+NS_ASSUME_NONNULL_END

ios/app/broadcast-extension/SampleUploader.m

@@ -0,0 +1,155 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <MessageUI/MessageUI.h>
+#import <ReplayKit/ReplayKit.h>
+
+#import "SampleUploader.h"
+#import "SocketConnection.h"
+
+static const NSInteger kBufferMaxLenght = 10 * 1024;
+
+@interface SampleUploader ()
+
+@property (nonatomic, assign) BOOL isReady;
+
+@property (nonatomic, strong) dispatch_queue_t serialQueue;
+@property (nonatomic, strong) SocketConnection *connection;
+@property (nonatomic, strong) CIContext *imageContext;
+
+@property (nonatomic, strong) NSData *dataToSend;
+@property (nonatomic, assign) NSUInteger byteIndex;
+
+@end
+
+@implementation SampleUploader
+
+- (instancetype)initWithConnection:(SocketConnection *)connection {
+  self = [super init];
+  if (self) {
+    self.serialQueue = dispatch_queue_create("org.jitsi.meet.broadcast.sampleUploader", DISPATCH_QUEUE_SERIAL);
+    
+    self.connection = connection;
+    [self setupConnection];
+    
+    self.imageContext = [[CIContext alloc] initWithOptions:nil];
+    self.isReady = false;
+  }
+  
+  return self;
+}
+
+- (void)sendSample:(CMSampleBufferRef)sampleBuffer {
+  self.isReady = false;
+  
+  self.dataToSend = [self prepareSample:sampleBuffer];
+  self.byteIndex = 0;
+  
+  dispatch_async(self.serialQueue, ^{
+    [self sendData];
+  });
+}
+
+// MARK: Private Methods
+
+- (void)setupConnection {
+  __weak __typeof(self) weakSelf = self;
+  self.connection.didOpen = ^{
+    weakSelf.isReady = true;
+  };
+  self.connection.streamHasSpaceAvailable = ^{
+    dispatch_async(weakSelf.serialQueue, ^{
+      weakSelf.isReady = ![weakSelf sendData];
+    });
+  };
+}
+
+/**
+ This function downscales and converts to jpeg the provided sample buffer, then wraps the resulted image data into a CFHTTPMessageRef. Returns the serialized CFHTTPMessageRef.
+ */
+- (NSData *)prepareSample:(CMSampleBufferRef)sampleBuffer {
+  CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);
+    
+  CVPixelBufferLockBaseAddress(imageBuffer, kCVPixelBufferLock_ReadOnly);
+  
+  CGFloat scaleFactor = 2;
+  size_t width = CVPixelBufferGetWidth(imageBuffer)/scaleFactor;
+  size_t height = CVPixelBufferGetHeight(imageBuffer)/scaleFactor;
+    
+  CGAffineTransform scaleTransform = CGAffineTransformMakeScale(1/scaleFactor, 1/scaleFactor);
+  NSData *bufferData = [self jpegDataFromPixelBuffer:imageBuffer withScaling:scaleTransform];
+  
+  CVPixelBufferUnlockBaseAddress(imageBuffer, kCVPixelBufferLock_ReadOnly);
+  
+  if (bufferData) {
+    CFHTTPMessageRef httpResponse = CFHTTPMessageCreateResponse(kCFAllocatorDefault, 200, NULL, kCFHTTPVersion1_1);
+    CFHTTPMessageSetHeaderFieldValue(httpResponse, (__bridge CFStringRef)@"Content-Length", (__bridge CFStringRef)[NSString stringWithFormat:@"%ld", bufferData.length]);
+    CFHTTPMessageSetHeaderFieldValue(httpResponse, (__bridge CFStringRef)@"Buffer-Width", (__bridge CFStringRef)[NSString stringWithFormat:@"%ld", width]);
+    CFHTTPMessageSetHeaderFieldValue(httpResponse, (__bridge CFStringRef)@"Buffer-Height", (__bridge CFStringRef)[NSString stringWithFormat:@"%ld", height]);
+
+    CFHTTPMessageSetBody(httpResponse, (__bridge CFDataRef)bufferData);
+
+    CFDataRef serializedMessage = CFHTTPMessageCopySerializedMessage(httpResponse);
+    CFRelease(httpResponse);
+    
+    return CFBridgingRelease(serializedMessage);
+  }
+  
+  return nil;
+}
+
+- (BOOL)sendData {
+  if (!self.dataToSend) {
+    NSLog(@"no data to send");
+    return false;
+  }
+
+  NSUInteger bytesLeft = self.dataToSend.length - self.byteIndex;
+  
+  NSInteger length = bytesLeft > kBufferMaxLenght ? kBufferMaxLenght : bytesLeft;
+  uint8_t buffer[length];
+  [self.dataToSend getBytes:&buffer range:NSMakeRange(self.byteIndex, length)];
+
+  length = [self.connection writeBufferToStream:buffer maxLength:length];
+  if (length > 0) {
+    self.byteIndex += length;
+    bytesLeft -= length;
+
+    if (bytesLeft == 0) {
+      NSLog(@"video sample processed successfully");
+      self.dataToSend = nil;
+      self.byteIndex = 0;
+    }
+  }
+  else {
+    NSLog(@"writeBufferToStream failure");
+  }
+  
+  return true;
+}
+
+- (NSData *)jpegDataFromPixelBuffer:(CVPixelBufferRef)pixelBuffer withScaling:(CGAffineTransform)scaleTransform {
+  CIImage *image = [[CIImage alloc] initWithCVPixelBuffer:pixelBuffer];
+  image = [image imageByApplyingTransform:scaleTransform];
+  
+  NSDictionary *options = @{(NSString *)kCGImageDestinationLossyCompressionQuality: [NSNumber numberWithFloat:1.0]};
+  NSData *imageData = [self.imageContext JPEGRepresentationOfImage:image
+                                                        colorSpace:image.colorSpace
+                                                           options:options];
+  return imageData;
+}
+
+@end

ios/app/broadcast-extension/SocketConnection.h

@@ -0,0 +1,34 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface SocketConnection : NSObject
+
+@property (nonatomic, copy, nullable) void (^didOpen)(void);
+@property (nonatomic, copy, nullable) void (^didClose)(NSError*);
+@property (nonatomic, copy, nullable) void (^streamHasSpaceAvailable)(void);
+
+- (instancetype)initWithFilePath:(nonnull NSString *)filePath;
+- (BOOL)open;
+- (void)close;
+- (NSInteger)writeBufferToStream:(const uint8_t*)buffer maxLength:(NSInteger)length;
+
+@end
+
+NS_ASSUME_NONNULL_END

ios/app/broadcast-extension/SocketConnection.m

@@ -0,0 +1,189 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#include <sys/socket.h>
+#include <sys/un.h>
+
+#import "SocketConnection.h"
+
+@interface SocketConnection () <NSStreamDelegate>
+
+@property (nonatomic, copy) NSString *filePath;
+
+@property (nonatomic, strong) NSInputStream *inputStream;
+@property (nonatomic, strong) NSOutputStream *outputStream;
+
+@property (nonatomic, strong) NSThread *networkThread;
+
+@end
+
+@implementation SocketConnection {
+  int _socket;
+  struct sockaddr_un _socketAddr;
+}
+
+- (instancetype)initWithFilePath:(NSString *)path {
+  self = [super init];
+  if (self) {
+    self.filePath = path;
+    
+    [self setupSocketWithFilePath:path];
+    [self setupNetworkThread];
+  }
+  
+  return self;
+}
+
+- (BOOL)open {
+  NSLog(@"Open socket connection");
+  
+  if (![[NSFileManager defaultManager] fileExistsAtPath:self.filePath]) {
+      NSLog(@"failure: socket file missing");
+      return false;
+  }
+
+  int status = connect(_socket, (struct sockaddr *)&_socketAddr, sizeof(_socketAddr));
+  if (status < 0) {
+      NSLog(@"failure: socket connect (%d)", status);
+      return false;
+  }
+  
+  [self.networkThread start];
+
+  CFReadStreamRef readStream;
+  CFWriteStreamRef writeStream;
+
+  CFStreamCreatePairWithSocket(kCFAllocatorDefault, _socket, &readStream, &writeStream);
+
+  self.inputStream = (__bridge_transfer NSInputStream *)readStream;
+  self.inputStream.delegate = self;
+  [self.inputStream setProperty:@"kCFBooleanTrue" forKey:@"kCFStreamPropertyShouldCloseNativeSocket"];
+
+  self.outputStream = (__bridge_transfer NSOutputStream *)writeStream;
+  self.outputStream.delegate = self;
+  [self.outputStream setProperty:@"kCFBooleanTrue" forKey:@"kCFStreamPropertyShouldCloseNativeSocket"];
+  
+  [self performSelector:@selector(scheduleStreams) onThread:self.networkThread withObject:nil waitUntilDone:true];
+
+  [self.inputStream open];
+  [self.outputStream open];
+
+  NSLog(@"read stream status: %ld", CFReadStreamGetStatus(readStream));
+  NSLog(@"write stream status: %ld", CFWriteStreamGetStatus(writeStream));
+  
+  return true;
+}
+
+- (void)close {
+  [self performSelector:@selector(unscheduleStreams) onThread:self.networkThread withObject:nil waitUntilDone:true];
+
+  self.inputStream.delegate = nil;
+  self.outputStream.delegate = nil;
+  
+  [self.inputStream close];
+  [self.outputStream close];
+
+  [self.networkThread cancel];
+}
+
+- (NSInteger)writeBufferToStream:(const uint8_t*)buffer maxLength:(NSInteger)length {
+  return [self.outputStream write:buffer maxLength:length];
+}
+
+// MARK: Private Methods
+
+- (BOOL)isOpen {
+  return self.inputStream.streamStatus == NSStreamStatusOpen && self.outputStream.streamStatus == NSStreamStatusOpen;
+}
+
+- (void)setupSocketWithFilePath:(NSString*)path {
+  _socket = socket(AF_UNIX, SOCK_STREAM, 0);
+  
+  memset(&_socketAddr, 0, sizeof(_socketAddr));
+  _socketAddr.sun_family = AF_UNIX;
+  strncpy(_socketAddr.sun_path, path.UTF8String, sizeof(_socketAddr.sun_path) - 1);
+}
+
+- (void)setupNetworkThread {
+  self.networkThread = [[NSThread alloc] initWithBlock:^{
+    do {
+      @autoreleasepool {
+        [[NSRunLoop currentRunLoop] run];
+      }
+    } while (![NSThread currentThread].isCancelled);
+  }];
+  self.networkThread.qualityOfService = NSQualityOfServiceUserInitiated;
+}
+
+- (void)scheduleStreams {
+  [self.inputStream scheduleInRunLoop:NSRunLoop.currentRunLoop forMode:NSRunLoopCommonModes];
+  [self.outputStream scheduleInRunLoop:NSRunLoop.currentRunLoop forMode:NSRunLoopCommonModes];
+}
+
+- (void)unscheduleStreams {
+  [self.inputStream removeFromRunLoop:NSRunLoop.currentRunLoop forMode:NSRunLoopCommonModes];
+  [self.outputStream removeFromRunLoop:NSRunLoop.currentRunLoop forMode:NSRunLoopCommonModes];
+}
+
+- (void)notifyDidClose:(NSError *)error {
+  if (self.didClose) {
+    self.didClose(error);
+  }
+}
+
+@end
+
+#pragma mark - NSStreamDelegate
+
+@implementation SocketConnection (NSStreamDelegate)
+
+- (void)stream:(NSStream *)aStream handleEvent:(NSStreamEvent)eventCode {
+  switch (eventCode) {
+    case NSStreamEventOpenCompleted:
+      NSLog(@"client stream open completed");
+      if (aStream == self.outputStream && self.didOpen) {
+        self.didOpen();
+      }
+      break;
+    case NSStreamEventHasBytesAvailable:
+      if (aStream == self.inputStream) {
+        uint8_t buffer;
+        NSInteger numberOfBytesRead = [(NSInputStream *)aStream read:&buffer maxLength:sizeof(buffer)];
+        if (!numberOfBytesRead && aStream.streamStatus == NSStreamStatusAtEnd) {
+          NSLog(@"server socket closed");
+          [self close];
+          [self notifyDidClose:nil];
+        }
+      }
+      break;
+    case NSStreamEventHasSpaceAvailable:
+      if (aStream == self.outputStream && self.streamHasSpaceAvailable) {
+        NSLog(@"client stream has space available");
+        self.streamHasSpaceAvailable();
+      }
+      break;
+    case NSStreamEventErrorOccurred:
+      NSLog(@"client stream error occurred: %@", aStream.streamError);
+      [self close];
+      [self notifyDidClose:aStream.streamError];
+      break;
+      
+    default:
+      break;
+  }
+}
+
+@end

ios/app/broadcast-extension/extension.entitlements

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>com.apple.security.application-groups</key>
+	<array>
+		<string>group.org.jitsi.meet.appgroup</string>
+	</array>
+</dict>
+</plist>

ios/app/src/Info.plist

@@ -45,6 +45,8 @@
 	</array>
 	<key>CFBundleVersion</key>
 	<string>1</string>
+	<key>FirebaseCrashlyticsCollectionEnabled</key>
+	<string>false</string>
 	<key>FirebaseScreenReportingEnabled</key>
 	<false/>
 	<key>ITSAppUsesNonExemptEncryption</key>
@@ -66,14 +68,18 @@
 	<string>See your scheduled meetings in the app.</string>
 	<key>NSCameraUsageDescription</key>
 	<string>Participate in meetings with video.</string>
-	<key>NSMicrophoneUsageDescription</key>
-	<string>Participate in meetings with voice.</string>
 	<key>NSLocalNetworkUsageDescription</key>
 	<string>Local network is used for establishing Peer-to-Peer connections.</string>
+	<key>NSMicrophoneUsageDescription</key>
+	<string>Participate in meetings with voice.</string>
 	<key>NSUserActivityTypes</key>
 	<array>
 		<string>org.jitsi.JitsiMeet.ios.conference</string>
 	</array>
+	<key>RTCAppGroupIdentifier</key>
+	<string>group.org.jitsi.meet.appgroup</string>
+	<key>RTCScreenSharingExtension</key>
+	<string>org.jitsi.meet.broadcast.extension</string>
 	<key>UIBackgroundModes</key>
 	<array>
 		<string>audio</string>
@@ -99,7 +105,5 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
-	<key>FirebaseCrashlyticsCollectionEnabled</key>
-	<string>false</string>
 </dict>
 </plist>

ios/app/src/ViewController.m

@@ -115,6 +115,22 @@
   NSLog(@"%@%@", @"Audio muted changed: ", data[@"muted"]);
 }
 
+- (void)endpointTextMessageReceived:(NSDictionary *)data {
+  NSLog(@"%@%@", @"Endpoint text message received: ", data);
+}
+
+- (void)screenShareToggled:(NSDictionary *)data {
+  NSLog(@"%@%@", @"Screen share toggled: ", data);
+}
+
+- (void)chatMessageReceived:(NSDictionary *)data {
+    NSLog(@"%@%@", @"Chat message received: ", data);
+}
+
+- (void)chatToggled:(NSDictionary *)data {
+  NSLog(@"%@%@", @"Chat toggled: ", data);
+}
+
 #pragma mark - Helpers
 
 - (void)terminate {

ios/fastlane/Fastfile

@@ -16,6 +16,20 @@ platform :ios do
       app_identifier: "com.atlassian.JitsiMeet.ios"
     )
 
+    # Set the broadcast extension identifier
+    update_app_identifier(
+      xcodeproj: "app/app.xcodeproj",
+      plist_path: "broadcast-extension/Info.plist",
+      app_identifier: "com.atlassian.JitsiMeet.ios.broadcast"
+    )
+    update_info_plist(
+      xcodeproj: "app/app.xcodeproj",
+      plist_path: "src/Info.plist",
+      block: proc do |plist|
+        plist["RTCScreenSharingExtension"] = "com.atlassian.JitsiMeet.ios.broadcast"
+      end
+    )
+
     # Set the (watch) app identifier
     update_app_identifier(
       xcodeproj: "app/app.xcodeproj",

ios/sdk/sdk.xcodeproj/project.pbxproj

@@ -24,6 +24,8 @@
 		0BCA49601EC4B6C600B793EE /* POSIX.m in Sources */ = {isa = PBXBuildFile; fileRef = 0BCA495D1EC4B6C600B793EE /* POSIX.m */; };
 		0BCA49611EC4B6C600B793EE /* Proximity.m in Sources */ = {isa = PBXBuildFile; fileRef = 0BCA495E1EC4B6C600B793EE /* Proximity.m */; };
 		0BD906EA1EC0C00300C8C18E /* JitsiMeet.h in Headers */ = {isa = PBXBuildFile; fileRef = 0BD906E81EC0C00300C8C18E /* JitsiMeet.h */; settings = {ATTRIBUTES = (Public, ); }; };
+		4E51B76425E5345E0038575A /* ScheenshareEventEmiter.h in Headers */ = {isa = PBXBuildFile; fileRef = 4E51B76225E5345E0038575A /* ScheenshareEventEmiter.h */; };
+		4E51B76525E5345E0038575A /* ScheenshareEventEmiter.m in Sources */ = {isa = PBXBuildFile; fileRef = 4E51B76325E5345E0038575A /* ScheenshareEventEmiter.m */; };
 		6C31EDC820C06D490089C899 /* recordingOn.mp3 in Resources */ = {isa = PBXBuildFile; fileRef = 6C31EDC720C06D490089C899 /* recordingOn.mp3 */; };
 		6C31EDCA20C06D530089C899 /* recordingOff.mp3 in Resources */ = {isa = PBXBuildFile; fileRef = 6C31EDC920C06D530089C899 /* recordingOff.mp3 */; };
 		6F08DF7D4458EE3CF3F36F6D /* libPods-JitsiMeetSDK.a in Frameworks */ = {isa = PBXBuildFile; fileRef = E4376CA6886DE68FD7A4294B /* libPods-JitsiMeetSDK.a */; };
@@ -85,6 +87,8 @@
 		0BD906E51EC0C00300C8C18E /* JitsiMeetSDK.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = JitsiMeetSDK.framework; sourceTree = BUILT_PRODUCTS_DIR; };
 		0BD906E81EC0C00300C8C18E /* JitsiMeet.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = JitsiMeet.h; sourceTree = "<group>"; };
 		0BD906E91EC0C00300C8C18E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+		4E51B76225E5345E0038575A /* ScheenshareEventEmiter.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = ScheenshareEventEmiter.h; sourceTree = "<group>"; };
+		4E51B76325E5345E0038575A /* ScheenshareEventEmiter.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = ScheenshareEventEmiter.m; sourceTree = "<group>"; };
 		6C31EDC720C06D490089C899 /* recordingOn.mp3 */ = {isa = PBXFileReference; lastKnownFileType = audio.mp3; name = recordingOn.mp3; path = ../../sounds/recordingOn.mp3; sourceTree = "<group>"; };
 		6C31EDC920C06D530089C899 /* recordingOff.mp3 */ = {isa = PBXFileReference; lastKnownFileType = audio.mp3; name = recordingOff.mp3; path = ../../sounds/recordingOff.mp3; sourceTree = "<group>"; };
 		75635B0820751D6D00F29C9F /* joined.wav */ = {isa = PBXFileReference; lastKnownFileType = audio.wav; name = joined.wav; path = ../../sounds/joined.wav; sourceTree = "<group>"; };
@@ -231,6 +235,8 @@
 				C8AFD27D2462C613000293D2 /* InfoPlistUtil.h */,
 				C8AFD27E2462C613000293D2 /* InfoPlistUtil.m */,
 				C81E9AB825AC5AD800B134D9 /* ExternalAPI.h */,
+				4E51B76225E5345E0038575A /* ScheenshareEventEmiter.h */,
+				4E51B76325E5345E0038575A /* ScheenshareEventEmiter.m */,
 			);
 			path = src;
 			sourceTree = "<group>";
@@ -298,6 +304,7 @@
 				0B93EF7E1EC9DDCD0030D24D /* RCTBridgeWrapper.h in Headers */,
 				DE81A2DE2317ED5400AE1940 /* JitsiMeetBaseLogHandler.h in Headers */,
 				DEA9F284258A5D9900D4CD74 /* JitsiMeetSDK.h in Headers */,
+				4E51B76425E5345E0038575A /* ScheenshareEventEmiter.h in Headers */,
 				DE65AACC2318028300290BEC /* JitsiMeetBaseLogHandler+Private.h in Headers */,
 				0B412F221EDEF6EA00B1A0A6 /* JitsiMeetViewDelegate.h in Headers */,
 				0BD906EA1EC0C00300C8C18E /* JitsiMeet.h in Headers */,
@@ -466,6 +473,7 @@
 				C69EFA0C209A0F660027712B /* JMCallKitEmitter.swift in Sources */,
 				DEFE535621FB2E8300011A3A /* ReactUtils.m in Sources */,
 				C6A34261204EF76800E062DD /* DragGestureController.swift in Sources */,
+				4E51B76525E5345E0038575A /* ScheenshareEventEmiter.m in Sources */,
 				A4A934E9212F3ADB001E9388 /* Dropbox.m in Sources */,
 				C69EFA0D209A0F660027712B /* JMCallKitProxy.swift in Sources */,
 				DE81A2D52316AC4D00AE1940 /* JitsiMeetLogger.m in Sources */,

ios/sdk/src/ExternalAPI.h

@@ -19,6 +19,12 @@
 @interface ExternalAPI : RCTEventEmitter<RCTBridgeModule>
 
 - (void)sendHangUp;
-- (void)sendSetAudioMuted: (BOOL)muted;
+- (void)sendSetAudioMuted:(BOOL)muted;
+- (void)sendEndpointTextMessage:(NSString*)message :(NSString*)to;
+- (void)toggleScreenShare;
+- (void)retrieveParticipantsInfo:(void (^)(NSArray*))completion;
+- (void)openChat:(NSString*)to;
+- (void)closeChat;
+- (void)sendChatMessage:(NSString*)message :(NSString*)to ;
 
 @end

ios/sdk/src/ExternalAPI.m

@@ -18,17 +18,36 @@
 #import "JitsiMeetView+Private.h"
 
 // Events
-static NSString * const hangUpEvent = @"org.jitsi.meet.HANG_UP";
-static NSString * const setAudioMutedEvent = @"org.jitsi.meet.SET_AUDIO_MUTED";
+static NSString * const hangUpAction = @"org.jitsi.meet.HANG_UP";
+static NSString * const setAudioMutedAction = @"org.jitsi.meet.SET_AUDIO_MUTED";
+static NSString * const sendEndpointTextMessageAction = @"org.jitsi.meet.SEND_ENDPOINT_TEXT_MESSAGE";
+static NSString * const toggleScreenShareAction = @"org.jitsi.meet.TOGGLE_SCREEN_SHARE";
+static NSString * const retrieveParticipantsInfoAction = @"org.jitsi.meet.RETRIEVE_PARTICIPANTS_INFO";
+static NSString * const openChatAction = @"org.jitsi.meet.OPEN_CHAT";
+static NSString * const closeChatAction = @"org.jitsi.meet.CLOSE_CHAT";
+static NSString * const sendChatMessageAction = @"org.jitsi.meet.SEND_CHAT_MESSAGE";
 
 @implementation ExternalAPI
 
+static NSMapTable<NSString*, void (^)(NSArray* participantsInfo)> *participantInfoCompletionHandlers;
+
+__attribute__((constructor))
+static void initializeViewsMap() {
+    participantInfoCompletionHandlers = [NSMapTable strongToStrongObjectsMapTable];
+}
+
 RCT_EXPORT_MODULE();
 
 - (NSDictionary *)constantsToExport {
     return @{
-        @"HANG_UP": hangUpEvent,
-        @"SET_AUDIO_MUTED" : setAudioMutedEvent
+        @"HANG_UP": hangUpAction,
+        @"SET_AUDIO_MUTED" : setAudioMutedAction,
+        @"SEND_ENDPOINT_TEXT_MESSAGE": sendEndpointTextMessageAction,
+        @"TOGGLE_SCREEN_SHARE": toggleScreenShareAction,
+        @"RETRIEVE_PARTICIPANTS_INFO": retrieveParticipantsInfoAction,
+        @"OPEN_CHAT": openChatAction,
+        @"CLOSE_CHAT": closeChatAction,
+        @"SEND_CHAT_MESSAGE": sendChatMessageAction
     };
 };
 
@@ -44,7 +63,15 @@ RCT_EXPORT_MODULE();
 }
 
 - (NSArray<NSString *> *)supportedEvents {
-    return @[ hangUpEvent, setAudioMutedEvent ];
+    return @[ hangUpAction,
+              setAudioMutedAction,
+              sendEndpointTextMessageAction,
+              toggleScreenShareAction,
+              retrieveParticipantsInfoAction,
+              openChatAction,
+              closeChatAction,
+              sendChatMessageAction
+    ];
 }
 
 /**
@@ -72,6 +99,11 @@ RCT_EXPORT_METHOD(sendEvent:(NSString *)name
     if (!delegate) {
         return;
     }
+    
+    if ([name isEqual: @"PARTICIPANTS_INFO_RETRIEVED"]) {
+        [self onParticipantsInfoRetrieved: data];
+        return;
+    }
 
     SEL sel = NSSelectorFromString([self methodNameFromEventName:name]);
 
@@ -80,6 +112,15 @@ RCT_EXPORT_METHOD(sendEvent:(NSString *)name
     }
 }
 
+- (void) onParticipantsInfoRetrieved:(NSDictionary *)data {
+    NSArray *participantsInfoArray = [data objectForKey:@"participantsInfo"];
+    NSString *completionHandlerId = [data objectForKey:@"requestId"];
+    
+    void (^completionHandler)(NSArray*) = [participantInfoCompletionHandlers objectForKey:completionHandlerId];
+    completionHandler(participantsInfoArray);
+    [participantInfoCompletionHandlers removeObjectForKey:completionHandlerId];
+}
+
 /**
  * Converts a specific event name i.e. redux action type description to a
  * method name.
@@ -103,13 +144,53 @@ RCT_EXPORT_METHOD(sendEvent:(NSString *)name
 }
 
 - (void)sendHangUp {
-    [self sendEventWithName:hangUpEvent body:nil];
+    [self sendEventWithName:hangUpAction body:nil];
 }
 
-- (void)sendSetAudioMuted: (BOOL)muted {
+- (void)sendSetAudioMuted:(BOOL)muted {
     NSDictionary *data = @{ @"muted": [NSNumber numberWithBool:muted]};
 
-    [self sendEventWithName:setAudioMutedEvent body:data];
+    [self sendEventWithName:setAudioMutedAction body:data];
+}
+
+- (void)sendEndpointTextMessage:(NSString*)message :(NSString*)to {
+    NSMutableDictionary *data = [[NSMutableDictionary alloc] init];
+    data[@"to"] = to;
+    data[@"message"] = message;
+    
+    [self sendEventWithName:sendEndpointTextMessageAction body:data];
+}
+
+- (void)toggleScreenShare {
+    [self sendEventWithName:toggleScreenShareAction body:nil];
+}
+
+- (void)retrieveParticipantsInfo:(void (^)(NSArray*))completionHandler {
+    NSString *completionHandlerId = [[NSUUID UUID] UUIDString];
+    NSDictionary *data = @{ @"requestId": completionHandlerId};
+    
+    [participantInfoCompletionHandlers setObject:[completionHandler copy] forKey:completionHandlerId];
+    
+    [self sendEventWithName:retrieveParticipantsInfoAction body:data];
+}
+
+- (void)openChat:(NSString*)to {
+    NSMutableDictionary *data = [[NSMutableDictionary alloc] init];
+    data[@"to"] = to;
+    
+    [self sendEventWithName:openChatAction body:data];
+}
+
+- (void)closeChat {
+    [self sendEventWithName:closeChatAction body:nil];
+}
+
+- (void)sendChatMessage:(NSString*)message :(NSString*)to {
+    NSMutableDictionary *data = [[NSMutableDictionary alloc] init];
+    data[@"to"] = to;
+    data[@"message"] = message;
+    
+    [self sendEventWithName:sendChatMessageAction body:data];
 }
 
 @end

ios/sdk/src/Info.plist

@@ -15,7 +15,7 @@
 	<key>CFBundlePackageType</key>
 	<string>FMWK</string>
 	<key>CFBundleShortVersionString</key>
-	<string>3.0.0</string>
+	<string>3.2.0</string>
 	<key>CFBundleVersion</key>
 	<string>$(CURRENT_PROJECT_VERSION)</string>
 	<key>NSPrincipalClass</key>

ios/sdk/src/JitsiMeet+Private.h

@@ -16,11 +16,13 @@
 
 #import <React/RCTBridge.h>
 
+#import "ExternalAPI.h"
 #import "JitsiMeet.h"
 
 @interface JitsiMeet ()
 
 - (NSDictionary *)getDefaultProps;
 - (RCTBridge *)getReactBridge;
+- (ExternalAPI *)getExternalAPI;
 
 @end

ios/sdk/src/JitsiMeet.m

@@ -23,6 +23,7 @@
 #import "RCTBridgeWrapper.h"
 #import "ReactUtils.h"
 #import "RNSplashScreen.h"
+#import "ScheenshareEventEmiter.h"
 
 #import <RNGoogleSignin/RNGoogleSignin.h>
 #import <WebRTC/RTCLogging.h>
@@ -31,6 +32,7 @@
 @implementation JitsiMeet {
     RCTBridgeWrapper *_bridgeWrapper;
     NSDictionary *_launchOptions;
+    ScheenshareEventEmiter *_screenshareEventEmiter;
 }
 
 #pragma mak - This class is a singleton
@@ -50,6 +52,9 @@
     if (self = [super init]) {
         // Initialize the on and only bridge for interfacing with React Native.
         _bridgeWrapper = [[RCTBridgeWrapper alloc] init];
+        
+        // Initialize the listener for handling start/stop screensharing notifications.
+        _screenshareEventEmiter = [[ScheenshareEventEmiter alloc] init];
 
         // Register a fatal error handler for React.
         registerReactFatalErrorHandler();
@@ -213,4 +218,8 @@
     return _bridgeWrapper.bridge;
 }
 
+- (ExternalAPI *)getExternalAPI {
+    return [_bridgeWrapper.bridge moduleForClass:ExternalAPI.class];
+}
+
 @end

ios/sdk/src/JitsiMeetView.h

@@ -36,9 +36,13 @@
  * Leaves the currently active conference.
  */
 - (void)leave;
-
 - (void)hangUp;
-
 - (void)setAudioMuted:(BOOL)muted;
+- (void)sendEndpointTextMessage:(NSString * _Nonnull)message :(NSString * _Nullable)to;
+- (void)toggleScreenShare;
+- (void)retrieveParticipantsInfo:(void (^ _Nonnull)(NSArray * _Nullable))completionHandler;
+- (void)openChat:(NSString * _Nullable)to;
+- (void)closeChat;
+- (void)sendChatMessage:(NSString * _Nonnull)message :(NSString * _Nullable)to;
 
 @end

ios/sdk/src/JitsiMeetView.m

@@ -116,13 +116,43 @@ static void initializeViewsMap() {
 }
 
 - (void)hangUp {
-    RCTBridge *bridge = [[JitsiMeet sharedInstance] getReactBridge];
-    [[bridge moduleForClass:ExternalAPI.class] sendHangUp];
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI sendHangUp];
 }
 
 - (void)setAudioMuted:(BOOL)muted {
-    RCTBridge *bridge = [[JitsiMeet sharedInstance] getReactBridge];
-    [[bridge moduleForClass:ExternalAPI.class] sendSetAudioMuted:muted];
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI sendSetAudioMuted:muted];
+}
+
+- (void)sendEndpointTextMessage:(NSString * _Nonnull)message :(NSString * _Nullable)to {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI sendEndpointTextMessage:message :to];
+}
+
+- (void)toggleScreenShare {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI toggleScreenShare];
+}
+
+- (void)retrieveParticipantsInfo:(void (^ _Nonnull)(NSArray * _Nullable))completionHandler {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI retrieveParticipantsInfo:completionHandler];
+}
+
+- (void)openChat:(NSString*)to  {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI openChat:to];
+}
+
+- (void)closeChat  {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI closeChat];
+}
+
+- (void)sendChatMessage:(NSString * _Nonnull)message :(NSString * _Nullable)to {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI sendChatMessage:message :to];
 }
 
 #pragma mark Private methods

ios/sdk/src/JitsiMeetViewDelegate.h

@@ -75,4 +75,33 @@
  * The `data` dictionary contains a `muted` key with state of the audioMuted for the localParticipant.
  */
 - (void)audioMutedChanged:(NSDictionary *)data;
+
+/**
+ * Called when an endpoint text message is received.
+ *
+ * The `data` dictionary contains a `senderId` key with the participantId of the sender and a 'message' key with the content.
+ */
+- (void)endpointTextMessageReceived:(NSDictionary *)data;
+
+/**
+ * Called when a participant toggled shared screen.
+ *
+ * The `data` dictionary contains a `participantId` key with the id of the participant  and a 'sharing' key with boolean value.
+ */
+- (void)screenShareToggled:(NSDictionary *)data;
+
+/**
+ * Called when a chat message is received.
+ *
+ * The `data` dictionary contains `message`, `senderId` and  `isPrivate` keys.
+ */
+- (void)chatMessaageReceived:(NSDictionary *)data;
+
+/**
+ * Called when the chat dialog is displayed/hidden.
+ *
+ * The `data` dictionary contains a `isOpen` key.
+ */
+- (void)chatToggled:(NSDictionary *)data;
+
 @end

ios/sdk/src/ScheenshareEventEmiter.h

@@ -0,0 +1,25 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface ScheenshareEventEmiter : NSObject
+
+@end
+
+NS_ASSUME_NONNULL_END

ios/sdk/src/ScheenshareEventEmiter.m

@@ -0,0 +1,63 @@
+/*
+ * Copyright @ 2021-present 8x8, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#import "ScheenshareEventEmiter.h"
+#import "JitsiMeet+Private.h"
+#import "ExternalAPI.h"
+
+NSNotificationName const kBroadcastStartedNotification = @"iOS_BroadcastStarted";
+NSNotificationName const kBroadcastStoppedNotification = @"iOS_BroadcastStopped";
+
+@implementation ScheenshareEventEmiter {
+    CFNotificationCenterRef _notificationCenter;
+}
+
+- (instancetype)init {
+    self = [super init];
+    if (self) {
+        _notificationCenter = CFNotificationCenterGetDarwinNotifyCenter();
+        [self setupObserver];
+    }
+    
+    return self;
+}
+
+- (void)dealloc {
+    [self clearObserver];
+}
+
+// MARK: Private Methods
+
+- (void)setupObserver {
+    CFNotificationCenterAddObserver(_notificationCenter, (__bridge const void *)(self), broadcastToggleNotificationCallback, (__bridge CFStringRef)kBroadcastStartedNotification, NULL, CFNotificationSuspensionBehaviorDeliverImmediately);
+    CFNotificationCenterAddObserver(_notificationCenter, (__bridge const void *)(self), broadcastToggleNotificationCallback, (__bridge CFStringRef)kBroadcastStoppedNotification, NULL, CFNotificationSuspensionBehaviorDeliverImmediately);
+}
+
+- (void)clearObserver {
+    CFNotificationCenterRemoveObserver(_notificationCenter, (__bridge const void *)(self), (__bridge CFStringRef)kBroadcastStartedNotification, NULL);
+    CFNotificationCenterRemoveObserver(_notificationCenter, (__bridge const void *)(self), (__bridge CFStringRef)kBroadcastStoppedNotification, NULL);
+}
+
+void broadcastToggleNotificationCallback(CFNotificationCenterRef center,
+                                         void *observer,
+                                         CFStringRef name,
+                                         const void *object,
+                                         CFDictionaryRef userInfo) {
+    ExternalAPI *externalAPI = [[JitsiMeet sharedInstance] getExternalAPI];
+    [externalAPI toggleScreenShare];
+}
+
+@end

lang/languages-fa.json

@@ -32,6 +32,7 @@
     "lv": "لتونیایی",
     "nl": "هلندی",
     "oc": "اکسیتان(قدیمی)",
+    "fa": "فارسی",
     "pl": "لهستانی",
     "ptBR": "پرتغالی (برزیل)",
     "ru": "روسی",
@@ -47,4 +48,4 @@
     "vi": "ویتنامی",
     "zhCN": "چینی",
     "zhTW": "چینی (تایوان)"
-}
+}