From b168f42a9cae7c0dc3856c16a2ca00e41b62ec4c Mon Sep 17 00:00:00 2001 From: robert-costello Date: Mon, 4 Dec 2023 16:03:50 -0500 Subject: [PATCH 1/6] add consts --- corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js index 42f2d18fb956..bc8a575bb36b 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js @@ -39,6 +39,8 @@ hqDefine("cloudcare/js/form_entry/const", function () { TEXT_ALIGN_CENTER: 'text-align-center', TEXT_ALIGN_RIGHT: 'text-align-right', BUTTON_SELECT: 'button-select', + SHORT_WIDTH: 'short', + MEDIUM_WIDTH: 'medium', // Note it's important to differentiate these two NO_PENDING_ANSWER: undefined, From 6922c059265a33f8116aef42c64a7055f4c6e58e Mon Sep 17 00:00:00 2001 From: robert-costello Date: Mon, 4 Dec 2023 16:07:22 -0500 Subject: [PATCH 2/6] set entry width --- .../static/cloudcare/js/form_entry/form_ui.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js index a211b8cebc62..7cc12c4708b0 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js @@ -861,9 +861,11 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { }; Question.prototype.setWidths = function () { + const self = this; const columnWidth = Question.calculateColumnWidthForPerRowStyle(this.style); const perRowPattern = new RegExp(`\\d+${constants.PER_ROW}(\\s|$)`); + setCustomInputWidth(); if (this.stylesContains(perRowPattern)) { this.controlWidth = constants.FULL_WIDTH; this.labelWidth = constants.FULL_WIDTH; @@ -873,6 +875,21 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { this.labelWidth = constants.LABEL_WIDTH; this.questionTileWidth = constants.FULL_WIDTH; } + + function setCustomInputWidth() { + const shortWidth = new RegExp(constants.SHORT_WIDTH); + const mediumWidth = new RegExp(constants.MEDIUM_WIDTH); + $(document).ready(function() { + const entryWidgetContainer = $(`#${self.entry.entryId}`).closest('.widget-container'); + if (self.stylesContains(shortWidth)) { + entryWidgetContainer.removeClass(constants.CONTROL_WIDTH) + entryWidgetContainer.addClass('col-sm-2'); + } else if (self.stylesContains(mediumWidth)) { + entryWidgetContainer.removeClass(constants.CONTROL_WIDTH) + entryWidgetContainer.addClass('col-sm-4'); + } + }); + } }; /** From f55836b774e590829cce01db3278f6683ff39c5e Mon Sep 17 00:00:00 2001 From: robert-costello Date: Mon, 4 Dec 2023 16:34:42 -0500 Subject: [PATCH 3/6] lint --- .../cloudcare/static/cloudcare/js/form_entry/form_ui.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js index 7cc12c4708b0..54ca0be2e4c4 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js @@ -879,13 +879,13 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { function setCustomInputWidth() { const shortWidth = new RegExp(constants.SHORT_WIDTH); const mediumWidth = new RegExp(constants.MEDIUM_WIDTH); - $(document).ready(function() { + $(document).ready(function () { const entryWidgetContainer = $(`#${self.entry.entryId}`).closest('.widget-container'); if (self.stylesContains(shortWidth)) { - entryWidgetContainer.removeClass(constants.CONTROL_WIDTH) + entryWidgetContainer.removeClass(constants.CONTROL_WIDTH); entryWidgetContainer.addClass('col-sm-2'); } else if (self.stylesContains(mediumWidth)) { - entryWidgetContainer.removeClass(constants.CONTROL_WIDTH) + entryWidgetContainer.removeClass(constants.CONTROL_WIDTH); entryWidgetContainer.addClass('col-sm-4'); } }); From a2abb01f7181ad10134add1aa1428f286c71bdfa Mon Sep 17 00:00:00 2001 From: robert-costello Date: Tue, 5 Dec 2023 11:13:15 -0500 Subject: [PATCH 4/6] use controlWidth --- .../static/cloudcare/js/form_entry/form_ui.js | 20 ++++++------------- 1 file changed, 6 insertions(+), 14 deletions(-) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js index 54ca0be2e4c4..66d5526a7d72 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js @@ -864,8 +864,9 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { const self = this; const columnWidth = Question.calculateColumnWidthForPerRowStyle(this.style); const perRowPattern = new RegExp(`\\d+${constants.PER_ROW}(\\s|$)`); + const shortWidth = new RegExp(constants.SHORT_WIDTH); + const mediumWidth = new RegExp(constants.MEDIUM_WIDTH); - setCustomInputWidth(); if (this.stylesContains(perRowPattern)) { this.controlWidth = constants.FULL_WIDTH; this.labelWidth = constants.FULL_WIDTH; @@ -876,19 +877,10 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { this.questionTileWidth = constants.FULL_WIDTH; } - function setCustomInputWidth() { - const shortWidth = new RegExp(constants.SHORT_WIDTH); - const mediumWidth = new RegExp(constants.MEDIUM_WIDTH); - $(document).ready(function () { - const entryWidgetContainer = $(`#${self.entry.entryId}`).closest('.widget-container'); - if (self.stylesContains(shortWidth)) { - entryWidgetContainer.removeClass(constants.CONTROL_WIDTH); - entryWidgetContainer.addClass('col-sm-2'); - } else if (self.stylesContains(mediumWidth)) { - entryWidgetContainer.removeClass(constants.CONTROL_WIDTH); - entryWidgetContainer.addClass('col-sm-4'); - } - }); + if (self.stylesContains(shortWidth)) { + self.controlWidth = 'col-sm-2'; + } else if (self.stylesContains(mediumWidth)) { + self.controlWidth = 'col-sm-4'; } }; From 3be486d24b5536b7e3223e9414d605cdc530ff98 Mon Sep 17 00:00:00 2001 From: robert-costello Date: Tue, 5 Dec 2023 13:24:52 -0500 Subject: [PATCH 5/6] remove regex --- .../cloudcare/static/cloudcare/js/form_entry/form_ui.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js index 66d5526a7d72..f4fd4e20e85c 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js @@ -864,8 +864,6 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { const self = this; const columnWidth = Question.calculateColumnWidthForPerRowStyle(this.style); const perRowPattern = new RegExp(`\\d+${constants.PER_ROW}(\\s|$)`); - const shortWidth = new RegExp(constants.SHORT_WIDTH); - const mediumWidth = new RegExp(constants.MEDIUM_WIDTH); if (this.stylesContains(perRowPattern)) { this.controlWidth = constants.FULL_WIDTH; @@ -877,9 +875,9 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { this.questionTileWidth = constants.FULL_WIDTH; } - if (self.stylesContains(shortWidth)) { + if (self.stylesContains(constants.SHORT_WIDTH)) { self.controlWidth = 'col-sm-2'; - } else if (self.stylesContains(mediumWidth)) { + } else if (self.stylesContains(constants.MEDIUM_WIDTH)) { self.controlWidth = 'col-sm-4'; } }; From 15e3777b53e3a091a9fcc9f140c36329670720c7 Mon Sep 17 00:00:00 2001 From: robert-costello Date: Tue, 5 Dec 2023 13:35:34 -0500 Subject: [PATCH 6/6] update constants --- .../cloudcare/static/cloudcare/js/form_entry/const.js | 6 ++++-- .../cloudcare/static/cloudcare/js/form_entry/form_ui.js | 8 ++++---- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js index bc8a575bb36b..186168c11b2d 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/const.js @@ -39,8 +39,8 @@ hqDefine("cloudcare/js/form_entry/const", function () { TEXT_ALIGN_CENTER: 'text-align-center', TEXT_ALIGN_RIGHT: 'text-align-right', BUTTON_SELECT: 'button-select', - SHORT_WIDTH: 'short', - MEDIUM_WIDTH: 'medium', + SHORT: 'short', + MEDIUM: 'medium', // Note it's important to differentiate these two NO_PENDING_ANSWER: undefined, @@ -54,6 +54,8 @@ hqDefine("cloudcare/js/form_entry/const", function () { BLOCK_SUBMIT: 'block-submit', BLOCK_ALL: 'block-all', FULL_WIDTH: 'col-sm-12', + SHORT_WIDTH: 'col-sm-2', + MEDIUM_WIDTH: 'col-sm-4', // XForm Navigation QUESTIONS_FOR_INDEX: 'questions_for_index', diff --git a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js index f4fd4e20e85c..f78efd66c5a5 100644 --- a/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js +++ b/corehq/apps/cloudcare/static/cloudcare/js/form_entry/form_ui.js @@ -875,10 +875,10 @@ hqDefine("cloudcare/js/form_entry/form_ui", function () { this.questionTileWidth = constants.FULL_WIDTH; } - if (self.stylesContains(constants.SHORT_WIDTH)) { - self.controlWidth = 'col-sm-2'; - } else if (self.stylesContains(constants.MEDIUM_WIDTH)) { - self.controlWidth = 'col-sm-4'; + if (self.stylesContains(constants.SHORT)) { + self.controlWidth = constants.SHORT_WIDTH; + } else if (self.stylesContains(constants.MEDIUM)) { + self.controlWidth = constants.MEDIUM_WIDTH; } };