From c4bd171f1aec1418d0f65bffed4f73ede816f67a Mon Sep 17 00:00:00 2001
From: Miodec <bartnikjack@gmail.com>
Date: Tue, 28 Jun 2022 13:02:44 +0200
Subject: [PATCH] replaced manual background filters save with automatic closes
 #3253

---
 frontend/src/ts/elements/custom-background-filter.ts | 9 ++++++---
 frontend/static/html/pages/settings.html             | 6 ------
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/frontend/src/ts/elements/custom-background-filter.ts b/frontend/src/ts/elements/custom-background-filter.ts
index 32bab64ca..49e94dfb1 100644
--- a/frontend/src/ts/elements/custom-background-filter.ts
+++ b/frontend/src/ts/elements/custom-background-filter.ts
@@ -1,6 +1,6 @@
 import * as UpdateConfig from "../config";
-import * as Notifications from "./notifications";
 import * as ConfigEvent from "../observables/config-event";
+import { debounce } from "throttle-debounce";
 
 const filters = {
   blur: {
@@ -116,12 +116,15 @@ $(".section.customBackgroundFilter .opacity input").on("input", () => {
   apply();
 });
 
-$(".section.customBackgroundFilter  .save.button").on("click", () => {
+$(".section.customBackgroundFilter input").on("input", () => {
+  debouncedSave();
+});
+
+const debouncedSave = debounce(2000, async () => {
   const arr = Object.keys(filters).map(
     (filterKey) => filters[filterKey as keyof typeof filters].value
   ) as MonkeyTypes.CustomBackgroundFilter;
   UpdateConfig.setCustomBackgroundFilter(arr, false);
-  Notifications.add("Custom background filters saved", 1);
 });
 
 ConfigEvent.subscribe((eventKey, eventValue) => {
diff --git a/frontend/static/html/pages/settings.html b/frontend/static/html/pages/settings.html
index 565c196fa..816a25865 100644
--- a/frontend/static/html/pages/settings.html
+++ b/frontend/static/html/pages/settings.html
@@ -1734,12 +1734,6 @@
           <div class="value"></div>
           <input type="range" min="0" max="1" value="1" step="0.1" />
         </div>
-        <div class="saveContainer">
-          <div class="save button" style="grid-column: 3">
-            <!-- <i class="fas fa-save fa-fw"></i> -->
-            save
-          </div>
-        </div>
       </div>
     </div>
     <div class="section autoSwitchTheme">