Modify the link disabled attribute instead of using the DOM
authorKarl O. Pinc <kop@karlpinc.com>
Tue, 8 Oct 2024 18:08:24 +0000 (13:08 -0500)
committerKarl O. Pinc <kop@karlpinc.com>
Tue, 8 Oct 2024 18:08:24 +0000 (13:08 -0500)
Having the page load with the disabled attribute present prevents
the "flash" of having the styling present and then removed.  But the
DOM can't be used to put the stylesheet in and out of the rendering
chain when the stylesheet is disabled, so no point in that.

src/pgwui_sql/static/pgwui_sql.js
src/pgwui_sql/templates/sql.mak

index e30b7d15418c6c5b376856128116b8e6187cf025..fcd1a87cc496ad236f31ab7d71a2c9116b2bfc7e 100644 (file)
@@ -39,19 +39,23 @@ function openSqlEdit() {
 }
 
 function whitespaceDisplay(checked) {
-         if (checked) {
-           globalThis.tdSqltextSheet.disabled = false;
-         } else {
-           globalThis.tdSqltextSheet.disabled = true;
-         }
+    const whitespace_sheet = document.getElementById(
+        'stylesheet_show_whitespace_id');
+    if (checked) {
+        whitespace_sheet.removeAttribute('disabled');
+    } else {
+         whitespace_sheet.setAttribute('disabled', '');
+    }
 }
 
 function rulesDisplay(checked) {
-         if (checked) {
-           globalThis.horizontalRuleSheet.disabled = false;
-         } else {
-           globalThis.horizontalRuleSheet.disabled = true;
-         }
+    const rule_sheet = document.getElementById(
+        'stylesheet_background_rules_id');
+     if (checked) {
+         rule_sheet.removeAttribute('disabled');
+     } else {
+         rule_sheet.setAttribute('disabled', '');
+     }
 }
 
 /* Functions for initialization */
@@ -81,8 +85,6 @@ function initializeStyling() {
 }
 
 /* Initialization */
-globalThis.tdSqltextSheet = getSheet(pgwuiSqlShowWhitespaceURL());
-globalThis.horizontalRuleSheet = getSheet(pgwuiSqlBackgroundRulesURL());
 attachEvents();
 /* This is redundent, since styling on load should be right,
    but it does not hurt and is needed to properly style should the checkbox
index 868ac5a2393596d89119728205e1b6a742a81333..9f3877d96aea393578e52dd37e396bbcea085aa5 100644 (file)
 <%block name="stylesheet_links">
   ${parent.stylesheet_links()}
   <link rel="stylesheet"
+        id="stylesheet_show_whitespace_id"
         disabled
         href="${request.static_path('pgwui_sql:static/show_whitespace.css')}"
         type="text/css" />
   <link rel="stylesheet"
+        id="stylesheet_background_rules_id"
         disabled
         href="${request.static_path('pgwui_sql:static/background_rules.css')}"
         type="text/css" />