Merge pull request #1308 from jitsi/ss_resize_remote

Fix for the size of remote desktop sharing videos

.editorconfig

@@ -8,3 +8,6 @@ indent_size = 4
 indent_style = space
 max_line_length = 80
 trim_trailing_whitespace = true
+
+[Makefile]
+indent_style = tab

.eslintignore

@@ -3,6 +3,7 @@ build/*
 
 # Third-party source code which we (1) do not want to modify or (2) try to
 # modify as little as possible.
+flow-typed/*
 libs/*
 
 # ESLint will by default ignore its own configuration file. However, there does

.eslintrc.js

@@ -4,7 +4,10 @@ module.exports = {
         'commonjs': true,
         'es6': true
     },
-    'extends': 'eslint:recommended',
+    'extends': [
+        'eslint:recommended',
+        'plugin:flowtype/recommended'
+    ],
     'globals': {
         // The globals that (1) are accessed but not defined within many of our
         // files, (2) are certainly defined, and (3) we would like to use
@@ -12,12 +15,16 @@ module.exports = {
         // files.
         '__filename': false
     },
+    'parser': 'babel-eslint',
     'parserOptions': {
         'ecmaFeatures': {
             'experimentalObjectRestSpread': true
         },
         'sourceType': 'module'
     },
+    'plugins': [
+        'flowtype'
+    ],
     'rules': {
         'new-cap': [
             'error',

.flowconfig

@@ -0,0 +1,50 @@
+[ignore]
+; We fork some components by platform
+.*/*[.]android.js
+
+; Ignore "BUCK" generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+; Ignore unexpected extra "@providesModule"
+.*/node_modules/.*/node_modules/fbjs/.*
+
+; Ignore duplicate module providers
+; For RN Apps installed via npm, "Libraries" folder is inside
+; "node_modules/react-native" but in the source repo it is in the root
+.*/Libraries/react-native/React.js
+.*/Libraries/react-native/ReactNative.js
+
+; Ignore packages in node_modules which we (i.e. the jitsi-meet project) have
+; seen to cause errors and we have chosen not to fix.
+.*/node_modules/babel-core/.*
+.*/node_modules/bower/.*
+.*/node_modules/jsonlint/.*
+
+[include]
+
+[libs]
+node_modules/react-native/Libraries/react-native/react-native-interface.js
+node_modules/react-native/flow
+flow/
+
+[options]
+module.system=haste
+
+experimental.strict_type_args=true
+
+munge_underscores=true
+
+module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FixMe
+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-7]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-7]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
+
+unsafe.enable_getters_and_setters=true
+
+[version]
+^0.37.0

.gitattributes

@@ -1,2 +1,3 @@
 *.bundle.js -text -diff
+*.pbxproj -text
 lib-jitsi-meet.js -text -diff

.gitignore

@@ -4,7 +4,6 @@ deploy-local.sh
 libs/
 all.css
 *css.map
-unsupported_browser.css
 .remote-sync.json
 .sync-config.cson
 
@@ -36,21 +35,34 @@ DerivedData
 *.xcuserstate
 project.xcworkspace
 
-# Android/IJ
+# Android/IntelliJ
 #
-*.iml
+build/
 .idea
 .gradle
 local.properties
+*.iml
 
 # node.js
 #
 node_modules/
 npm-debug.log
+yarn-error.log
 
 # BUCK
 #
 buck-out/
 \.buckd/
 android/app/libs
-android/keystores/debug.keystore
+*.keystore
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use
+# fastlane to re-generate the screenshots whenever they are needed. For more
+# information about the recommended setup visit:
+# https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
+#
+fastlane/report.xml
+fastlane/Preview.html
+fastlane/screenshots

.jshintignore

@@ -1,6 +1,12 @@
+# The following do not need to be checked because they do not represent JS
+# source code.
+build/
 debian/
 libs/
 node_modules/
+
+# The following are checked by ESLint which supersedes JSHint.
+flow-typed/
 react/
+
 analytics.js
-webpack.config.babel.js

404.html

@@ -6,7 +6,7 @@
 <body>
     <div class="error_page">
         <h2>404 Not Found</h2>
-        <p class="error_page__message">You can create new conversation <a href="/">here</a></p>
+        <p class="error_page__message">You can create new conversation <a class="link" href="/">here</a></p>
     </div>
 </body>
 </html>

ConferenceEvents.js

@@ -0,0 +1,4 @@
+/**
+ * Notifies interested parties that hangup procedure will start.
+ */
+export const BEFORE_HANGUP = "conference.before_hangup";

Makefile

@@ -8,7 +8,6 @@ OUTPUT_DIR = .
 STYLES_BUNDLE = css/all.bundle.css
 STYLES_DESTINATION = css/all.css
 STYLES_MAIN = css/main.scss
-STYLES_UNSUPPORTED_BROWSER = css/unsupported_browser.scss
 WEBPACK = ./node_modules/.bin/webpack
 
 all: update-deps compile deploy clean
@@ -47,7 +46,6 @@ deploy-lib-jitsi-meet:
 		$(DEPLOY_DIR)
 
 deploy-css:
-	$(NODE_SASS) css/unsupported_browser.scss css/unsupported_browser.css ; \
 	$(NODE_SASS) $(STYLES_MAIN) $(STYLES_BUNDLE) && \
 	$(CLEANCSS) $(STYLES_BUNDLE) > $(STYLES_DESTINATION) ; \
 	rm $(STYLES_BUNDLE)
@@ -59,6 +57,5 @@ source-package:
 	mkdir -p source_package/jitsi-meet/css && \
 	cp -r *.js *.html connection_optimization favicon.ico fonts images libs sounds LICENSE lang source_package/jitsi-meet && \
 	cp css/all.css source_package/jitsi-meet/css && \
-	cp css/unsupported_browser.css source_package/jitsi-meet/css && \
 	(cd source_package ; tar cjf ../jitsi-meet.tar.bz2 jitsi-meet) && \
 	rm -rf source_package

README.md

@@ -1,5 +1,5 @@
-Jitsi Meet - Secure, Simple and Scalable Video Conferences
-====
+# Jitsi Meet - Secure, Simple and Scalable Video Conferences
+
 Jitsi Meet is an open-source (Apache) WebRTC JavaScript application that uses [Jitsi Videobridge](https://jitsi.org/videobridge) to provide high quality, scalable video conferences. You can see [Jitsi Meet in action](http://youtu.be/7vFUVClsNh0) here at the session #482 of the VoIP Users Conference.
 
 You can also try it out yourself at https://meet.jit.si .
@@ -12,6 +12,13 @@ Installing Jitsi Meet is quite a simple experience. For Debian-based systems, we
 
 For other systems, or if you wish to install all components manually, see the [detailed manual installation instructions](https://github.com/jitsi/jitsi-meet/blob/master/doc/manual-install.md).
 
+## Download
+
+You can download Debian/Ubuntu binaries:
+* [stable](https://download.jitsi.org/stable/) ([instructions](https://jitsi.org/Main/InstallJitsiMeetDebianStableRepository))
+* [testing](https://download.jitsi.org/testing/) ([instructions](https://jitsi.org/Main/InstallJitsiMeetDebianTestingRepository))
+* [nightly](https://download.jitsi.org/unstable/) ([instructions](https://jitsi.org/Main/InstallJitsiMeetDebianNightlyRepository))
+
 ## Building the sources
 
 Jitsi Meet uses [Browserify](http://browserify.org). If you want to make changes in the code you need to [install Browserify](http://browserify.org/#install). Browserify requires [nodejs](http://nodejs.org).
@@ -28,7 +35,7 @@ To build the Jitsi Meet application, just type
 make
 ```
 
-## Working with the library sources(lib-jitsi-meet).
+## Working with the library sources (lib-jitsi-meet)
 
 By default the library is build from its git repository sources. The default dependency path in package.json is :
 ```json
@@ -75,6 +82,14 @@ npm unlink lib-jitsi-meet
 npm install
 ```
 
+## Embedding in external applications
+
+Jitsi Meet provides a very flexible way of embedding it in external applications by using the [Jitsi Meet API](doc/api.md).
+
+## Mobile app
+Jitsi Meet is also available as a React Native application for Android and iOS.
+Instructions on how to build it can be  found [here](doc/mobile.md).
+
 ## Discuss
 Please use the [Jitsi dev mailing list](http://lists.jitsi.org/pipermail/dev/) to discuss feature requests before opening an issue on Github.
 

analytics.js

@@ -27,5 +27,7 @@
         action + '.' + data.browserName, label, value);
   };
 
-  ctx.Analytics = Analytics;
+  if(typeof ctx.analyticsHandlers === "undefined")
+    ctx.analyticsHandlers = [];
+  ctx.analyticsHandlers.push(Analytics);
 }(window));

android/app/BUCK

@@ -46,13 +46,13 @@ android_library(
 
 android_build_config(
   name = 'build_config',
-  package = 'org.jitsi.jitsi_meet_react',
+  package = 'org.jitsi.meet',
 )
 
 android_resource(
   name = 'res',
   res = 'src/main/res',
-  package = 'org.jitsi.jitsi_meet_react',
+  package = 'org.jitsi.meet',
 )
 
 android_binary(

android/app/build.gradle

@@ -1,15 +1,4 @@
-buildscript {
-    repositories {
-        maven { url 'https://maven.fabric.io/public' }
-    }
-
-    dependencies {
-        classpath 'io.fabric.tools:gradle:1.+'
-    }
-}
-
 apply plugin: 'com.android.application'
-apply plugin: 'io.fabric'
 
 import com.android.build.OutputFile
 
@@ -98,11 +87,11 @@ android {
     buildToolsVersion '23.0.1'
 
     defaultConfig {
-        applicationId 'org.jitsi.jitsi_meet_react'
+        applicationId 'org.jitsi.meet'
         minSdkVersion 16
         targetSdkVersion 22
-        versionCode 1
-        versionName '1.0'
+        versionCode Integer.parseInt("${version}")
+        versionName "1.2.${version}"
         ndk {
             abiFilters 'armeabi-v7a', 'x86'
         }
@@ -149,18 +138,14 @@ if (project.hasProperty('JITSI_SIGNING')
     apply from: project.property('JITSI_SIGNING');
 }
 
-repositories {
-    maven { url 'https://maven.fabric.io/public' }
-}
 dependencies {
+    compile project(':react-native-immersive')
+    compile project(':react-native-keep-awake')
     compile project(':react-native-vector-icons')
     compile project(':react-native-webrtc')
     compile fileTree(dir: 'libs', include: ['*.jar'])
     compile 'com.android.support:appcompat-v7:23.0.1'
-    compile 'com.facebook.react:react-native:+'
-    compile('com.crashlytics.sdk.android:crashlytics:2.6.5@aar') {
-        transitive = true
-    }
+    compile 'com.facebook.react:react-native:+'  // From node_modules
 }
 
 apply from: '../../node_modules/react-native-vector-icons/fonts.gradle'
@@ -168,6 +153,6 @@ apply from: '../../node_modules/react-native-vector-icons/fonts.gradle'
 // Run this once to be able to run the application with BUCK
 // puts all compile dependencies into folder libs for BUCK to use
 task copyDownloadableDepsToLibs(type: Copy) {
-  from configurations.compile
-  into 'libs'
+    from configurations.compile
+    into 'libs'
 }

android/app/src/main/AndroidManifest.xml

@@ -1,11 +1,14 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="org.jitsi.jitsi_meet_react"
+    package="org.jitsi.meet"
     android:versionCode="1"
     android:versionName="1.0">
 
-    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /><!-- WebRTC -->
+    <!-- XXX: ACCESS_NETWORK_STATE is required by WebRTC. -->
+    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+    <uses-permission android:name="android.permission.BLUETOOTH" />
     <uses-permission android:name="android.permission.CAMERA" />
     <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
     <uses-permission android:name="android.permission.RECORD_AUDIO" />
     <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
 
@@ -13,8 +16,8 @@
     <uses-feature android:name="android.hardware.camera.autofocus"/>
 
     <uses-sdk
-        android:minSdkVersion="16"
-        android:targetSdkVersion="22" />
+        android:minSdkVersion="19"
+        android:targetSdkVersion="23" />
 
     <application
       android:allowBackup="true"
@@ -35,16 +38,21 @@
             <action android:name="android.intent.action.VIEW" />
             <category android:name="android.intent.category.BROWSABLE" />
             <category android:name="android.intent.category.DEFAULT" />
+            <data android:host="beta.hipchat.me" android:scheme="https" />
             <data android:host="beta.meet.jit.si" android:scheme="https" />
             <data android:host="chaos.hipchat.me" android:scheme="https" />
             <data android:host="enso.me" android:scheme="https" />
+            <data android:host="hipchat.me" android:scheme="https" />
             <data android:host="meet.jit.si" android:scheme="https" />
         </intent-filter>
+        <intent-filter>
+            <action android:name="android.intent.action.VIEW" />
+            <category android:name="android.intent.category.BROWSABLE" />
+            <category android:name="android.intent.category.DEFAULT" />
+            <data android:scheme="org.jitsi.meet" />
+        </intent-filter>
       </activity>
       <activity
         android:name="com.facebook.react.devsupport.DevSettingsActivity" />
-      <meta-data
-        android:name="io.fabric.ApiKey"
-        android:value="a8ae24a58302ba79da1d312138e941f6b86e3242" />
     </application>
 </manifest>

android/app/src/main/java/org/jitsi/jitsi_meet_react/MainApplication.java

@@ -1,39 +0,0 @@
-package org.jitsi.jitsi_meet_react;
-
-import android.app.Application;
-import android.util.Log;
-
-import com.facebook.react.ReactApplication;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.ReactNativeHost;
-import com.facebook.react.ReactPackage;
-import com.facebook.react.shell.MainReactPackage;
-import com.oblador.vectoricons.VectorIconsPackage;
-import com.oney.WebRTCModule.WebRTCModulePackage;
-
-import java.util.Arrays;
-import java.util.List;
-
-public class MainApplication extends Application implements ReactApplication {
-
-  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
-    @Override
-    protected boolean getUseDeveloperSupport() {
-      return BuildConfig.DEBUG;
-    }
-
-    @Override
-    protected List<ReactPackage> getPackages() {
-      return Arrays.<ReactPackage>asList(
-          new MainReactPackage(),
-          new VectorIconsPackage(),
-          new WebRTCModulePackage()
-      );
-    }
-  };
-
-  @Override
-  public ReactNativeHost getReactNativeHost() {
-      return mReactNativeHost;
-  }
-}

android/app/src/main/java/org/jitsi/meet/MainActivity.java

@@ -1,11 +1,8 @@
-package org.jitsi.jitsi_meet_react;
+package org.jitsi.meet;
 
-import android.os.Bundle;
-import com.crashlytics.android.Crashlytics;
 import com.facebook.react.ReactActivity;
 import com.facebook.react.ReactActivityDelegate;
 import com.facebook.react.ReactRootView;
-import io.fabric.sdk.android.Fabric;
 
 public class MainActivity extends ReactActivity {
     /**
@@ -46,11 +43,4 @@ public class MainActivity extends ReactActivity {
     protected String getMainComponentName() {
         return "App";
     }
-
-    @Override
-    protected void onCreate(Bundle savedInstanceState) {
-        super.onCreate(savedInstanceState);
-
-        Fabric.with(this, new Crashlytics());
-    }
 }

android/app/src/main/java/org/jitsi/meet/MainApplication.java

@@ -0,0 +1,63 @@
+package org.jitsi.meet;
+
+import android.app.Application;
+
+import com.facebook.react.ReactApplication;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+import com.facebook.soloader.SoLoader;
+
+import java.util.Arrays;
+import java.util.List;
+
+public class MainApplication extends Application implements ReactApplication {
+    private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
+        /**
+         * {@inheritDoc}
+         */
+        @Override
+        public boolean getUseDeveloperSupport() {
+            return BuildConfig.DEBUG;
+        }
+
+        /**
+         * {@inheritDoc}
+         */
+        @Override
+        protected List<ReactPackage> getPackages() {
+            return Arrays.<ReactPackage>asList(
+                new com.corbt.keepawake.KCKeepAwakePackage(),
+                new com.facebook.react.shell.MainReactPackage(),
+                new com.oblador.vectoricons.VectorIconsPackage(),
+                new com.oney.WebRTCModule.WebRTCModulePackage(),
+                new com.rnimmersive.RNImmersivePackage(),
+                new org.jitsi.meet.audiomode.AudioModePackage()
+            );
+        }
+    };
+
+    /**
+     * {@inheritDoc}
+     */
+    @Override
+    public ReactNativeHost getReactNativeHost() {
+        return mReactNativeHost;
+    }
+
+    /**
+     * {@inheritDoc}
+     */
+    @Override
+    public void onCreate() {
+        super.onCreate();
+
+        SoLoader.init(this, /* native exopackage */ false);
+
+        if (!getReactNativeHost()
+                .getReactInstanceManager()
+                    .getDevSupportManager()
+                        .getDevSupportEnabled()) {
+            // TODO Auto-generated method stub
+        }
+    }
+}

android/app/src/main/java/org/jitsi/meet/audiomode/AudioModeModule.java

@@ -0,0 +1,322 @@
+package org.jitsi.meet.audiomode;
+
+import android.annotation.TargetApi;
+import android.content.BroadcastReceiver;
+import android.content.Context;
+import android.content.Intent;
+import android.content.IntentFilter;
+import android.media.AudioDeviceInfo;
+import android.media.AudioManager;
+import android.os.Build;
+import android.os.Handler;
+import android.os.Looper;
+import android.util.Log;
+
+import com.facebook.react.bridge.Promise;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.ReactContextBaseJavaModule;
+import com.facebook.react.bridge.ReactMethod;
+
+import java.util.HashMap;
+import java.util.Map;
+
+/**
+ * Module implementing a simple API to select the appropriate audio device for a
+ * conference call.
+ *
+ * Audio calls should use <tt>AudioModeModule.AUDIO_CALL</tt>, which uses the
+ * builtin earpiece, wired headset or bluetooth headset. The builtin earpiece is
+ * the default audio device.
+ *
+ * Video calls should should use <tt>AudioModeModule.VIDEO_CALL</tt>, which uses
+ * the builtin speaker, earpiece, wired headset or bluetooth headset. The
+ * builtin speaker is the default audio device.
+ *
+ * Before a call has started and after it has ended the
+ * <tt>AudioModeModule.DEFAULT</tt> mode should be used.
+ */
+public class AudioModeModule extends ReactContextBaseJavaModule {
+    /**
+     * Constants representing the audio mode.
+     * - DEFAULT: Used before and after every call. It represents the default
+     *   audio routing scheme.
+     * - AUDIO_CALL: Used for audio only calls. It will use the earpiece by
+     *   default, unless a wired or Bluetooth headset is connected.
+     * - VIDEO_CALL: Used for video calls. It will use the speaker by default,
+     *   unless a wired or Bluetooth headset is connected.
+     */
+    private static final int DEFAULT    = 0;
+    private static final int AUDIO_CALL = 1;
+    private static final int VIDEO_CALL = 2;
+
+    /**
+     *
+     */
+    private static final String ACTION_HEADSET_PLUG
+        = (Build.VERSION.SDK_INT >= 21)
+            ? AudioManager.ACTION_HEADSET_PLUG
+            : Intent.ACTION_HEADSET_PLUG;
+
+    /**
+     * React Native module name.
+     */
+    private static final String MODULE_NAME = "AudioMode";
+
+    /**
+     * Tag used when logging messages.
+     */
+    static final String TAG = MODULE_NAME;
+
+    /**
+     * {@link AudioManager} instance used to interact with the Android audio
+     * subsystem.
+     */
+    private final AudioManager audioManager;
+
+    /**
+     * {@link BluetoothHeadsetMonitor} for detecting Bluetooth device changes in
+     * old (< M) Android versions.
+     */
+    private BluetoothHeadsetMonitor bluetoothHeadsetMonitor;
+
+    /**
+     * {@link Handler} for running all operations on the main thread.
+     */
+    private final Handler mainThreadHandler
+        = new Handler(Looper.getMainLooper());
+
+    /**
+     * {@link Runnable} for running update operation on the main thread.
+     */
+    private final Runnable mainThreadRunner
+        = new Runnable() {
+            @Override
+            public void run() {
+                if (mode != -1) {
+                    updateAudioRoute(mode);
+                }
+            }
+        };
+
+    /**
+     * Audio mode currently in use.
+     */
+    private int mode = -1;
+
+    /**
+     * Initializes a new module instance. There shall be a single instance of
+     * this module throughout the lifetime of the application.
+     *
+     * @param reactContext the {@link ReactApplicationContext} where this module
+     * is created.
+     */
+    public AudioModeModule(ReactApplicationContext reactContext) {
+        super(reactContext);
+
+        audioManager
+            = (AudioManager)
+                reactContext.getSystemService(Context.AUDIO_SERVICE);
+
+        // Setup runtime device change detection.
+        setupAudioRouteChangeDetection();
+    }
+
+    /**
+     * Gets a mapping with the constants this module is exporting.
+     *
+     * @return a {@link Map} mapping the constants to be exported with their
+     * values.
+     */
+    @Override
+    public Map<String, Object> getConstants() {
+        Map<String, Object> constants = new HashMap<>();
+
+        constants.put("AUDIO_CALL", AUDIO_CALL);
+        constants.put("DEFAULT", DEFAULT);
+        constants.put("VIDEO_CALL", VIDEO_CALL);
+
+        return constants;
+    }
+
+    /**
+     * Gets the name for this module, to be used in the React Native bridge.
+     *
+     * @return a string with the module name.
+     */
+    @Override
+    public String getName() {
+        return MODULE_NAME;
+    }
+
+    /**
+     * Helper method to trigger an audio route update when devices change. It
+     * makes sure the operation is performed on the main thread.
+     */
+    void onAudioDeviceChange() {
+        mainThreadHandler.post(mainThreadRunner);
+    }
+
+    /**
+     * Helper method to set the output route to a Bluetooth device.
+     *
+     * @param enabled true if Bluetooth should use used, false otherwise.
+     */
+    private void setBluetoothAudioRoute(boolean enabled) {
+        if (enabled) {
+            audioManager.startBluetoothSco();
+            audioManager.setBluetoothScoOn(true);
+        } else {
+            audioManager.setBluetoothScoOn(false);
+            audioManager.stopBluetoothSco();
+        }
+    }
+
+    /**
+     * Public method to set the current audio mode.
+     *
+     * @param mode the desired audio mode.
+     * @param promise a {@link Promise} which will be resolved if the audio mode
+     * could be updated successfully, and it will be rejected otherwise.
+     */
+    @ReactMethod
+    public void setMode(final int mode, final Promise promise) {
+        if (mode != DEFAULT && mode != AUDIO_CALL && mode != VIDEO_CALL) {
+            promise.reject("setMode", "Invalid audio mode " + mode);
+            return;
+        }
+
+        Runnable r = new Runnable() {
+            @Override
+            public void run() {
+                if (updateAudioRoute(mode)) {
+                    AudioModeModule.this.mode = mode;
+                    promise.resolve(null);
+                } else {
+                    promise.reject(
+                            "setMode",
+                            "Failed to set the requested audio mode");
+                }
+            }
+        };
+        mainThreadHandler.post(r);
+    }
+
+    /**
+     * Setup the audio route change detection mechanism. We use the
+     * {@link android.media.AudioDeviceCallback} API on Android >= 23 only.
+     */
+    private void setupAudioRouteChangeDetection() {
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
+            setupAudioRouteChangeDetectionM();
+        } else {
+            setupAudioRouteChangeDetectionPreM();
+        }
+    }
+
+    /**
+     * Audio route change detection mechanism for Android API >= 23.
+     */
+    @TargetApi(Build.VERSION_CODES.M)
+    private void setupAudioRouteChangeDetectionM() {
+        android.media.AudioDeviceCallback audioDeviceCallback =
+                new android.media.AudioDeviceCallback() {
+                    @Override
+                    public void onAudioDevicesAdded(
+                            AudioDeviceInfo[] addedDevices) {
+                        Log.d(TAG, "Audio devices added");
+                        onAudioDeviceChange();
+                    }
+
+                    @Override
+                    public void onAudioDevicesRemoved(
+                            AudioDeviceInfo[] removedDevices) {
+                        Log.d(TAG, "Audio devices removed");
+                        onAudioDeviceChange();
+                    }
+                };
+
+        audioManager.registerAudioDeviceCallback(audioDeviceCallback, null);
+    }
+
+    /**
+     * Audio route change detection mechanism for Android API < 23.
+     */
+    private void setupAudioRouteChangeDetectionPreM() {
+        Context context = getReactApplicationContext();
+
+        // Detect changes in wired headset connections.
+        IntentFilter wiredHeadSetFilter = new IntentFilter(ACTION_HEADSET_PLUG);
+        BroadcastReceiver wiredHeadsetReceiver = new BroadcastReceiver() {
+            @Override
+            public void onReceive(Context context, Intent intent) {
+                Log.d(TAG, "Wired headset added / removed");
+                onAudioDeviceChange();
+            }
+        };
+        context.registerReceiver(wiredHeadsetReceiver, wiredHeadSetFilter);
+
+        // Detect Bluetooth device changes.
+        bluetoothHeadsetMonitor = new BluetoothHeadsetMonitor(this, context);
+    }
+
+    /**
+     * Updates the audio route for the given mode.
+     *
+     * @param mode the audio mode to be used when computing the audio route.
+     * @return true if the audio route was updated successfully, false
+     * otherwise.
+     */
+    private boolean updateAudioRoute(int mode) {
+        Log.d(TAG, "Update audio route for mode: " + mode);
+
+        if (mode == DEFAULT) {
+            audioManager.setMode(AudioManager.MODE_NORMAL);
+            audioManager.abandonAudioFocus(null);
+            audioManager.setSpeakerphoneOn(false);
+            audioManager.setMicrophoneMute(true);
+            setBluetoothAudioRoute(false);
+
+            return true;
+        }
+
+        audioManager.setMode(AudioManager.MODE_IN_COMMUNICATION);
+        audioManager.setMicrophoneMute(false);
+
+        if (audioManager.requestAudioFocus(
+                    null,
+                    AudioManager.STREAM_VOICE_CALL,
+                    AudioManager.AUDIOFOCUS_GAIN)
+                == AudioManager.AUDIOFOCUS_REQUEST_FAILED) {
+            Log.d(TAG, "Audio focus request failed");
+            return false;
+        }
+
+        boolean useSpeaker = (mode == VIDEO_CALL);
+
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
+            // On Android >= M we use the AudioDeviceCallback API, so turn on
+            // Bluetooth SCO from the start.
+            if (audioManager.isBluetoothScoAvailableOffCall()) {
+                audioManager.startBluetoothSco();
+            }
+        } else {
+            // On older Android versions we must set the Bluetooth route
+            // manually. Also disable the speaker in that case.
+            setBluetoothAudioRoute(
+                    bluetoothHeadsetMonitor.isHeadsetAvailable());
+            if (bluetoothHeadsetMonitor.isHeadsetAvailable()) {
+                useSpeaker = false;
+            }
+        }
+
+        // XXX: isWiredHeadsetOn is not deprecated when used just for knowing if
+        // there is a wired headset connected, regardless of audio being routed
+        // to it.
+        audioManager.setSpeakerphoneOn(
+                useSpeaker
+                    && !(audioManager.isWiredHeadsetOn()
+                        || audioManager.isBluetoothScoOn()));
+
+        return true;
+    }
+}

android/app/src/main/java/org/jitsi/meet/audiomode/AudioModePackage.java

@@ -0,0 +1,48 @@
+package org.jitsi.meet.audiomode;
+
+import com.facebook.react.ReactPackage;
+import com.facebook.react.bridge.JavaScriptModule;
+import com.facebook.react.bridge.NativeModule;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.uimanager.ViewManager;
+
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.List;
+
+/**
+ * Implements {@link ReactPackage} for {@link AudioModeModule}.
+ */
+public class AudioModePackage implements ReactPackage {
+    /**
+     * {@inheritDoc}
+     */
+    @Override
+    public List<Class<? extends JavaScriptModule>> createJSModules() {
+        return Collections.emptyList();
+    }
+
+    /**
+     * {@inheritDoc}
+     *
+     * @return List of native modules to be exposed by React Native.
+     */
+    @Override
+    public List<NativeModule> createNativeModules(
+            ReactApplicationContext reactContext) {
+        List<NativeModule> modules = new ArrayList<>();
+
+        modules.add(new AudioModeModule(reactContext));
+
+        return modules;
+    }
+
+    /**
+     * {@inheritDoc}
+     */
+    @Override
+    public List<ViewManager> createViewManagers(
+            ReactApplicationContext reactContext) {
+        return Collections.emptyList();
+    }
+}

android/app/src/main/java/org/jitsi/meet/audiomode/BluetoothHeadsetMonitor.java

@@ -0,0 +1,189 @@
+package org.jitsi.meet.audiomode;
+
+import android.bluetooth.BluetoothAdapter;
+import android.bluetooth.BluetoothDevice;
+import android.bluetooth.BluetoothHeadset;
+import android.bluetooth.BluetoothProfile;
+import android.content.BroadcastReceiver;
+import android.content.Context;
+import android.content.Intent;
+import android.content.IntentFilter;
+import android.media.AudioManager;
+import android.os.Handler;
+import android.os.Looper;
+import android.util.Log;
+
+/**
+ * Helper class to detect and handle Bluetooth device changes.  It monitors
+ * Bluetooth headsets being connected / disconnected and notifies the module
+ * about device changes when this occurs.
+ */
+public class BluetoothHeadsetMonitor {
+    /**
+     * {@link AudioModeModule} where this monitor reports.
+     */
+    private final AudioModeModule audioModeModule;
+
+    /**
+     * The {@link Context} in which {@link #audioModeModule} executes.
+     */
+    private final Context context;
+
+    /**
+     * Reference to a proxy object which allows us to query connected devices.
+     */
+    private BluetoothHeadset headset;
+
+    /**
+     * Flag indicating if there are any Bluetooth headset devices currently
+     * available.
+     */
+    private boolean headsetAvailable = false;
+
+    /**
+     * {@link Handler} for running all operations on the main thread.
+     */
+    private final Handler mainThreadHandler
+        = new Handler(Looper.getMainLooper());
+
+    /**
+     * Helper for running Bluetooth operations on the main thread.
+     */
+    private final Runnable updateDevicesRunnable
+        = new Runnable() {
+            @Override
+            public void run() {
+                headsetAvailable
+                    = (headset != null)
+                        && !headset.getConnectedDevices().isEmpty();
+                audioModeModule.onAudioDeviceChange();
+            }
+        };
+
+    public BluetoothHeadsetMonitor(
+            AudioModeModule audioModeModule,
+            Context context) {
+        this.audioModeModule = audioModeModule;
+        this.context = context;
+
+        AudioManager audioManager
+            = (AudioManager) context.getSystemService(Context.AUDIO_SERVICE);
+
+        if (!audioManager.isBluetoothScoAvailableOffCall()) {
+            Log.w(AudioModeModule.TAG, "Bluetooth SCO is not available");
+            return;
+        }
+
+        if (getBluetoothHeadsetProfileProxy()) {
+            registerBluetoothReceiver();
+
+            // Initial detection.
+            updateDevices();
+        }
+    }
+
+    private boolean getBluetoothHeadsetProfileProxy() {
+        BluetoothAdapter adapter = BluetoothAdapter.getDefaultAdapter();
+
+        if (adapter == null) {
+            Log.w(AudioModeModule.TAG, "Device doesn't support Bluetooth");
+            return false;
+        }
+
+        // XXX: The profile listener listens for system services of the given
+        // type being available to the application. That is, if our Bluetooth
+        // adapter has the "headset" profile.
+        BluetoothProfile.ServiceListener listener
+            = new BluetoothProfile.ServiceListener() {
+                @Override
+                public void onServiceConnected(
+                        int profile,
+                        BluetoothProfile proxy) {
+                    if (profile == BluetoothProfile.HEADSET) {
+                        headset = (BluetoothHeadset) proxy;
+                        updateDevices();
+                    }
+                }
+
+                @Override
+                public void onServiceDisconnected(int profile) {
+                    // The logic is the same as the logic of onServiceConnected.
+                    onServiceConnected(profile, /* proxy */ null);
+                }
+            };
+
+        return
+            adapter.getProfileProxy(
+                    context,
+                    listener,
+                    BluetoothProfile.HEADSET);
+    }
+
+    /**
+     * Returns the current headset availability.
+     *
+     * @return true if there is a Bluetooth headset connected, false otherwise.
+     */
+    public boolean isHeadsetAvailable() {
+        return headsetAvailable;
+    }
+
+    private void onBluetoothReceiverReceive(Context context, Intent intent) {
+        final String action = intent.getAction();
+
+        if (action.equals(BluetoothHeadset.ACTION_CONNECTION_STATE_CHANGED)) {
+            // XXX: This action will be fired when a Bluetooth headset is
+            // connected or disconnected to the system. This is not related to
+            // audio routing.
+            int state = intent.getIntExtra(BluetoothHeadset.EXTRA_STATE, -99);
+
+            switch (state) {
+            case BluetoothHeadset.STATE_CONNECTED:
+            case BluetoothHeadset.STATE_DISCONNECTED:
+                Log.d(
+                        AudioModeModule.TAG,
+                        "BT headset connection state changed: " + state);
+                updateDevices();
+                break;
+            }
+        } else if (action.equals(AudioManager.ACTION_SCO_AUDIO_STATE_UPDATED)) {
+            // XXX: This action will be fired when the connection established
+            // with a Bluetooth headset (called a SCO connection) changes state.
+            // When the SCO connection is active we route audio to it.
+            int state
+                = intent.getIntExtra(AudioManager.EXTRA_SCO_AUDIO_STATE, -99);
+
+            switch (state) {
+            case AudioManager.SCO_AUDIO_STATE_CONNECTED:
+            case AudioManager.SCO_AUDIO_STATE_DISCONNECTED:
+                Log.d(
+                        AudioModeModule.TAG,
+                        "BT SCO connection state changed: " + state);
+                updateDevices();
+                break;
+            }
+        }
+    }
+
+    private void registerBluetoothReceiver() {
+        BroadcastReceiver receiver = new BroadcastReceiver() {
+            @Override
+            public void onReceive(Context context, Intent intent) {
+                onBluetoothReceiverReceive(context, intent);
+            }
+        };
+        IntentFilter filter = new IntentFilter();
+
+        filter.addAction(AudioManager.ACTION_SCO_AUDIO_STATE_UPDATED);
+        filter.addAction(BluetoothHeadset.ACTION_CONNECTION_STATE_CHANGED);
+        context.registerReceiver(receiver, filter);
+    }
+
+    /**
+     * Detects if there are new devices connected / disconnected and fires the
+     * {@link AudioModeModule#onAudioDeviceChange()} callback.
+     */
+    private void updateDevices() {
+        mainThreadHandler.post(updateDevicesRunnable);
+    }
+}

android/app/src/main/res/values/styles.xml

@@ -3,6 +3,7 @@
     <!-- Base application theme. -->
     <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <!-- Customize your theme here. -->
+        <item name="android:windowTranslucentStatus">true</item>
     </style>
 
 </resources>

android/gradle.properties

@@ -18,3 +18,4 @@
 # org.gradle.parallel=true
 
 android.useDeprecatedNdk=true
+version=1

android/settings.gradle

@@ -1,6 +1,10 @@
 rootProject.name = 'jitsi-meet-react'
 
 include ':app'
+include ':react-native-immersive'
+project(':react-native-immersive').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-immersive/android')
+include ':react-native-keep-awake'
+project(':react-native-keep-awake').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-keep-awake/android')
 include ':react-native-vector-icons'
 project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
 include ':react-native-webrtc'

app.js

@@ -1,4 +1,3 @@
-/* global $, config, getRoomName */
 /* application specific logic */
 
 import "babel-polyfill";
@@ -7,7 +6,6 @@ import "jquery-contextmenu";
 import "jquery-ui";
 import "strophe";
 import "strophe-disco";
-import "strophe-caps";
 import "jQuery-Impromptu";
 import "autosize";
 
@@ -18,65 +16,13 @@ import 'aui-experimental-css';
 
 window.toastr = require("toastr");
 
-import URLProcessor from "./modules/config/URLProcessor";
-import RoomnameGenerator from './modules/util/RoomnameGenerator';
-
 import UI from "./modules/UI/UI";
 import settings from "./modules/settings/Settings";
 import conference from './conference';
-import ConferenceUrl from './modules/URL/ConferenceUrl';
 import API from './modules/API/API';
 
-import UIEvents from './service/UI/UIEvents';
-import getTokenData from "./modules/tokendata/TokenData";
 import translation from "./modules/translation/translation";
-
-/**
- * Tries to push history state with the following parameters:
- * 'VideoChat', `Room: ${roomName}`, URL. If fail, prints the error and returns
- * it.
- */
-function pushHistoryState(roomName, URL) {
-    try {
-        window.history.pushState(
-            'VideoChat', `Room: ${roomName}`, URL
-        );
-    } catch (e) {
-        console.warn("Push history state failed with parameters:",
-            'VideoChat', `Room: ${roomName}`, URL, e);
-        return e;
-    }
-    return null;
-}
-
-/**
- * Replaces current history state(replaces the URL displayed by the browser).
- * @param {string} newUrl the URL string which is to be displayed by the browser
- * to the user.
- */
-function replaceHistoryState (newUrl) {
-    if (window.history
-        && typeof window.history.replaceState === 'function') {
-        window.history.replaceState({}, document.title, newUrl);
-    }
-}
-
-/**
- * Builds and returns the room name.
- */
-function buildRoomName () {
-    let roomName = getRoomName();
-
-    if(!roomName) {
-        let word = RoomnameGenerator.generateRoomWithoutSeparator();
-        roomName = word.toLowerCase();
-        let historyURL = window.location.href + word;
-        //Trying to push state with current URL + roomName
-        pushHistoryState(word, historyURL);
-    }
-
-    return roomName;
-}
+import remoteControl from "./modules/remotecontrol/RemoteControl";
 
 const APP = {
     // Used by do_external_connect.js if we receive the attach data after
@@ -97,6 +43,16 @@ const APP = {
     settings,
     conference,
     translation,
+    /**
+     * The log collector which captures JS console logs for this app.
+     * @type {LogCollector}
+     */
+    logCollector: null,
+    /**
+     * Indicates if the log collector has been started (it will not be started
+     * if the welcome page is displayed).
+     */
+    logCollectorStarted : false,
     /**
      * After the APP has been initialized provides utility methods for dealing
      * with the conference room URL(address).
@@ -105,104 +61,15 @@ const APP = {
     ConferenceUrl : null,
     connection: null,
     API,
-    init () {
-        this.keyboardshortcut =
-            require("./modules/keyboardshortcut/keyboardshortcut");
-        this.configFetch = require("./modules/config/HttpConfigFetch");
-        this.tokenData = getTokenData();
-    }
+    remoteControl
 };
 
-/**
- * If JWT token data it will be used for local user settings
- */
-function setTokenData() {
-    let localUser = APP.tokenData.caller;
-    if(localUser) {
-        APP.settings.setEmail((localUser.getEmail() || "").trim(), true);
-        APP.settings.setAvatarUrl((localUser.getAvatarUrl() || "").trim());
-        APP.settings.setDisplayName((localUser.getName() || "").trim(), true);
-    }
-}
-
-function init() {
-    setTokenData();
-    // Initialize the conference URL handler
-    APP.ConferenceUrl = new ConferenceUrl(window.location);
-    // Clean up the URL displayed by the browser
-    replaceHistoryState(APP.ConferenceUrl.getInviteUrl());
-    var isUIReady = APP.UI.start();
-    if (isUIReady) {
-        APP.conference.init({roomName: buildRoomName()}).then(function () {
-            APP.UI.initConference();
-
-            APP.UI.addListener(UIEvents.LANG_CHANGED, function (language) {
-                APP.translation.setLanguage(language);
-                APP.settings.setLanguage(language);
-            });
-
-            APP.keyboardshortcut.init();
-        }).catch(function (err) {
-            APP.UI.hideRingOverLay();
-            APP.API.notifyConferenceLeft(APP.conference.roomName);
-            console.error(err);
-        });
-    }
-}
-
-/**
- * If we have an HTTP endpoint for getting config.json configured we're going to
- * read it and override properties from config.js and interfaceConfig.js.
- * If there is no endpoint we'll just continue with initialization.
- * Keep in mind that if the endpoint has been configured and we fail to obtain
- * the config for any reason then the conference won't start and error message
- * will be displayed to the user.
- */
-function obtainConfigAndInit() {
-    let roomName = APP.conference.roomName;
-
-    if (config.configLocation) {
-        APP.configFetch.obtainConfig(
-            config.configLocation, roomName,
-            // Get config result callback
-            function(success, error) {
-                if (success) {
-                    var now = APP.connectionTimes["configuration.fetched"] =
-                        window.performance.now();
-                    console.log("(TIME) configuration fetched:\t", now);
-                    init();
-                } else {
-                    // Show obtain config error,
-                    // pass the error object for report
-                    APP.UI.messageHandler.openReportDialog(
-                        null, "dialog.connectError", error);
-                }
-            });
-    } else {
-        require("./modules/config/BoshAddressChoice").chooseAddress(
-            config, roomName);
-
-        init();
-    }
-}
-
-
-$(document).ready(function () {
-    var now = APP.connectionTimes["document.ready"] = window.performance.now();
-    console.log("(TIME) document ready:\t", now);
-
-    URLProcessor.setConfigParametersFromUrl();
-    APP.init();
-
-    APP.translation.init(settings.getLanguage());
-
-    APP.API.init(APP.tokenData.externalAPISettings);
-
-    obtainConfigAndInit();
-});
-
-$(window).bind('beforeunload', function () {
-    APP.API.dispose();
-});
+// TODO The execution of the mobile app starts from react/index.native.js.
+// Similarly, the execution of the Web app should start from react/index.web.js
+// for the sake of consistency and ease of understanding. Temporarily though
+// because we are at the beginning of introducing React into the Web app, allow
+// the execution of the Web app to start from app.js in order to reduce the
+// complexity of the beginning step.
+require('./react');
 
 module.exports = APP;

close.html

@@ -3,25 +3,16 @@
     <link rel="stylesheet" href="css/all.css"/>
     <!--#include virtual="title.html" -->
     <script><!--#include virtual="/interface_config.js" --></script>
-    <script>function translateStr(id, msg) {
-        var div = document.getElementById(id);
-        div.innerHTML = msg;
-    }
-    function translate() {
-        translateStr('hintMessage',
-            'You can use video calls with '
-            + interfaceConfig.APP_NAME +' for your business');
-    }
-    </script>
+    <script src="close.js"></script>
 </head>
-<body onload="translate();">
+<body>
 <div class="redirectPageMessage">
     <div class="thanks-msg">
-        <p id="thanksMessage">Thank you for your feedback!</p>
+        <p>Thank you for your feedback!</p>
     </div>
     <div class="hint-msg">
         <p>
-            <span>Did you know?</span>
+            <span id="hintQuestion">Did you know?</span>
             <span class="hint-msg__holder" id="hintMessage"></span>
         </p>
         <div class="happy-software"></div>

close.js

@@ -0,0 +1,59 @@
+/* global interfaceConfig */
+//list of tips
+var hints = [
+    "You can pin participants by clicking on their thumbnails.",// jshint ignore:line
+    "You can tell others you have something to say by using the \"Raise Hand\" feature",// jshint ignore:line
+    "You can learn about key shortcuts by pressing Shift+?",// jshint ignore:line
+    "You can learn more about the state of everyone's connection by hovering on the bars in their thumbnail",// jshint ignore:line
+    "You can hide all thumbnails by using the button in the bottom right corner"// jshint ignore:line
+];
+
+/**
+ * Get a random hint meessage from hint array.
+ *
+ * @return {string} the hint message.
+ */
+function getHint(){
+    var l = hints.length - 1;
+    var n = Math.round(Math.random() * l);
+
+    return hints[n];
+}
+
+/**
+ * Inserts text message
+ * into DOM element
+ *
+ * @param id {string} element identificator
+ * @param msg {string} text message
+ */
+// eslint-disable-next-line no-unused-vars
+function insertTextMsg(id, msg){
+    var el = document.getElementById(id);
+
+    if (el)
+        el.innerHTML = msg;
+}
+
+/**
+ * Sets the hint and thanks messages. Will be executed on load event.
+ */
+function onLoad() {
+    //Works only for close2.html because close.html doesn't have this element.
+    insertTextMsg('thanksMessage',
+        'Thank you for using ' + interfaceConfig.APP_NAME);
+
+    // If there is a setting show a special message only for the guests
+    if (interfaceConfig.CLOSE_PAGE_GUEST_HINT) {
+        if ( window.sessionStorage.getItem('guest') === 'true' ) {
+            var element = document.getElementById('hintQuestion');
+            element.classList.add('hide');
+            insertTextMsg('hintMessage', interfaceConfig.CLOSE_PAGE_GUEST_HINT);
+            return;
+        }
+    }
+
+    insertTextMsg('hintMessage', getHint());
+}
+
+window.onload = onLoad;

close2.html

@@ -3,27 +3,16 @@
     <link rel="stylesheet" href="css/all.css"/>
     <!--#include virtual="title.html" -->
     <script><!--#include virtual="/interface_config.js" --></script>
-    <script>function translateStr(id, msg) {
-        var div = document.getElementById(id);
-        div.innerHTML = msg;
-    }
-    function translate() {
-        translateStr('thanksMessage',
-            'Thank you for using ' + interfaceConfig.APP_NAME);
-        translateStr('hintMessage',
-            'You can use video calls with '
-            + interfaceConfig.APP_NAME +' for your business');
-    }
-    </script>
+    <script src="close.js"></script>
 </head>
-<body onload="translate();">
+<body>
     <div class="redirectPageMessage">
         <div class="thanks-msg">
             <p id="thanksMessage"></p>
         </div>
         <div class="hint-msg">
             <p>
-                <span>Did you know?</span>
+                <span id="hintQuestion">Did you know?</span>
                 <span class="hint-msg__holder" id="hintMessage"></span>
             </p>
             <div class="happy-software"></div>

conference.js

@@ -1,4 +1,6 @@
 /* global $, APP, JitsiMeetJS, config, interfaceConfig */
+const logger = require("jitsi-meet-logger").getLogger(__filename);
+
 import {openConnection} from './connection';
 import Invite from './modules/UI/invite/Invite';
 import ContactList from './modules/UI/side_pannels/contactlist/ContactList';
@@ -8,10 +10,15 @@ import Recorder from './modules/recorder/Recorder';
 
 import mediaDeviceHelper from './modules/devices/mediaDeviceHelper';
 
-import {reportError} from './modules/util/helpers';
+import { reload, reportError } from './modules/util/helpers';
 
 import UIEvents from './service/UI/UIEvents';
 import UIUtil from './modules/UI/util/UIUtil';
+import * as JitsiMeetConferenceEvents from './ConferenceEvents';
+
+import analytics from './modules/analytics/analytics';
+
+import EventEmitter from "events";
 
 const ConnectionEvents = JitsiMeetJS.events.connection;
 const ConnectionErrors = JitsiMeetJS.errors.connection;
@@ -24,6 +31,8 @@ const TrackErrors = JitsiMeetJS.errors.track;
 
 const ConnectionQualityEvents = JitsiMeetJS.events.connectionQuality;
 
+const eventEmitter = new EventEmitter();
+
 let room, connection, localAudio, localVideo;
 
 /**
@@ -164,7 +173,7 @@ function muteLocalMedia(localMedia, muted, localMediaTypeString) {
     const method = muted ? 'mute' : 'unmute';
 
     localMedia[method]().catch(reason => {
-        console.warn(`${localMediaTypeString} ${method} was rejected:`, reason);
+        logger.warn(`${localMediaTypeString} ${method} was rejected:`, reason);
     });
 }
 
@@ -191,10 +200,11 @@ function muteLocalVideo (muted) {
 function maybeRedirectToWelcomePage(options) {
     // if close page is enabled redirect to it, without further action
     if (config.enableClosePage) {
-        if (options.feedbackSubmitted)
-            window.location.pathname = "close.html";
-        else
-            window.location.pathname = "close2.html";
+        // save whether current user is guest or not, before navigating
+        // to close page
+        window.sessionStorage.setItem('guest', APP.tokenData.isGuest);
+        assignWindowLocationPathname(
+                options.feedbackSubmitted ? "close.html" : "close2.html");
         return;
     }
 
@@ -207,11 +217,42 @@ function maybeRedirectToWelcomePage(options) {
     if (config.enableWelcomePage) {
         setTimeout(() => {
             APP.settings.setWelcomePageEnabled(true);
-            window.location.pathname = "/";
+            assignWindowLocationPathname('./');
         }, 3000);
     }
 }
 
+/**
+ * Assigns a specific pathname to window.location.pathname taking into account
+ * the context root of the Web app.
+ *
+ * @param {string} pathname - The pathname to assign to
+ * window.location.pathname. If the specified pathname is relative, the context
+ * root of the Web app will be prepended to the specified pathname before
+ * assigning it to window.location.pathname.
+ * @return {void}
+ */
+function assignWindowLocationPathname(pathname) {
+    const windowLocation = window.location;
+
+    if (!pathname.startsWith('/')) {
+        // XXX To support a deployment in a sub-directory, assume that the room
+        // (name) is the last non-directory component of the path (name).
+        let contextRoot = windowLocation.pathname;
+
+        contextRoot
+            = contextRoot.substring(0, contextRoot.lastIndexOf('/') + 1);
+
+        // A pathname equal to ./ specifies the current directory. It will be
+        // fine but pointless to include it because contextRoot is the current
+        // directory.
+        pathname.startsWith('./') && (pathname = pathname.substring(2));
+        pathname = contextRoot + pathname;
+    }
+
+    windowLocation.pathname = pathname;
+}
+
 /**
  * Create local tracks of specified types.
  * @param {Object} options
@@ -252,26 +293,10 @@ function createLocalTracks (options, checkForPermissionPrompt) {
             });
             return tracks;
         }).catch(function (err) {
-            console.error(
+            logger.error(
                 'failed to create local tracks', options.devices, err);
             return Promise.reject(err);
         });
-    }
-
-/**
- * Changes the email for the local user
- * @param email {string} the new email
- */
-function changeLocalEmail(email = '') {
-    email = email.trim();
-
-    if (email === APP.settings.getEmail()) {
-        return;
-    }
-
-    APP.settings.setEmail(email);
-    APP.UI.setUserEmail(room.myUserId(), email);
-    sendData(commands.EMAIL, email);
 }
 
 /**
@@ -292,9 +317,10 @@ function changeLocalDisplayName(nickname = '') {
 }
 
 class ConferenceConnector {
-    constructor(resolve, reject) {
+    constructor(resolve, reject, invite) {
         this._resolve = resolve;
         this._reject = reject;
+        this._invite = invite;
         this.reconnectTimeout = null;
         room.on(ConferenceEvents.CONFERENCE_JOINED,
             this._handleConferenceJoined.bind(this));
@@ -308,7 +334,7 @@ class ConferenceConnector {
         this._reject(err);
     }
     _onConferenceFailed(err, ...params) {
-        console.error('CONFERENCE FAILED:', err, ...params);
+        logger.error('CONFERENCE FAILED:', err, ...params);
         APP.UI.hideRingOverLay();
         switch (err) {
             // room is locked by the password
@@ -326,7 +352,7 @@ class ConferenceConnector {
         case ConferenceErrors.NOT_ALLOWED_ERROR:
             {
                 // let's show some auth not allowed page
-                window.location.pathname = "authError.html";
+                assignWindowLocationPathname('authError.html');
             }
             break;
 
@@ -338,7 +364,8 @@ class ConferenceConnector {
             }, 5000);
 
             // notify user that auth is required
-            AuthHandler.requireAuth(room, this.invite.getRoomLocker().password);
+            AuthHandler.requireAuth(
+                room, this._invite.getRoomLocker().password);
             break;
 
         case ConferenceErrors.RESERVATION_ERROR:
@@ -381,7 +408,8 @@ class ConferenceConnector {
             // the app. Both the errors above are unrecoverable from the library
             // perspective.
             room.leave().then(() => connection.disconnect());
-            APP.UI.showPageReloadOverlay();
+            APP.UI.showPageReloadOverlay(
+                false /* not a network type of failure */, err);
             break;
 
         case ConferenceErrors.CONFERENCE_MAX_USERS:
@@ -389,14 +417,14 @@ class ConferenceConnector {
             APP.UI.notifyMaxUsersLimitReached();
             break;
         case ConferenceErrors.INCOMPATIBLE_SERVER_VERSIONS:
-            window.location.reload();
+            reload();
             break;
         default:
             this._handleConferenceFailed(err, ...params);
         }
     }
     _onConferenceError(err, ...params) {
-        console.error('CONFERENCE Error:', err, params);
+        logger.error('CONFERENCE Error:', err, params);
         switch (err) {
         case ConferenceErrors.CHAT_ERROR:
             {
@@ -405,7 +433,7 @@ class ConferenceConnector {
             }
             break;
         default:
-            console.error("Unknown error.");
+            logger.error("Unknown error.", err);
         }
     }
     _unsubscribe() {
@@ -438,26 +466,6 @@ function disconnect() {
     return Promise.resolve();
 }
 
-/**
- * Set permanent properties to analytics.
- * NOTE: Has to be used after JitsiMeetJS.init. Otherwise analytics will be
- * null.
- */
-function setAnalyticsPermanentProperties() {
-    let permanentProperties = {
-        userAgent: navigator.userAgent,
-        roomName: APP.conference.roomName
-    };
-    let {server, group} = APP.tokenData;
-    if(server) {
-        permanentProperties.server = server;
-    }
-    if(group) {
-        permanentProperties.group = group;
-    }
-    JitsiMeetJS.analytics.addPermanentProperties(permanentProperties);
-}
-
 export default {
     isModerator: false,
     audioMuted: false,
@@ -480,8 +488,6 @@ export default {
      */
     init(options) {
         this.roomName = options.roomName;
-        JitsiMeetJS.setLogLevel(JitsiMeetJS.logLevels.TRACE);
-
         // attaches global error handler, if there is already one, respect it
         if(JitsiMeetJS.getGlobalOnErrorHandler){
             var oldOnErrorHandler = window.onerror;
@@ -504,20 +510,25 @@ export default {
             };
         }
 
-        return JitsiMeetJS.init(config)
-            .then(() => {
-                setAnalyticsPermanentProperties();
+        return JitsiMeetJS.init(
+            Object.assign(
+                {enableAnalyticsLogging: analytics.isEnabled()}, config)
+            ).then(() => {
+                analytics.init();
                 return createInitialLocalTracksAndConnect(options.roomName);
             }).then(([tracks, con]) => {
-                console.log('initialized with %s local tracks', tracks.length);
+                logger.log('initialized with %s local tracks', tracks.length);
                 APP.connection = connection = con;
-                this._bindConnectionFailedHandler(con);
-                this._createRoom(tracks);
                 this.isDesktopSharingEnabled =
                     JitsiMeetJS.isDesktopSharingEnabled();
+                APP.remoteControl.init();
+                this._bindConnectionFailedHandler(con);
+                this._createRoom(tracks);
 
-                if (UIUtil.isButtonEnabled('contacts'))
+                if (UIUtil.isButtonEnabled('contacts')
+                    && !interfaceConfig.filmStripOnly) {
                     APP.UI.ContactList = new ContactList(room);
+                }
 
                 // if user didn't give access to mic or camera or doesn't have
                 // them at all, we disable corresponding toolbar buttons
@@ -537,7 +548,8 @@ export default {
                 // XXX The API will take care of disconnecting from the XMPP
                 // server (and, thus, leaving the room) on unload.
                 return new Promise((resolve, reject) => {
-                    (new ConferenceConnector(resolve, reject)).connect();
+                    (new ConferenceConnector(
+                        resolve, reject, this.invite)).connect();
                 });
         });
     },
@@ -558,15 +570,34 @@ export default {
      */
     _bindConnectionFailedHandler (connection) {
         const handler = function (error, errMsg) {
-            if (ConnectionErrors.OTHER_ERROR === error) {
-                // - item-not-found
-                // - connection dropped(closed by Strophe unexpectedly
-                //   possible due too many transport errors)
-                console.error("XMPP connection error: " + errMsg);
-                APP.UI.showPageReloadOverlay();
-                connection.removeEventListener(
-                    ConnectionEvents.CONNECTION_FAILED, handler);
+            /* eslint-disable no-case-declarations */
+            switch (error) {
+                case ConnectionErrors.CONNECTION_DROPPED_ERROR:
+                case ConnectionErrors.OTHER_ERROR:
+                case ConnectionErrors.SERVER_ERROR:
+
+                    logger.error("XMPP connection error: " + errMsg);
+
+                    // From all of the cases above only CONNECTION_DROPPED_ERROR
+                    // is considered a network type of failure
+                    const isNetworkFailure
+                        = error === ConnectionErrors.CONNECTION_DROPPED_ERROR;
+
+                    APP.UI.showPageReloadOverlay(
+                        isNetworkFailure,
+                        "xmpp-conn-dropped:" + errMsg);
+
+                    connection.removeEventListener(
+                        ConnectionEvents.CONNECTION_FAILED, handler);
+
+                    // FIXME it feels like the conference should be stopped
+                    // by lib-jitsi-meet
+                    if (room)
+                        room.leave();
+
+                    break;
             }
+            /* eslint-enable no-case-declarations */
         };
         connection.addEventListener(
             ConnectionEvents.CONNECTION_FAILED, handler);
@@ -888,7 +919,7 @@ export default {
             } else if (track.isVideoTrack()) {
                 return this.useVideoStream(track);
             } else {
-                console.error(
+                logger.error(
                     "Ignored not an audio nor a video track: ", track);
                 return Promise.resolve();
             }
@@ -905,43 +936,40 @@ export default {
         return options;
     },
 
-    /**
-     * Start using provided video stream.
-     * Stops previous video stream.
-     * @param {JitsiLocalTrack} [stream] new stream to use or null
-     * @returns {Promise}
-     */
-    useVideoStream (stream) {
-        let promise = Promise.resolve();
-        if (localVideo) {
-            // this calls room.removeTrack internally
-            // so we don't need to remove it manually
-            promise = localVideo.dispose();
-        }
-        localVideo = stream;
 
-        return promise.then(function () {
-            if (stream) {
-                return room.addTrack(stream);
-            }
-        }).then(() => {
-            if (stream) {
-                this.videoMuted = stream.isMuted();
-                this.isSharingScreen = stream.videoType === 'desktop';
+  /**
+   * Start using provided video stream.
+   * Stops previous video stream.
+   * @param {JitsiLocalTrack} [stream] new stream to use or null
+   * @returns {Promise}
+   */
+    useVideoStream (newStream) {
+        return room.replaceTrack(localVideo, newStream)
+            .then(() => {
+                // We call dispose after doing the replace because
+                //  dispose will try and do a new o/a after the
+                //  track removes itself.  Doing it after means
+                //  the JitsiLocalTrack::conference member is already
+                //  cleared, so it won't try and do the o/a
+                if (localVideo) {
+                    localVideo.dispose();
+                }
+                localVideo = newStream;
+                if (newStream) {
+                    this.videoMuted = newStream.isMuted();
+                    this.isSharingScreen = newStream.videoType === 'desktop';
 
-                APP.UI.addLocalStream(stream);
+                    APP.UI.addLocalStream(newStream);
 
-                stream.videoType === 'camera'
-                    && APP.UI.setCameraButtonEnabled(true);
-            } else {
-                this.videoMuted = false;
-                this.isSharingScreen = false;
-            }
-
-            APP.UI.setVideoMuted(this.getMyUserId(), this.videoMuted);
-
-            APP.UI.updateDesktopSharingButtons();
-        });
+                    newStream.videoType === 'camera'
+                        && APP.UI.setCameraButtonEnabled(true);
+                } else {
+                    this.videoMuted = false;
+                    this.isSharingScreen = false;
+                }
+                APP.UI.setVideoMuted(this.getMyUserId(), this.videoMuted);
+                APP.UI.updateDesktopSharingButtons();
+            });
     },
 
     /**
@@ -950,41 +978,37 @@ export default {
      * @param {JitsiLocalTrack} [stream] new stream to use or null
      * @returns {Promise}
      */
-    useAudioStream (stream) {
-        let promise = Promise.resolve();
-        if (localAudio) {
-            // this calls room.removeTrack internally
-            // so we don't need to remove it manually
-            promise = localAudio.dispose();
-        }
-        localAudio = stream;
-
-        return promise.then(function () {
-            if (stream) {
-                return room.addTrack(stream);
-            }
-        }).then(() => {
-            if (stream) {
-                this.audioMuted = stream.isMuted();
-
-                APP.UI.addLocalStream(stream);
-            } else {
-                this.audioMuted = false;
-            }
-
-            APP.UI.setMicrophoneButtonEnabled(true);
-            APP.UI.setAudioMuted(this.getMyUserId(), this.audioMuted);
-        });
+    useAudioStream (newStream) {
+        return room.replaceTrack(localAudio, newStream)
+            .then(() => {
+                // We call dispose after doing the replace because
+                //  dispose will try and do a new o/a after the
+                //  track removes itself.  Doing it after means
+                //  the JitsiLocalTrack::conference member is already
+                //  cleared, so it won't try and do the o/a
+                if (localAudio) {
+                    localAudio.dispose();
+                }
+                localAudio = newStream;
+                if (newStream) {
+                    this.audioMuted = newStream.isMuted();
+                    APP.UI.addLocalStream(newStream);
+                } else {
+                    this.audioMuted = false;
+                }
+                APP.UI.setMicrophoneButtonEnabled(true);
+                APP.UI.setAudioMuted(this.getMyUserId(), this.audioMuted);
+            });
     },
 
     videoSwitchInProgress: false,
     toggleScreenSharing (shareScreen = !this.isSharingScreen) {
         if (this.videoSwitchInProgress) {
-            console.warn("Switch in progress.");
+            logger.warn("Switch in progress.");
             return;
         }
         if (!this.isDesktopSharingEnabled) {
-            console.warn("Cannot toggle screen sharing: not supported.");
+            logger.warn("Cannot toggle screen sharing: not supported.");
             return;
         }
 
@@ -992,7 +1016,7 @@ export default {
         let externalInstallation = false;
 
         if (shareScreen) {
-            createLocalTracks({
+            this.screenSharingPromise = createLocalTracks({
                 devices: ['desktop'],
                 desktopSharingExtensionExternalInstallation: {
                     interval: 500,
@@ -1038,7 +1062,7 @@ export default {
                 this.videoSwitchInProgress = false;
                 JitsiMeetJS.analytics.sendEvent(
                     'conference.sharingDesktop.start');
-                console.log('sharing local desktop');
+                logger.log('sharing local desktop');
             }).catch((err) => {
                 // close external installation dialog to show the error.
                 if(externalInstallation)
@@ -1050,7 +1074,7 @@ export default {
                     return;
                 }
 
-                console.error('failed to share local desktop', err);
+                logger.error('failed to share local desktop', err);
 
                 if (err.name === TrackErrors.FIREFOX_EXTENSION_NEEDED) {
                     APP.UI.showExtensionRequiredDialog(
@@ -1081,17 +1105,20 @@ export default {
                     dialogTitleKey, dialogTxt, false);
             });
         } else {
-            createLocalTracks({ devices: ['video'] }).then(
+            APP.remoteControl.receiver.stop();
+            this.screenSharingPromise = createLocalTracks(
+                { devices: ['video'] })
+            .then(
                 ([stream]) => this.useVideoStream(stream)
             ).then(() => {
                 this.videoSwitchInProgress = false;
                 JitsiMeetJS.analytics.sendEvent(
                     'conference.sharingDesktop.stop');
-                console.log('sharing local video');
+                logger.log('sharing local video');
             }).catch((err) => {
                 this.useVideoStream(null);
                 this.videoSwitchInProgress = false;
-                console.error('failed to share local video', err);
+                logger.error('failed to share local video', err);
             });
         }
     },
@@ -1113,11 +1140,13 @@ export default {
             }
         );
 
+        room.on(ConferenceEvents.PARTCIPANT_FEATURES_CHANGED,
+            user => APP.UI.onUserFeaturesChanged(user));
         room.on(ConferenceEvents.USER_JOINED, (id, user) => {
             if (user.isHidden())
                 return;
 
-            console.log('USER %s connnected', id, user);
+            logger.log('USER %s connnected', id, user);
             APP.API.notifyUserJoined(id);
             APP.UI.addUser(user);
 
@@ -1125,7 +1154,7 @@ export default {
             APP.UI.updateUserRole(user);
         });
         room.on(ConferenceEvents.USER_LEFT, (id, user) => {
-            console.log('USER %s LEFT', id, user);
+            logger.log('USER %s LEFT', id, user);
             APP.API.notifyUserLeft(id);
             APP.UI.removeUser(id, user.getDisplayName());
             APP.UI.onSharedVideoStop(id);
@@ -1134,7 +1163,7 @@ export default {
 
         room.on(ConferenceEvents.USER_ROLE_CHANGED, (id, role) => {
             if (this.isLocalId(id)) {
-                console.info(`My role changed, new role: ${role}`);
+                logger.info(`My role changed, new role: ${role}`);
                 if (this.isModerator !== room.isModerator()) {
                     this.isModerator = room.isModerator();
                     APP.UI.updateLocalRole(room.isModerator());
@@ -1192,7 +1221,7 @@ export default {
             {
                 this.audioLevelsMap[id] = lvl;
                 if(config.debugAudioLevels)
-                    console.log("AudioLevel:" + id + "/" + lvl);
+                    logger.log("AudioLevel:" + id + "/" + lvl);
             }
 
             APP.UI.setAudioLevel(id, lvl);
@@ -1248,6 +1277,57 @@ export default {
                 APP.API.notifyReceivedChatMessage(id, nick, text, ts);
                 APP.UI.addMessage(id, nick, text, ts);
             });
+            APP.UI.addListener(UIEvents.MESSAGE_CREATED, (message) => {
+                APP.API.notifySendingChatMessage(message);
+                room.sendTextMessage(message);
+            });
+
+            APP.UI.addListener(UIEvents.SELECTED_ENDPOINT, (id) => {
+                try {
+                    // do not try to select participant if there is none (we
+                    // are alone in the room), otherwise an error will be
+                    // thrown cause reporting mechanism is not available
+                    // (datachannels currently)
+                    if (room.getParticipants().length === 0)
+                        return;
+
+                    room.selectParticipant(id);
+                } catch (e) {
+                    JitsiMeetJS.analytics.sendEvent(
+                        'selectParticipant.failed');
+                    reportError(e);
+                }
+            });
+
+            APP.UI.addListener(UIEvents.PINNED_ENDPOINT,
+            (smallVideo, isPinned) => {
+                let smallVideoId = smallVideo.getId();
+                let isLocal = APP.conference.isLocalId(smallVideoId);
+
+                let eventName
+                    = (isPinned ? "pinned" : "unpinned") + "." +
+                            (isLocal ? "local" : "remote");
+                let participantCount = room.getParticipantCount();
+                JitsiMeetJS.analytics.sendEvent(
+                        eventName,
+                        { value: participantCount });
+
+                // FIXME why VIDEO_CONTAINER_TYPE instead of checking if
+                // the participant is on the large video ?
+                if (smallVideo.getVideoType() === VIDEO_CONTAINER_TYPE
+                    && !isLocal) {
+
+                    // When the library starts supporting multiple pins we
+                    // would pass the isPinned parameter together with the
+                    // identifier, but currently we send null to indicate that
+                    // we unpin the last pinned.
+                    try {
+                        room.pinParticipant(isPinned ? smallVideoId : null);
+                    } catch (e) {
+                        reportError(e);
+                    }
+                }
+            });
         }
 
         room.on(ConferenceEvents.CONNECTION_INTERRUPTED, () => {
@@ -1273,7 +1353,7 @@ export default {
         });
 
         room.on(ConferenceEvents.RECORDER_STATE_CHANGED, (status, error) => {
-            console.log("Received recorder status change: ", status, error);
+            logger.log("Received recorder status change: ", status, error);
             APP.UI.updateRecordingState(status);
         });
 
@@ -1283,6 +1363,32 @@ export default {
             // FIXME close
         });
 
+        room.on(ConferenceEvents.SUSPEND_DETECTED, () => {
+            // After wake up, we will be in a state where conference is left
+            // there will be dialog shown to user.
+            // We do not want video/audio as we show an overlay and after it
+            // user need to rejoin or close, while waking up we can detect
+            // camera wakeup as a problem with device.
+            // We also do not care about device change, which happens
+            // on resume after suspending PC.
+            if (this.deviceChangeListener)
+                JitsiMeetJS.mediaDevices.removeEventListener(
+                    JitsiMeetJS.events.mediaDevices.DEVICE_LIST_CHANGED,
+                    this.deviceChangeListener);
+
+            // stop local video
+            if (localVideo) {
+                localVideo.dispose();
+            }
+            // stop local audio
+            if (localAudio) {
+                localAudio.dispose();
+            }
+
+            // show overlay
+            APP.UI.showSuspendedOverlay();
+        });
+
         room.on(ConferenceEvents.DTMF_SUPPORT_CHANGED, (isDTMFSupported) => {
             APP.UI.updateDTMFSupport(isDTMFSupported);
         });
@@ -1301,13 +1407,6 @@ export default {
         APP.UI.addListener(UIEvents.AUDIO_MUTED, muteLocalAudio);
         APP.UI.addListener(UIEvents.VIDEO_MUTED, muteLocalVideo);
 
-        if (!interfaceConfig.filmStripOnly) {
-            APP.UI.addListener(UIEvents.MESSAGE_CREATED, (message) => {
-                APP.API.notifySendingChatMessage(message);
-                room.sendTextMessage(message);
-            });
-        }
-
         room.on(ConnectionQualityEvents.LOCAL_STATS_UPDATED,
             (stats) => {
                 APP.UI.updateLocalStats(stats.connectionQuality, stats);
@@ -1323,7 +1422,7 @@ export default {
             APP.UI.initEtherpad(value);
         });
 
-        APP.UI.addListener(UIEvents.EMAIL_CHANGED, changeLocalEmail);
+        APP.UI.addListener(UIEvents.EMAIL_CHANGED, this.changeLocalEmail);
         room.addCommandListener(this.commands.defaults.EMAIL, (data, from) => {
             APP.UI.setUserEmail(from, data.value);
         });
@@ -1375,7 +1474,7 @@ export default {
         APP.UI.addListener(UIEvents.LOGOUT, () => {
             AuthHandler.logout(room).then(url => {
                 if (url) {
-                    window.location.href = url;
+                    UIUtil.redirect(url);
                 } else {
                     this.hangup(true);
                 }
@@ -1430,50 +1529,6 @@ export default {
             AuthHandler.authenticate(room);
         });
 
-        APP.UI.addListener(UIEvents.SELECTED_ENDPOINT, (id) => {
-            try {
-                // do not try to select participant if there is none (we are
-                // alone in the room), otherwise an error will be thrown cause
-                // reporting mechanism is not available (datachannels currently)
-                if (room.getParticipants().length === 0)
-                    return;
-
-                room.selectParticipant(id);
-            } catch (e) {
-                JitsiMeetJS.analytics.sendEvent('selectParticipant.failed');
-                reportError(e);
-            }
-        });
-
-        APP.UI.addListener(UIEvents.PINNED_ENDPOINT, (smallVideo, isPinned) => {
-            let smallVideoId = smallVideo.getId();
-            let isLocal = APP.conference.isLocalId(smallVideoId);
-
-            let eventName
-                = (isPinned ? "pinned" : "unpinned") + "." +
-                        (isLocal ? "local" : "remote");
-            let participantCount = room.getParticipantCount();
-            JitsiMeetJS.analytics.sendEvent(
-                    eventName,
-                    { value: participantCount });
-
-            // FIXME why VIDEO_CONTAINER_TYPE instead of checking if
-            // the participant is on the large video ?
-            if (smallVideo.getVideoType() === VIDEO_CONTAINER_TYPE
-                && !isLocal) {
-
-                // When the library starts supporting multiple pins we would
-                // pass the isPinned parameter together with the identifier,
-                // but currently we send null to indicate that we unpin the
-                // last pinned.
-                try {
-                    room.pinParticipant(isPinned ? smallVideoId : null);
-                } catch (e) {
-                    reportError(e);
-                }
-            }
-        });
-
         APP.UI.addListener(
             UIEvents.VIDEO_DEVICE_CHANGED,
             (cameraDeviceId) => {
@@ -1485,7 +1540,7 @@ export default {
                 })
                 .then(([stream]) => {
                     this.useVideoStream(stream);
-                    console.log('switched local video device');
+                    logger.log('switched local video device');
                     APP.settings.setCameraDeviceId(cameraDeviceId, true);
                 })
                 .catch((err) => {
@@ -1507,7 +1562,7 @@ export default {
                 })
                 .then(([stream]) => {
                     this.useAudioStream(stream);
-                    console.log('switched local audio device');
+                    logger.log('switched local audio device');
                     APP.settings.setMicDeviceId(micDeviceId, true);
                 })
                 .catch((err) => {
@@ -1523,9 +1578,9 @@ export default {
                 JitsiMeetJS.analytics.sendEvent(
                     'settings.changeDevice.audioOut');
                 APP.settings.setAudioOutputDeviceId(audioOutputDeviceId)
-                    .then(() => console.log('changed audio output device'))
+                    .then(() => logger.log('changed audio output device'))
                     .catch((err) => {
-                        console.warn('Failed to change audio output device. ' +
+                        logger.warn('Failed to change audio output device. ' +
                             'Default or previously set audio output device ' +
                             'will be used instead.', err);
                         APP.UI.setSelectedAudioOutputFromSettings();
@@ -1585,12 +1640,23 @@ export default {
     },
     /**
     * Adds any room listener.
-    * @param eventName one of the ConferenceEvents
-    * @param callBack the function to be called when the event occurs
+    * @param {string} eventName one of the ConferenceEvents
+    * @param {Function} listener the function to be called when the event
+    * occurs
     */
-    addConferenceListener(eventName, callBack) {
-        room.on(eventName, callBack);
+    addConferenceListener(eventName, listener) {
+        room.on(eventName, listener);
     },
+
+    /**
+    * Removes any room listener.
+    * @param {string} eventName one of the ConferenceEvents
+    * @param {Function} listener the listener to be removed.
+    */
+    removeConferenceListener(eventName, listener) {
+        room.off(eventName, listener);
+    },
+
     /**
      * Inits list of current devices and event listener for device change.
      * @private
@@ -1617,11 +1683,12 @@ export default {
                 APP.UI.onAvailableDevicesChanged(devices);
             });
 
+            this.deviceChangeListener = (devices) =>
+                window.setTimeout(
+                    () => this._onDeviceListChanged(devices), 0);
             JitsiMeetJS.mediaDevices.addEventListener(
                 JitsiMeetJS.events.mediaDevices.DEVICE_LIST_CHANGED,
-                (devices) =>
-                    window.setTimeout(
-                        () => this._onDeviceListChanged(devices), 0));
+                this.deviceChangeListener);
         }
     },
     /**
@@ -1720,14 +1787,25 @@ export default {
      * @param {string} name the event name
      * @param {int} value the value (it's int because google analytics supports
      * only int).
+     * @param {string} label short text which provides more info about the event
+     * which allows to distinguish between few event cases of the same name
      * NOTE: Should be used after conference.init
      */
-    logEvent(name, value) {
+    logEvent(name, value, label) {
         if(JitsiMeetJS.analytics) {
-            JitsiMeetJS.analytics.sendEvent(name, {value});
+            JitsiMeetJS.analytics.sendEvent(name, {value, label});
         }
         if(room) {
-            room.sendApplicationLog(JSON.stringify({name, value}));
+            room.sendApplicationLog(JSON.stringify({name, value, label}));
+        }
+    },
+    /**
+     * Methods logs an application event given in the JSON format.
+     * @param {string} logJSON an event to be logged in JSON format
+     */
+    logJSON(logJSON) {
+        if (room) {
+            room.sendApplicationLog(logJSON);
         }
     },
     /**
@@ -1736,6 +1814,7 @@ export default {
      * requested
      */
     hangup (requestFeedback = false) {
+        eventEmitter.emit(JitsiMeetConferenceEvents.BEFORE_HANGUP);
         APP.UI.hideRingOverLay();
         let requestFeedbackPromise = requestFeedback
                 ? APP.UI.requestFeedbackOnHangup()
@@ -1754,5 +1833,68 @@ export default {
             APP.API.notifyReadyToClose();
             maybeRedirectToWelcomePage(values[0]);
         });
+    },
+
+    /**
+     * Changes the email for the local user
+     * @param email {string} the new email
+     */
+    changeLocalEmail(email = '') {
+        email = email.trim();
+
+        if (email === APP.settings.getEmail()) {
+            return;
+        }
+
+        APP.settings.setEmail(email);
+        APP.UI.setUserEmail(room.myUserId(), email);
+        sendData(commands.EMAIL, email);
+    },
+
+    /**
+     * Changes the avatar url for the local user
+     * @param url {string} the new url
+     */
+    changeLocalAvatarUrl(url = '') {
+        url = url.trim();
+
+        if (url === APP.settings.getAvatarUrl()) {
+            return;
+        }
+
+        APP.settings.setAvatarUrl(url);
+        APP.UI.setUserAvatarUrl(room.myUserId(), url);
+        sendData(commands.AVATAR_URL, url);
+    },
+
+    /**
+     * Sends a message via the data channel.
+     * @param {string} to the id of the endpoint that should receive the
+     * message. If "" - the message will be sent to all participants.
+     * @param {object} payload the payload of the message.
+     * @throws NetworkError or InvalidStateError or Error if the operation
+     * fails.
+     */
+    sendEndpointMessage (to, payload) {
+        room.sendEndpointMessage(to, payload);
+    },
+
+    /**
+     * Adds new listener.
+     * @param {String} eventName the name of the event
+     * @param {Function} listener the listener.
+     */
+    addListener (eventName, listener) {
+        eventEmitter.addListener(eventName, listener);
+    },
+
+    /**
+     * Removes listener.
+     * @param {String} eventName the name of the event that triggers the
+     * listener
+     * @param {Function} listener the listener.
+     */
+    removeListener (eventName, listener) {
+        eventEmitter.removeListener(eventName, listener);
     }
 };

config.js

@@ -20,13 +20,13 @@ var config = { // eslint-disable-line no-unused-vars
     //focusUserJid: 'focus@auth.jitsi-meet.example.com', // The real JID of focus participant - can be overridden here
     //defaultSipNumber: '', // Default SIP number
 
-    // Desktop sharing method. Can be set to 'ext', 'webrtc' or false to disable.
-    desktopSharingChromeMethod: 'ext',
     // The ID of the jidesha extension for Chrome.
-    desktopSharingChromeExtId: 'diibjkoicjeejcmhdnailmkgecihlobk',
+    desktopSharingChromeExtId: null,
+    // Whether desktop sharing should be disabled on Chrome.
+    desktopSharingChromeDisabled: true,
     // The media sources to use when using screen sharing with the Chrome
     // extension.
-    desktopSharingChromeSources: ['screen', 'window'],
+    desktopSharingChromeSources: ['screen', 'window', 'tab'],
     // Required version of Chrome extension
     desktopSharingChromeMinExtVersion: '0.1',
 
@@ -76,5 +76,9 @@ var config = { // eslint-disable-line no-unused-vars
     // If true - all users without token will be considered guests and all users
     // with token will be considered non-guests. Only guests will be allowed to
     // edit their profile.
-    enableUserRolesBasedOnToken: false
+    enableUserRolesBasedOnToken: false,
+    // Suspending video might cause problems with audio playback. Disabling until these are fixed.
+    disableSuspendVideo: true,
+    // disables or enables RTX (RFC 4588).
+    disableRtx: true
 };

connection.js

@@ -1,4 +1,6 @@
 /* global APP, JitsiMeetJS, config */
+const logger = require("jitsi-meet-logger").getLogger(__filename);
+
 import AuthHandler from './modules/UI/authentication/AuthHandler';
 import jitsiLocalStorage from './modules/util/JitsiLocalStorage';
 
@@ -84,7 +86,7 @@ function connect(id, password, roomName) {
 
         function handleConnectionFailed(err) {
             unsubscribe();
-            console.error("CONNECTION FAILED:", err);
+            logger.error("CONNECTION FAILED:", err);
             reject(err);
         }
 

css/_base.scss

@@ -29,36 +29,6 @@ html, body, input, textarea, keygen, select, button {
     color: #636363;
 }
 
-input[type='text'], input[type='password'], textarea {
-    display: inline-block;
-    width: 100%;
-    padding: 5px 7px;
-    color: $inputColor;
-    border-radius: $borderRadius;
-    line-height: 32px;
-    height: 32px;
-    text-align: left;
-    border:1px solid $inputBorderColor;
-    background-color: $inputBackground;
-    outline: none; /* removes the default outline */
-    resize: none; /* prevents the user-resizing, adjust to taste */
-}
-
-@include placeholder {
-    color: $placeHolderColor;
-}
-
-textarea {
-    overflow: hidden;
-    word-wrap: break-word;
-    resize: none;
-    line-height: 1.5em;
-}
-
-button.no-icon {
-    padding: 0 1em;
-}
-
 button, input, select, textarea {
     margin: 0;
     vertical-align: baseline;
@@ -75,10 +45,26 @@ input[type="reset"], input[type="submit"] {
     cursor: pointer;
 }
 
+textarea {
+    overflow: hidden;
+    word-wrap: break-word;
+    resize: none;
+    line-height: 1.5em;
+}
+
+input[type='text'], input[type='password'], textarea {
+    outline: none; /* removes the default outline */
+    resize: none; /* prevents the user-resizing, adjust to taste */
+}
+
 button {
     color: #FFF;
     background-color: $buttonBackground;
     border-radius: $borderRadius;
+
+    &.no-icon {
+        padding: 0 1em;
+    }
 }
 
 button,
@@ -98,7 +84,6 @@ form {
 }
 
 .leftwatermark {
-    display: none;
     left: $defaultToolbarSize;
     margin-left: 10px;
     background-image: url($defaultWatermarkLink);
@@ -106,13 +91,11 @@ form {
 }
 
 .rightwatermark {
-    display: none;
     right: 15;
     background-position: center right;
 }
 
 .poweredby {
-    display: none;
     position: absolute;
     left: 25;
     bottom: 7;
@@ -132,38 +115,6 @@ form {
     font-size: 12px;
 }
 
-/**
- * Hides an element.
- */
-.hide {
-    display: none !important;
-}
-
-/**
- * Shows an element.
- */
-.show {
-    display: block !important;
-}
-
-/**
- * Shows an inline element.
- */
-.show-inline {
-    display: inline-block !important;
-}
-
-/**
- * Shows a flex element.
- */
-.show-flex {
-    display: -webkit-box !important;
-    display: -moz-box !important;
-    display: -ms-flexbox !important;
-    display: -webkit-flex !important;
-    display: flex !important;
-}
-
 /**
 * Tooltips
 **/
@@ -185,19 +136,7 @@ form {
     visibility: visible;
 }
 
-.link {
-    cursor: pointer;
-    color: $linkFontColor;
-    @include transition(color .1s ease-out);
-
-    &:hover {
-        color: $linkHoverFontColor;
-        text-decoration: underline;
-        @include transition(color .1s ease-in);
-    }
-}
-
 #inviteLinkRef {
     -webkit-user-select: text;
     user-select: text;
-}
+}

css/_contact_list.scss

@@ -5,7 +5,7 @@
         font-size: 12px;
         bottom: 0px;
         margin: 0;
-        margin-top: 16px;
+        margin-top: 12px;
         padding: 0px;
         width: 100%;
     }
@@ -13,18 +13,24 @@
     .clickable {
         cursor: pointer;
     }
+
+    .icon-security,
+    .icon-security-locked {
+        font-size: 16px;
+    }
 }
 
 #contacts {
 
     >li {
-        color: $defaultSideBarFontColor;
+        display: block;
         list-style-type: none;
         text-align: left;
         white-space: nowrap;
-        color: #FFF;
-        font-size: 10pt;
-        padding: 6px 10%;
+        color: $baseLight;
+        font-size: 16px;
+        padding: 0 10%;
+        height: 27px;
 
         &:hover,
         &:active {
@@ -36,6 +42,7 @@
             vertical-align: middle;
             margin: 0px;
             width: 100%;
+            line-height: 1.5em;
             text-overflow: ellipsis;
             overflow: hidden;
         }

css/_filmstrip.scss

@@ -18,7 +18,7 @@
         flex-wrap: nowrap;
         position: relative;
         z-index: 1;                     // Set z-index to make element visible
-        width: 17px;
+        width: $hideFilmstripButtonWidth;
 
         button {
             font-size: 14px;
@@ -50,13 +50,17 @@
         position:relative;
         height:196px;
         padding: 0;
+        /*The filmstrip should not be covered by the left toolbar*/
+        padding-left: $defaultToolbarSize + 5;
         bottom: 0;
         width:auto;
-        border: 2px solid transparent;
+        border: $thumbnailsBorder solid transparent;
         z-index: 5;
         transition: bottom 2s;
         overflow: visible !important;
-        font-size: 0pt; /*!!!Removes the gap between the local video container and the remote videos.*/
+        /*!!!Removes the gap between the local video container and the remote
+        videos.*/
+        font-size: 0pt;
 
         &.hidden {
             bottom: -196px;
@@ -66,8 +70,8 @@
             display: none;
             position: relative;
             background-size: contain;
-            border: 2px solid transparent;
-            border-radius:1px;
+            border: $thumbnailVideoBorder solid transparent;
+            border-radius: $borderRadius;
             margin: 0 $thumbnailVideoMargin;
 
             &.videoContainerFocused, &:hover {
@@ -83,12 +87,12 @@
                 -webkit-animation-name: greyPulse;
                 -webkit-animation-duration: 2s;
                 -webkit-animation-iteration-count: 1;
-                border: 2px solid $videoThumbnailSelected !important;
+                border: $thumbnailVideoBorder solid $videoThumbnailSelected !important;
                 box-shadow: inset 0 0 3px $videoThumbnailSelected,
                 0 0 3px $videoThumbnailSelected !important;
             }
 
-            .remotevideomenu {
+            .remotevideomenu > .icon-menu {
                 display: none;
             }
 
@@ -97,11 +101,11 @@
             */
             &:hover {
                 cursor: hand;
-                border: 2px solid $videoThumbnailHovered;
+                border: $thumbnailVideoBorder solid $videoThumbnailHovered;
                 box-shadow: inset 0 0 3px $videoThumbnailHovered,
                 0 0 3px $videoThumbnailHovered;
 
-                .remotevideomenu {
+                .remotevideomenu > .icon-menu {
                     display: inline-block;
                 }
             }
@@ -111,10 +115,10 @@
             & > video,
             & > object {
                 cursor: hand;
-                border-radius:1px;
+                border-radius: $borderRadius;
                 object-fit: cover;
                 overflow: hidden;
             }
         }
     }
-}
+}

css/_font.scss

@@ -25,6 +25,9 @@
     -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-mic-camera-combined:before {
+  content: "\e903";
+}
 .icon-feedback:before {
   content: "\e91d";
 }
@@ -34,15 +37,15 @@
 .icon-avatar:before {
   content: "\e901";
 }
-.icon-autorenew:before {
-  content: "\e903";
-}
 .icon-hangup:before {
   content: "\e905";
 }
 .icon-chat:before {
   content: "\e906";
 }
+.icon-download:before {
+  content: "\e902";
+}
 .icon-edit:before {
   content: "\e907";
 }
@@ -55,9 +58,6 @@
 .icon-kick:before {
   content: "\e904";
 }
-.icon-menu:before {
-  content: "\e91f";
-}
 .icon-menu-up:before {
   content: "\e91f";
 }
@@ -70,9 +70,6 @@
 .icon-exit-full-screen:before {
   content: "\e90c";
 }
-.icon-star:before {
-    content: "\e916";
-}
 .icon-star-full:before {
   content: "\e90a";
 }
@@ -109,6 +106,12 @@
 .icon-settings:before {
   content: "\e915";
 }
+.icon-star:before {
+  content: "\e916";
+}
+.icon-switch-camera:before {
+  content: "\e921";
+}
 .icon-share-desktop:before {
   content: "\e917";
 }
@@ -133,7 +136,6 @@
 .icon-recEnable:before {
   content: "\e614";
 }
-// FIXME not used anymore - consider removing in the next font update
 .icon-presentation:before {
   content: "\e603";
-}
+}

css/_inlay.scss

@@ -1,18 +1,18 @@
 .inlay {
     margin-top: 14%;
-    @include border-radius(3px);
+    @include border-radius(4px);
     padding: 40px 38px 44px;
     color: #fff;
-    background: lighten(desaturate($defaultBackground, 70%), 20%);
+    background: $inlayColorBg;
     text-align: center;
 
     &__title {
-        margin: 12px 0;
+        margin: 17px 0;
         padding-bottom: 17px;
         color: $popoverFontColor;
         font-size: 21px;
         letter-spacing: 0.3px;
-        border-bottom: 1px solid $auiBorderColor;
+        border-bottom: 1px solid $inlayBorderColor;
     }
 
     &__text {
@@ -26,4 +26,8 @@
         margin: 0 10px;
         font-size: 50px;
     }
+
+    &__button {
+        float: none !important;
+    }
 }

css/_jitsi_popover.scss

@@ -10,17 +10,17 @@
     color: $popoverFontColor;
     background-color: $popoverBg;
     background-clip: padding-box;
-    border-radius: 3px;
+    border-radius: $borderRadius;
     /*-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);*/
     /*box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);*/
     white-space: normal;
-    margin-top: -10px;
+    margin-top: -$popoverMenuPadding;
 
     &__menu-padding {
-        height: 10px;
+        height: $popoverMenuPadding;
         width: 100px;
         position: absolute;
-        bottom: -10px;
+        bottom: -$popoverMenuPadding;
     }
 
     &__showmore {

css/_jquery.contextMenu.scss

@@ -1,18 +1,18 @@
 @charset "UTF-8";
-/*!
- * jQuery contextMenu - Plugin for simple contextMenu handling
- *
- * Version: v2.1.1
- *
- * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)
- * Web: http://swisnl.github.io/jQuery-contextMenu/
- *
- * Copyright (c) 2011-2016 SWIS BV and contributors
- *
- * Licensed under
- *   MIT License http://www.opensource.org/licenses/mit-license
- *
- * Date: 2016-02-28T09:53:18.890Z
+/*!
+ * jQuery contextMenu - Plugin for simple contextMenu handling
+ *
+ * Version: v2.1.1
+ *
+ * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)
+ * Web: http://swisnl.github.io/jQuery-contextMenu/
+ *
+ * Copyright (c) 2011-2016 SWIS BV and contributors
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *
+ * Date: 2016-02-28T09:53:18.890Z
  */
 @font-face {
   font-family: "context-menu-icons";
@@ -88,7 +88,7 @@
   list-style-type: none;
   background: #fff;
   border: 1px solid #bebebe;
-  border-radius: 3px;
+  border-radius: $borderRadius;
   -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
           box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
 }
@@ -156,8 +156,8 @@
           transform: translateY(-50%);
 }
 
-/**
- * Inputs
+/**
+ * Inputs
  */
 .context-menu-item.context-menu-input {
   padding: 5px 10px;

css/_mixins.scss

@@ -63,7 +63,15 @@
   top: 50%;
   left: 50%;
   position: absolute;
-  @include transform(translate(-50%, -50%))
+  @include transform(translate(-50%, -50%));
+}
+
+/**
+* Defines the maximum width and height
+**/
+@mixin maxSize($value) {
+    max-width: $value;
+    max-height: $value;
 }
 
 @mixin transform($func) {
@@ -142,4 +150,12 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+}
+
+/**
+ * Creates a semi-transparent background with the given color and alpha
+ * (opacity) value.
+ */
+@mixin transparentBg($color, $alpha) {
+  background-color: rgba(red($color), green($color), blue($color), $alpha);
 }

css/_popup_menu.scss

@@ -6,7 +6,6 @@
     padding: 0;
     margin: 2px 0;
     bottom: 0;
-    width: 100px;
     height: auto;
 
     &:first-child {
@@ -66,4 +65,9 @@
 
 span.remotevideomenu:hover ul.popupmenu, ul.popupmenu:hover {
     display:block !important;
-}
+}
+
+.remote-control-spinner {
+    top: 6px;
+    left: 2px;
+}

css/_side_toolbar_container.scss

@@ -16,30 +16,20 @@
      * Labels inside the side panel.
      */
     label {
-        color: $defaultColor;
+        color: $baseLight;
     }
 
     /**
      * Form elements and blocks.
      */
     input, select, a,
-    .sideToolbarBlock, .input-control, .button-control {
+    .sideToolbarBlock, .form-control, .button-control {
         display: block;
         margin-top: 15px;
         margin-left: 10%;
         width: 80%;
     }
 
-    /**
-     * Specify colors for edit elements.
-     */
-    select, input[type="button"], input[type="text"], input[type="reset"],
-    input[type="submit"] {
-        color: $inputColor;
-        background: $inputBackground;
-        border: none;
-    }
-
     /**
      * Specify styling of elements inside a block.
      */
@@ -70,20 +60,24 @@
         box-sizing: border-box;
         color: #FFF;
 
+        .input-control {
+            border: 0;
+        }
+
         /**
          * Titles and subtitles of inner containers.
          */
         div.title, div.subTitle {
-            margin: 10px 0;
+            margin: 24px 0 11px;
         }
 
         /**
          * Main title size.
          */
         div.title {
-            color: $defaultColor !important;
-            font-size: 16px;
+            color: $toolbarTitleColor;
             text-align: center;
+            font-size: $toolbarTitleFontSize;
         }
 
         /**

css/_toastr.scss

@@ -92,8 +92,9 @@
 }
 
 #toast-container.notification-bottom-right {
+  $videoOffset: 2 * ($thumbnailVideoMargin + $thumbnailsBorder) + $thumbnailVideoBorder;
   bottom: 135px;
-  right: 28px;
+  right: $hideFilmstripButtonWidth + $videoOffset;
 }
 
 #toast-container * {

css/_toolbars.scss

@@ -252,7 +252,7 @@ a.button>#avatar {
  */
 @include keyframes(slideInExt) {
     from { width: 0px; }
-    to   { width: 200px; } // TO FIX: Make this value a percentage.
+    to   { width: $sidebarWidth; } // TO FIX: Make this value a percentage.
 }
 
 .slideInExt {
@@ -260,7 +260,7 @@ a.button>#avatar {
 }
 
 @include keyframes(slideOutExt) {
-  from { width: 200px; } // TO FIX: Make this value a percentage.
+  from { width: $sidebarWidth; } // TO FIX: Make this value a percentage.
   to   { width: 0px; }
 }
 

css/_utils.scss

@@ -0,0 +1,38 @@
+/**
+ * Hides an element.
+ */
+.hide {
+    display: none !important;
+}
+
+/**
+ * Shows an element.
+ */
+.show {
+    display: block !important;
+}
+
+/**
+ * Shows an inline element.
+ */
+.show-inline {
+    display: inline-block !important;
+}
+
+/**
+* Shows as a list item
+**/
+.show-list-item {
+    display: list-item !important;
+}
+
+/**
+ * Shows a flex element.
+ */
+.show-flex {
+    display: -webkit-box !important;
+    display: -moz-box !important;
+    display: -ms-flexbox !important;
+    display: -webkit-flex !important;
+    display: flex !important;
+}

css/_variables.scss

@@ -14,9 +14,13 @@ $defaultToolbarSize: 50px;
 
 // Video layout.
 $thumbnailToolbarHeight: 22px;
-$thumbnailIndicatorBorder: 0px;
+$thumbnailIndicatorBorder: 2px;
 $thumbnailIndicatorSize: $thumbnailToolbarHeight;
-$thumbnailVideoMargin: 2px;
+$thumbnailVideoMargin: 5px;
+$thumbnailsBorder: 2px;
+$thumbnailVideoBorder: 2px;
+$hideFilmstripButtonWidth: 17px;
+
 
 /**
  * Color variables.
@@ -30,6 +34,8 @@ $tooltipBg: rgba(0,0,0, 0.7);
 /**
  * Toolbar
  */
+$toolbarTitleColor: #FFFFFF;
+$toolbarTitleFontSize: 19px;
 $toolbarBackground: rgba(0, 0, 0, 0.5);
 $toolbarSelectBackground: rgba(0, 0, 0, .6);
 $toolbarBadgeBackground: #165ECC;
@@ -37,14 +43,14 @@ $toolbarBadgeColor: #FFFFFF;
 $toolbarToggleBackground: #12499C;
 $splitterToolbarButtonMargin: 18px;
 
-/*
+/**
  * Main controls
  * TODO: looks like we don't use it
  */
 $inputSemiBackground: rgba(132, 132, 132, .8);
 $inputLightBackground: #EBEBEB;
 
-/*
+/**
  * Video layout
  */
 $videoThumbnailHovered: rgba(22, 94, 204, .4);
@@ -71,7 +77,6 @@ $rateStarLabelColor: #333;
 $rateStarDefault: #ccc;
 $rateStarActivity: #165ecc;
 $rateStarSize: 34px;
-$feedbackCancelFontColor: #333;
 
 /**
  * Notifications
@@ -92,8 +97,8 @@ $notificationWidth: 215px;
  */
 $borderRadius: 4px;
 $defaultWatermarkLink: '../images/watermark.png';
-$sidebarWidth: 200px;
-
+$sidebarWidth: 220px;
+$popoverMenuPadding: 13px;
 $happySoftwareBackground: transparent;
 
 /**
@@ -117,14 +122,15 @@ $defaultDarkFontColor: #000;
 /**
  * Forms
  */
-//dropdown
-$selectFontColor: $defaultLightFontColor;
-$selectBg: $defaultBackground;
-$selectActiveBg: $defaultBackground;
-$selectActiveItemBg: $defaultDarkColor;
 //inputs
 $inputControlEmColor: #f29424;
 //buttons
 $linkFontColor: #489afe;
 $linkHoverFontColor: #287ade;
 
+/**
+ * Landing
+ */
+$primaryUnsupportedBrowserButtonBgColor: #17a0db;
+$unsupportedBrowserButtonBgColor: #ff9a00;
+$unsupportedBrowserTextColor: #4a4a4a;

css/_videolayout_default.scss

@@ -18,45 +18,103 @@
 
     &__background {
         @include topLeft();
+        background-color: black;
+        border-radius: $borderRadius;
         width: 100%;
         height: 100%;
-        background-color: black;
     }
-}
 
-/**
- * The toolbar of the video thumbnail.
- */
-.videocontainer__toolbar,
-.videocontainer__toptoolbar {
-    position: absolute;
-    left: 0;
-    z-index: 3;
-    width: 100%;
-    box-sizing: border-box; // Includes the padding in the 100% width.
-}
+    /**
+     * The toolbar of the video thumbnail.
+     */
+    &__toolbar,
+    &__toptoolbar {
+        position: absolute;
+        left: 0;
+        z-index: 3;
+        width: 100%;
+        box-sizing: border-box; // Includes the padding in the 100% width.
+    }
 
-.videocontainer__toolbar {
-    bottom: 0;
-    padding: 0 5px 0 5px;
-    height: $thumbnailToolbarHeight;
-}
+    &__toolbar {
+        bottom: 0;
+        padding: 0 5px 0 5px;
+        height: $thumbnailToolbarHeight;
+    }
 
-.videocontainer__toptoolbar {
-    $toolbarPadding: 5px;
-    top: 0;
-    padding: $toolbarPadding;
-    padding-bottom: 0;
-    height: $thumbnailIndicatorSize + $toolbarPadding;
-}
+    &__toptoolbar {
+        $toolbarPadding: 5px;
+        top: 0;
+        padding: $toolbarPadding;
+        padding-bottom: 0;
 
-.videocontainer__hoverOverlay {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    visibility: hidden;
-    background: rgba(0,0,0,.6);
-    z-index: 2;
+        span.indicator {
+            position: relative;
+            font-size: 8px;
+            text-align: center;
+            line-height: $thumbnailIndicatorSize;
+            display: none;
+            padding: 0;
+            margin-right: em(5, 8);
+            float: left;
+            @include circle($thumbnailIndicatorSize);
+            box-sizing: border-box;
+            z-index: 3;
+            background: $dominantSpeakerBg;
+            color: $thumbnailPictogramColor;
+            border: $thumbnailIndicatorBorder solid $thumbnailPictogramColor;
+
+            &:last-child {
+                margin-right: 0;
+            }
+
+            .indicatoricon {
+                @include absoluteAligning();
+            }
+
+            .connection {
+                position: relative;
+                display: inline-block;
+                margin: 0 auto;
+                left: 0;
+                @include transform(translate(0, -50%));
+
+                &_empty
+                {
+                    color: #8B8B8B;/*#FFFFFF*/
+                    overflow: hidden;
+                }
+
+                &_lost
+                {
+                    color: #8B8B8B;
+                    overflow: visible;
+                }
+
+                &_full
+                {
+                    @include topLeft();
+                    color: #FFFFFF;/*#15A1ED*/
+                    overflow: hidden;
+                }
+            }
+
+            .icon-connection,
+            .icon-connection-lost {
+                font-size: 1em;
+            }
+        }
+    }
+
+    &__hoverOverlay {
+        background: rgba(0,0,0,.6);
+        border-radius: $borderRadius;
+        position: relative;
+        width: 100%;
+        height: 100%;
+        visibility: hidden;
+        z-index: 2;
+    }
 }
 
 #localVideoWrapper {
@@ -72,8 +130,8 @@
 
 #localVideoWrapper>video,
 #localVideoWrapper>object {
+    border-radius: $borderRadius !important;
     cursor: hand;
-    border-radius:1px !important;
     object-fit: cover;
 }
 
@@ -155,6 +213,7 @@
 
 .videocontainer .displayname {
     pointer-events: none;
+    padding: 0 3px 0 3px;
 }
 
 .videocontainer .editdisplayname {
@@ -217,72 +276,6 @@
   background: $connectionIndicatorBg;
 }
 
-.videocontainer__toptoolbar span.indicator {
-    position: relative;
-    font-size: 8pt;
-    text-align: center;
-    line-height: $thumbnailToolbarHeight;
-    display: none;
-    padding: 0;
-    margin-right: 5px;
-    float: left;
-    @include circle($thumbnailIndicatorSize);
-    box-sizing: border-box;
-    z-index: 3;
-    background: $dominantSpeakerBg;
-    color: $thumbnailPictogramColor;
-    border: $thumbnailIndicatorBorder solid $thumbnailPictogramColor;
-
-    .indicatoricon {
-        position: absolute;
-        top: 50%;
-        left: 0;
-        @include transform(translateY(-50%));
-        width: $thumbnailIndicatorSize - 2 * $thumbnailIndicatorBorder;
-        height: $thumbnailIndicatorSize - 2 * $thumbnailIndicatorBorder;
-        line-height: $thumbnailIndicatorSize - 2 * $thumbnailIndicatorBorder;
-    }
-
-    .connection {
-        position: relative;
-        margin: 0 auto;
-        width: 12px;
-        height: 8px;
-
-        &_empty
-        {
-            @include topLeft();
-            max-width: 12px;
-            width: 12px;
-            color: #8B8B8B;/*#FFFFFF*/
-            overflow: hidden;
-        }
-
-        &_lost
-        {
-            @include topLeft();
-            max-width: 12px;
-            width: 12px;
-            color: #8B8B8B;
-            overflow: visible;
-        }
-
-        &_full
-        {
-            @include topLeft();
-            max-width: 12px;
-            width: 12px;
-            color: #FFFFFF;/*#15A1ED*/
-            overflow: hidden;
-        }
-    }
-
-    .icon-connection,
-    .icon-connection-lost {
-        font-size: 6pt;
-    }
-}
-
 .remotevideomenu
 {
     display: inline-block;
@@ -399,8 +392,11 @@
 }
 
 .userAvatar {
-    @include circle(60px);
+    @include maxSize(60px);
     @include absoluteAligning();
+    border-radius: 50%;
+    height: 50%;
+    width: auto;
 }
 
 .sharedVideoAvatar {
@@ -478,6 +474,7 @@
 #localConnectionMessage {
     display: none;
     position: absolute;
+    left: 0;
     width: 100%;
     top:50%;
     z-index: 2;

css/_welcome_page.scss

@@ -50,7 +50,7 @@
     float: left;
 }
 
-#domain_name
+.domain-name
 {
     float: left;
     height: 55px;
@@ -61,37 +61,51 @@
     color: $defaultDarkColor;
 }
 
-#enter_room_field {
-    font-size: 15px;
-    border: none;
-    -webkit-appearance: none;
-    width: 228px;
-    height: 55px;
-    line-height: 55px;
-    font-weight: 500;
-    box-shadow: none;
-    float: left;
-    background-color: #FFFFFF;
-    position: relative;
-    z-index: 2;
-}
+.enter-room {
+    &__field {
+        font-size: 15px;
+        border: none;
+        -webkit-appearance: none;
+        width: 228px;
+        height: 55px;
+        line-height: 55px;
+        font-weight: 500;
+        box-shadow: none;
+        float: left;
+        background-color: #FFFFFF;
+        position: relative;
+        z-index: 2;
+    }
 
-#enter_room_button {
-    width: 73px;
-    height: 45px;
-    background-color: #21B9FC;
-    moz-border-radius: 1px;
-    -webkit-border-radius: 1px;
-    color: #ffffff;
-    font-weight: 600;
-    border: none;
-    margin-top: 5px;
-    font-size: 19px;
-    padding-top: 6px;
-    outline: none;
-    float:left;
-    position: relative;
-    z-index: 2;
+    &__reload {
+        display: block;
+        width: 30px;
+        color: #acacac;
+        font-size: 1.9em;
+        line-height: 55px;
+        z-index: 3;
+        float:  left;
+        cursor: pointer;
+        text-align: center;
+    }
+
+    &__button {
+        width: 73px;
+        height: 45px;
+        background-color: #21B9FC;
+        moz-border-radius: 1px;
+        -webkit-border-radius: 1px;
+        color: #ffffff;
+        font-weight: 600;
+        border: none;
+        margin-top: 5px;
+        font-size: 19px;
+        padding-top: 6px;
+        outline: none;
+        float:left;
+        position: relative;
+        z-index: 2;
+    }
 }
 
 #enter_room_container {
@@ -184,16 +198,3 @@
     line-height: 22px;
     font-weight: 200;
 }
-
-#reload_roomname
-{
-    width: 30px;
-    color: #acacac;
-    font-size: 1.9em;
-    line-height: 55px;
-    z-index: 3;
-    float:  left;
-    cursor: pointer;
-    text-align: center;
-    display: none;
-}

css/aui-components/dropdown.scss

@@ -1,6 +1,6 @@
-
 .select2-container.aui-select2-container {
     background-color: transparent !important;
+    margin-top: 2px;
 
     a.select2-choice {
         height: 28px !important;
@@ -55,6 +55,7 @@
 
             .select2-result-label{
                 font-size: 12px;
+                color: $selectFontColor !important;
                 line-height: 20px;
             }
         }

css/components/_button-control.scss

@@ -82,4 +82,8 @@
             color: $linkHoverFontColor;
         }
     }
+
+    &_center {
+        float: none !important;
+    }
 }

css/components/_form-control.scss

@@ -1,4 +1,4 @@
-.input-control {
+.form-control {
     padding: 16px 0;
 
     &:first-child {
@@ -19,24 +19,6 @@
         font-weight: $labelFontWeight;
     }
 
-    &__input {
-        margin-bottom: 8px;
-        @include transition(all .2s ease-in);
-
-        &:last-child {
-            margin-bottom: inherit;
-        }
-
-        &::selection {
-            background-color: $defaultDarkSelectionColor;
-        }
-
-        &.error {
-            color: $errorColor;
-            border-color: $errorColor;
-        }
-    }
-
     &__em {
         color: $inputControlEmColor;
     }

css/components/_input-control.scss

@@ -0,0 +1,32 @@
+.input-control {
+    @include transition(all .2s ease-in);
+    display: inline-block;
+    width: 100%;
+    padding: 5px 7px;
+    color: $inputColor;
+    border-radius: $borderRadius;
+    line-height: 32px;
+    height: 32px;
+    text-align: left;
+    border:1px solid $inputBorderColor;
+    background-color: $inputBackground;
+    margin-bottom: 8px;
+
+    &:last-child {
+        margin-bottom: inherit;
+    }
+
+    &::selection {
+        background-color: $defaultDarkSelectionColor;
+    }
+
+
+    &.error {
+        color: $errorColor;
+        border-color: $errorColor;
+    }
+}
+
+@include placeholder {
+    color: $placeHolderColor;
+}

css/components/_link.scss

@@ -0,0 +1,11 @@
+.link {
+    cursor: pointer;
+    color: $linkFontColor;
+    @include transition(color .1s ease-out);
+
+    &:hover {
+        color: $linkHoverFontColor;
+        text-decoration: underline;
+        @include transition(color .1s ease-in);
+    }
+}

css/main.scss

@@ -33,6 +33,7 @@
 
 @import 'toastr';
 @import 'base';
+@import 'utils';
 @import 'overlay/overlay';
 @import 'inlay';
 @import 'reload_overlay/reload_overlay';
@@ -55,14 +56,18 @@
 @import 'jquery.contextMenu';
 @import 'keyboard-shortcuts';
 @import 'redirect_page';
-@import 'input-control/input-control';
+@import 'components/form-control';
+@import 'components/link';
 @import 'shortcuts/main';
-@import 'buttons/button-control';
+@import 'components/button-control';
+@import 'components/_input-control.scss';
 @import "modals/invite/invite";
 @import "connection-info";
 @import 'aui-components/dropdown';
 @import '404';
 @import 'policy';
 @import 'filmstrip';
+@import 'unsupported-browser/unsupported-desktop-browser';
+@import 'unsupported-browser/unsupported-mobile-browser';
 
 /* Modules END */

css/modals/_dialog.scss

@@ -2,7 +2,7 @@
     visibility: visible;
     height: auto;
 
-    h3 {
+    h1, h2, h3, h4, h5, h6 {
         color: $auiDialogColor;
     }
 
@@ -72,7 +72,7 @@
         }
     }
 
-    .input-control:not(:last-child) {
+    .form-control:not(:last-child) {
         border-bottom: 1px solid $auiBorderColor;
     }
 }

css/modals/feedback/_feedback.scss

@@ -62,20 +62,18 @@
             text-align: center;
             padding: 10px 40px 20px 40px;
 
-            .input-control{
-                &__input {
-                    background-color: $feedbackInputBg;
-                    color: $feedbackInputTextColor;
+            .input-control {
+                background-color: $feedbackInputBg;
+                color: $feedbackInputTextColor;
 
-                    &::-webkit-input-placeholder {
-                        color: $feedbackInputPlaceholderColor;
-                    }
-                    &::-moz-placeholder {  /* Firefox 19+ */
-                        color: $feedbackInputPlaceholderColor;
-                    }
-                    &:-ms-input-placeholder {
-                        color: $feedbackInputPlaceholderColor;
-                    }
+                &::-webkit-input-placeholder {
+                    color: $feedbackInputPlaceholderColor;
+                }
+                &::-moz-placeholder {  /* Firefox 19+ */
+                    color: $feedbackInputPlaceholderColor;
+                }
+                &:-ms-input-placeholder {
+                    color: $feedbackInputPlaceholderColor;
                 }
             }
 

css/overlay/_overlay.scss

@@ -1,5 +1,6 @@
 .overlay {
-    &__container {
+    &__container,
+    &__container-light {
         top: 0;
         left: 0;
         width: 100%;
@@ -9,6 +10,10 @@
         background: $defaultBackground;
     }
 
+    &__container-light {
+        @include transparentBg($defaultBackground, 0.7);
+    }
+
     &__content {
         position: absolute;
         margin: 0 auto;

css/reload_overlay/_reload_overlay.scss

@@ -13,5 +13,4 @@
 #reloadProgressBar {
     width: 180px;
     margin: 5px auto;
-}
-
+}

css/themes/_light.scss

@@ -1,3 +1,14 @@
+/**
+ * Base
+ */
+$baseLight: #FFFFFF;
+
+/**
+* Controls
+*/
+$controlBackground: $baseLight;
+$controlColor: #333333;
+
 /**
 * Buttons
 */
@@ -17,7 +28,7 @@ $buttonLinkColor: #0090e8;
 
 $primaryButtonBackground: #3572b0;
 $primaryButtonHoverBackground: #2a67a5;
-$primaryButtonColor: #fff;
+$primaryButtonColor: $baseLight;
 $primaryButtonFontWeight: 400;
 
 $buttonShadowColor: #192d4f;
@@ -38,14 +49,20 @@ $uploadConnectionIconColor: #ffa800;
  **/
 $auiDialogColor: #333;
 $auiDialogBg: #f5f5f5;
-$auiDialogContentBg: #fff;
+$auiDialogContentBg: $baseLight;
 $auiBorderColor: #ccc;
 $dialogTitleFontWeight: 400;
 
+/**
+* Inlay colors
+**/
+$inlayColorBg: lighten($defaultBackground, 20%);
+$inlayBorderColor: lighten($auiDialogContentBg, 10%);
+
 // Main controls
-$inputBackground: #fff;
+$inputBackground: $controlBackground;
 $inputBorderColor: #ccc;
-$inputColor: #333;
+$inputColor: $controlColor;
 $placeHolderColor: #a7a7a7;
 $readOnlyInputColor: #a7a7a7;
 $defaultDarkSelectionColor: #ccc;
@@ -57,10 +74,22 @@ $linkHoverFontColor: darken(#3572b0, 10%);
 $dropdownColor: #333;
 $errorColor: #c61600;
 
+// Feedback colors
+$feedbackCancelFontColor: #333;
+
 // Popover colors
 $popoverBg: #000;
 $popoverFontColor: #ffffff;
 $popupMenuSelectedItemBackground: rgba(256, 256, 256, .2);
 
 // Toolbar
-$splitterColor: #ccc;
+$splitterColor: #ccc;
+
+/**
+ * Forms
+ */
+//dropdown
+$selectFontColor: $controlColor;
+$selectBg: $controlBackground;
+$selectActiveBg: darken($controlBackground, 5%);
+$selectActiveItemBg: darken($controlBackground, 20%);

css/unsupported-browser/_unsupported-desktop-browser.scss

@@ -0,0 +1,132 @@
+.supported-browser {
+    color: #929391;
+    display: inline-block;
+    font-size: 20px;
+    margin: 1em 7px;
+    vertical-align: middle;
+    width: 138px;
+
+    &__button {
+        background-color: #62c82a;
+        border: 1px solid #3c8117;
+        border-radius: 10px;
+        color: #FFFFFF;
+        font-size: 12px;
+        height: 26px;
+        margin: 15px auto 0px auto;
+        padding-top: 13px;
+        text-align: center;
+        width: 115px;
+    }
+
+    &__link {
+        color: #087dba;
+        text-decoration: none;
+
+        &:hover {
+            text-decoration: none;
+        }
+
+        &:active {
+            text-decoration: none;
+        }
+
+        &:focus {
+            text-decoration: none;
+        }
+    }
+
+    &-list
+    {
+        margin: 0 auto;
+    }
+
+    &__logo {
+        margin: 20px auto 0px auto;
+
+        &_chrome {
+            background-image: url('../../images/chrome.png');
+            height: 78px;
+            width: 78px;
+        }
+
+        &_chromium {
+            background-image: url('../../images/chromium.png');
+            height: 78px;
+            width: 77px;
+        }
+
+        &_firefox {
+            background-image: url('../../images/firefox.png');
+            height: 80px;
+            width: 86px;
+        }
+
+        &_opera {
+            background-image: url('../../images/opera.png');
+            height: 78px;
+            width: 73px;
+        }
+
+        &_ie {
+            background-image: url('../../images/ie.png');
+            height: 78px;
+            width: 80px;
+        }
+
+        &_safari {
+            background-image: url('../../images/safari.png');
+            height: 79px;
+            width: 78px;
+        }
+    }
+
+    &__text
+    {
+        line-height: 1.2em;
+
+        &_small {
+            font-size: small;
+        }
+    }
+
+    &__tile {
+        background-color: #e8e8e8;
+        border: 1px solid #cfcfcf;
+        border-radius: 10px;
+        height: 163px;
+        margin-top: 5px;
+        width: 138px;
+    }
+}
+
+.unsupported-desktop-browser {
+    display: block;
+    height: 565px;
+    margin: auto;
+    overflow:hidden;
+    position: absolute;
+    text-align: center;
+    top: 0; left: 0; bottom: 0; right: 0;
+    width:500px;
+
+    &__page {
+        display:inline-block;
+        font-size: 28px;
+        padding-top: 25px;
+        vertical-align:middle;
+    }
+
+    &__title {
+        margin: 0 auto;
+        width: 20em;
+    }
+
+    &-wrapper {
+        background: #fff;
+        display: block;
+        height: 100%;
+        position: absolute;
+        width: 100%;
+    }
+}

css/unsupported-browser/_unsupported-mobile-browser.scss

@@ -0,0 +1,69 @@
+.unsupported-mobile-browser {
+    background-color: #fff;
+    height: 100vh;
+    padding: 35px 0;
+    width: 100vw;
+
+    &__body {
+        color: $unsupportedBrowserTextColor;
+        margin: auto;
+        max-width: 40em;
+        text-align: center;
+        width: 75%;
+
+        a:active {
+            text-decoration: none;
+        }
+    }
+
+    &__text {
+        font-size: 1.8em;
+        line-height: em(29px, 21px);
+        margin-bottom: 0.65em;
+
+        &_small {
+            font-size: 1.5em;
+            margin-bottom: 1em;
+            margin-top: em(21, 18);
+
+            strong {
+                font-size: em(21, 18);
+            }
+        }
+    }
+
+    &__logo {
+        height: 108px;
+        width: 77px;
+    }
+
+    &__button {
+        border: 0;
+        height: 42px;
+        margin: 0 auto;
+        max-width: 300px;
+        width: 98%;
+        @include border-radius(8px);
+        background-color: $unsupportedBrowserButtonBgColor;
+        font-size: 1.5em;
+        font-weight: 300;
+        letter-spacing: 0.5px;
+        text-shadow: 0px 1px 2px $unsupportedBrowserTextColor;
+
+        // Disable standard button effects.
+        box-shadow: none;
+        outline: none;
+
+        &:active {
+            background-color: $unsupportedBrowserButtonBgColor;
+        }
+
+        &_primary {
+            background-color: $primaryUnsupportedBrowserButtonBgColor;
+
+            &:active {
+                background-color: $primaryUnsupportedBrowserButtonBgColor;
+            }
+        }
+    }
+}

css/unsupported_browser.scss

@@ -1,138 +0,0 @@
-@import 'variables';
-
-body {
-    width:100%;
-    height:100%;
-    background-color: white;
-    color: #424242;
-    font-family: $baseFontFamily;
-    font-size: 28px;
-    margin:0;
-    padding:0;
-}
-#wrap{
-    display: block;
-    position: absolute;
-    width:500px;
-    height: 565px;
-    overflow:hidden;
-    text-align: center;
-    margin: auto;
-    top: 0; left: 0; bottom: 0; right: 0;
-}
-.firefox{
-    font-size: 11pt;
-    color: #c8c8c8;
-    width: 468px;
-    text-align: center;
-    margin: 30px auto 0px auto;
-    padding-left: 15px;
-}
-#text{
-    display:inline-block;
-    font-size: 28px;
-    /* width: 568px; */
-    vertical-align:middle;
-    padding-top: 25px;
-}
-
-a {
-    color: #087dba;
-    text-decoration:none;
-}
-
-.browser {
-    width: 138px;
-    height: 163px;
-    margin-top: 5px;
-    background-color: #e8e8e8;
-    border: 1px solid #cfcfcf;
-    border-radius: 10px;
-}
-
-.browser_wrapper
-{
-    width: 138px;
-    /* height: 188px; */
-    vertical-align: middle;
-    color: #929391;
-    font-size: 20px;
-    float: left;
-    margin-left: 15px;
-    margin-top: 5px;
-}
-
-.browser_text
-{
-    height: 2em;
-}
-.supported_browsers
-{
-    margin: 0px auto 0px auto;
-    /* width: 660px; */
-}
-
-.clear
-{
-    clear: both;
-}
-
-.button
-{
-    background-color: #62c82a;
-    border: 1px solid #3c8117;
-    border-radius: 10px;
-    color: #FFFFFF;
-    font-size: 12px;
-    text-align: center;
-    width: 115px;
-    height: 26px;
-    padding-top: 13px;
-    margin: 15px auto 0px auto;
-}
-
-.logo
-{
-    margin: 20px auto 0px auto;
-}
-
-#chrome_logo
-{
-    width: 78px;
-    height: 78px;
-    background-image: url('../images/chrome.png');
-}
-#chromium_logo
-{
-    width: 77px;
-    height: 78px;
-    background-image: url('../images/chromium.png');
-}
-#firefox_logo
-{
-    width: 86px;
-    height: 80px;
-    background-image: url('../images/firefox.png');
-}
-
-#opera_logo
-{
-    width: 73px;
-    height: 78px;
-    background-image: url('../images/opera.png');
-}
-
-#safari_logo
-{
-    width: 78px;
-    height: 79px;
-    background-image: url('../images/safari.png');
-}
-
-#ie_logo
-{
-    width: 80px;
-    height: 78px;
-    background-image: url('../images/ie.png');
-}
-

debian/changelog

@@ -1,4 +1,4 @@
-jitsi-meet (1.0.1-1) unstable; urgency=low
+jitsi-meet-web (1.0.1-1) unstable; urgency=low
 
   * Initial release. (Closes: #760485)
 

debian/control

@@ -1,4 +1,4 @@
-Source: jitsi-meet
+Source: jitsi-meet-web
 Section: net
 Priority: extra
 Maintainer: Jitsi Team <dev@jitsi.org>
@@ -7,10 +7,10 @@ Build-Depends: debhelper (>= 8.0.0)
 Standards-Version: 3.9.6
 Homepage: https://jitsi.org/meet
 
-Package: jitsi-meet
+Package: jitsi-meet-web
+Replaces: jitsi-meet (<= 1.0.1525-1)
 Architecture: all
-Depends: ${misc:Depends}, jitsi-videobridge, jitsi-meet-prosody,
- openjdk-8-jre-headless | nginx
+Depends: ${misc:Depends}
 Description: WebRTC JavaScript video conferences
  Jitsi Meet is a WebRTC JavaScript application that uses Jitsi
  Videobridge to provide high quality, scalable video conferences.
@@ -19,9 +19,24 @@ Description: WebRTC JavaScript video conferences
  forwarding and relaying, configured to work with jetty instance
  running embedded into Jitsi Videobridge
 
+Package: jitsi-meet-web-config
+Architecture: all
+Depends: openssl, openjdk-8-jre-headless | nginx | apache2
+Description: Configuration for web serving of Jitsi Meet
+ Jitsi Meet is a WebRTC JavaScript application that uses Jitsi
+ Videobridge to provide high quality, scalable video conferences.
+ .
+ It is a web interface to Jitsi Videobridge for audio and video
+ forwarding and relaying, configured to work with jetty instance
+ running embedded into Jitsi Videobridge or using a webserver Nginx or
+ Apache2.
+ .
+ This package contains configuration for Nginx to be used with
+ Jitsi Meet.
+
 Package: jitsi-meet-prosody
 Architecture: all
-Depends: ${misc:Depends}, openssl, prosody | prosody-trunk, jitsi-videobridge, jicofo
+Depends: openssl, prosody | prosody-trunk
 Description: Prosody configuration for Jitsi Meet
  Jitsi Meet is a WebRTC JavaScript application that uses Jitsi
  Videobridge to provide high quality, scalable video conferences.

debian/jitsi-meet-prosody.config

@@ -1,4 +0,0 @@
-#!/bin/sh -e
-
-# Source debconf library.
-. /usr/share/debconf/confmodule

debian/jitsi-meet-prosody.postinst

@@ -21,13 +21,49 @@ set -e
 case "$1" in
     configure)
 
-        . /etc/jitsi/videobridge/config
-
-        . /etc/jitsi/jicofo/config
-
         # loading debconf
         . /usr/share/debconf/confmodule
 
+        # try to get host from jitsi-videobridge
+        db_get jitsi-videobridge/jvb-hostname
+        if [ -z "$RET" ] ; then
+            # server hostname
+            db_set jitsi-videobridge/jvb-hostname "localhost"
+            db_input critical jitsi-videobridge/jvb-hostname || true
+            db_go
+        fi
+        JVB_HOSTNAME="$RET"
+
+        db_get jitsi-videobridge/jvbsecret
+        if [ -z "$RET" ] ; then
+            db_input critical jitsi-videobridge/jvbsecret || true
+            db_go
+        fi
+        JVB_SECRET="$RET"
+
+        db_get jicofo/jicofo-authuser
+        if [ -z "$RET" ] ; then
+            db_input critical jicofo/jicofo-authuser || true
+            db_go
+        fi
+        JICOFO_AUTH_USER="$RET"
+
+        db_get jicofo/jicofo-authpassword
+        if [ -z "$RET" ] ; then
+            db_input critical jicofo/jicofo-authpassword || true
+            db_go
+        fi
+        JICOFO_AUTH_PASSWORD="$RET"
+
+        db_get jicofo/jicofosecret
+        if [ -z "$RET" ] ; then
+            db_input critical jicofo/jicofosecret || true
+            db_go
+        fi
+        JICOFO_SECRET="$RET"
+
+        JICOFO_AUTH_DOMAIN="auth.$JVB_HOSTNAME"
+
         # detect dpkg-reconfigure, just delete old links
         db_get jitsi-meet-prosody/jvb-hostname
         JVB_HOSTNAME_OLD=$RET
@@ -38,7 +74,7 @@ case "$1" in
         fi
 
         # stores the hostname so we will reuse it later, like in purge
-        db_set jitsi-meet-prosody/jvb-hostname $JVB_HOSTNAME
+        db_set jitsi-meet-prosody/jvb-hostname "$JVB_HOSTNAME"
 
         # and we're done with debconf
         db_stop
@@ -68,21 +104,21 @@ case "$1" in
             fi
         fi
         # UPGRADE to server side focus check if focus is configured
-        if [ -f $PROSODY_HOST_CONFIG ] && ! grep -q "VirtualHost \"auth.$JVB_HOSTNAME\"" $PROSODY_HOST_CONFIG; then
-            echo -e "\nVirtualHost \"auth.$JVB_HOSTNAME\"" >> $PROSODY_HOST_CONFIG
+        if [ -f $PROSODY_HOST_CONFIG ] && ! grep -q "VirtualHost \"$JICOFO_AUTH_DOMAIN\"" $PROSODY_HOST_CONFIG; then
+            echo -e "\nVirtualHost \"$JICOFO_AUTH_DOMAIN\"" >> $PROSODY_HOST_CONFIG
             echo -e "        authentication = \"internal_plain\"\n" >> $PROSODY_HOST_CONFIG
-            sed -i "s/Component \"conference.$JVB_HOSTNAME\" \"muc\"/Component \"conference.$JVB_HOSTNAME\" \"muc\"\nadmins = { \"$JICOFO_AUTH_USER@auth.$JVB_HOSTNAME\" }\n/g" $PROSODY_HOST_CONFIG
+            sed -i "s/Component \"conference.$JVB_HOSTNAME\" \"muc\"/Component \"conference.$JVB_HOSTNAME\" \"muc\"\nadmins = { \"$JICOFO_AUTH_USER@$JICOFO_AUTH_DOMAIN\" }\n/g" $PROSODY_HOST_CONFIG
             echo -e "Component \"focus.$JVB_HOSTNAME\"" >> $PROSODY_HOST_CONFIG
             echo -e "    component_secret=\"$JICOFO_SECRET\"\n" >> $PROSODY_HOST_CONFIG
             PROSODY_CREATE_JICOFO_USER="true"
         # UPGRADE to server side focus on old config(/etc/prosody/prosody.cfg.lua)
-        elif [ ! -f $PROSODY_HOST_CONFIG ] && ! grep -q "VirtualHost \"auth.$JVB_HOSTNAME\"" $PROSODY_CONFIG_OLD; then
-            echo -e "\nVirtualHost \"auth.$JVB_HOSTNAME\"" >> $PROSODY_CONFIG_OLD
+        elif [ ! -f $PROSODY_HOST_CONFIG ] && ! grep -q "VirtualHost \"$JICOFO_AUTH_DOMAIN\"" $PROSODY_CONFIG_OLD; then
+            echo -e "\nVirtualHost \"$JICOFO_AUTH_DOMAIN\"" >> $PROSODY_CONFIG_OLD
             echo -e "        authentication = \"internal_plain\"\n" >> $PROSODY_CONFIG_OLD
             if ! grep -q "admins = { }" $PROSODY_CONFIG_OLD; then
-                echo -e "admins = { \"$JICOFO_AUTH_USER@auth.$JVB_HOSTNAME\" }\n" >> $PROSODY_CONFIG_OLD
+                echo -e "admins = { \"$JICOFO_AUTH_USER@$JICOFO_AUTH_DOMAIN\" }\n" >> $PROSODY_CONFIG_OLD
             else
-                sed -i "s/admins = { }/admins = { \"$JICOFO_AUTH_USER@auth.$JVB_HOSTNAME\" }\n/g" $PROSODY_CONFIG_OLD
+                sed -i "s/admins = { }/admins = { \"$JICOFO_AUTH_USER@$JICOFO_AUTH_DOMAIN\" }\n/g" $PROSODY_CONFIG_OLD
             fi
             echo -e "Component \"focus.$JVB_HOSTNAME\"" >> $PROSODY_CONFIG_OLD
             echo -e "    component_secret=\"$JICOFO_SECRET\"\n" >> $PROSODY_CONFIG_OLD
@@ -109,8 +145,6 @@ case "$1" in
 
         if [ "$PROSODY_CONFIG_PRESENT" = "false" ]; then
             invoke-rc.d prosody restart
-            invoke-rc.d jitsi-videobridge restart
-            invoke-rc.d jicofo restart
         fi
     ;;
 

debian/jitsi-meet-prosody.postrm

@@ -36,6 +36,9 @@ case "$1" in
             rm -f /etc/prosody/conf.avail/$JVB_HOSTNAME.cfg.lua
             rm -f /etc/prosody/conf.d/$JVB_HOSTNAME.cfg.lua
         fi
+
+        # Clear the debconf variable
+        db_purge
     ;;
 
     upgrade|failed-upgrade|abort-install|abort-upgrade|disappear)

debian/jitsi-meet-prosody.templates

@@ -2,3 +2,29 @@ Template: jitsi-meet-prosody/jvb-hostname
 Type: string
 _Description: The hostname of the current installation:
  The value for the hostname that is set in Jitsi Videobridge installation.
+
+Template: jitsi-videobridge/jvb-hostname
+Type: string
+_Description: The hostname of the current installation:
+ The value for the hostname that is set in Jitsi Videobridge installation.
+
+Template: jitsi-videobridge/jvbsecret
+Type: password
+_Description: Jitsi Videobridge Component secret:
+ The secret used by Jitsi Videobridge to connect to xmpp server as component.
+
+Template: jicofo/jicofo-authuser
+Type: string
+Default: focus
+_Description: Jicofo username:
+ The jicofo needs an authenticated admin user to connect to xmpp server.
+
+Template: jicofo/jicofo-authpassword
+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

debian/jitsi-meet-tokens.postinst

@@ -21,17 +21,12 @@ set -e
 case "$1" in
     configure)
 
-        if [ -f "/etc/jitsi/videobridge/config" ] ; then
-            . /etc/jitsi/videobridge/config
-        fi
-
-        if [ -f "/etc/jitsi/jicofo/config" ] ; then
-            . /etc/jitsi/jicofo/config
-        fi
-
         # loading debconf
         . /usr/share/debconf/confmodule
 
+        db_get jitsi-meet-prosody/jvb-hostname
+        JVB_HOSTNAME="$RET"
+
         db_get jitsi-meet-tokens/appid
         if [ "$RET" = "false" ] ; then
             echo "Application ID is mandatory"
@@ -45,14 +40,10 @@ case "$1" in
         fi
         APP_SECRET=$RET
 
-        # We can adjust Prosody config only if there is Jvb or Jicofo domain configured
         PROSODY_HOST_CONFIG="/etc/prosody/conf.avail/$JVB_HOSTNAME.cfg.lua"
-        if [ ! -f "$PROSODY_HOST_CONFIG" ] ; then
-            PROSODY_HOST_CONFIG="/etc/prosody/conf.avail/$JICOFO_HOSTNAME.cfg.lua"
-        fi
 
         # Store config filename for purge
-        db_set jitsi-meet-prosody/prosody_config $PROSODY_HOST_CONFIG
+        db_set jitsi-meet-prosody/prosody_config "$PROSODY_HOST_CONFIG"
 
         db_stop
 

debian/jitsi-meet-tokens.postrm

@@ -52,6 +52,8 @@ case "$1" in
     ;;
 
     purge)
+        # Clear the debconf variable
+        db_purge
     ;;
 
     upgrade|failed-upgrade|abort-install|abort-upgrade|disappear)

debian/jitsi-meet-web-config.docs

@@ -1,4 +1,4 @@
-README.md
 doc/debian/jitsi-meet/jitsi-meet.example
+doc/debian/jitsi-meet/jitsi-meet.example-apache
 doc/debian/jitsi-meet/README
 config.js

debian/jitsi-meet-web-config.postinst

@@ -1,5 +1,5 @@
 #!/bin/bash
-# postinst script for jitsi-meet
+# postinst script for jitsi-meet-web-config
 #
 # see: dh_installdeb(1)
 
@@ -20,13 +20,19 @@ set -e
 case "$1" in
     configure)
 
-        JVB_ETC_CONFIG="/etc/jitsi/videobridge/config"
-
-        . $JVB_ETC_CONFIG
-
         # loading debconf
         . /usr/share/debconf/confmodule
 
+        # try to get host from jitsi-videobridge
+        db_get jitsi-videobridge/jvb-hostname
+        if [ -z "$RET" ] ; then
+            # server hostname
+            db_set jitsi-videobridge/jvb-hostname "localhost"
+            db_input critical jitsi-videobridge/jvb-hostname || true
+            db_go
+        fi
+        JVB_HOSTNAME="$RET"
+
         # detect dpkg-reconfigure
         RECONFIGURING="false"
         db_get jitsi-meet/jvb-hostname
@@ -49,22 +55,54 @@ case "$1" in
         if [ "$NGINX_INSTALL_CHECK" = "installed" ] || [ "$NGINX_INSTALL_CHECK" = "unpacked" ] ; then
             FORCE_NGINX="true"
         fi
+        APACHE_INSTALL_CHECK="$(dpkg-query -f '${Status}' -W 'apache2' 2>/dev/null | awk '{print $3}' || true)"
+        if [ "$APACHE_INSTALL_CHECK" = "installed" ] || [ "$APACHE_INSTALL_CHECK" = "unpacked" ] ; then
+            FORCE_APACHE="true"
+        fi
 
-        # SSL for nginx
-        db_get jitsi-meet/cert-choice
-        CERT_CHOICE="$RET"
-        UPLOADED_CERT_CHOICE="A certificate is available and the files are uploaded on the server"
+        # if first time config ask for certs, or if we are reconfiguring
+        if [ -z "$JVB_HOSTNAME_OLD" ] || [ "$RECONFIGURING" = "true" ] ; then
+            # SSL for nginx
+            db_get jitsi-meet/cert-choice
+            CERT_CHOICE="$RET"
+            UPLOADED_CERT_CHOICE="A certificate is available and the files are uploaded on the server"
+
+            if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
+                db_set jitsi-meet/cert-path-key "/etc/ssl/$JVB_HOSTNAME.key"
+                db_input critical jitsi-meet/cert-path-key || true
+                db_go
+                db_get jitsi-meet/cert-path-key
+                CERT_KEY="$RET"
+                db_set jitsi-meet/cert-path-crt "/etc/ssl/$JVB_HOSTNAME.crt"
+                db_input critical jitsi-meet/cert-path-crt || true
+                db_go
+                db_get jitsi-meet/cert-path-crt
+                CERT_CRT="$RET"
+            else
+                # create self-signed certs
+                CERT_KEY="/etc/jitsi/meet/$JVB_HOSTNAME.key"
+                CERT_CRT="/etc/jitsi/meet/$JVB_HOSTNAME.crt"
+                HOST="$( (hostname -s; echo localhost) | head -n 1)"
+                DOMAIN="$( (hostname -d; echo localdomain) | head -n 1)"
+                openssl req -new -newkey rsa:4096 -days 365 -nodes -x509 -subj \
+                    "/O=$DOMAIN/OU=$HOST/CN=$JVB_HOSTNAME/emailAddress=webmaster@$HOST.$DOMAIN" \
+                    -keyout $CERT_KEY \
+                    -out $CERT_CRT
+            fi
+        fi
 
         # jitsi meet
         JITSI_MEET_CONFIG="/etc/jitsi/meet/$JVB_HOSTNAME-config.js"
         if [ ! -f $JITSI_MEET_CONFIG ] ; then
-            cp /usr/share/doc/jitsi-meet/config.js $JITSI_MEET_CONFIG
+            cp /usr/share/doc/jitsi-meet-web-config/config.js $JITSI_MEET_CONFIG
             sed -i "s/jitsi-meet.example.com/$JVB_HOSTNAME/g" $JITSI_MEET_CONFIG
         fi
 
         # this is new install let's configure jvb to serve meet
-        if [[ -z $FORCE_NGINX && ( -z $JVB_HOSTNAME_OLD || "$JVB_SERVE" = "true" ) ]] ; then
+        # no-nginx, no-apache installed on machine, this is new install or reconfiguring old one which have jvb_serve set
+        if [[ -z "$FORCE_NGINX" && -z "$FORCE_APACHE" && ( -z "$JVB_HOSTNAME_OLD" || ( "$JVB_SERVE" = "true" && "$RECONFIGURING" = "true" )) ]] ; then
 
+            JVB_ETC_CONFIG="/etc/jitsi/videobridge/config"
             JVB_CONFIG="/etc/jitsi/videobridge/sip-communicator.properties"
 
             # this is a reconfigure, lets just delete old links
@@ -89,6 +127,7 @@ case "$1" in
             echo "org.jitsi.videobridge.rest.jetty.ResourceHandler.resourceBase=/usr/share/jitsi-meet" >> $JVB_CONFIG
             echo "org.jitsi.videobridge.rest.jetty.ResourceHandler.alias./config.js=/etc/jitsi/meet/$JVB_HOSTNAME-config.js" >> $JVB_CONFIG
             echo "org.jitsi.videobridge.rest.jetty.ResourceHandler.alias./interface_config.js=/usr/share/jitsi-meet/interface_config.js" >> $JVB_CONFIG
+            echo "org.jitsi.videobridge.rest.jetty.ResourceHandler.alias./logging_config.js=/usr/share/jitsi-meet/logging_config.js" >> $JVB_CONFIG
             echo "org.jitsi.videobridge.rest.jetty.RewriteHandler.regex=^/([a-zA-Z0-9]+)$" >> $JVB_CONFIG
             echo "org.jitsi.videobridge.rest.jetty.RewriteHandler.replacement=/" >> $JVB_CONFIG
             echo "org.jitsi.videobridge.rest.jetty.SSIResourceHandler.paths=/" >> $JVB_CONFIG
@@ -112,34 +151,19 @@ case "$1" in
                 chmod 755 /etc/authbind/byport/443
             fi
 
-            if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
-                # create jks from uploaded certs
-                openssl pkcs12 -export \
-                    -in /etc/ssl/$JVB_HOSTNAME.crt \
-                    -inkey /etc/ssl/$JVB_HOSTNAME.key \
-                    -passout pass:changeit > /etc/jitsi/videobridge/$JVB_HOSTNAME.p12
-                keytool -importkeystore \
-                    -srckeystore /etc/jitsi/videobridge/$JVB_HOSTNAME.p12 \
-                    -destkeystore /etc/jitsi/videobridge/$JVB_HOSTNAME.jks \
-                    -srcstoretype pkcs12 \
-                    -noprompt -storepass changeit -srcstorepass changeit
-            else
-                # create jks from self-signed certs
-                openssl pkcs12 -export \
-                    -in /var/lib/prosody/$JVB_HOSTNAME.crt \
-                    -inkey /var/lib/prosody/$JVB_HOSTNAME.key \
-                    -passout pass:changeit > /etc/jitsi/videobridge/$JVB_HOSTNAME.p12
-                keytool -importkeystore \
-                    -srckeystore /etc/jitsi/videobridge/$JVB_HOSTNAME.p12 \
-                    -destkeystore /etc/jitsi/videobridge/$JVB_HOSTNAME.jks \
-                    -srcstoretype pkcs12 \
-                    -noprompt -storepass changeit -srcstorepass changeit
-            fi
+            CERT_P12="/etc/jitsi/videobridge/$JVB_HOSTNAME.p12"
+            CERT_JKS="/etc/jitsi/videobridge/$JVB_HOSTNAME.jks"
+            # create jks from  certs
+            openssl pkcs12 -export \
+                -in $CERT_CRT -inkey $CERT_KEY -passout pass:changeit > $CERT_P12
+            keytool -importkeystore -destkeystore $CERT_JKS \
+                -srckeystore $CERT_P12 -srcstoretype pkcs12 \
+                -noprompt -storepass changeit -srcstorepass changeit
 
             db_set jitsi-meet/jvb-serve "true"
 
             invoke-rc.d jitsi-videobridge restart
-        elif [[ "$FORCE_NGINX" = "true" || ( -n $JVB_HOSTNAME_OLD && "$JVB_SERVE" = "false" ) ]] ; then
+        elif [[ "$FORCE_NGINX" = "true" && ( -z "$JVB_HOSTNAME_OLD" || "$RECONFIGURING" = "true" ) ]] ; then
             # this is a reconfigure, lets just delete old links
             if [ "$RECONFIGURING" = "true" ] ; then
                 rm -f /etc/nginx/sites-enabled/$JVB_HOSTNAME_OLD.conf
@@ -148,7 +172,7 @@ case "$1" in
 
             # nginx conf
             if [ ! -f /etc/nginx/sites-available/$JVB_HOSTNAME.conf ] ; then
-                cp /usr/share/doc/jitsi-meet/jitsi-meet.example /etc/nginx/sites-available/$JVB_HOSTNAME.conf
+                cp /usr/share/doc/jitsi-meet-web-config/jitsi-meet.example /etc/nginx/sites-available/$JVB_HOSTNAME.conf
                 if [ ! -f /etc/nginx/sites-enabled/$JVB_HOSTNAME.conf ] ; then
                     ln -s /etc/nginx/sites-available/$JVB_HOSTNAME.conf /etc/nginx/sites-enabled/$JVB_HOSTNAME.conf
                 fi
@@ -156,28 +180,47 @@ case "$1" in
             fi
 
             if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
-                db_set jitsi-meet/cert-path-key "/etc/ssl/$JVB_HOSTNAME.key"
-                db_input critical jitsi-meet/cert-path-key || true
-                db_go
-                db_get jitsi-meet/cert-path-key
-                CERT_KEY="$RET"
-                db_set jitsi-meet/cert-path-crt "/etc/ssl/$JVB_HOSTNAME.crt"
-                db_input critical jitsi-meet/cert-path-crt || true
-                db_go
-                db_get jitsi-meet/cert-path-crt
-                CERT_CRT="$RET"
                 # replace self-signed certificate paths with user provided ones
                 CERT_KEY_ESC=$(echo $CERT_KEY | sed 's/\./\\\./g')
                 CERT_KEY_ESC=$(echo $CERT_KEY_ESC | sed 's/\//\\\//g')
-                sed -i "s/ssl_certificate_key\ \/var\/lib\/prosody\/.*key/ssl_certificate_key\ $CERT_KEY_ESC/g" \
+                sed -i "s/ssl_certificate_key\ \/etc\/jitsi\/meet\/.*key/ssl_certificate_key\ $CERT_KEY_ESC/g" \
                     /etc/nginx/sites-available/$JVB_HOSTNAME.conf
                 CERT_CRT_ESC=$(echo $CERT_CRT | sed 's/\./\\\./g')
                 CERT_CRT_ESC=$(echo $CERT_CRT_ESC | sed 's/\//\\\//g')
-                sed -i "s/ssl_certificate\ \/var\/lib\/prosody\/.*crt/ssl_certificate\ $CERT_CRT_ESC/g" \
+                sed -i "s/ssl_certificate\ \/etc\/jitsi\/meet\/.*crt/ssl_certificate\ $CERT_CRT_ESC/g" \
                     /etc/nginx/sites-available/$JVB_HOSTNAME.conf
             fi
 
             invoke-rc.d nginx reload
+        elif [[ "$FORCE_APACHE" = "true" && ( -z "$JVB_HOSTNAME_OLD" || "$RECONFIGURING" = "true" ) ]] ; then
+            # this is a reconfigure, lets just delete old links
+            if [ "$RECONFIGURING" = "true" ] ; then
+                a2dissite $JVB_HOSTNAME_OLD.conf
+                rm -f /etc/jitsi/meet/$JVB_HOSTNAME_OLD-config.js
+            fi
+
+            # 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
+                cp /usr/share/doc/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
+            fi
+
+            if [ "$CERT_CHOICE" = "$UPLOADED_CERT_CHOICE" ] ; then
+                # replace self-signed certificate paths with user provided ones
+                CERT_KEY_ESC=$(echo $CERT_KEY | sed 's/\./\\\./g')
+                CERT_KEY_ESC=$(echo $CERT_KEY_ESC | sed 's/\//\\\//g')
+                sed -i "s/SSLCertificateKeyFile\ \/etc\/jitsi\/meet\/.*key/SSLCertificateKeyFile\ $CERT_KEY_ESC/g" \
+                    /etc/apache2/sites-available/$JVB_HOSTNAME.conf
+                CERT_CRT_ESC=$(echo $CERT_CRT | sed 's/\./\\\./g')
+                CERT_CRT_ESC=$(echo $CERT_CRT_ESC | sed 's/\//\\\//g')
+                sed -i "s/SSLCertificateFile\ \/etc\/jitsi\/meet\/.*crt/SSLCertificateFile\ $CERT_CRT_ESC/g" \
+                    /etc/apache2/sites-available/$JVB_HOSTNAME.conf
+            fi
+
+            invoke-rc.d apache2 reload
         fi
 
         # and we're done with debconf

debian/jitsi-meet-web-config.postrm

@@ -1,5 +1,5 @@
 #!/bin/sh
-# postrm script for jitsi-meet
+# postrm script for jitsi-meet-web-config
 #
 # see: dh_installdeb(1)
 
@@ -27,6 +27,9 @@ case "$1" in
         if [ -x "/etc/init.d/nginx" ]; then
             invoke-rc.d nginx reload
         fi
+        if [ -x "/etc/init.d/apache2" ]; then
+            invoke-rc.d apache2 reload
+        fi
     ;;
     purge)
         db_get jitsi-meet/jvb-hostname
@@ -35,9 +38,15 @@ case "$1" in
             rm -f /etc/jitsi/meet/$JVB_HOSTNAME-config.js
             rm -f /etc/nginx/sites-available/$JVB_HOSTNAME.conf
             rm -f /etc/nginx/sites-enabled/$JVB_HOSTNAME.conf
+            rm -f /etc/apache2/sites-available/$JVB_HOSTNAME.conf
+            rm -f /etc/apache2/sites-enabled/$JVB_HOSTNAME.conf
             rm -f /etc/jitsi/videobridge/$JVB_HOSTNAME.jks
             rm -f /etc/jitsi/videobridge/$JVB_HOSTNAME.p12
+            rm -f /etc/jitsi/meet/$JVB_HOSTNAME.key
+            rm -f /etc/jitsi/meet/$JVB_HOSTNAME.crt
         fi
+        # Clear the debconf variable
+        db_purge
     ;;
     upgrade|failed-upgrade|abort-install|abort-upgrade|disappear)
     ;;

debian/jitsi-meet-web-config.templates

@@ -30,3 +30,8 @@ Type: boolean
 Default: false
 _Description: for internal use
  for internal use.
+
+Template: jitsi-videobridge/jvb-hostname
+Type: string
+_Description: Hostname:
+ The Jitsi Meet web config package needs the DNS hostname of your instance.

debian/jitsi-meet-web.docs

@@ -0,0 +1 @@
+README.md

debian/jitsi-meet-web.install

@@ -4,7 +4,6 @@
 *.ico					/usr/share/jitsi-meet/
 libs					/usr/share/jitsi-meet/
 css/all.css 			/usr/share/jitsi-meet/css/
-css/unsupported_browser.css		/usr/share/jitsi-meet/css/
 sounds					/usr/share/jitsi-meet/
 fonts					/usr/share/jitsi-meet/
 images					/usr/share/jitsi-meet/

debian/po/POTFILES.in

@@ -1 +1 @@
-[type: gettext/rfc822deb] jitsi-meet.templates
+[type: gettext/rfc822deb] jitsi-meet-web-config.templates

debian/po/templates.pot

@@ -1,10 +1,14 @@
+# SOME DESCRIPTIVE TITLE.
+# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the jitsi-meet-web package.
+# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
 #
 #, fuzzy
 msgid ""
 msgstr ""
-"Project-Id-Version: jitsi-meet\n"
-"Report-Msgid-Bugs-To: jitsi-meet@packages.debian.org\n"
-"POT-Creation-Date: 2014-09-03 17:26+0200\n"
+"Project-Id-Version: jitsi-meet-web\n"
+"Report-Msgid-Bugs-To: jitsi-meet-web@packages.debian.org\n"
+"POT-Creation-Date: 2016-11-15 22:39+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -15,25 +19,25 @@ msgstr ""
 
 #. Type: select
 #. Choices
-#: ../jitsi-meet.templates:1001
+#: ../jitsi-meet-web-config.templates:1001
 msgid "Self-signed certificate will be generated"
 msgstr ""
 
 #. Type: select
 #. Choices
-#: ../jitsi-meet.templates:1001
+#: ../jitsi-meet-web-config.templates:1001
 msgid "A certificate is available and the files are uploaded on the server"
 msgstr ""
 
 #. Type: select
 #. Description
-#: ../jitsi-meet.templates:1002
+#: ../jitsi-meet-web-config.templates:1002
 msgid "SSL certificate for the Jitsi Meet instance"
 msgstr ""
 
 #. Type: select
 #. Description
-#: ../jitsi-meet.templates:1002
+#: ../jitsi-meet-web-config.templates:1002
 msgid ""
 "Jitsi Meet is best to be set up with an SSL certificate. Having no "
 "certificate, a self-signed one will be generated. Having a certificate "
@@ -44,13 +48,13 @@ msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:2001
+#: ../jitsi-meet-web-config.templates:2001
 msgid "Full local server path to the SSL key file:"
 msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:2001
+#: ../jitsi-meet-web-config.templates:2001
 msgid ""
 "The full path to the SSL key file on the server. If it has not been "
 "uploaded, now is a good time to do so."
@@ -58,13 +62,13 @@ msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:3001
+#: ../jitsi-meet-web-config.templates:3001
 msgid "Full local server path to the SSL certificate file:"
 msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:3001
+#: ../jitsi-meet-web-config.templates:3001
 msgid ""
 "The full path to the SSL certificate file on the server. If you haven't "
 "uploaded it, now is a good time to upload it in another console."
@@ -72,27 +76,38 @@ msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:4001
+#: ../jitsi-meet-web-config.templates:4001
 msgid "The hostname of the current installation:"
 msgstr ""
 
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:4001
+#: ../jitsi-meet-web-config.templates:4001
 msgid ""
 "The value for the hostname that is set in Jitsi Videobridge installation."
 msgstr ""
 
-
-#. Type: string
+#. Type: boolean
 #. Description
-#: ../jitsi-meet.templates:5001
+#: ../jitsi-meet-web-config.templates:5001
 msgid "for internal use"
 msgstr ""
 
+#. Type: boolean
+#. Description
+#: ../jitsi-meet-web-config.templates:5001
+msgid "for internal use."
+msgstr ""
+
 #. Type: string
 #. Description
-#: ../jitsi-meet.templates:5001
-msgid ""
-"Jitsi Videobridge installation can use its internal jetty to serve static meet pages."
+#: ../jitsi-meet-web-config.templates:6001
+msgid "Hostname:"
+msgstr ""
+
+#. Type: string
+#. Description
+#: ../jitsi-meet-web-config.templates:6001
+msgid ""
+"The Jitsi Meet web config package needs the DNS hostname of your instance."
 msgstr ""

doc/api.md

@@ -1,17 +1,17 @@
-Jitsi Meet API
-============
+# Jitsi Meet API
 
-You can use Jitsi Meet API to embed Jitsi Meet in to your application.
+You can use the Jitsi Meet API to embed Jitsi Meet in to your application.
 
-Installation
-==========
+## Installation
+
+To embed Jitsi Meet in your application you need to add the Jitsi Meet API library:
 
-To embed Jitsi Meet in your application you need to add Jitsi Meet API library
 ```javascript
 <script src="https://meet.jit.si/external_api.js"></script>
 ```
 
-The next step for embedding Jitsi Meet is to create the Jitsi Meet API object
+The next step for embedding Jitsi Meet is to create the Jitsi Meet API object:
+
 ```javascript
 <script>
     var domain = "meet.jit.si";
@@ -21,161 +21,174 @@ The next step for embedding Jitsi Meet is to create the Jitsi Meet API object
     var api = new JitsiMeetExternalAPI(domain, room, width, height);
 </script>
 ```
-You can paste that lines in your html code where you want to be placed the Jitsi Meet conference
-or you can specify the parent HTML element for the Jitsi Meet conference in the JitsiMeetExternalAPI
-constructor.
+
+You can use the above lines to indicate where exactly you want the Jitsi Meet conference to be placed in your HTML code,
+or you can specify the parent HTML element for the Jitsi Meet conference in the `JitsiMeetExternalAPI`
+constructor:
+
 ```javascript
-    var api = new JitsiMeetExternalAPI(domain, room, width, height, htmlElement);
+var api = new JitsiMeetExternalAPI(domain, room, width, height, htmlElement);
 ```
-If you don't specify room the user will enter in new conference with random room name.
 
-You can overwrite options set in config.js and interface_config.js. For example, to enable the film-strip-only interface mode and disable simulcast, you can use:
+If you don't specify the room the user will enter in new conference with a random room name.
+
+You can overwrite options set in [config.js]() and [interface_config.js](). For example, to enable the film-strip-only interface mode and disable simulcast, you can use:
+
 ```javascript
-    var configOverwrite = {enableSimulcast: false};
-    var interfaceConfigOverwrite = {filmStripOnly: true};
-    var api = new JitsiMeetExternalAPI(domain, room, width, height, htmlElement, true, configOverwrite, interfaceConfigOverwrite);
+var configOverwrite = {disableSimulcast: true};
+var interfaceConfigOverwrite = {filmStripOnly: true};
+var api = new JitsiMeetExternalAPI(domain, room, width, height, htmlElement, configOverwrite, interfaceConfigOverwrite);
 ```
 
-Controlling embedded Jitsi Meet Conference
-=========
+## Controlling the embedded Jitsi Meet Conference
 
-You can control the embedded Jitsi Meet conference using the JitsiMeetExternalAPI object.
+You can control the embedded Jitsi Meet conference using the `JitsiMeetExternalAPI` object by using `executeCommand`:
 
-You can send command to Jitsi Meet conference using ```executeCommand```.
-```
-api.executeCommand(command, arguments)
-```
-The ```command``` parameter is String object with the name of the command.
-The ```arguments``` parameter is array with the arguments required by the command.
-If no arguments are required by the command this parameter can be omitted or you can pass empty array.
-Currently we support the following commands:
-
-
-* **displayName** - sets the display name of the local participant. This command requires one argument -
-the new display name to be set
-```
-api.executeCommand('displayName', ['New Nickname']);
-```
-* **toggleAudio** - mutes / unmutes the audio for the local participant. No arguments are required.
-```
-api.executeCommand('toggleAudio', [])
-```
-* **toggleVideo** - mutes / unmutes the video for the local participant. No arguments are required.
-```
-api.executeCommand('toggleVideo', [])
-```
-* **toggleFilmStrip** - hides / shows the film strip. No arguments are required.
-```
-api.executeCommand('filmStrip', [])
-```
-* **toggleChat** - hides / shows the chat. No arguments are required.
-```
-api.executeCommand('toggleChat', [])
-```
-* **toggleContactList** - hides / shows the contact list. No arguments are required.
-```
-api.executeCommand('toggleContactList', [])
+```javascript
+api.executeCommand(command, ...arguments)
 ```
 
-* **toggleShareScreen** - starts / stops the screen sharing. No arguments are required.
+The `command` parameter is String object with the name of the command. The following commands are currently supported:
+
+* **displayName** - Sets the display name of the local participant. This command requires one argument - the new display name to be set.
+```javascript
+api.executeCommand('displayName', 'New Nickname');
 ```
-api.executeCommand('toggleShareScreen', [])
+
+* **toggleAudio** - Mutes / unmutes the audio for the local participant. No arguments are required.
+```javascript
+api.executeCommand('toggleAudio')
+```
+
+* **toggleVideo** - Mutes / unmutes the video for the local participant. No arguments are required.
+```javascript
+api.executeCommand('toggleVideo')
+```
+
+* **toggleFilmStrip** - Hides / shows the film strip. No arguments are required.
+```javascript
+api.executeCommand('toggleFilmStrip')
+```
+
+* **toggleChat** - Hides / shows the chat. No arguments are required.
+```javascript
+api.executeCommand('toggleChat')
+```
+
+* **toggleContactList** - Hides / shows the contact list. No arguments are required.
+```javascript
+api.executeCommand('toggleContactList')
+```
+
+* **toggleShareScreen** - Starts / stops screen sharing. No arguments are required.
+```javascript
+api.executeCommand('toggleShareScreen')
 ```
 
 * **hangup** - Hangups the call. No arguments are required.
-```
-api.executeCommand('hangup', [])
+```javascript
+api.executeCommand('hangup')
 ```
 
-You can also execute multiple commands using the method ```executeCommands```.
+* **email** - Changes the local email address. This command requires one argument - the new email address to be set.
+```javascript
+api.executeCommand('email', 'example@example.com')
 ```
+
+* **avatarUrl** - Changes the local avatar URL. This command requires one argument - the new avatar URL to be set.
+```javascript
+api.executeCommand('avatarUrl', 'https://avatars0.githubusercontent.com/u/3671647')
+```
+
+You can also execute multiple commands using the `executeCommands` method:
+```javascript
 api.executeCommands(commands)
 ```
-The ```commands``` parameter is object with keys the names of the commands and values the arguments for the
-commands.
-
-```
+The `commands` parameter is an object with the names of the commands as keys and the arguments for the commands asvalues:
+```javascript
 api.executeCommands({displayName: ['nickname'], toggleAudio: []});
 ```
 
-You can add event listeners to the embedded Jitsi Meet using ```addEventListener``` method.
-```
+You can add event listeners to the embedded Jitsi Meet using the `addEventListener` method.
+```javascript
 api.addEventListener(event, listener)
 ```
-The ```event``` parameter is String object with the name of the event.
-The ```listener``` paramenter is Function object with one argument that will be notified when the event occurs
-with data related to the event.
 
-Currently we support the following events:
+The `event` parameter is a String object with the name of the event.
+The `listener` parameter is a Function object with one argument that will be notified when the event occurs with data related to the event.
 
-* **incomingMessage** - event notifications about incoming
-messages. The listener will receive object with the following structure:
-```
+The following events are currently supported:
+
+* **incomingMessage** - Event notifications about incoming
+messages. The listener will receive an object with the following structure:
+```javascript
 {
-"from": from,//JID of the user that sent the message
-"nick": nick,//the nickname of the user that sent the message
-"message": txt//the text of the message
+"from": from,    // JID of the user that sent the message
+"nick": nick,    // the nickname of the user that sent the message
+"message": txt   // the text of the message
 }
 ```
-* **outgoingMessage** - event notifications about outgoing
-messages. The listener will receive object with the following structure:
-```
+
+* **outgoingMessage** - Event notifications about outgoing
+messages. The listener will receive an object with the following structure:
+```javascript
 {
-"message": txt//the text of the message
+"message": txt   // the text of the message
 }
 ```
+
 * **displayNameChanged** - event notifications about display name
-change. The listener will receive object with the following structure:
-```
+changes. The listener will receive an object with the following structure:
+```javascript
 {
-jid: jid,//the JID of the participant that changed his display name
-displayname: displayName //the new display name
+"jid": jid,                 // the JID of the participant that changed his display name
+"displayname": displayName  // the new display name
 }
 ```
-* **participantJoined** - event notifications about new participant.
-The listener will receive object with the following structure:
-```
+
+* **participantJoined** - event notifications about new participants who join the room. The listener will receive an object with the following structure:
+```javascript
 {
-jid: jid //the jid of the participant
+"jid": jid   // the JID of the participant
 }
 ```
-* **participantLeft** - event notifications about participant that left room.
-The listener will receive object with the following structure:
-```
+
+* **participantLeft** - event notifications about participants that leave the room. The listener will receive an object with the following structure:
+```javascript
 {
-jid: jid //the jid of the participant
+"jid": jid   // the JID of the participant
 }
 ```
-* **video-conference-joined** - event notifications fired when the local user has joined the video conference.
-The listener will receive object with the following structure:
-```
+
+* **videoConferenceJoined** - event notifications fired when the local user has joined the video conference. The listener will receive an object with the following structure:
+```javascript
 {
-roomName: room //the room name of the conference
+"roomName": room   // the room name of the conference
 }
 ```
-* **video-conference-left** - event notifications fired when the local user has left the video conference.
-The listener will receive object with the following structure:
-```
+
+* **videoConferenceLeft** - event notifications fired when the local user has left the video conference. The listener will receive an object with the following structure:
+```javascript
 {
-roomName: room //the room name of the conference
+"roomName": room   // the room name of the conference
 }
 ```
 
 * **readyToClose** - event notification fired when Jitsi Meet is ready to be closed (hangup operations are completed).
 
-You can also add multiple event listeners by using ```addEventListeners```.
+You can also add multiple event listeners by using `addEventListeners`.
 This method requires one argument of type Object. The object argument must
-have keys with the names of the events and values the listeners of the events.
+have the names of the events as keys and the listeners of the events as values.
 
-```
+```javascript
 function incomingMessageListener(object)
 {
-...
+// ...
 }
 
 function outgoingMessageListener(object)
 {
-...
+// ...
 }
 
 api.addEventListeners({
@@ -183,20 +196,28 @@ api.addEventListeners({
     outgoingMessage: outgoingMessageListener})
 ```
 
-If you want to remove a listener you can use ```removeEventListener``` method with argument the name of the event.
-```
+If you want to remove a listener you can use `removeEventListener` method with argument the name of the event.
+
+```javascript
 api.removeEventListener("incomingMessage");
 ```
 
-If you want to remove more than one event you can use ```removeEventListeners``` method with argument
- array with the names of the events.
-```
+If you want to remove more than one event you can use `removeEventListeners` method with an Array with the names of the events as an argument.
+```javascript
 api.removeEventListeners(["incomingMessage", "outgoingMessageListener"]);
 ```
 
-You can remove the embedded Jitsi Meet Conference with the following code:
+You can get the number of participants in the conference with the following API function:
+```javascript
+var numberOfParticipants = api.getNumberOfParticipants();
 ```
+
+You can remove the embedded Jitsi Meet Conference with the following API function:
+```javascript
 api.dispose()
 ```
 
-It is a good practice to remove the conference before the page is unloaded.
+NOTE: It's a good practice to remove the conference before the page is unloaded.
+
+[config.js]: https://github.com/jitsi/jitsi-meet/blob/master/config.js
+[interface_config.js]: https://github.com/jitsi/jitsi-meet/blob/master/interface_config.js

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

@@ -15,8 +15,8 @@ server {
 
     add_header Strict-Transport-Security "max-age=31536000";
 
-    ssl_certificate /var/lib/prosody/jitsi-meet.example.com.crt;
-    ssl_certificate_key /var/lib/prosody/jitsi-meet.example.com.key;
+    ssl_certificate /etc/jitsi/meet/jitsi-meet.example.com.crt;
+    ssl_certificate_key /etc/jitsi/meet/jitsi-meet.example.com.key;
 
     root /usr/share/jitsi-meet;
     index index.html index.htm;

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

@@ -0,0 +1,43 @@
+
+<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>
+
+  ServerName jitsi-meet.example.com
+
+  SSLProtocol TLSv1 TLSv1.1 TLSv1.2
+  SSLEngine on
+  SSLProxyEngine on
+  SSLCertificateFile /etc/jitsi/meet/jitsi-meet.example.com.crt
+  SSLCertificateKeyFile /etc/jitsi/meet/jitsi-meet.example.com.key
+  SSLCipherSuite "EECDH+ECDSA+AESGCM:EECDH+aRSA+AESGCM:EECDH+ECDSA+SHA256:EECDH+aRSA+SHA256:EECDH+ECDSA+SHA384:EECDH+ECDSA+SHA256:EECDH+aRSA+SHA384:EDH+aRSA+AESGCM:EDH+aRSA+SHA256:EDH+aRSA:EECDH:!aNULL:!eNULL:!MEDIUM:!LOW:!3DES:!MD5:!EXP:!PSK:!SRP:!DSS:!RC4:!SEED"
+  SSLHonorCipherOrder on
+  Header set Strict-Transport-Security "max-age=31536000"
+
+  DocumentRoot "/usr/share/jitsi-meet"
+  <Directory "/usr/share/jitsi-meet">
+    Options Indexes MultiViews Includes FollowSymLinks
+    AddOutputFilter Includes html
+    AllowOverride All
+    Order allow,deny
+    Allow from all
+  </Directory>
+
+  Alias "/config.js" "/etc/jitsi/meet/jitsi-meet.example.com-config.js"
+  <Location /config.js>
+    Require all granted
+  </Location>
+
+  ProxyPreserveHost on
+  ProxyPass /http-bind http://localhost:5280/http-bind/
+  ProxyPassReverse /http-bind http://localhost:5280/http-bind/
+
+  RewriteEngine on
+  RewriteRule ^/([a-zA-Z0-9]+)$ /index.html
+</VirtualHost>

doc/examples/api.html

@@ -0,0 +1,22 @@
+<html itemscope itemtype="http://schema.org/Product" prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/html">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="content-type" content="text/html;charset=utf-8">
+    </head>
+    <body>
+        <script src="https://meet.jit.si/external_api.js"></script>
+        <script>
+            var domain = "meet.jit.si";
+            var room = "JitsiMeetAPIExample";
+            var width = 700;
+            var height = 180;
+            var htmlElement = undefined;
+            var configOverwrite = {};
+            var interfaceConfigOverwrite = {
+                filmStripOnly: true
+            };
+            var api = new JitsiMeetExternalAPI(domain, room, width, height,
+                htmlElement, configOverwrite, interfaceConfigOverwrite);
+        </script>
+    </body>
+</html>

doc/manual-install.md

@@ -131,9 +131,9 @@ Or autostart it by adding the line in `/etc/rc.local`:
 
 ## Install Jitsi Conference Focus (jicofo)
 
-Install JDK and Ant if missing:
+Install JDK and Maven if missing:
 ```
-apt-get install default-jdk ant
+apt-get install default-jdk maven
 ```
 
 _NOTE: When installing on older Debian releases keep in mind that you need JDK >= 1.7._
@@ -145,12 +145,14 @@ git clone https://github.com/jitsi/jicofo.git
 Build distribution package. Replace {os-name} with one of: 'lin', 'lin64', 'macosx', 'win', 'win64'.
 ```sh
 cd jicofo
-ant dist.{os-name}
+mvn package -DskipTests -Dassembly.skipAssembly=false
 ```
 Run jicofo:
 ```sh
-cd dist/{os-name}'
-./jicofo.sh --domain=jitsi.example.com --secret=YOURSECRET2 --user_domain=auth.jitsi.example.com --user_name=focus --user_password=YOURSECRET3
+=======
+unzip target/jicofo-{os-name}-1.0-SNAPSHOT.zip
+cd jicofo-{os-name}-1.0-SNAPSHOT'
+./jicofo.sh --host=localhost --domain=jitsi.example.com --secret=YOURSECRET2 --user_domain=auth.jitsi.example.com --user_name=focus --user_password=YOURSECRET3
 ```
 
 ## Deploy Jitsi Meet
@@ -159,6 +161,8 @@ Checkout and configure Jitsi Meet:
 cd /srv
 git clone https://github.com/jitsi/jitsi-meet.git
 mv jitsi-meet/ jitsi.example.com
+npm install
+make
 ```
 
 Edit host names in `/srv/jitsi.example.com/config.js` (see also the example config file):
@@ -167,11 +171,11 @@ var config = {
     hosts: {
         domain: 'jitsi.example.com',
         muc: 'conference.jitsi.example.com',
-        bridge: 'jitsi-videobridge.jitsi.example.com'
+        bridge: 'jitsi-videobridge.jitsi.example.com',
+        focus: 'focus.jitsi.example.com'
     },
     useNicks: false,
     bosh: '//jitsi.example.com/http-bind', // FIXME: use xep-0156 for that
-    desktopSharing: 'false' // Desktop sharing method. Can be set to 'ext', 'webrtc' or false to disable.
     //chromeExtensionId: 'diibjkoicjeejcmhdnailmkgecihlobk', // Id of desktop streamer Chrome extension
     //minChromeExtVersion: '0.1' // Required version of Chrome extension
 };

doc/mobile.md

@@ -0,0 +1,94 @@
+# Jitsi Meet mobile apps
+
+Jitsi Meet can also be built as a standalone mobile application for
+iOS and Android.  It uses the [React Native]() framework.
+
+First make sure the [React Native dependencies]() are installed.
+
+**NOTE**:  This document assumes the app is being built on a macOS system.
+
+**NOTE**:  The app must be built for an actual device since the simulators don't
+work properly with the native plugins we require.
+
+
+## iOS
+
+1. Install some extra dependencies
+
+  - Install ios-deploy globally (in case you want to use the React Native CLI
+    to deploy the app to the device)
+
+    ```bash
+    npm install -g ios-deploy
+    ```
+
+2. Build the app
+
+    There are 2 ways to build the app: using the CLI or using Xcode.
+
+    Using the CLI:
+
+    ```bash
+    react-native run-ios --device
+    ```
+
+    When the app is launched from the CLI the output can be checked with the
+    following command:
+
+    ```bash
+    react-native log-ios
+    ```
+
+    Using Xcode
+
+    - Open **ios/jitsi-meet-react.xcworkspace** in Xcode. Make sure it's the
+      workspace file!
+
+    - Select your device from the top bar and hit the "play" button.
+
+    When the app is launched from Xcode the Debug console will show the output
+    logs the application creates.
+
+
+3. Other remarks
+
+    It's likely you'll need to change the bundle ID for deploying to a device
+    because the default bundle ID points to the application signed by Atlassian.
+
+    This can be changed in the "General" tab.  Under "Identity" set
+    "Bundle Identifier" to a different value, and adjust the "Team" in the
+    "Signing" section to match your own.
+
+
+## Android
+
+The [React Native dependencies]() page has very detailed information on how to
+setup [Android Studio]() and the required components for getting the necessary
+build environment.  Make sure you follow it closely.
+
+1. Building the app
+
+    The app can be built using the CLI utility as follows:
+
+    ```bash
+    react-native run-android
+    ```
+
+    It will be launched on the connected Android device.
+
+
+## Debugging
+
+The official documentation on [debugging]() is quite extensive, it is the
+preferred method for debugging.
+
+**NOTE**: When using Chrome Developer Tools for debugging the JavaScript code
+is being interpreted by Chrome's V8 engine, instead of JSCore which
+React Native uses.  It's important to keep this in mind due to potential
+differences in supported JavaScript features.
+
+
+[Android Studio]: https://developer.android.com/studio/index.html
+[debugging]: https://facebook.github.io/react-native/docs/debugging.html
+[React Native]: https://facebook.github.io/react-native/
+[React Native dependencies]: https://facebook.github.io/react-native/docs/getting-started.html#installing-dependencies

flow-typed/npm/flow-bin_v0.x.x.js

@@ -0,0 +1,6 @@
+// flow-typed signature: 6a5610678d4b01e13bbfbbc62bdaf583
+// flow-typed version: 3817bc6980/flow-bin_v0.x.x/flow_>=v0.25.x
+
+declare module "flow-bin" {
+  declare module.exports: string;
+}

flow-typed/npm/react-redux_v5.x.x.js

@@ -0,0 +1,89 @@
+// flow-typed signature: 0ed284c5a2e97a9e3c0e87af3dedc09d
+// flow-typed version: bdf1e66252/react-redux_v5.x.x/flow_>=v0.30.x
+
+import type { Dispatch, Store } from 'redux'
+
+declare module 'react-redux' {
+
+  /*
+
+    S = State
+    A = Action
+    OP = OwnProps
+    SP = StateProps
+    DP = DispatchProps
+
+  */
+
+  declare type MapStateToProps<S, OP: Object, SP: Object> = (state: S, ownProps: OP) => SP | MapStateToProps<S, OP, SP>;
+
+  declare type MapDispatchToProps<A, OP: Object, DP: Object> = ((dispatch: Dispatch<A>, ownProps: OP) => DP) | DP;
+
+  declare type MergeProps<SP, DP: Object, OP: Object, P: Object> = (stateProps: SP, dispatchProps: DP, ownProps: OP) => P;
+
+  declare type StatelessComponent<P> = (props: P) => ?React$Element<any>;
+
+  declare class ConnectedComponent<OP, P, Def, St> extends React$Component<void, OP, void> {
+    static WrappedComponent: Class<React$Component<Def, P, St>>;
+    getWrappedInstance(): React$Component<Def, P, St>;
+    static defaultProps: void;
+    props: OP;
+    state: void;
+  }
+
+  declare type ConnectedComponentClass<OP, P, Def, St> = Class<ConnectedComponent<OP, P, Def, St>>;
+
+  declare type Connector<OP, P> = {
+    (component: StatelessComponent<P>): ConnectedComponentClass<OP, P, void, void>;
+    <Def, St>(component: Class<React$Component<Def, P, St>>): ConnectedComponentClass<OP, P, Def, St>;
+  };
+
+  declare class Provider<S, A> extends React$Component<void, { store: Store<S, A>, children?: any }, void> { }
+
+  declare type ConnectOptions = {
+    pure?: boolean,
+    withRef?: boolean
+  };
+
+  declare type Null = null | void;
+
+  declare function connect<A, OP>(
+    ...rest: Array<void> // <= workaround for https://github.com/facebook/flow/issues/2360
+  ): Connector<OP, $Supertype<{ dispatch: Dispatch<A> } & OP>>;
+
+  declare function connect<A, OP>(
+    mapStateToProps: Null,
+    mapDispatchToProps: Null,
+    mergeProps: Null,
+    options: ConnectOptions
+  ): Connector<OP, $Supertype<{ dispatch: Dispatch<A> } & OP>>;
+
+  declare function connect<S, A, OP, SP>(
+    mapStateToProps: MapStateToProps<S, OP, SP>,
+    mapDispatchToProps: Null,
+    mergeProps: Null,
+    options?: ConnectOptions
+  ): Connector<OP, $Supertype<SP & { dispatch: Dispatch<A> } & OP>>;
+
+  declare function connect<A, OP, DP>(
+    mapStateToProps: Null,
+    mapDispatchToProps: MapDispatchToProps<A, OP, DP>,
+    mergeProps: Null,
+    options?: ConnectOptions
+  ): Connector<OP, $Supertype<DP & OP>>;
+
+  declare function connect<S, A, OP, SP, DP>(
+    mapStateToProps: MapStateToProps<S, OP, SP>,
+    mapDispatchToProps: MapDispatchToProps<A, OP, DP>,
+    mergeProps: Null,
+    options?: ConnectOptions
+  ): Connector<OP, $Supertype<SP & DP & OP>>;
+
+  declare function connect<S, A, OP, SP, DP, P>(
+    mapStateToProps: MapStateToProps<S, OP, SP>,
+    mapDispatchToProps: MapDispatchToProps<A, OP, DP>,
+    mergeProps: MergeProps<SP, DP, OP, P>,
+    options?: ConnectOptions
+  ): Connector<OP, P>;
+
+}

flow-typed/npm/redux_v3.x.x.js

@@ -0,0 +1,56 @@
+// flow-typed signature: ba132c96664f1a05288f3eb2272a3c35
+// flow-typed version: c4bbd91cfc/redux_v3.x.x/flow_>=v0.33.x
+
+declare module 'redux' {
+
+  /*
+
+    S = State
+    A = Action
+
+  */
+
+  declare type Dispatch<A: { type: $Subtype<string> }> = (action: A) => A;
+
+  declare type MiddlewareAPI<S, A> = {
+    dispatch: Dispatch<A>;
+    getState(): S;
+  };
+
+  declare type Store<S, A> = {
+    // rewrite MiddlewareAPI members in order to get nicer error messages (intersections produce long messages)
+    dispatch: Dispatch<A>;
+    getState(): S;
+    subscribe(listener: () => void): () => void;
+    replaceReducer(nextReducer: Reducer<S, A>): void
+  };
+
+  declare type Reducer<S, A> = (state: S, action: A) => S;
+
+  declare type Middleware<S, A> =
+    (api: MiddlewareAPI<S, A>) =>
+      (next: Dispatch<A>) => Dispatch<A>;
+
+  declare type StoreCreator<S, A> = {
+    (reducer: Reducer<S, A>, enhancer?: StoreEnhancer<S, A>): Store<S, A>;
+    (reducer: Reducer<S, A>, preloadedState: S, enhancer?: StoreEnhancer<S, A>): Store<S, A>;
+  };
+
+  declare type StoreEnhancer<S, A> = (next: StoreCreator<S, A>) => StoreCreator<S, A>;
+
+  declare function createStore<S, A>(reducer: Reducer<S, A>, enhancer?: StoreEnhancer<S, A>): Store<S, A>;
+  declare function createStore<S, A>(reducer: Reducer<S, A>, preloadedState: S, enhancer?: StoreEnhancer<S, A>): Store<S, A>;
+
+  declare function applyMiddleware<S, A>(...middlewares: Array<Middleware<S, A>>): StoreEnhancer<S, A>;
+
+  declare type ActionCreator<A, B> = (...args: Array<B>) => A;
+  declare type ActionCreators<K, A> = { [key: K]: ActionCreator<A, any> };
+
+  declare function bindActionCreators<A, C: ActionCreator<A, any>>(actionCreator: C, dispatch: Dispatch<A>): C;
+  declare function bindActionCreators<A, K, C: ActionCreators<K, A>>(actionCreators: C, dispatch: Dispatch<A>): C;
+
+  declare function combineReducers<O: Object, A>(reducers: O): Reducer<$ObjMap<O, <S>(r: Reducer<S, any>) => S>, A>;
+
+  declare function compose<S, A>(...fns: Array<StoreEnhancer<S, A>>): Function;
+
+}

fonts/jitsi.svg

@@ -14,7 +14,7 @@
 <glyph unicode="&#xe900;" glyph-name="connection-lost" horiz-adv-x="1414" d="M0 299.153h196.337v-187.951h-196.337v187.951zM271.842 480.372h196.337v-369.169h-196.337v369.169zM543.656 661.562h196.337v-550.36h-196.337v550.36zM815.47 842.766v-731.564h119.56c-14.589 33.025-23.125 71.503-23.232 111.943 0.132 86.42 38.697 163.851 99.656 216.468l0.348 403.153h-196.332zM1087.292 1024v-533.672c28.874 10.572 62.222 16.73 97.009 16.825 35.717-0.129 69.823-6.614 101.322-18.371l-1.999 535.218h-196.332zM1192.868 439.852c-0.009 0-0.020 0-0.031 0-122.247 0-221.351-98.447-221.372-219.896 0-0.007 0-0.014 0-0.021 0-121.467 99.111-219.935 221.372-219.935 0.011 0 0.021 0 0.032 0 122.248 0.014 221.345 98.477 221.345 219.935 0 0.007 0 0.013 0 0.020-0.021 121.441-99.11 219.883-221.345 219.897zM1194.706 372.607c87.601-0.006 158.614-69.787 158.614-155.866 0-0.006 0-0.012 0-0.019-0.022-86.062-71.026-155.822-158.614-155.828-87.588 0.006-158.593 69.766-158.615 155.826 0 0.007 0 0.014 0 0.020 0 86.079 71.013 155.86 158.613 155.866zM1286.795 355.682l48.348-52.528-236.375-217.567-48.348 52.528 236.375 217.567z" />
 <glyph unicode="&#xe901;" glyph-name="avatar" d="M512 204c106 0 200 56 256 138-2 84-172 132-256 132-86 0-254-48-256-132 56-82 150-138 256-138zM512 810c-70 0-128-58-128-128s58-128 128-128 128 58 128 128-58 128-128 128zM512 938c236 0 426-190 426-426s-190-426-426-426-426 190-426 426 190 426 426 426z" />
 <glyph unicode="&#xe902;" glyph-name="download" d="M726 470h-128v170h-172v-170h-128l214-214zM826 596c110-8 198-100 198-212 0-118-96-214-214-214h-554c-142 0-256 114-256 256 0 132 100 240 228 254 54 102 160 174 284 174 156 0 284-110 314-258z" />
-<glyph unicode="&#xe903;" glyph-name="autorenew" d="M800 694c34-52 54-116 54-182 0-188-154-342-342-342v-128l-170 172 170 170v-128c142 0 256 114 256 256 0 44-12 84-30 120zM512 768c-142 0-256-114-256-256 0-44 10-84 30-120l-62-62c-34 52-54 116-54 182 0 188 154 342 342 342v128l170-172-170-170v128z" />
+<glyph unicode="&#xe903;" glyph-name="mic-camera-combined" d="M756.704 628.138l267.296 202.213v-635.075l-267.296 202.213v-191.923c0-12.085-11.296-21.863-25.216-21.863h-706.272c-13.92 0-25.216 9.777-25.216 21.863v612.25c0 12.085 11.296 21.863 25.216 21.863h706.272c13.92 0 25.216-9.777 25.216-21.863v-189.679zM371.338 376.228c47.817 0 86.529 40.232 86.529 89.811v184.835c0 49.651-38.713 89.883-86.529 89.883-47.788 0-86.515-40.232-86.515-89.883v-184.835c0-49.579 38.756-89.811 86.515-89.811v0zM356.754 314.070v-32.78h33.718v33.412c73.858 9.606 131.235 73.73 131.235 151.351v88.232h-30.636v-88.232c0-67.57-53.696-122.534-119.734-122.534-66.024 0-119.691 54.964-119.691 122.534v88.232h-30.636v-88.232c0-79.215 59.674-144.502 135.744-151.969v-0.014z" />
 <glyph unicode="&#xe904;" glyph-name="kick" d="M512 810l284-426h-568zM214 298h596v-84h-596v84z" />
 <glyph unicode="&#xe905;" glyph-name="hangup" d="M512 640c-68 0-134-10-196-30v-132c0-16-10-34-24-40-42-20-80-46-114-78-8-8-18-12-30-12s-22 4-30 12l-106 106c-8 8-12 18-12 30s4 22 12 30c130 124 306 200 500 200s370-76 500-200c8-8 12-18 12-30s-4-22-12-30l-106-106c-8-8-18-12-30-12s-22 4-30 12c-34 32-72 58-114 78-14 6-24 20-24 38v132c-62 20-128 32-196 32z" />
 <glyph unicode="&#xe906;" glyph-name="chat" d="M854 342v512h-684v-598l86 86h598zM854 938c46 0 84-38 84-84v-512c0-46-38-86-84-86h-598l-170-170v768c0 46 38 84 84 84h684z" />
@@ -44,4 +44,5 @@
 <glyph unicode="&#xe91e;" glyph-name="raised-hand" d="M982 790v-620c0-94-78-170-172-170h-310c-46 0-90 18-122 50l-336 342s54 52 56 52c10 8 22 12 34 12 10 0 18-2 26-6 2 0 184-104 184-104v508c0 36 28 64 64 64s64-28 64-64v-300h42v406c0 36 28 64 64 64s64-28 64-64v-406h42v364c0 36 28 64 64 64s64-28 64-64v-364h44v236c0 36 28 64 64 64s64-28 64-64z" />
 <glyph unicode="&#xe91f;" glyph-name="menu-up" d="M512 682l256-256-60-60-196 196-196-196-60 60z" />
 <glyph unicode="&#xe920;" glyph-name="menu-down" d="M708 658l60-60-256-256-256 256 60 60 196-196z" />
+<glyph unicode="&#xe921;" glyph-name="switch-camera" d="M640 362l150 150-150 150v-108h-256v108l-150-150 150-150v108h256v-108zM854 854c46 0 84-40 84-86v-512c0-46-38-86-84-86h-684c-46 0-84 40-84 86v512c0 46 38 86 84 86h136l78 84h256l78-84h136z" />
 </font></defs></svg>

fonts/selection.json

@@ -1,6 +1,35 @@
 {
   "IcoMoonType": "selection",
   "icons": [
+    {
+      "icon": {
+        "paths": [
+          "M756.704 395.862l267.296-202.213v635.075l-267.296-202.213v191.923c0 12.085-11.296 21.863-25.216 21.863h-706.272c-13.92 0-25.216-9.777-25.216-21.863v-612.25c0-12.085 11.296-21.863 25.216-21.863h706.272c13.92 0 25.216 9.777 25.216 21.863v189.679zM371.338 647.772c47.817 0 86.529-40.232 86.529-89.811v-184.835c0-49.651-38.713-89.883-86.529-89.883-47.788 0-86.515 40.232-86.515 89.883v184.835c0 49.579 38.756 89.811 86.515 89.811v0zM356.754 709.93v32.78h33.718v-33.412c73.858-9.606 131.235-73.73 131.235-151.351v-88.232h-30.636v88.232c0 67.57-53.696 122.534-119.734 122.534-66.024 0-119.691-54.964-119.691-122.534v-88.232h-30.636v88.232c0 79.215 59.674 144.502 135.744 151.969v0.014z"
+        ],
+        "attrs": [
+          {}
+        ],
+        "isMulticolor": false,
+        "isMulticolor2": false,
+        "grid": 0,
+        "tags": [
+          "Combined Shape"
+        ]
+      },
+      "attrs": [
+        {}
+      ],
+      "properties": {
+        "order": 109,
+        "id": 0,
+        "name": "mic-camera-combined",
+        "prevSize": 32,
+        "code": 59651
+      },
+      "setIdx": 0,
+      "setId": 2,
+      "iconIdx": 0
+    },
     {
       "icon": {
         "paths": [
@@ -26,8 +55,8 @@
         "prevSize": 32,
         "code": 59677
       },
-      "setIdx": 0,
-      "setId": 2,
+      "setIdx": 1,
+      "setId": 1,
       "iconIdx": 0
     },
     {
@@ -55,8 +84,8 @@
         "prevSize": 32,
         "code": 59676
       },
-      "setIdx": 0,
-      "setId": 2,
+      "setIdx": 1,
+      "setId": 1,
       "iconIdx": 1
     },
     {
@@ -81,35 +110,9 @@
         "code": 59649,
         "name": "avatar"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 12
-    },
-    {
-      "icon": {
-        "paths": [
-          "M800 330c34 52 54 116 54 182 0 188-154 342-342 342v128l-170-172 170-170v128c142 0 256-114 256-256 0-44-12-84-30-120zM512 256c-142 0-256 114-256 256 0 44 10 84 30 120l-62 62c-34-52-54-116-54-182 0-188 154-342 342-342v-128l170 172-170 170v-128z"
-        ],
-        "isMulticolor": false,
-        "isMulticolor2": false,
-        "tags": [
-          "autorenew"
-        ],
-        "grid": 0,
-        "attrs": []
-      },
-      "attrs": [],
-      "properties": {
-        "id": 68,
-        "order": 84,
-        "ligatures": "autorenew",
-        "prevSize": 32,
-        "code": 59651,
-        "name": "autorenew"
-      },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 69
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 2
     },
     {
       "icon": {
@@ -133,9 +136,9 @@
         "code": 59653,
         "name": "hangup"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 123
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 3
     },
     {
       "icon": {
@@ -159,9 +162,9 @@
         "code": 59654,
         "name": "chat"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 149
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 4
     },
     {
       "icon": {
@@ -185,9 +188,9 @@
         "code": 59650,
         "name": "download"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 165
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 5
     },
     {
       "icon": {
@@ -211,9 +214,9 @@
         "code": 59655,
         "name": "edit"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 186
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 6
     },
     {
       "icon": {
@@ -237,9 +240,9 @@
         "code": 59656,
         "name": "share-doc"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 207
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 7
     },
     {
       "icon": {
@@ -263,9 +266,9 @@
         "code": 59657,
         "name": "telephone"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 216
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 8
     },
     {
       "icon": {
@@ -289,9 +292,9 @@
         "code": 59652,
         "name": "kick"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 243
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 9
     },
     {
       "icon": {
@@ -315,9 +318,9 @@
         "code": 59679,
         "name": "menu-up"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 257
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 10
     },
     {
       "icon": {
@@ -341,9 +344,9 @@
         "code": 59680,
         "name": "menu-down"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 258
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 11
     },
     {
       "icon": {
@@ -367,9 +370,9 @@
         "code": 59659,
         "name": "full-screen"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 351
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 12
     },
     {
       "icon": {
@@ -393,9 +396,9 @@
         "code": 59660,
         "name": "exit-full-screen"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 352
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 13
     },
     {
       "icon": {
@@ -419,9 +422,9 @@
         "code": 59658,
         "name": "star-full"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 364
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 14
     },
     {
       "icon": {
@@ -445,9 +448,9 @@
         "code": 59661,
         "name": "security"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 474
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 15
     },
     {
       "icon": {
@@ -471,9 +474,9 @@
         "code": 59662,
         "name": "security-locked"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 475
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 16
     },
     {
       "icon": {
@@ -497,9 +500,9 @@
         "code": 59663,
         "name": "reload"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 483
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 17
     },
     {
       "icon": {
@@ -523,9 +526,9 @@
         "code": 59664,
         "name": "microphone"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 493
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 18
     },
     {
       "icon": {
@@ -549,9 +552,9 @@
         "code": 59665,
         "name": "mic-empty"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 494
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 19
     },
     {
       "icon": {
@@ -575,9 +578,9 @@
         "code": 59666,
         "name": "mic-disabled"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 495
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 20
     },
     {
       "icon": {
@@ -601,9 +604,9 @@
         "code": 59678,
         "name": "raised-hand"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 540
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 21
     },
     {
       "icon": {
@@ -627,9 +630,9 @@
         "code": 59675,
         "name": "contactList"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 550
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 22
     },
     {
       "icon": {
@@ -653,9 +656,9 @@
         "code": 59667,
         "name": "link"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 560
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 23
     },
     {
       "icon": {
@@ -679,9 +682,9 @@
         "code": 59668,
         "name": "shared-video"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 591
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 24
     },
     {
       "icon": {
@@ -705,9 +708,9 @@
         "code": 59669,
         "name": "settings"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 666
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 25
     },
     {
       "icon": {
@@ -731,9 +734,35 @@
         "code": 59670,
         "name": "star"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 718
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 26
+    },
+    {
+      "icon": {
+        "paths": [
+          "M640 662l150-150-150-150v108h-256v-108l-150 150 150 150v-108h256v108zM854 170c46 0 84 40 84 86v512c0 46-38 86-84 86h-684c-46 0-84-40-84-86v-512c0-46 38-86 84-86h136l78-84h256l78 84h136z"
+        ],
+        "isMulticolor": false,
+        "isMulticolor2": false,
+        "tags": [
+          "switch_camera"
+        ],
+        "grid": 0,
+        "attrs": []
+      },
+      "attrs": [],
+      "properties": {
+        "id": 741,
+        "order": 108,
+        "ligatures": "switch_camera",
+        "prevSize": 32,
+        "code": 59681,
+        "name": "switch-camera"
+      },
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 27
     },
     {
       "icon": {
@@ -757,9 +786,9 @@
         "code": 59671,
         "name": "share-desktop"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 784
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 28
     },
     {
       "icon": {
@@ -783,9 +812,9 @@
         "code": 59672,
         "name": "camera"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 799
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 29
     },
     {
       "icon": {
@@ -809,9 +838,9 @@
         "code": 59673,
         "name": "camera-disabled"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 800
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 30
     },
     {
       "icon": {
@@ -835,9 +864,9 @@
         "code": 59674,
         "name": "volume"
       },
-      "setIdx": 0,
-      "setId": 2,
-      "iconIdx": 822
+      "setIdx": 1,
+      "setId": 1,
+      "iconIdx": 31
     },
     {
       "icon": {
@@ -885,7 +914,7 @@
       },
       "setIdx": 1,
       "setId": 1,
-      "iconIdx": 0
+      "iconIdx": 32
     },
     {
       "icon": {
@@ -956,7 +985,7 @@
       },
       "setIdx": 1,
       "setId": 1,
-      "iconIdx": 4
+      "iconIdx": 33
     },
     {
       "icon": {
@@ -983,7 +1012,7 @@
       },
       "setIdx": 1,
       "setId": 1,
-      "iconIdx": 12
+      "iconIdx": 34
     },
     {
       "icon": {
@@ -1011,7 +1040,7 @@
       },
       "setIdx": 1,
       "setId": 1,
-      "iconIdx": 13
+      "iconIdx": 35
     },
     {
       "icon": {
@@ -1039,7 +1068,7 @@
       },
       "setIdx": 1,
       "setId": 1,
-      "iconIdx": 22
+      "iconIdx": 36
     }
   ],
   "height": 1024,

images/logo-blue.svg

@@ -0,0 +1,182 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 744.09448819 1052.3622047"
+   id="svg3526"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   inkscape:export-filename="/Users/ystamcheva/Dropbox/Designs/appLogo.png"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90"
+   sodipodi:docname="logo-blue.svg">
+  <defs
+     id="defs3528" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.49497475"
+     inkscape:cx="817.30793"
+     inkscape:cy="496.00851"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:window-width="1440"
+     inkscape:window-height="851"
+     inkscape:window-x="0"
+     inkscape:window-y="1"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata3531">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g4181">
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g33">
+        <path
+           d="m 257.311,591.057 c 27.544,0 85.707,-16.445 124.179,-27.332 5.595,-1.575 10.81,-3.049 15.549,-4.371 0.767,-0.211 1.51,-0.403 2.213,-0.579 -2.161,-2.139 -5.755,-5.387 -11.612,-10.295 -25.628,-17.369 -49.827,-25.456 -76.146,-25.456 -5.741,0 -11.707,0.352 -18.208,1.088 -22.283,2.535 -40.848,7.845 -49.767,10.39 -4.521,1.296 -5.883,1.683 -7.292,1.683 -2.688,0 -4.997,-1.599 -5.9,-4.069 -0.904,-2.483 -0.13,-5.223 1.969,-6.981 l 0.127,-0.102 c 15.379,-12.883 44.032,-36.866 98.39,-47.582 9.428,-1.853 19.514,-2.796 29.968,-2.796 24.334,0 49.53,5.026 74.869,14.925 34.511,13.474 58.094,30.771 77.062,44.67 10.211,7.489 19.03,13.959 26.705,17.516 1.961,0.912 2.979,1.169 3.453,1.236 0.349,-0.452 1.106,-1.7 2.219,-4.974 0.298,-0.867 2.453,-10.019 -13.007,-62.071 -8.985,-30.217 -19.822,-61.077 -25.465,-74.778 -10.916,-26.509 -8.237,-45.296 -4.877,-56.284 -9.248,3.399 -18.701,8.688 -28.646,15.993 l -0.62,0.458 c -4.969,3.684 -10.031,7.853 -15.482,12.725 -32.074,28.718 -56.104,43.69 -71.455,44.504 l -0.423,0.021 -0.421,-0.036 c -13.524,-1.148 -34.019,-20.834 -42.403,-30.801 -1.743,-1.169 -3.729,-1.699 -6.35,-1.699 -2.632,0 -5.583,0.553 -8.438,1.095 -2.077,0.394 -4.218,0.795 -6.341,1.01 -6.767,0.679 -16.252,2.867 -25.406,4.974 -4.413,1.014 -8.967,2.063 -13.13,2.922 -0.079,0.013 -1.866,0.382 -5.06,1.224 -22.624,6.693 -39.673,14.372 -48.012,21.628 -0.091,0.079 -0.36,0.288 -0.789,0.603 -5.64,4.009 -19.199,15.447 -23.29,34.907 l -0.043,0.162 c -8.541,35.837 4.408,80.28 21.615,105.666 8.093,11.932 16.814,19.376 23.944,20.42 1.775,0.252 3.905,0.386 6.321,0.386 z"
+           id="path35"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g37">
+        <path
+           d="m 383.729,400.995 c 0.549,0.108 1.191,0.162 1.9,0.162 14.785,0 47.804,-21.408 53.912,-31.205 l 0.486,-0.78 0.694,-0.611 c 2.083,-2.056 8.099,-12.885 11.019,-19.367 -31.312,-9.394 -34.767,-26.347 -37.821,-41.41 -0.355,-1.749 -0.667,-3.324 -0.946,-4.732 -0.357,-1.842 -0.731,-3.713 -1.052,-5.159 -46.646,15.471 -60.905,24.154 -68.687,30.611 -4.027,3.345 -6.398,12.858 5.215,39.189 5.932,13.422 26.386,31.591 35.28,33.302 z"
+           id="path39"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <path
+         style="fill:#17a0db;fill-opacity:1"
+         inkscape:connector-curvature="0"
+         id="path43"
+         d="m 183.03568,710.19014 c -5.799,-6.834 -8.258,-15.447 -7.293,-25.624 4.105,-49.397 -1.525,-61.33 -4.132,-64.162 -0.629,-0.685 -0.969,-0.685 -1.238,-0.685 -0.101,0 -0.195,0.006 -0.296,0.016 -4.84,1.157 -37.441,23.198 -44.638,89.005 -3.471,31.758 2.611,72.542 7.794,97.348 4.165,-14.646 10.742,-30.779 23.483,-47.384 11.862,-15.444 24.801,-27.623 40.852,-38.298 -4.99,-2.075 -10.346,-5.274 -14.532,-10.216 z" />
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g45">
+        <path
+           d="m 485.028,154.141 c -3.896,25.701 -10.239,50.115 -22.077,75.883 12.904,-14.609 20.445,-30.481 22.971,-48.296 1.051,-7.38 2.045,-14.439 -0.894,-27.587 z"
+           id="path47"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g49">
+        <path
+           d="m 413.102,273.797 c 23.135,-20.915 37.22,-55.455 43.078,-75.971 -20.149,19.407 -44.636,29.82 -60.351,36.512 -5.412,2.308 -10.08,4.295 -12.878,5.926 -1.178,0.685 -2.367,1.374 -3.571,2.069 -9.533,5.515 -23.924,13.85 -26.022,18.987 l -0.06,0.167 -0.078,0.165 c -6.529,13.72 -10.208,34.352 -11.387,46.184 15.135,-9.242 30.738,-15.41 43.699,-20.529 12.03,-4.753 22.432,-8.863 27.57,-13.51 z"
+           id="path51"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g53">
+        <path
+           d="m 436.439,291.877 c -0.141,0.357 -0.292,0.695 -0.455,1.017 -3.833,11.143 1.446,26.3 11.227,32.017 2.602,1.522 5.132,2.452 7.559,2.772 0.334,0.014 0.666,0.027 1.001,0.027 7.601,0 13.801,-5.56 18.4,-16.519 2.896,-8.34 3.308,-18.23 1.125,-27.158 -1.696,-6.936 -6.084,-15.215 -8.88,-19.343 -5.219,3.582 -15.533,11.462 -22.615,17.716 -4.946,4.777 -6.733,7.785 -7.362,9.471 z"
+           id="path55"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g57">
+        <path
+           d="m 501.845,575.103 c 8.403,-2.29 15.076,-4.165 19.998,-5.623 -10.137,-7.061 -21.871,-15.846 -37.823,-28.253 -39.096,-30.404 -81.019,-45.826 -124.587,-45.826 -23.861,0 -44.647,4.592 -61.098,10.151 4.101,-0.255 8.271,-0.377 12.554,-0.377 5.088,0 10.42,0.179 15.842,0.541 16.949,1.136 60.616,8.845 100.106,55.931 7.956,9.469 16.507,17.307 40.828,17.307 8.679,0 18.796,-0.967 30.913,-2.959 0.749,-0.209 1.882,-0.518 3.267,-0.892 z"
+           id="path59"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g61">
+        <path
+           d="m 557.268,369.949 c -7.755,-12.043 -17.498,-19.524 -25.41,-19.524 -1.464,0 -2.862,0.258 -4.154,0.765 -4.239,1.672 -10.952,21.042 -7.979,35.126 2.023,9.582 13.67,41.96 19.262,57.52 2.142,5.958 3.18,8.869 3.527,9.951 0.275,0.853 0.67,2.077 1.17,3.621 4.517,13.765 16.111,49.145 19.562,77.793 7.175,-30.554 11.239,-67.36 9.647,-111.409 -0.723,-20.199 -6.274,-39.323 -15.625,-53.843 z"
+           id="path63"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g65">
+        <path
+           d="m 412.08,575.289 c -0.153,-0.2 -0.3,-0.397 -0.445,-0.585 -0.614,0.1 -1.616,0.319 -3.185,0.776 l -0.657,0.197 c -8.011,2.95 -22.707,7.908 -39.694,13.64 -20.387,6.87 -43.477,14.659 -62.808,21.595 -24.596,9.165 -32.572,12.781 -35.073,14.048 -0.454,1.218 -0.963,2.772 -1.53,4.486 -5.817,17.705 -19.139,58.23 -84.831,86.562 13.568,13.744 43.101,38.415 101.24,38.415 5.035,0 10.258,-0.188 15.494,-0.566 43.896,-3.121 85.158,-22.544 116.206,-54.673 28.233,-29.21 44.259,-65.641 44.507,-100.76 -6.871,-0.571 -18.519,-2.281 -29.301,-7.4 -0.125,-0.061 -12.447,-6.002 -19.923,-15.735 z"
+           id="path67"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g69">
+        <path
+           d="m 162.104,639.109 c -0.122,10.334 -1.489,20.245 -2.82,29.907 -0.716,5.216 -1.464,10.615 -2.014,16.041 -0.746,10.914 1.612,14.717 2.659,15.829 0.571,0.629 1.513,1.346 3.536,1.346 1.558,0 3.418,-0.432 5.383,-1.251 19.507,-8.176 38.032,-22.367 46.937,-30.243 -13.668,-6.095 -34.689,-19.26 -53.681,-31.629 z"
+           id="path71"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         style="fill:#17a0db;fill-opacity:1"
+         transform="translate(43.272677,-6.8248629)"
+         id="g73">
+        <path
+           d="m 484.26,598.224 c -0.552,7.258 -1.737,20.949 -3.631,31.378 -2.295,12.629 -6.095,23.31 -8.305,28.889 3.945,3.648 7.878,7.228 10.429,9.488 10.265,-6.718 43.961,-32.297 67.208,-90.368 -7.447,5.03 -17.906,9.456 -31.465,13.332 -13.797,3.929 -27.204,6.229 -34.236,7.281 z"
+           id="path75"
+           inkscape:connector-curvature="0"
+           style="fill:#17a0db;fill-opacity:1" />
+      </g>
+      <g
+         transform="translate(43.272677,-6.8248629)"
+         id="g85"
+         style="fill:#17a0db;fill-opacity:1">
+        <path
+           style="fill:#17a0db;fill-opacity:1"
+           inkscape:connector-curvature="0"
+           id="path87"
+           d="M 627.562,350.519 C 613.5,321.124 593.893,306.283 580.351,297.677 568.965,290.444 555.872,285.188 541.339,282 c -1.622,-10.158 -4.397,-20.542 -8.198,-30.646 24.507,-36.531 30.407,-77.605 17.008,-119.213 C 539.858,100.151 531.868,79.524 524.996,67.213 510.15,40.585 489.58,34.997 474.936,34.997 c -15.09,0 -29.538,6.412 -39.667,17.61 -10.37,11.462 -15.213,26.462 -13.634,42.228 1.349,13.446 -2.178,37.872 -4.519,46.594 -0.04,0.117 -4.202,11.776 -35.168,26.784 -0.746,0.268 -2.332,0.811 -4.773,1.629 -17.812,5.965 -50.913,17.062 -72.963,46.219 -16.847,20.407 -20.985,40.629 -25.766,64.036 -2.858,13.955 -5.846,32.187 -5.105,53.745 -55.35,12.291 -95.226,37.338 -118.609,74.54 -24.203,38.52 -28.402,86.272 -12.468,141.993 l 0.14,0.414 c 0.292,1.014 0.6,2.024 0.921,3.03 -2.718,-0.466 -5.465,-0.858 -8.285,-1.169 -2.469,-0.284 -5.015,-0.42 -7.54,-0.42 -27.636,0 -57.043,17.371 -78.666,46.474 -16.427,22.098 -36.156,61.131 -36.852,121.593 -0.523,44.905 4.279,86.306 14.283,123.054 7.461,27.381 15.784,44.202 18.979,50.09 l 67.793,127.079 31.06,-140.731 c 10.6,-47.935 21.066,-68.283 34.571,-81.732 31.425,18.938 68.541,28.901 107.941,28.901 43.919,0 89.715,-12.667 128.934,-35.662 25.477,-14.954 47.193,-33.324 64.629,-54.658 0.236,0 0.469,0 0.704,0 l 1.857,-0.038 c 10.782,-0.365 25.522,-5.697 40.434,-14.63 12.421,-7.433 31.147,-21.108 49.946,-44.064 18.945,-23.155 34.402,-51.324 45.926,-83.731 13.5,-37.939 21.717,-82.115 24.404,-131.272 3.253,-45.723 -2.078,-83.533 -15.881,-112.384 z m -31.124,109.427 c -2.415,44.805 -9.745,84.66 -21.764,118.441 -9.713,27.302 -22.502,50.739 -38.005,69.69 -26.696,32.611 -52.783,41.355 -55.551,41.465 l -0.22,0 c -2.528,0 -4.012,-1.032 -11.095,-5.988 -1.979,-1.379 -4.969,-3.467 -7.436,-5.075 -14.813,28.811 -39.145,53.701 -70.659,72.185 -32.098,18.824 -69.432,29.202 -105.1,29.202 -42.352,0 -79.532,-13.979 -107.842,-40.493 -38.621,24.556 -61.833,45.044 -80.652,130.273 l -3.562,16.157 -7.787,-14.59 C 84.8,867.621 78.058,854.32 71.708,830.982 62.852,798.444 58.598,761.384 59.071,720.842 c 0.944,-80.909 44.373,-121.518 68.427,-121.518 0.792,0 1.578,0.039 2.328,0.128 22.8,2.551 37.699,12.402 64.745,30.291 2.796,1.853 5.74,3.8 8.843,5.838 9.69,6.36 23.387,14.125 26.835,14.791 6.562,-0.381 12.986,-15.079 14.853,-28.713 0.114,-0.829 0.226,-1.598 0.334,-2.315 0.147,-1.612 0.227,-3.03 0.27,-4.194 -1.144,-0.399 -2.333,-0.869 -3.547,-1.403 l -0.27,-0.091 c -17.012,-5.857 -41.868,-34.625 -54.378,-76.385 -12.081,-42.21 -9.691,-77.122 7.099,-103.83 27.221,-43.328 86.307,-53.515 105.849,-56.861 6.109,-1.214 12.498,-2.351 18.999,-3.378 3.035,-0.762 5.11,-1.399 6.449,-1.978 0.58,-0.403 0.835,-0.833 0.439,-2.403 l 0.53,-0.148 -0.513,0.115 c -0.237,-1.065 -0.565,-2.311 -0.941,-3.753 -0.521,-1.997 -1.103,-4.256 -1.705,-6.936 -6.05,-27.141 -2.962,-49.884 0.863,-68.559 4.297,-21.019 6.678,-32.656 16.605,-44.279 13.152,-18.103 36.803,-26.025 50.953,-30.77 3.948,-1.322 7.359,-2.462 9.331,-3.412 43.344,-20.789 57.145,-42.646 61.091,-57.318 3.127,-11.642 8.084,-42.253 5.931,-63.63 -0.239,-2.425 0.326,-4.421 1.695,-5.935 1.215,-1.341 2.942,-2.104 4.748,-2.104 4.061,0 9.623,0 30.377,64.478 10.949,33.996 2.785,65.868 -24.244,94.74 -0.347,0.375 -0.7,0.742 -1.04,1.095 -0.738,0.76 -1.848,1.909 -1.999,2.326 0.006,0 -0.048,1.042 1.755,4.031 11.425,18.864 17.633,42.323 15.832,59.763 -0.429,4.062 -1.206,7.971 -1.879,11.411 -0.4,1.968 -0.879,4.377 -1.126,6.241 0.111,0 0.226,0 0.347,0 3.088,-0.327 7.867,-0.7 13.628,-0.7 13.556,0 32.969,2.077 48.503,11.951 9.382,5.952 21.255,15.137 29.981,33.404 10.281,21.472 14.096,51.453 11.369,89.114 z" />
+      </g>
+    </g>
+    <path
+       style="fill:#ffffff"
+       d=""
+       id="path3618"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>

index.html

@@ -1,7 +1,8 @@
 <html itemscope itemtype="http://schema.org/Product" prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/html">
   <head>
-    <meta charset="utf-8" />
+    <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">
     <!--#include virtual="base.html" -->
     <script>
         window.indexLoadedTime = window.performance.now();
@@ -14,6 +15,7 @@
             "utils.js",
             "do_external_connect.js",
             "interface_config.js",
+            "logging_config.js",
             "lib-jitsi-meet.min.js",
             "app.bundle.min.js",
             "all.css"
@@ -27,14 +29,95 @@
                 && criticalFiles.some(
                     function(file) { return fileRef.indexOf(file) !== -1 })) {
                 window.onload = function() {
+                    // The whole complex part below implements page reloads with
+                    // "exponential backoff". The retry attempt is passes as
+                    // "rCounter" query parameter
+                    var href = window.location.href;
+
+                    var retryMatch = href.match(/.+(\?|&)rCounter=(\d+)/);
+                    var retryCountStr = retryMatch ? retryMatch[2] : "0";
+                    var retryCount = Number.parseInt(retryCountStr);
+
+                    if (retryMatch == null) {
+                        var separator = href.indexOf("?") === -1 ? "?" : "&";
+                        var hashIdx = href.indexOf("#");
+
+                        if (hashIdx === -1) {
+                            href += separator + "rCounter=1";
+                        } else {
+                            var hashPart = href.substr(hashIdx);
+
+                            href = href.substr(0, hashIdx)
+                                + separator + "rCounter=1" + hashPart;
+                        }
+                    } else {
+                        var separator = retryMatch[1];
+
+                        href = href.replace(
+                            /(\?|&)rCounter=(\d+)/,
+                            separator + "rCounter=" + (retryCount + 1));
+                    }
+
+                    var delay = Math.pow(2, retryCount) * 2000;
+                    if (isNaN(delay) || delay < 2000 || delay > 60000)
+                        delay = 10000;
+
+                    var showMoreText = "show more";
+                    var showLessText = "show less";
+
                     document.body.innerHTML
-                        = "The application failed to load, missing file: "
-                            + fileRef;
+                        = "<div style='"
+                        + "position: absolute;top: 50%;left: 50%;"
+                        + "text-align: center;"
+                        + "font-size: medium;"
+                        + "font-weight: 400;"
+                        + "transform: translate(-50%, -50%)'>"
+                        + "Uh oh! We couldn't fully download everything we needed :(" // jshint ignore:line
+                        + "<br/> "
+                        + "We will try again shortly. In the mean time, check for problems with your Internet connection!" // jshint ignore:line
+                        + "<br/><br/> "
+                        + "<div id='moreInfo' style='"
+                        + "display: none;'>" + "Missing " + fileRef
+                        + "<br/><br/></div>"
+                        + "<a id='showMore' style='"
+                        + "text-decoration: underline;"
+                        + "font-size:small;"
+                        + "cursor: pointer'>" + showMoreText + "</a>"
+                        + "&nbsp;&nbsp;&nbsp;"
+                        + "<a href='" + href + "' style='"
+                        + "text-decoration: underline;"
+                        + "font-size:small;"
+                        + "'>reload now</a>"
+                        + "</div>";
+
+                    var showMoreElem = document.getElementById("showMore");
+                    showMoreElem.addEventListener('click', function () {
+                            var moreInfoElem
+                                    = document.getElementById("moreInfo");
+
+                            if (showMoreElem.innerHTML === showMoreText) {
+                                moreInfoElem.setAttribute(
+                                    "style",
+                                    "display: block;"
+                                    + "color:#FF991F;"
+                                    + "font-size:small;"
+                                    + "user-select:text;");
+                                showMoreElem.innerHTML = showLessText;
+                            }
+                            else {
+                                moreInfoElem.setAttribute(
+                                    "style", "display: none;");
+                                showMoreElem.innerHTML = showMoreText;
+                            }
+                        });
+
+                    window.setTimeout(
+                        function () { window.location.replace(href); }, delay);
                 };
                 window.removeEventListener(
                     'error', loadErrHandler, true /* capture phase */);
             }
-        }
+        };
         window.addEventListener(
             'error', loadErrHandler, true /* capture phase type of listener */);
     </script>
@@ -43,148 +126,15 @@
     <!--#include virtual="connection_optimization/connection_optimization.html" -->
     <script src="connection_optimization/do_external_connect.js?v=1"></script>
     <script><!--#include virtual="/interface_config.js" --></script>
+    <script><!--#include virtual="/logging_config.js" --></script>
     <script src="libs/lib-jitsi-meet.min.js?v=139"></script>
     <script src="libs/app.bundle.min.js?v=139"></script>
     <!--#include virtual="title.html" -->
-    <link rel="stylesheet" href="css/all.css"/>
+    <link rel="stylesheet" href="css/all.css">
     <!--#include virtual="plugin.head.html" -->
   </head>
   <body>
-    <div id="welcome_page">
-        <div id="welcome_page_header">
-            <a target="_new">
-                <div class="watermark leftwatermark"></div>
-            </a>
-            <a target="_new">
-                <div class="watermark rightwatermark"></div>
-            </a>
-            <a class="poweredby" href="http://jitsi.org" target="_new" ><span data-i18n="poweredby"></span> jitsi.org</a>
-
-            <div id="enter_room_container">
-                <div id="enter_room_form" >
-                    <div id="domain_name"></div>
-                    <div id="enter_room">
-                        <input id="enter_room_field" type="text" autofocus/>
-                        <div class="icon-reload" id="reload_roomname"></div>
-                        <input id="enter_room_button" type="button" data-i18n="[value]welcomepage.go" value="GO" />
-
-                    </div>
-                </div>
-            </div>
-            <div id="brand_header"></div>
-            <input type='checkbox' name='checkbox' id="disable_welcome"/>
-            <label for="disable_welcome" class="disable_welcome_position" data-i18n="welcomepage.disable"></label>
-            <div id="header_text">
-                <!--#include virtual="plugin.header.text.html" -->
-            </div>
-        </div>
-        <div id="welcome_page_main">
-            <div id="features">
-                <div class="feature_row">
-                    <div class="feature_holder">
-                        <div class="feature_icon" data-i18n="welcomepage.feature1.title" ></div>
-                        <div class="feature_description" data-i18n="welcomepage.feature1.content" data-i18n-options='{ "postProcess": "resolveAppName" }'>
-                        </div>
-                    </div>
-                    <div class="feature_holder">
-                        <div class="feature_icon" data-i18n="welcomepage.feature2.title" ></div>
-                        <div class="feature_description" data-i18n="welcomepage.feature2.content">
-                        </div>
-                    </div>
-                    <div class="feature_holder">
-                        <div class="feature_icon" data-i18n="welcomepage.feature3.title" ></div>
-                        <div class="feature_description" data-i18n="welcomepage.feature3.content" data-i18n-options='{ "postProcess": "resolveAppName" }'>
-                        </div>
-                    </div>
-                    <div class="feature_holder">
-                        <div class="feature_icon" data-i18n="welcomepage.feature4.title" ></div>
-                        <div class="feature_description" data-i18n="welcomepage.feature4.content">
-                        </div>
-                    </div>
-                </div>
-                <div class="feature_row">
-                    <div class="feature_holder">
-                            <div class="feature_icon" data-i18n="welcomepage.feature5.title" ></div>
-                            <div class="feature_description" data-i18n="welcomepage.feature5.content" data-i18n-options='{ "postProcess": "resolveAppName" }'>
-                            </div>
-                    </div>
-                    <div class="feature_holder">
-                            <div class="feature_icon" data-i18n="welcomepage.feature6.title" ></div>
-                            <div class="feature_description" data-i18n="welcomepage.feature6.content" data-i18n-options='{ "postProcess": "resolveAppName" }'>
-                            </div>
-                    </div>
-                    <div class="feature_holder">
-                            <div class="feature_icon" data-i18n="welcomepage.feature7.title" ></div>
-                            <div class="feature_description" data-i18n="welcomepage.feature7.content" data-i18n-options='{ "postProcess": "resolveAppName" }'></div>
-                    </div>
-                    <div class="feature_holder">
-                            <div class="feature_icon" data-i18n="welcomepage.feature8.title" ></div>
-                            <div class="feature_description" data-i18n="welcomepage.feature8.content"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <!--#include virtual="plugin.welcomepage.footer.html" -->
-    </div>
-    <div id="videoconference_page">
-        <div id="mainToolbarContainer">
-                <div id="notice" class="notice" style="display: none">
-                    <span id="noticeText" class="noticeText"></span>
-                </div>
-                <div id="mainToolbar" class="toolbar"></div>
-        </div>
-        <div id="subject" class="hide"></div>
-
-        <div id="extendedToolbar" class="toolbar">
-            <div id="extendedToolbarButtons"></div>
-
-            <a class="button icon-feedback" id="feedbackButton"></a>
-
-            <div id="sideToolbarContainer"></div>
-        </div>
-        <div id="videospace">
-            <div id="largeVideoContainer" class="videocontainer">
-                <div id="sharedVideo"><div id="sharedVideoIFrame"></div></div>
-                <div id="etherpad"></div>
-                <a target="_new"><div class="watermark leftwatermark"></div></a>
-                <a target="_new"><div class="watermark rightwatermark"></div></a>
-                <a class="poweredby" href="http://jitsi.org" target="_new">
-                    <span data-i18n="poweredby"></span> jitsi.org
-                </a>
-                <div id="dominantSpeaker">
-                    <div class="dynamic-shadow"></div>
-                    <img id="dominantSpeakerAvatar" src=""/>
-                </div>
-                <span id="remoteConnectionMessage"></span>
-                <div id="largeVideoWrapper">
-                    <video id="largeVideo" muted="true" autoplay></video>
-                </div>
-                <span id="localConnectionMessage"></span>
-                <span id="videoResolutionLabel" class="video-state-indicator moveToCorner">HD</span>
-                <span id="recordingLabel" class="video-state-indicator centeredVideoLabel">
-                    <span id="recordingLabelText"></span>
-                    <img id="recordingSpinner" class="recordingSpinner" src="images/spin.svg"></img>
-                </span>
-            </div>
-            <div class="filmstrip">
-                <div class="filmstrip__videos" id="remoteVideos">
-                    <span id="localVideoContainer" class="videocontainer videocontainer_small">
-                        <div class="videocontainer__background"></div>
-                        <span id="localVideoWrapper">
-                            <!--<video id="localVideo" autoplay muted></video> - is now per stream generated -->
-                        </span>
-                        <audio id="localAudio" autoplay muted></audio>
-                        <div class="videocontainer__toolbar"></div>
-                        <div class="videocontainer__toptoolbar"></div>
-                        <div class="videocontainer__hoverOverlay"></div>
-                    </span>
-                    <audio id="userJoined" src="sounds/joined.wav" preload="auto"></audio>
-                    <audio id="userLeft" src="sounds/left.wav" preload="auto"></audio>
-                </div>
-            </div>
-
-        </div>
-    </div>
+    <div id="react"></div>
     <div id="keyboard-shortcuts" class="keyboard-shortcuts" style="display:none;">
         <div class="content">
             <ul id="keyboard-shortcuts-list" class="shortcuts-list">

interface_config.js

@@ -11,6 +11,8 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
     DEFAULT_LOCAL_DISPLAY_NAME: "me",
     SHOW_JITSI_WATERMARK: true,
     JITSI_WATERMARK_LINK: "https://jitsi.org",
+    // if watermark is disabled by default, it can be shown only for guests
+    SHOW_WATERMARK_FOR_GUESTS: true,
     SHOW_BRAND_WATERMARK: false,
     BRAND_WATERMARK_LINK: "",
     SHOW_POWERED_BY: false,
@@ -22,8 +24,6 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
      * If we should show authentication block in profile
      */
     AUTHENTICATION_ENABLE: true,
-    // the toolbar buttons line is intentionally left in one line, to be able
-    // to easily override values or remove them using regex
     /**
      * The index of the splitter button in the main toolbar. The splitter
      * button is a button in the toolbar that will be applied a special styling
@@ -55,6 +55,8 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
      * Whether to only show the filmstrip (and hide the toolbar).
      */
     filmStripOnly: false,
+    //A html text to be shown to guests on the close page, false disables it
+    CLOSE_PAGE_GUEST_HINT: false,
     RANDOM_AVATAR_URL_PREFIX: false,
     RANDOM_AVATAR_URL_SUFFIX: false,
     FILM_STRIP_MAX_HEIGHT: 120,

ios/Podfile

@@ -1,12 +0,0 @@
-# Uncomment the next line to define a global platform for your project
-# platform :ios, '9.0'
-
-target 'jitsi-meet-react' do
-  # Uncomment the next line if you're using Swift or would like to use dynamic frameworks
-  # use_frameworks!
-
-  # Pods for jitsi-meet-react
-  pod 'Crashlytics'
-  pod 'Fabric'
-
-end

ios/Podfile.lock

@@ -1,16 +0,0 @@
-PODS:
-  - Crashlytics (3.8.3):
-    - Fabric (~> 1.6.3)
-  - Fabric (1.6.11)
-
-DEPENDENCIES:
-  - Crashlytics
-  - Fabric
-
-SPEC CHECKSUMS:
-  Crashlytics: 2b6dbe138a42395577cfa73dfa1aa7248cadf39e
-  Fabric: 5911403591946b8228ab1c51d98f1d7137e863c6
-
-PODFILE CHECKSUM: 672d557f679f28c07b3364884b4580e605000f01
-
-COCOAPODS: 1.1.1