From 3ae97348f81c54691061c0a8fcf843882c3500b8 Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Wed, 25 Oct 2017 18:17:33 +0100
Subject: [PATCH] Add option to mirror local video feed

---
 src/components/structures/UserSettings.js | 4 ++++
 src/components/views/voip/VideoView.js    | 9 +++++++--
 src/i18n/strings/en_EN.json               | 1 +
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js
index 7704cce0c7..ac1c6b662b 100644
--- a/src/components/structures/UserSettings.js
+++ b/src/components/structures/UserSettings.js
@@ -118,6 +118,10 @@ const SETTINGS_LABELS = [
         id: 'TextualBody.disableBigEmoji',
         label: _td('Disable big emoji in chat'),
     },
+    {
+        id: 'VideoView.flipVideoHorizontally',
+        label: _td('Mirror local video feed'),
+    },
 /*
     {
         id: 'useFixedWidthFont',
diff --git a/src/components/views/voip/VideoView.js b/src/components/views/voip/VideoView.js
index 8f062d27ae..94cc74960f 100644
--- a/src/components/views/voip/VideoView.js
+++ b/src/components/views/voip/VideoView.js
@@ -18,10 +18,13 @@ limitations under the License.
 
 import React from 'react';
 import ReactDOM from 'react-dom';
+import classNames from 'classnames';
 
 import sdk from '../../../index';
 import dis from '../../../dispatcher';
 
+import UserSettingsStore from '../../../UserSettingsStore';
+
 module.exports = React.createClass({
     displayName: 'VideoView',
 
@@ -108,14 +111,16 @@ module.exports = React.createClass({
                  document.mozFullScreenElement ||
                  document.webkitFullscreenElement);
         const maxVideoHeight = fullscreenElement ? null : this.props.maxHeight;
-
+        const localVideoFeedClasses = classNames("mx_VideoView_localVideoFeed",
+            {"mx_VideoView_localVideoFeed_flipped": UserSettingsStore.getSyncedSetting}
+        );
         return (
             <div className="mx_VideoView" ref={this.setContainer} onClick={this.props.onClick}>
                 <div className="mx_VideoView_remoteVideoFeed">
                     <VideoFeed ref="remote" onResize={this.props.onResize}
                         maxHeight={maxVideoHeight} />
                 </div>
-                <div className="mx_VideoView_localVideoFeed">
+                <div className={localVideoFeedClasses}>
                     <VideoFeed ref="local" />
                 </div>
             </div>
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index fbff51299a..b9bca1ca6c 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -755,6 +755,7 @@
     "Disable Emoji suggestions while typing": "Disable Emoji suggestions while typing",
     "Hide avatars in user and room mentions": "Hide avatars in user and room mentions",
     "Disable big emoji in chat": "Disable big emoji in chat",
+    "Mirror local video feed": "Mirror local video feed",
     "Opt out of analytics": "Opt out of analytics",
     "Disable Peer-to-Peer for 1:1 calls": "Disable Peer-to-Peer for 1:1 calls",
     "Never send encrypted messages to unverified devices from this device": "Never send encrypted messages to unverified devices from this device",