From 650781c759963421878459829aaf7770ab96f6b1 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 8 Aug 2018 14:40:17 -0400 Subject: [PATCH 001/139] add data for field pipe and keepCharPositions --- js/components/text_input.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/js/components/text_input.js b/js/components/text_input.js index e027a800..ecfa3d75 100644 --- a/js/components/text_input.js +++ b/js/components/text_input.js @@ -25,6 +25,8 @@ export default { showError: false, showValid: false, mask: inputValidations[this.validation].mask, + pipe: inputValidations[this.validation].pipe || undefined, + keepCharPositions: inputValidations[this.validation].keepCharPositions || false, renderedValue: this.value } }, From 1c4c49da6257ab5d3f69d90f157be6a35cba8b34 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 8 Aug 2018 14:40:33 -0400 Subject: [PATCH 002/139] Add new input validation sets --- js/lib/input_validations.js | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/js/lib/input_validations.js b/js/lib/input_validations.js index 6e7a066d..db21eec9 100644 --- a/js/lib/input_validations.js +++ b/js/lib/input_validations.js @@ -1,5 +1,6 @@ import createNumberMask from 'text-mask-addons/dist/createNumberMask' import emailMask from 'text-mask-addons/dist/emailMask' +import createAutoCorrectedDatePipe from 'text-mask-addons/dist/createAutoCorrectedDatePipe' export default { anything: { @@ -7,14 +8,31 @@ export default { match: /^(?!\s*$).+/, unmask: [], }, + integer: { + mask: createNumberMask({ prefix: '', allowDecimal: false }), + match: /^[1-9]\d*$/, + unmask: [] + }, dollars: { mask: createNumberMask({ prefix: '$', allowDecimal: true }), match: /^-?\d+\.?\d*$/, unmask: ['$',','] }, + gigabytes: { + mask: createNumberMask({ prefix: '', suffix:'GB', allowDecimal: false }), + match: /^[1-9]\d*$/, + unmask: ['GB'] + }, email: { mask: emailMask, match: /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/, unmask: [], + }, + date: { + mask: [/\d/,/\d/,'/',/\d/,/\d/,'/',/\d/,/\d/,/\d/,/\d/], + match: /(0[1-9]|1[012])[- \/.](0[1-9]|[12][0-9]|3[01])[- \/.](19|20)\d\d/, + unmask: [], + pipe: createAutoCorrectedDatePipe('mm/dd/yyyy HH:MM'), + keepCharPositions: true } } From c80490f7177fcdd8ba9152a56e65d75cbca8f154 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 8 Aug 2018 14:40:58 -0400 Subject: [PATCH 003/139] Vue-ify text-input macro --- templates/components/text_input.html | 73 +++++++++++++++++++++------- 1 file changed, 55 insertions(+), 18 deletions(-) diff --git a/templates/components/text_input.html b/templates/components/text_input.html index 0f50ca89..b620cf35 100644 --- a/templates/components/text_input.html +++ b/templates/components/text_input.html @@ -1,23 +1,60 @@ -{% macro TextInput(field, placeholder='') -%} -
-
+ {%- endmacro %} From 22266959d669375b279ab24afe90ec8e6ff00904 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 8 Aug 2018 14:50:08 -0400 Subject: [PATCH 004/139] Add input validations and some placeholder changes to request form page 1 --- templates/requests/screen-1.html | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/templates/requests/screen-1.html b/templates/requests/screen-1.html index 7dbfb367..43266b04 100644 --- a/templates/requests/screen-1.html +++ b/templates/requests/screen-1.html @@ -22,27 +22,27 @@

All fields are required, unless specified optional.

General

-{{ TextInput(f.dod_component) }} -{{ TextInput(f.jedi_usage,placeholder="e.g. We are migrating XYZ application to the cloud so that...") }} +{{ OptionsInput(f.dod_component) }} +{{ TextInput(f.jedi_usage, paragraph=True, placeholder="e.g. We are migrating XYZ application to the cloud so that...") }}

Cloud Readiness

-{{ TextInput(f.num_software_systems,placeholder="Number of systems") }} +{{ TextInput(f.num_software_systems, validation='integer') }} {{ OptionsInput(f.jedi_migration) }} {{ OptionsInput(f.rationalization_software_systems) }} {{ OptionsInput(f.technical_support_team) }} {{ OptionsInput(f.organization_providing_assistance) }} {{ OptionsInput(f.engineering_assessment) }} -{{ TextInput(f.data_transfers) }} -{{ TextInput(f.expected_completion_date) }} +{{ OptionsInput(f.data_transfers) }} +{{ TextInput(f.expected_completion_date, validation='date', placeholder='MM / DD / YYYY') }} {{ OptionsInput(f.cloud_native) }}

Financial Usage

-{{ TextInput(f.estimated_monthly_spend) }} +{{ TextInput(f.estimated_monthly_spend, validation='dollars') }}

So this means you are spending approximately $X annually

-{{ TextInput(f.dollar_value) }} -{{ TextInput(f.number_user_sessions) }} -{{ TextInput(f.average_daily_traffic) }} -{{ TextInput(f.start_date) }} +{{ TextInput(f.dollar_value, validation='dollars') }} +{{ TextInput(f.number_user_sessions, validation='integer') }} +{{ TextInput(f.average_daily_traffic, placeholder='Gigabytes per day', validation='gigabytes') }} +{{ TextInput(f.start_date, validation='date', placeholder='MM / DD / YYYY') }} {% endblock %} From 034c1471540be2dcafed70ef5b7b650947be78db Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 9 Aug 2018 13:44:30 -0400 Subject: [PATCH 005/139] remove commas from unmasked integer values --- js/lib/input_validations.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/lib/input_validations.js b/js/lib/input_validations.js index db21eec9..68f3b2a8 100644 --- a/js/lib/input_validations.js +++ b/js/lib/input_validations.js @@ -11,7 +11,7 @@ export default { integer: { mask: createNumberMask({ prefix: '', allowDecimal: false }), match: /^[1-9]\d*$/, - unmask: [] + unmask: [','] }, dollars: { mask: createNumberMask({ prefix: '$', allowDecimal: true }), @@ -21,7 +21,7 @@ export default { gigabytes: { mask: createNumberMask({ prefix: '', suffix:'GB', allowDecimal: false }), match: /^[1-9]\d*$/, - unmask: ['GB'] + unmask: [',','GB'] }, email: { mask: emailMask, From c2851c2e8674361a3a7129674814f6c58e4bdd4e Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 9 Aug 2018 13:46:04 -0400 Subject: [PATCH 006/139] Among other things, make sure theres a name on the inputs so the forms can submit --- templates/components/text_input.html | 26 ++++++++++++++++---------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/templates/components/text_input.html b/templates/components/text_input.html index b620cf35..b4c990a9 100644 --- a/templates/components/text_input.html +++ b/templates/components/text_input.html @@ -1,14 +1,18 @@ {% from "components/icon.html" import Icon %} {% macro TextInput(field, placeholder='', validation='anything', paragraph=False) -%} - + +
+ v-bind:class="['usa-input usa-input--validation--' + validation, { 'usa-input--error': showError, 'usa-input--success': showValid }]" + class='usa-input {% if field.errors %}usa-input--error{% endif %}'>
+
Tooltips
+ {{ Icon('help') }}top
+ {{ Icon('help') }}top-start
+ {{ Icon('help') }}right
+ {{ Icon('help') }}bottom
From fcbb16afc6c5eee52c3be9aa69f2af9df21a07d8 Mon Sep 17 00:00:00 2001 From: luis cielak Date: Thu, 9 Aug 2018 13:51:02 -0400 Subject: [PATCH 009/139] Organize styleguide --- templates/styleguide.html | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/templates/styleguide.html b/templates/styleguide.html index 753e2d94..f5b32657 100644 --- a/templates/styleguide.html +++ b/templates/styleguide.html @@ -128,12 +128,6 @@
col 12
-
Tooltips
- {{ Icon('help') }}top
- {{ Icon('help') }}top-start
- {{ Icon('help') }}right
- {{ Icon('help') }}bottom
-
@@ -288,6 +282,14 @@
+ +
+
Tooltips
+ {{ Icon('help') }}top
+ {{ Icon('help') }}top-start
+ {{ Icon('help') }}right
+ {{ Icon('help') }}bottom
+ From 30a84c3ac6075e116015047882abaf9747143e39 Mon Sep 17 00:00:00 2001 From: luis cielak Date: Thu, 9 Aug 2018 14:06:29 -0400 Subject: [PATCH 010/139] Make tooltip module and update example --- templates/components/tooltip.html | 9 +++++++++ templates/styleguide.html | 6 ++++-- 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/templates/components/tooltip.html b/templates/components/tooltip.html index e69de29b..465d57e4 100644 --- a/templates/components/tooltip.html +++ b/templates/components/tooltip.html @@ -0,0 +1,9 @@ +{% from "components/icon.html" import Icon %} + +{% macro Tooltip(message) -%} + + + {{ Icon('help') }} + + +{%- endmacro %} diff --git a/templates/styleguide.html b/templates/styleguide.html index f5b32657..80d72fae 100644 --- a/templates/styleguide.html +++ b/templates/styleguide.html @@ -3,6 +3,7 @@ {% from "components/icon.html" import Icon %} {% from "components/modal.html" import Modal %} {% from "components/alert.html" import Alert %} +{% from "components/tooltip.html" import Tooltip %} {% block content %} @@ -283,13 +284,14 @@ -
Tooltips
- {{ Icon('help') }}top
+ {{ Tooltip('this is a tooltip text') }}example
{{ Icon('help') }}top-start
{{ Icon('help') }}right
{{ Icon('help') }}bottom
+ + From 1b2e091a694592f93d8df94e0a74a67a1b5de6f9 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 9 Aug 2018 14:26:45 -0400 Subject: [PATCH 011/139] get rid of duplicate class declaration --- templates/components/text_input.html | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/templates/components/text_input.html b/templates/components/text_input.html index 189504ed..4c52a634 100644 --- a/templates/components/text_input.html +++ b/templates/components/text_input.html @@ -8,8 +8,7 @@ inline-template>
+ v-bind:class="['usa-input {% if field.errors %}usa-input--error{% endif %} usa-input--validation--' + validation, { 'usa-input--error': showError, 'usa-input--success': showValid }]">