From e229306bc63d1cca9527b0acdfcd9588b3ab92ce Mon Sep 17 00:00:00 2001 From: "Karl O. Pinc" Date: Wed, 25 Sep 2024 15:09:00 -0500 Subject: [PATCH] Add "Show rules" checkbox and attendent css and js The only problem here is that as the column headings stick to the page their background covers only the columns, not the entire width of the screen/enclosing div. Which means that when background rules are displayed they are uncovered in the horizontal area where the table headings appear. The backround_rules.css _could_ apply the rules to the table instead of the div, but then the rules don't go all the way across the page. There is surely a way to fiddle with this but it's not worth bothering with now. --- src/pgwui_sql/static/background_rules.css | 26 +++++++++++++++++++++++ src/pgwui_sql/static/pgwui_sql.css | 5 +++-- src/pgwui_sql/static/pgwui_sql.js | 10 +++++++++ src/pgwui_sql/templates/sql.mak | 22 +++++++++++++++++++ src/pgwui_sql/views/sql.py | 12 +++++++++++ 5 files changed, 73 insertions(+), 2 deletions(-) create mode 100644 src/pgwui_sql/static/background_rules.css diff --git a/src/pgwui_sql/static/background_rules.css b/src/pgwui_sql/static/background_rules.css new file mode 100644 index 0000000..303e4fb --- /dev/null +++ b/src/pgwui_sql/static/background_rules.css @@ -0,0 +1,26 @@ +/* Copyright (C) 2024 The Meme Factory, Inc. http://www.karlpinc.com/ + * + * This file is part of PGWUI_SQL. + * + * This program is free software: you can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License + * as published by the Free Software Foundation, either version 3 of + * the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, but + * WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public + * License along with this program. If not, see + * . + * + * Turned on and off to put "rules" in the container background. + * + * Karl O. Pinc + */ + +div.stickycontainer { + background: repeating-linear-gradient(white 0 4em, lightcyan 0 8em); +} diff --git a/src/pgwui_sql/static/pgwui_sql.css b/src/pgwui_sql/static/pgwui_sql.css index bb547b4..3594c6d 100644 --- a/src/pgwui_sql/static/pgwui_sql.css +++ b/src/pgwui_sql/static/pgwui_sql.css @@ -55,9 +55,10 @@ textarea.sqltext { height: 40em; So don't try. Instead, set the background to "white", the same that we set in the body's background. And then assume that all the backgrounds in-between are transparent. */ -.stickyheading { position: sticky; /* attach to heading */ +.stickyheading { position: sticky; /* attach to heading */ top: 0; - background-color: white; /* kludge, see above */ + background-color: white; /* kludge, see above */ + border-collapse: collapse; /* cover tbody background */ text-align: left; } .stickycontainer { overflow-y: clip; } /* attach to heading's container */ .stickyfooting { position: sticky; /* attach to footer */ diff --git a/src/pgwui_sql/static/pgwui_sql.js b/src/pgwui_sql/static/pgwui_sql.js index 6c943b2..b34d06a 100644 --- a/src/pgwui_sql/static/pgwui_sql.js +++ b/src/pgwui_sql/static/pgwui_sql.js @@ -44,6 +44,14 @@ function whitespaceDisplay(checked) { } } +function rulesDisplay(checked) { + if (checked) { + globalThis.horizontalRuleSheet.disabled = false; + } else { + globalThis.horizontalRuleSheet.disabled = true; + } +} + /* Functions for initialization */ function getSheet(url) { for (const sheet of document.styleSheets) { @@ -60,8 +68,10 @@ function initializeStyling() { } } applyCheckbox('show_spaces_id', whitespaceDisplay); + applyCheckbox('show_rules_id', rulesDisplay); } /* Initialization */ globalThis.tdSqltextSheet = getSheet(pgwuiSqlShowWhitespaceURL()); +globalThis.horizontalRuleSheet = getSheet(pgwuiSqlBackgroundRulesURL()); initializeStyling(); diff --git a/src/pgwui_sql/templates/sql.mak b/src/pgwui_sql/templates/sql.mak index 182ca09..de4970f 100644 --- a/src/pgwui_sql/templates/sql.mak +++ b/src/pgwui_sql/templates/sql.mak @@ -26,6 +26,8 @@ search_path The requested search_path sql Text of the sql command(s) result_rows List of SQLResult objects + show_rules HTML attribute of input element indicating checked checkbox + of the "Show rules" checkbox show_spaces HTML attribute of input element indicating checked checkbox of the "Show spaces" checkbox @@ -48,6 +50,10 @@ return '${request.static_url( "pgwui_sql:static/show_whitespace.css")}'; } + function pgwuiSqlBackgroundRulesURL() { + return '${request.static_url( + "pgwui_sql:static/background_rules.css")}'; + } // Set window name so that the sql_edit window can vary the target // by db/user/etc. and have multiple result windows open at once. window.name='${self.sql_results_target()}'; @@ -66,6 +72,9 @@ + <%block name="action_success"> @@ -144,6 +153,19 @@ % endfor
+ + Show rules + + + + + Show spaces diff --git a/src/pgwui_sql/views/sql.py b/src/pgwui_sql/views/sql.py index f261302..69eeab1 100644 --- a/src/pgwui_sql/views/sql.py +++ b/src/pgwui_sql/views/sql.py @@ -47,6 +47,7 @@ log = logging.getLogger(__name__) @attrs.define(slots=False) class SQLInitialPost(pgwui_sql.views.base.SQLBaseInitialPost): show_spaces = attrs.field(default=False) + show_rules = attrs.field(default=False) class SQLWTForm(pgwui_sql.views.base.SQLBaseWTForm): @@ -56,6 +57,8 @@ class SQLWTForm(pgwui_sql.views.base.SQLBaseWTForm): # just to keep my hand in. show_spaces = wtforms.fields.BooleanField( 'Show spaces', id='show_spaces_id') + show_rules = wtforms.fields.BooleanField( + 'Show rules', id='show_rules_id') @attrs.define(slots=False) @@ -67,6 +70,7 @@ class SQLForm(pgwui_sql.views.base.SQLBaseForm): uh The UploadHandler instance using the form ''' show_spaces = attrs.field(default=False) + show_rules = attrs.field(default=False) def read(self): ''' @@ -77,16 +81,24 @@ class SQLForm(pgwui_sql.views.base.SQLBaseForm): # Read our own data self['show_spaces'] = self._form.show_spaces.data + self['show_rules'] = self._form.show_rules.data def write(self, result, errors): ''' Produces the dict pyramid will use to render the form. ''' response = super().write(result, errors) + if self['show_spaces']: response['show_spaces'] = CHECKED else: response['show_spaces'] = UNCHECKED + + if self['show_rules']: + response['show_rules'] = CHECKED + else: + response['show_rules'] = UNCHECKED + return response -- 2.34.1