https://github.com/python/cpython/commit/5b5263648f2404b22f9a596c67350c2e602df52b
commit: 5b5263648f2404b22f9a596c67350c2e602df52b
branch: main
author: Hugo van Kemenade <[email protected]>
committer: pablogsal <[email protected]>
date: 2025-12-20T02:36:09+01:00
summary:

gh-142927: Tachyon: Start with user's default light/dark theme (#142987)

files:
M Lib/profiling/sampling/_heatmap_assets/heatmap.js
M Lib/profiling/sampling/_heatmap_assets/heatmap_index.js
M Lib/profiling/sampling/_heatmap_assets/heatmap_index_template.html
M Lib/profiling/sampling/_heatmap_assets/heatmap_pyfile_template.html
M Lib/profiling/sampling/_heatmap_assets/heatmap_shared.js

diff --git a/Lib/profiling/sampling/_heatmap_assets/heatmap.js 
b/Lib/profiling/sampling/_heatmap_assets/heatmap.js
index d6a91ef290309b..90b5b111d36a8f 100644
--- a/Lib/profiling/sampling/_heatmap_assets/heatmap.js
+++ b/Lib/profiling/sampling/_heatmap_assets/heatmap.js
@@ -15,37 +15,13 @@ let coldCodeHidden = false;
 // ============================================================================
 
 function toggleTheme() {
-    const html = document.documentElement;
-    const current = html.getAttribute('data-theme') || 'light';
-    const next = current === 'light' ? 'dark' : 'light';
-    html.setAttribute('data-theme', next);
-    localStorage.setItem('heatmap-theme', next);
-
-    // Update theme button icon
-    const btn = document.getElementById('theme-btn');
-    if (btn) {
-        btn.querySelector('.icon-moon').style.display = next === 'dark' ? 
'none' : '';
-        btn.querySelector('.icon-sun').style.display = next === 'dark' ? '' : 
'none';
-    }
+    toggleAndSaveTheme();
     applyLineColors();
 
     // Rebuild scroll marker with new theme colors
     buildScrollMarker();
 }
 
-function restoreUIState() {
-    // Restore theme
-    const savedTheme = localStorage.getItem('heatmap-theme');
-    if (savedTheme) {
-        document.documentElement.setAttribute('data-theme', savedTheme);
-        const btn = document.getElementById('theme-btn');
-        if (btn) {
-            btn.querySelector('.icon-moon').style.display = savedTheme === 
'dark' ? 'none' : '';
-            btn.querySelector('.icon-sun').style.display = savedTheme === 
'dark' ? '' : 'none';
-        }
-    }
-}
-
 // ============================================================================
 // Utility Functions
 // ============================================================================
diff --git a/Lib/profiling/sampling/_heatmap_assets/heatmap_index.js 
b/Lib/profiling/sampling/_heatmap_assets/heatmap_index.js
index 8eb6af0db5335e..db4b5485056217 100644
--- a/Lib/profiling/sampling/_heatmap_assets/heatmap_index.js
+++ b/Lib/profiling/sampling/_heatmap_assets/heatmap_index.js
@@ -19,35 +19,10 @@ function applyHeatmapBarColors() {
 // ============================================================================
 
 function toggleTheme() {
-    const html = document.documentElement;
-    const current = html.getAttribute('data-theme') || 'light';
-    const next = current === 'light' ? 'dark' : 'light';
-    html.setAttribute('data-theme', next);
-    localStorage.setItem('heatmap-theme', next);
-
-    // Update theme button icon
-    const btn = document.getElementById('theme-btn');
-    if (btn) {
-        btn.querySelector('.icon-moon').style.display = next === 'dark' ? 
'none' : '';
-        btn.querySelector('.icon-sun').style.display = next === 'dark' ? '' : 
'none';
-    }
-
+    toggleAndSaveTheme();
     applyHeatmapBarColors();
 }
 
-function restoreUIState() {
-    // Restore theme
-    const savedTheme = localStorage.getItem('heatmap-theme');
-    if (savedTheme) {
-        document.documentElement.setAttribute('data-theme', savedTheme);
-        const btn = document.getElementById('theme-btn');
-        if (btn) {
-            btn.querySelector('.icon-moon').style.display = savedTheme === 
'dark' ? 'none' : '';
-            btn.querySelector('.icon-sun').style.display = savedTheme === 
'dark' ? '' : 'none';
-        }
-    }
-}
-
 // ============================================================================
 // Type Section Toggle (stdlib, project, etc)
 // ============================================================================
diff --git a/Lib/profiling/sampling/_heatmap_assets/heatmap_index_template.html 
b/Lib/profiling/sampling/_heatmap_assets/heatmap_index_template.html
index 3620f8efb8058a..8d04149abe3014 100644
--- a/Lib/profiling/sampling/_heatmap_assets/heatmap_index_template.html
+++ b/Lib/profiling/sampling/_heatmap_assets/heatmap_index_template.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" data-theme="light">
+<html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
diff --git 
a/Lib/profiling/sampling/_heatmap_assets/heatmap_pyfile_template.html 
b/Lib/profiling/sampling/_heatmap_assets/heatmap_pyfile_template.html
index 91b629b2628244..2a9c07647e64cd 100644
--- a/Lib/profiling/sampling/_heatmap_assets/heatmap_pyfile_template.html
+++ b/Lib/profiling/sampling/_heatmap_assets/heatmap_pyfile_template.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" data-theme="light">
+<html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
diff --git a/Lib/profiling/sampling/_heatmap_assets/heatmap_shared.js 
b/Lib/profiling/sampling/_heatmap_assets/heatmap_shared.js
index 7fcd720d45d7b3..84b13ca0a9682b 100644
--- a/Lib/profiling/sampling/_heatmap_assets/heatmap_shared.js
+++ b/Lib/profiling/sampling/_heatmap_assets/heatmap_shared.js
@@ -39,6 +39,42 @@ function intensityToColor(intensity) {
     return rootStyle.getPropertyValue(`--heat-${level}`).trim();
 }
 
+// ============================================================================
+// Theme Support
+// ============================================================================
+
+// Get the preferred theme from localStorage or browser preference
+function getPreferredTheme() {
+    const saved = localStorage.getItem('heatmap-theme');
+    if (saved) return saved;
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' 
: 'light';
+}
+
+// Apply theme and update UI. Returns the applied theme.
+function applyTheme(theme) {
+    document.documentElement.setAttribute('data-theme', theme);
+    const btn = document.getElementById('theme-btn');
+    if (btn) {
+        btn.querySelector('.icon-moon').style.display = theme === 'dark' ? 
'none' : '';
+        btn.querySelector('.icon-sun').style.display = theme === 'dark' ? '' : 
'none';
+    }
+    return theme;
+}
+
+// Toggle theme and save preference. Returns the new theme.
+function toggleAndSaveTheme() {
+    const current = document.documentElement.getAttribute('data-theme') || 
'light';
+    const next = current === 'light' ? 'dark' : 'light';
+    applyTheme(next);
+    localStorage.setItem('heatmap-theme', next);
+    return next;
+}
+
+// Restore theme from localStorage, or use browser preference
+function restoreUIState() {
+    applyTheme(getPreferredTheme());
+}
+
 // ============================================================================
 // Favicon (Reuse logo image as favicon)
 // ============================================================================

_______________________________________________
Python-checkins mailing list -- [email protected]
To unsubscribe send an email to [email protected]
https://mail.python.org/mailman3//lists/python-checkins.python.org
Member address: [email protected]

Reply via email to