Remove Save button for period setting

Author: txruno

feature-locales/explore-filter/en.json

@@ -4,7 +4,6 @@
     "author": "Author",
     "period": "Period",
     "reset": "Reset",
-    "save": "Save",
     "sharedDate": "Shared Date",
     "updateDate": "Update Date",
     "startDate": "Start date",

feature-locales/explore-filter/es.json

@@ -4,7 +4,6 @@
     "author": "Autor",
     "period": "Período",
     "reset": "Restablecer",
-    "save": "Guardar",
     "sharedDate": "Fecha compartida",
     "updateDate": "Fecha de actualización",
     "startDate": "Fecha de inicio",

feature-locales/explore-filter/ja.json

@@ -4,7 +4,6 @@
     "author": "作者",
     "period": "期間",
     "reset": "リセット",
-    "save": "保存",
     "sharedDate": "共有日",
     "updateDate": "更新日",
     "startDate": "開始日",

feature-locales/explore-filter/tr.json

@@ -4,7 +4,6 @@
     "author": "Yazar",
     "period": "Dönem",
     "reset": "Sıfırla",
-    "save": "Kaydet",
     "sharedDate": "Paylaşım Tarihi",
     "updateDate": "Güncelleme Tarihi",
     "startDate": "Başlangıç tarihi",

features/explore-filter/script.js

@@ -287,13 +287,24 @@ export default async function ({ feature, console }) {
                     input.type = "date";
                     input.style.margin = "0 10px";
                     if (filterData.period[id]) input.value = filterData.period[id];
-                    const button = document.createElement("button");
-                    button.textContent = feature.msg("reset");
-                    button.addEventListener("click", function () {
+                    input.addEventListener("change", function () {
+                        if (input.value) {
+                            filterData["period"][id] = input.value;
+                            button.classList.add('active');
+                        }
+                        else if (filterData.period[id]) delete filterData.period[id];
+                        filter()
+                    });
+                    const resetButton = document.createElement("button");
+                    resetButton.textContent = feature.msg("reset");
+                    resetButton.addEventListener("click", function () {
                         input.value = ''
+                        if (filterData.period[id]) delete filterData.period[id];
+                        filter()
+                        if (Object.keys(filterData["period"]).length == 0) { if (button.classList.contains('active')) button.classList.remove('active') }
                     });
                     content.appendChild(input);
-                    content.appendChild(button);
+                    content.appendChild(resetButton);
                     return content;
                 }
 
@@ -310,11 +321,7 @@ export default async function ({ feature, console }) {
                 updateDetails.appendChild(updateStart);
                 updateDetails.appendChild(updateEnd);
 
-                const saveButton = document.createElement("button");
-                saveButton.textContent = feature.msg("save");
-                saveButton.style.marginRight = "100%";
-    
-                let modal = ScratchTools.modals.create({
+                ScratchTools.modals.create({
                     title: `${feature.msg("period")}`,
                     components: [
                         {
@@ -324,29 +331,9 @@ export default async function ({ feature, console }) {
                         {
                             type: "html",
                             content: updateDetails,
-                        },
-                        {
-                            type: "html",
-                            content: saveButton,
                         }
                     ]
                 });
-                saveButton.addEventListener("click", function () {
-                    function checkInput(id, element) {
-                        const input = element.querySelector("input");
-                        if (input.value) filterData["period"][id] = input.value;
-                        else if (filterData.period[id]) delete filterData.period[id];
-                    }
-                    checkInput("shareStart", shareStart);
-                    checkInput("shareEnd", shareEnd);
-                    checkInput("updateStart", updateStart);
-                    checkInput("updateEnd", updateEnd);
-                    modal.close();
-                    
-                    filter()
-                    if (Object.keys(filterData[id]).length == 0) { if (button.classList.contains('active')) button.classList.remove('active') }
-                    else button.classList.add('active');
-                })
                 break;
             }
 
@@ -361,7 +348,7 @@ export default async function ({ feature, console }) {
     else filterButton.classList.add('active');
     const filterSettings = document.createElement("div");
     filterSettings.classList.add('ste-filter-settings');
-    options.map((option) => {
+    options.forEach(option => {
         const icon = document.createElement("img");
         icon.src = feature.self.getResource(option.icon);