Record and Save icon in disabled

sugarlabs · Jan 9, 2025 · 4d34735 · 4d34735
1 parent bb9c946
commit 4d34735
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 0 deletions.
diff --git a/js/activity.js b/js/activity.js
@@ -1199,6 +1199,18 @@ class Activity {
                     saveButtonAdvanced.disabled = true;
                     saveButton.className = "grey-text inactiveLink";
                     saveButtonAdvanced.className = "grey-text inactiveLink";
+
+                    const Record = docById("record");
+                    Record.disabled = true;
+                    Record.className = "grey-text inactiveLink";
+                    const outerCircle = Record.querySelector("circle:not(#rec_inside)");
+                    if (outerCircle) {
+                        outerCircle.setAttribute("stroke", "#9E9E9E"); // Change the stroke color of the outer circle
+                    }
+                    const recInside = Record.querySelector("#rec_inside");
+                    if (recInside) {
+                        recInside.setAttribute("fill", "#9E9E9E"); // inner circle fill color
+                    }
                 }
 
                 this.logo.runLogoCommands(null, env);

diff --git a/js/logo.js b/js/logo.js
@@ -956,6 +956,24 @@ class Logo {
         }
 
         this.activity.showBlocksAfterRun = false;
+        const saveButton = docById('saveButton');
+        const saveButtonAdvanced = docById('saveButtonAdvanced');
+        saveButton.disabled = false;
+        saveButtonAdvanced.disabled = false;
+        saveButton.className = saveButton.className.replace('grey-text inactiveLink', '').trim();
+        saveButtonAdvanced.className = saveButtonAdvanced.className.replace('grey-text inactiveLink', '').trim();
+
+        const Record = docById("record");
+        Record.disabled = false;
+        Record.className = Record.className.replace('grey-text inactiveLink', '').trim();
+        const outerCircle = Record.querySelector("circle:not(#rec_inside)");
+        if (outerCircle) {
+            outerCircle.setAttribute("stroke", "#FFFFFF"); // Change the stroke color of the outer circle to white
+        }
+        const recInside = Record.querySelector("#rec_inside");
+        if (recInside) {
+            recInside.setAttribute("fill", "#FFFFFF"); // Change the inner circle fill color to white
+        }
     }
 
     /**
@@ -1795,6 +1813,18 @@ class Logo {
                         saveButtonAdvanced.disabled = false;
                         saveButton.className = saveButton.className.replace('grey-text inactiveLink', '').trim();
                         saveButtonAdvanced.className = saveButtonAdvanced.className.replace('grey-text inactiveLink', '').trim();
+
+                        const Record = docById("record");
+                        Record.disabled = false;
+                        Record.className = Record.className.replace('grey-text inactiveLink', '').trim();
+                        const outerCircle = Record.querySelector("circle:not(#rec_inside)");
+                        if (outerCircle) {
+                            outerCircle.setAttribute("stroke", "#FFFFFF"); // Change the stroke color of the outer circle to white
+                        }
+                        const recInside = Record.querySelector("#rec_inside");
+                        if (recInside) {
+                            recInside.setAttribute("fill", "#FFFFFF"); // Change the inner circle fill color to white
+                        }
                     }
                 }
                 document.getElementById("stop").style.color = "white";