From ad16f77c269edc26f02f5629a7cf234bd9dbcb0c Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:13:02 -0500 Subject: [PATCH 1/7] update models --- corehq/apps/app_manager/models.py | 1 + corehq/apps/app_manager/suite_xml/xml_models.py | 1 + 2 files changed, 2 insertions(+) diff --git a/corehq/apps/app_manager/models.py b/corehq/apps/app_manager/models.py index cb2f394751c2..07d55d7d8144 100644 --- a/corehq/apps/app_manager/models.py +++ b/corehq/apps/app_manager/models.py @@ -1857,6 +1857,7 @@ class DetailColumn(IndexedSchema): vertical_align = StringProperty(exclude_if_none=True) font_size = StringProperty(exclude_if_none=True) show_border = BooleanProperty(exclude_if_none=True) + show_shading = BooleanProperty(exclude_if_none=True) enum = SchemaListProperty(MappingItem) graph_configuration = SchemaProperty(GraphConfiguration) diff --git a/corehq/apps/app_manager/suite_xml/xml_models.py b/corehq/apps/app_manager/suite_xml/xml_models.py index da1179d0c91a..642a8d010800 100644 --- a/corehq/apps/app_manager/suite_xml/xml_models.py +++ b/corehq/apps/app_manager/suite_xml/xml_models.py @@ -793,6 +793,7 @@ class Style(XmlObject): grid_x = StringField("grid/@grid-x") grid_y = StringField("grid/@grid-y") show_border = BooleanField("@show-border") + show_shading = BooleanField("@show-shading") class Extra(XmlObject): From f5a02e38d3bf31669d26fb4b868043d9858629e8 Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:16:43 -0500 Subject: [PATCH 2/7] add shading option to modal --- .../partials/modules/style_configuration_modal.html | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/corehq/apps/app_manager/templates/app_manager/partials/modules/style_configuration_modal.html b/corehq/apps/app_manager/templates/app_manager/partials/modules/style_configuration_modal.html index 993c3c976e96..a45011379562 100644 --- a/corehq/apps/app_manager/templates/app_manager/partials/modules/style_configuration_modal.html +++ b/corehq/apps/app_manager/templates/app_manager/partials/modules/style_configuration_modal.html @@ -43,6 +43,14 @@

{% trans "Edit Field Style" %}

data-bind="checked: showBorder, visible: coordinatesVisible" > +
+ + +
From f9495a79d957d83b55b1611ee8b665c305e320fa Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:20:10 -0500 Subject: [PATCH 3/7] update column model for different shading --- .../apps/app_manager/static/app_manager/js/details/column.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/corehq/apps/app_manager/static/app_manager/js/details/column.js b/corehq/apps/app_manager/static/app_manager/js/details/column.js index 6cd499bbf9e7..f11a1b7e5352 100644 --- a/corehq/apps/app_manager/static/app_manager/js/details/column.js +++ b/corehq/apps/app_manager/static/app_manager/js/details/column.js @@ -41,6 +41,7 @@ hqDefine("app_manager/js/details/column", function () { vertical_align: "start", font_size: "medium", show_border: false, + show_shading: false, }; _.each(_.keys(defaults), function (key) { self.original[key] = self.original[key] || defaults[key]; @@ -77,6 +78,7 @@ hqDefine("app_manager/js/details/column", function () { self.fontSizeOptions = ['small', 'medium', 'large']; self.showBorder = ko.observable(self.original.show_border || false); + self.showShading = ko.observable(self.original.show_shading || false); self.openStyleModal = function () { const $modalDiv = $(document.createElement("div")); @@ -357,6 +359,7 @@ hqDefine("app_manager/js/details/column", function () { self.verticalAlign.subscribe(fireChange); self.fontSize.subscribe(fireChange); self.showBorder.subscribe(fireChange); + self.showShading.subscribe(fireChange); self.$format = $('
').append(self.format.ui); self.$format.find("select").css("margin-bottom", "5px"); @@ -449,6 +452,7 @@ hqDefine("app_manager/js/details/column", function () { column.vertical_align = self.verticalAlign(); column.font_size = self.fontSize(); column.show_border = self.showBorder(); + column.show_shading = self.showShading(); column.graph_configuration = self.format.val() === "graph" ? self.graph_extra.val() : null; column.late_flag = parseInt(self.late_flag_extra.val(), 10); column.time_ago_interval = parseFloat(self.time_ago_extra.val()); From af95077be371c5d5189240315a77f879fc6fc83c Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:22:26 -0500 Subject: [PATCH 4/7] add shading to style generation for tiles --- .../cloudcare/static/cloudcare/js/formplayer/menus/views.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/formplayer/menus/views.js b/corehq/apps/cloudcare/static/cloudcare/js/formplayer/menus/views.js index c005c2f38fd7..d9b68a9d20d8 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/formplayer/menus/views.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/formplayer/menus/views.js @@ -147,6 +147,7 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () { // generate the case tile's style block and insert const buildCellLayout = function (tiles, styles, prefix) { const borderInTile = Boolean(_.find(styles, s => s.showBorder)); + const shadingInTile = Boolean(_.find(styles, s => s.showShading)); const tileModels = _.chain(tiles || []) .map(function (tile, idx) { if (tile === null || tile === undefined) { @@ -161,6 +162,8 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () { horizontalAlign: getValidFieldAlignment(style.horizontalAlign), showBorder: style.showBorder, borderInTile: borderInTile, + showShading: style.showShading, + shadingInTile: shadingInTile, }; }) .filter(function (tile) { From fea5ef19f0709eb7c097bc49b8eea30f39ff74b9 Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:24:00 -0500 Subject: [PATCH 5/7] update suite xml --- corehq/apps/app_manager/suite_xml/features/case_tiles.py | 3 ++- corehq/apps/app_manager/suite_xml/sections/details.py | 2 ++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/corehq/apps/app_manager/suite_xml/features/case_tiles.py b/corehq/apps/app_manager/suite_xml/features/case_tiles.py index e8a13d58f599..dbb383ef0762 100644 --- a/corehq/apps/app_manager/suite_xml/features/case_tiles.py +++ b/corehq/apps/app_manager/suite_xml/features/case_tiles.py @@ -100,7 +100,8 @@ def build_case_tile_detail(self): horz_align=column_info.column.horizontal_align, vert_align=column_info.column.vertical_align, font_size=column_info.column.font_size, - show_border=column_info.column.show_border) + show_border=column_info.column.show_border, + show_shading=column_info.column.show_shading) fields = get_column_generator( self.app, self.module, self.detail, detail_type=self.detail_type, diff --git a/corehq/apps/app_manager/suite_xml/sections/details.py b/corehq/apps/app_manager/suite_xml/sections/details.py index a8293c90513b..5ea9fb3fe38d 100644 --- a/corehq/apps/app_manager/suite_xml/sections/details.py +++ b/corehq/apps/app_manager/suite_xml/sections/details.py @@ -496,6 +496,7 @@ def _get_persistent_case_context_detail(module, xml): grid_x=0, grid_y=0, show_border=False, + show_shading=False, ), header=Header(text=Text()), template=Template(text=Text(xpath_function=xml)), @@ -519,6 +520,7 @@ def _get_report_context_tile_detail(): grid_x=0, grid_y=0, show_border=False, + show_shading=False, ), header=Header(text=Text()), template=Template(text=Text(xpath=TextXPath( From 0187c8672afc1910768c745f683718d5788a0ecc Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:25:35 -0500 Subject: [PATCH 6/7] update styling template --- .../cloudcare/templates/formplayer/case_list.html | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/corehq/apps/cloudcare/templates/formplayer/case_list.html b/corehq/apps/cloudcare/templates/formplayer/case_list.html index 000d5d452874..1ef646f61866 100644 --- a/corehq/apps/cloudcare/templates/formplayer/case_list.html +++ b/corehq/apps/cloudcare/templates/formplayer/case_list.html @@ -244,12 +244,11 @@

<%- title %>

grid-area: <%- model.gridStyle %>; font-size: <%- model.fontStyle %>; text-align: <%- model.horizontalAlign %>; - <% if (!model.borderInTile) { %> + <% if (!model.borderInTile && !model.shadingInTile) { %> justify-self: <%- model.horizontalAlign %>; align-self: <%- model.verticalAlign %>; <% } else { %> - <% if (model.showBorder) { %> - border: 1px solid #685c53; + <% if (model.showBorder || model.showShading) { %> border-radius: 8px; padding-top: 5px; padding-bottom: 0px; @@ -257,6 +256,13 @@

<%- title %>

padding-right: 5px; justify-self: stretch; margin: 2px; + <% if (model.showBorder) { %> + border: 1px solid #685c53; + <% } %> + <% if (model.showShading) { %> + background-color: white; + z-index: -1; + <% } %> <% } else { %> margin: 7px; justify-self: <%- model.horizontalAlign %>; From 9c19edaa1eb6019ef80c2356a6a9b29a543bb137 Mon Sep 17 00:00:00 2001 From: robert-costello Date: Thu, 21 Dec 2023 14:28:35 -0500 Subject: [PATCH 7/7] update tests --- corehq/apps/app_manager/tests/test_report_config.py | 2 +- corehq/apps/app_manager/tests/test_suite_case_tiles.py | 2 +- .../apps/app_manager/tests/test_suite_custom_case_tiles.py | 7 ++++--- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/corehq/apps/app_manager/tests/test_report_config.py b/corehq/apps/app_manager/tests/test_report_config.py index 8d6d64fac015..de555a422d43 100644 --- a/corehq/apps/app_manager/tests/test_report_config.py +++ b/corehq/apps/app_manager/tests/test_report_config.py @@ -504,7 +504,7 @@ def test_liveness_fixture(self): -
diff --git a/corehq/apps/app_manager/tests/test_suite_case_tiles.py b/corehq/apps/app_manager/tests/test_suite_case_tiles.py index 206dd390223e..376ebbde6bd6 100644 --- a/corehq/apps/app_manager/tests/test_suite_case_tiles.py +++ b/corehq/apps/app_manager/tests/test_suite_case_tiles.py @@ -368,7 +368,7 @@ def test_persistent_case_name_in_forms(self, *args): -
diff --git a/corehq/apps/app_manager/tests/test_suite_custom_case_tiles.py b/corehq/apps/app_manager/tests/test_suite_custom_case_tiles.py index 93f9629de3cd..3b5df18f3861 100644 --- a/corehq/apps/app_manager/tests/test_suite_custom_case_tiles.py +++ b/corehq/apps/app_manager/tests/test_suite_custom_case_tiles.py @@ -21,7 +21,8 @@ def add_columns_for_case_details(_module, field='a', format='plain', useXpathExp grid_y=1, width=3, height=1, - show_border=False) + show_border=False, + show_shading=False) column.useXpathExpression = useXpathExpression _module.case_details.short.columns = [ column, @@ -47,7 +48,7 @@ def test_custom_case_tile(self, *args): """ -
@@ -94,7 +95,7 @@ def test_custom_case_tile_address(self, *args): """ -