mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-08-01 23:42:17 +02:00
polish JS, alg validation, polish layout
This commit is contained in:
parent
84cc92cb0a
commit
150e37fe42
10 changed files with 134 additions and 96 deletions
|
@ -285,53 +285,47 @@ function handleValidationClick(e) {
|
|||
let newForm = serverForm2[0].cloneNode(true)
|
||||
let formNumberRegex = RegExp(`form-(\\d){1}-`,'g')
|
||||
let formLabelRegex = RegExp(`DS Data record (\\d){1}`, 'g')
|
||||
// let formExampleRegex = RegExp(`ns(\\d){1}`, 'g')
|
||||
|
||||
formNum++
|
||||
newForm.innerHTML = newForm.innerHTML.replace(formNumberRegex, `form-${formNum}-`)
|
||||
newForm.innerHTML = newForm.innerHTML.replace(formLabelRegex, `DS Data Record ${formNum+1}`)
|
||||
// newForm.innerHTML = newForm.innerHTML.replace(formExampleRegex, `ns${formNum+1}`)
|
||||
container.insertBefore(newForm, addButton)
|
||||
|
||||
let inputs = newForm.querySelectorAll("input");
|
||||
// Reset the values of each input to blank
|
||||
inputs.forEach((input) => {
|
||||
input.classList.remove("usa-input--error");
|
||||
if (input.type === "text" || input.type === "number" || input.type === "password") {
|
||||
input.value = ""; // Set the value to an empty string
|
||||
|
||||
} else if (input.type === "checkbox" || input.type === "radio") {
|
||||
input.checked = false; // Uncheck checkboxes and radios
|
||||
}
|
||||
});
|
||||
|
||||
// Reset the values of each input to blank
|
||||
inputs.forEach((input) => {
|
||||
input.classList.remove("usa-input--error");
|
||||
if (input.type === "text" || input.type === "number" || input.type === "password") {
|
||||
input.value = ""; // Set the value to an empty string
|
||||
|
||||
} else if (input.type === "checkbox" || input.type === "radio") {
|
||||
input.checked = false; // Uncheck checkboxes and radios
|
||||
}
|
||||
});
|
||||
let selects = newForm.querySelectorAll("select");
|
||||
selects.forEach((select) => {
|
||||
select.classList.remove("usa-input--error");
|
||||
select.selectedIndex = 0; // Set the value to an empty string
|
||||
});
|
||||
|
||||
let selects = newForm.querySelectorAll("select");
|
||||
let labels = newForm.querySelectorAll("label");
|
||||
labels.forEach((label) => {
|
||||
label.classList.remove("usa-label--error");
|
||||
});
|
||||
|
||||
selects.forEach((select) => {
|
||||
select.classList.remove("usa-input--error");
|
||||
select.selectedIndex = 0; // Set the value to an empty string
|
||||
});
|
||||
let usaFormGroups = newForm.querySelectorAll(".usa-form-group");
|
||||
usaFormGroups.forEach((usaFormGroup) => {
|
||||
usaFormGroup.classList.remove("usa-form-group--error");
|
||||
});
|
||||
|
||||
|
||||
let labels = newForm.querySelectorAll("label");
|
||||
labels.forEach((label) => {
|
||||
label.classList.remove("usa-label--error");
|
||||
});
|
||||
|
||||
|
||||
let usaFormGroups = newForm.querySelectorAll(".usa-form-group");
|
||||
usaFormGroups.forEach((usaFormGroup) => {
|
||||
usaFormGroup.classList.remove("usa-form-group--error");
|
||||
});
|
||||
|
||||
let usaErrorMessages = newForm.querySelectorAll(".usa-error-message");
|
||||
usaErrorMessages.forEach((usaErrorMessage) => {
|
||||
let parentDiv = usaErrorMessage.closest('div');
|
||||
if (parentDiv) {
|
||||
parentDiv.remove(); // Remove the parent div if it exists
|
||||
}
|
||||
});
|
||||
let usaErrorMessages = newForm.querySelectorAll(".usa-error-message");
|
||||
usaErrorMessages.forEach((usaErrorMessage) => {
|
||||
let parentDiv = usaErrorMessage.closest('div');
|
||||
if (parentDiv) {
|
||||
parentDiv.remove(); // Remove the parent div if it exists
|
||||
}
|
||||
});
|
||||
|
||||
totalForms.setAttribute('value', `${formNum+1}`)
|
||||
}
|
||||
|
|
|
@ -22,6 +22,27 @@ a.breadcrumb__back {
|
|||
}
|
||||
}
|
||||
|
||||
a.usa-button {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a.usa-button--outline,
|
||||
a.usa-button--outline:visited {
|
||||
box-shadow: inset 0 0 0 2px color('primary');
|
||||
color: color('primary');
|
||||
}
|
||||
|
||||
a.usa-button--outline:hover,
|
||||
a.usa-button--outline:focus {
|
||||
box-shadow: inset 0 0 0 2px color('primary-dark');
|
||||
color: color('primary-dark');
|
||||
}
|
||||
|
||||
a.usa-button--outline:active {
|
||||
box-shadow: inset 0 0 0 2px color('primary-darker');
|
||||
color: color('primary-darker');
|
||||
}
|
||||
|
||||
a.withdraw {
|
||||
background-color: color('error');
|
||||
}
|
||||
|
@ -60,14 +81,14 @@ a.usa-button--unstyled:visited {
|
|||
color: color('primary');
|
||||
}
|
||||
|
||||
.dotgov-button--green {
|
||||
background-color: color('success-dark');
|
||||
|
||||
&:hover {
|
||||
background-color: color('success-darker');
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: color('green-80v');
|
||||
}
|
||||
}
|
||||
.dotgov-button--green {
|
||||
background-color: color('success-dark');
|
||||
|
||||
&:hover {
|
||||
background-color: color('success-darker');
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: color('green-80v');
|
||||
}
|
||||
}
|
|
@ -5,7 +5,6 @@ fieldset {
|
|||
padding: units(3);
|
||||
}
|
||||
|
||||
fieldset legend {
|
||||
font-weight: font-weight('bold');
|
||||
color: color('primary')
|
||||
fieldset:not(:first-child) {
|
||||
margin-top: units(2);
|
||||
}
|
|
@ -12,4 +12,10 @@
|
|||
@include at-media('tablet') {
|
||||
height: units('mobile');
|
||||
}
|
||||
}
|
||||
|
||||
.usa-form-group--unstyled-error {
|
||||
margin-left: 0;
|
||||
padding-left: 0;
|
||||
border-left: none;
|
||||
}
|
|
@ -1,10 +1,19 @@
|
|||
# common.py
|
||||
# Q: What are the options?
|
||||
# reference: https://www.iana.org/assignments/dns-sec-alg-numbers/dns-sec-alg-numbers.xhtml
|
||||
ALGORITHM_CHOICES = [
|
||||
(1, "ERSA/MD5 [RSAMD5]"),
|
||||
(2 , "Diffie-Hellman [DH]"),
|
||||
(3 ,"DSA/SHA-1 [DSA]"),
|
||||
(5 ,"RSA/SHA-1 [RSASHA1]"),
|
||||
(6 ,"DSA-NSEC3-SHA1"),
|
||||
(7 ,"RSASHA1-NSEC3-SHA1"),
|
||||
(8 ,"RSA/SHA-256 [RSASHA256]"),
|
||||
(10 ,"RSA/SHA-512 [RSASHA512]"),
|
||||
(12 ,"GOST R 34.10-2001 [ECC-GOST]"),
|
||||
(13 ,"ECDSA Curve P-256 with SHA-256 [ECDSAP256SHA256]"),
|
||||
(14 ,"ECDSA Curve P-384 with SHA-384 [ECDSAP384SHA384]"),
|
||||
(15 ,"Ed25519"),
|
||||
(16 ,"Ed448"),
|
||||
]
|
||||
# Q: What are the options?
|
||||
DIGEST_TYPE_CHOICES = [
|
||||
|
|
|
@ -179,14 +179,15 @@ class DomainDsdataForm(forms.Form):
|
|||
# Q: Is ChoiceFiled right? Or do we need to data types other than strings
|
||||
# (TypedChoiceField)
|
||||
digest_type = forms.TypedChoiceField(
|
||||
required=True,
|
||||
label="Digest Type",
|
||||
choices=[(None, "--Select--")] + DIGEST_TYPE_CHOICES,
|
||||
# Q: Is this even needed or is a required=True sufficient?
|
||||
error_messages={
|
||||
"required": (
|
||||
"You must select a Digest Type"
|
||||
)
|
||||
},
|
||||
# error_messages={
|
||||
# "required": (
|
||||
# "You must select a Digest Type"
|
||||
# )
|
||||
# },
|
||||
)
|
||||
digest = forms.CharField(
|
||||
required=True,
|
||||
|
@ -199,10 +200,10 @@ class DomainDsdataForm(forms.Form):
|
|||
# ],
|
||||
)
|
||||
|
||||
delete = forms.BooleanField(
|
||||
required=False,
|
||||
label="Delete",
|
||||
)
|
||||
# delete = forms.BooleanField(
|
||||
# required=False,
|
||||
# label="Delete",
|
||||
# )
|
||||
|
||||
# TODO: Conditional DS Key Data fields
|
||||
|
||||
|
@ -249,10 +250,10 @@ class DomainKeydataForm(forms.Form):
|
|||
label="Pub key",
|
||||
)
|
||||
|
||||
delete = forms.BooleanField(
|
||||
required=False,
|
||||
label="Delete",
|
||||
)
|
||||
# delete = forms.BooleanField(
|
||||
# required=False,
|
||||
# label="Delete",
|
||||
# )
|
||||
|
||||
# TODO: Conditional DS Key Data fields
|
||||
|
||||
|
|
|
@ -30,7 +30,7 @@
|
|||
<a href="{% url 'domain-dns-dnssec-keydata' pk=domain.id %}" class="usa-button usa-button--outline">Add Key Data</a>
|
||||
<button
|
||||
type="submit"
|
||||
class="usa-button"
|
||||
class="usa-button usa-button--unstyled"
|
||||
name="cancel"
|
||||
>Cancel</button>
|
||||
</p>
|
||||
|
|
|
@ -27,6 +27,8 @@
|
|||
>Add DS Data record</button>
|
||||
</form>
|
||||
{% else %}
|
||||
|
||||
<p>Enter the values given by your DNS provider for DS Data.</p>
|
||||
{% include "includes/required_fields.html" %}
|
||||
|
||||
<form class="usa-form usa-form--extra-large" method="post" novalidate id="form-container">
|
||||
|
@ -36,21 +38,23 @@
|
|||
{% for form in formset %}
|
||||
<fieldset class="ds-record">
|
||||
|
||||
<legend>DS Data record {{forloop.counter}}</legend>
|
||||
<legend class="sr-only">DS Data record {{forloop.counter}}</legend>
|
||||
|
||||
<h2 class="margin-top-0">DS Data record {{forloop.counter}}</h2>
|
||||
|
||||
<div class="grid-row grid-gap-2 flex-end">
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.key_tag %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.algorithm %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.digest_type %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
@ -58,7 +62,7 @@
|
|||
|
||||
<div class="grid-row">
|
||||
<div class="grid-col">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.digest %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
@ -66,9 +70,9 @@
|
|||
|
||||
<div class="grid-row margin-top-2">
|
||||
<div class="grid-col">
|
||||
{% with add_group_class="float-right-tablet" %}
|
||||
{% comment %} {% with add_group_class="float-right-tablet" %}
|
||||
{% input_with_errors form.delete %}
|
||||
{% endwith %}
|
||||
{% endwith %} {% endcomment %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -27,6 +27,8 @@
|
|||
>Add DS Key record</button>
|
||||
</form>
|
||||
{% else %}
|
||||
|
||||
<p>Enter the values given by your DNS provider for DS Key Data.</p>
|
||||
{% include "includes/required_fields.html" %}
|
||||
|
||||
<form class="usa-form usa-form--extra-large" method="post" novalidate id="form-container">
|
||||
|
@ -34,23 +36,25 @@
|
|||
{{ formset.management_form }}
|
||||
|
||||
{% for form in formset %}
|
||||
<fieldset class="key-record">
|
||||
<fieldset class="ds-record">
|
||||
|
||||
<legend>Key Data record {{forloop.counter}}</legend>
|
||||
<legend class="sr-only">Key Data record {{forloop.counter}}</legend>
|
||||
|
||||
<h2 class="margin-top-0">DS Data record {{forloop.counter}}</h2>
|
||||
|
||||
<div class="grid-row grid-gap-2 flex-end">
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.flag %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.protocol %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
<div class="tablet:grid-col-4">
|
||||
{% with attr_required=True %}
|
||||
{% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% input_with_errors form.algorithm %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
@ -59,16 +63,16 @@
|
|||
<div class="grid-row">
|
||||
<div class="grid-col">
|
||||
{% with attr_required=True %}
|
||||
{% input_with_errors form.pub_key %}
|
||||
{% input_with_errors form.pub_key add_group_class="usa-form-group--unstyled-error" %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid-row margin-top-2">
|
||||
<div class="grid-col">
|
||||
{% with add_group_class="float-right-tablet" %}
|
||||
{% comment %} {% with add_group_class="float-right-tablet" %}
|
||||
{% input_with_errors form.delete %}
|
||||
{% endwith %}
|
||||
{% endwith %} {% endcomment %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -336,14 +336,14 @@ class DomainDsdataView(DomainPermissionView, FormMixin):
|
|||
|
||||
for form in formset:
|
||||
try:
|
||||
if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
|
||||
dsrecord = {
|
||||
"keyTag": form.cleaned_data["key_tag"],
|
||||
"alg": form.cleaned_data["algorithm"],
|
||||
"digestType": form.cleaned_data["digest_type"],
|
||||
"digest": form.cleaned_data["digest"],
|
||||
}
|
||||
dnssecdata["dsData"].append(common.DSData(**dsrecord))
|
||||
# if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
|
||||
dsrecord = {
|
||||
"keyTag": form.cleaned_data["key_tag"],
|
||||
"alg": form.cleaned_data["algorithm"],
|
||||
"digestType": form.cleaned_data["digest_type"],
|
||||
"digest": form.cleaned_data["digest"],
|
||||
}
|
||||
dnssecdata["dsData"].append(common.DSData(**dsrecord))
|
||||
except KeyError:
|
||||
# no server information in this field, skip it
|
||||
pass
|
||||
|
@ -428,14 +428,14 @@ class DomainKeydataView(DomainPermissionView, FormMixin):
|
|||
|
||||
for form in formset:
|
||||
try:
|
||||
if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
|
||||
keyrecord = {
|
||||
"flags": form.cleaned_data["flag"],
|
||||
"protocol": form.cleaned_data["protocol"],
|
||||
"alg": form.cleaned_data["algorithm"],
|
||||
"pubKey": form.cleaned_data["pub_key"],
|
||||
}
|
||||
dnssecdata["keyData"].append(common.DNSSECKeyData(**keyrecord))
|
||||
# if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
|
||||
keyrecord = {
|
||||
"flags": form.cleaned_data["flag"],
|
||||
"protocol": form.cleaned_data["protocol"],
|
||||
"alg": form.cleaned_data["algorithm"],
|
||||
"pubKey": form.cleaned_data["pub_key"],
|
||||
}
|
||||
dnssecdata["keyData"].append(common.DNSSECKeyData(**keyrecord))
|
||||
except KeyError:
|
||||
# no server information in this field, skip it
|
||||
pass
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue