From e3b4e284286bdae259367f7ff6c03f90cc6b555f Mon Sep 17 00:00:00 2001
From: hippoz <10706925-hippoz@users.noreply.gitlab.com>
Date: Sat, 7 May 2022 03:45:09 +0300
Subject: [PATCH] frontend: add animation on/off setting

---
 frontend/src/components/overlays/Settings.svelte | 10 +++++++++-
 frontend/src/stores.js                           |  2 ++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/overlays/Settings.svelte b/frontend/src/components/overlays/Settings.svelte
index d18ce6c..beb4aa1 100644
--- a/frontend/src/components/overlays/Settings.svelte
+++ b/frontend/src/components/overlays/Settings.svelte
@@ -1,7 +1,7 @@
 <script>
     import { quintInOut } from "svelte/easing";
     import { AtSignIcon } from "svelte-feather-icons";
-    import { overlayStore, userInfoStore, smallViewport, theme } from "../../stores";
+    import { overlayStore, userInfoStore, smallViewport, theme, doAnimations } from "../../stores";
     import { logOut } from "../../auth";
     import { maybeFade, maybeFly } from "../../animations";
 
@@ -74,6 +74,14 @@
             <button class="button selection-option full-width selected" class:selected="{ $theme === "dark" }" on:click="{ () => theme.set('dark') }">Dark</button>
             <button class="button selection-option full-width" class:selected="{ $theme === "light" }" on:click="{ () => theme.set('light') }">Light</button>
         </div>
+
+        <div class="separator" />
+
+        <span class="input-label">Animations</span>
+        <div class="horizontal-selections">
+            <button class="button selection-option full-width selected" class:selected="{ $doAnimations === false }" on:click="{ () => doAnimations.set(false) }">Disabled</button>
+            <button class="button selection-option full-width" class:selected="{ $doAnimations === true }" on:click="{ () => doAnimations.set(true) }">Enabled</button>
+        </div>
  
         <div class="modal-footer">
             <button class="button modal-secondary-action" on:click="{ close }">Close</button>
diff --git a/frontend/src/stores.js b/frontend/src/stores.js
index ea9b37e..fce55c7 100644
--- a/frontend/src/stores.js
+++ b/frontend/src/stores.js
@@ -317,6 +317,7 @@ export const showSidebar = new Store(false, "showSidebar");
 export const showChannelView = new Store(true, "showChannelView");
 export const smallViewport = new Store(false, "smallViewport");
 export const theme = new StorageItemStore("app:visual:theme");
+export const doAnimations = new StorageItemStore("app:behavior:doAnimations");
 export const channels = new ChannelsStore();
 export const gatewayStatus = new GatewayStatusStore();
 export const messagesStoreProvider = new MessagesStoreProvider();
@@ -329,6 +330,7 @@ export const allStores = {
     showChannelView,
     smallViewport,
     theme,
+    doAnimations,
     channels,
     gatewayStatus,
     messagesStoreProvider,