fix: dynamically update fullscreen tooltip (#6643)

Resolves the stale issue from PR #5732 where the Fullscreen tooltip did not update properly after state change. Uses window.jQuery to re-initialize tooltips instead of Materialize M.Tooltip which fits the current setup used in toolbar.js.

Author: sapnilbiswas

index.html

@@ -1205,6 +1205,7 @@
 
         function handleFullscreenChange() {
             var iconCode = document.querySelector('#FullScrIcon');
+            var fullScreenBtn = document.querySelector('#FullScreen');
             // Update fullscreen icon based on actual fullscreen state.
             // This removes the need for a separate state variable and
             // prevents incorrect icon state when fullscreen is toggled
@@ -1216,6 +1217,17 @@
                 document.msFullscreenElement;
 
             iconCode.textContent = isFullscreen ? '\ue5d1' : '\ue5d0';
+            
+            if (fullScreenBtn && typeof _ === 'function') {
+                var tooltipText = isFullscreen ? _("Exit Fullscreen") : _("Enter Fullscreen");
+                fullScreenBtn.setAttribute('data-tooltip', tooltipText);
+                if (window.jQuery) {
+                    window.jQuery(fullScreenBtn).tooltip({
+                        html: true,
+                        delay: 100
+                    });
+                }
+            }
         }
 
         document.addEventListener('fullscreenchange', handleFullscreenChange);
@@ -1289,6 +1301,7 @@
 
             function handleFullscreenChange() {
                 var iconCode = document.querySelector("#FullScrIcon");
+                var fullScreenBtn = document.querySelector("#FullScreen");
                 // Update fullscreen icon based on actual fullscreen state.
                 // This removes the need for a separate state variable and
                 // prevents incorrect icon state when fullscreen is toggled
@@ -1300,6 +1313,17 @@
                     document.msFullscreenElement;
 
                 iconCode.textContent = isFullscreen ? "\ue5d1" : "\ue5d0";
+
+                if (fullScreenBtn && typeof _ === 'function') {
+                    var tooltipText = isFullscreen ? _("Exit Fullscreen") : _("Enter Fullscreen");
+                    fullScreenBtn.setAttribute("data-tooltip", tooltipText);
+                    if (window.jQuery) {
+                        window.jQuery(fullScreenBtn).tooltip({
+                            html: true,
+                            delay: 100
+                        });
+                    }
+                }
             }
 
             document.addEventListener("fullscreenchange", handleFullscreenChange);

js/toolbar.js

@@ -83,8 +83,8 @@ class Toolbar {
                 ["play", _("Play")],
                 ["stop", _("Stop")],
                 ["record", _("Record")],
-                ["Full screen", _("Full screen")],
-                ["FullScreen", _("Full screen")],
+                ["Full screen", _("Enter Fullscreen")],
+                ["FullScreen", _("Enter Fullscreen")],
                 ["Toggle Fullscreen", _("Toggle Fullscreen")],
                 ["newFile", _("New project")],
                 ["load", _("Load project from file")],
@@ -155,8 +155,8 @@ class Toolbar {
                 _("Play"),
                 _("Stop"),
                 _("Record"),
-                _("Full screen"),
-                _("Full screen"),
+                _("Enter Fullscreen"),
+                _("Enter Fullscreen"),
                 _("Toggle Fullscreen"),
                 _("New project"),
                 _("Load project from file"),
@@ -231,8 +231,8 @@ class Toolbar {
                 ["play", _("Play")],
                 ["stop", _("Stop")],
                 ["record", _("Record")],
-                ["Full screen", _("Full screen")],
-                ["FullScreen", _("Full screen")],
+                ["Full screen", _("Enter Fullscreen")],
+                ["FullScreen", _("Enter Fullscreen")],
                 ["Toggle Fullscreen", _("Toggle Fullscreen")],
                 ["newFile", _("New project")],
                 ["load", _("Load project from file")],
@@ -297,8 +297,8 @@ class Toolbar {
                 _("Play"),
                 _("Stop"),
                 _("Record"),
-                _("Full screen"),
-                _("Full screen"),
+                _("Enter Fullscreen"),
+                _("Enter Fullscreen"),
                 _("Toggle Fullscreen"),
                 _("New project"),
                 _("Load project from file"),