Split autoplay gifs and videos in to different settings

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

src/settings/Settings.tsx

@@ -393,9 +393,14 @@ export const SETTINGS: {[setting: string]: ISetting} = {
         displayName: _td('Always show message timestamps'),
         default: false,
     },
-    "autoplayGifsAndVideos": {
+    "autoplayGifs": {
         supportedLevels: LEVELS_ACCOUNT_SETTINGS,
-        displayName: _td('Autoplay GIFs and videos'),
+        displayName: _td('Autoplay GIFs'),
+        default: false,
+    },
+    "autoplayVideo": {
+        supportedLevels: LEVELS_ACCOUNT_SETTINGS,
+        displayName: _td('Autoplay videos'),
         default: false,
     },
     "enableSyntaxHighlightLanguageDetection": {

src/settings/handlers/AccountSettingsHandler.ts

@@ -110,6 +110,21 @@ export default class AccountSettingsHandler extends MatrixClientBackedSettingsHa
             return content ? content['enabled'] : null;
         }
 
+        // Special case for autoplaying videos and GIFs
+        if (["autoplayGifs", "autoplayVideo"].includes(settingName)) {
+            const settings = this.getSettings() || {};
+            const value = settings[settingName];
+            // Fallback to old combined setting
+            if (value === null || value === undefined) {
+                const oldCombinedValue= settings["autoplayGifsAndVideos"];
+                // Write, so that we can remove this in the future
+                this.setValue("autoplayGifs", roomId, oldCombinedValue);
+                this.setValue("autoplayVideo", roomId, oldCombinedValue);
+                return oldCombinedValue;
+            }
+            return value;
+        }
+
         const settings = this.getSettings() || {};
         let preferredValue = settings[settingName];