Skip to content

Commit

Permalink
Test consolidating scripts
Browse files Browse the repository at this point in the history
  • Loading branch information
@zandercymatics
zandercymatics committed Apr 17, 2024
1 parent d977cc3 commit 9490b60
Show file tree
Hide file tree
Showing 4 changed files with 106 additions and 159 deletions.
59 changes: 0 additions & 59 deletions _includes/domain-search.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,65 +5,6 @@
IF YOU NEED TO MAKE AN UPDATE TO THE SCRIPT HERE, ALSO UPDATE THE `info-page.html` FILE
{% endcomment %}

<script>
function checkDomainAvailability() {
// Cancel the default action
event.preventDefault();

const baseUrl = "https://manage.get.gov/api/v1/available/?domain="

var requested_domain = document.getElementById('domain-input').value

if (requested_domain === null || requested_domain.length === 0) {
render_result(``)
}

var searchEndpoint = new URL("", baseUrl + requested_domain);

fetch(searchEndpoint).then(function(reply) {
return reply.json()
}).then(function(response) {
var requested_domain_display_string = requested_domain
if (!requested_domain_display_string.endsWith('.gov')) {
requested_domain_display_string += '.gov'
}
if (response.available) {
render_result(`
<div class="usa-alert usa-alert--success usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain is available!
<a class="usa-link" href="{{ '/domains/before/' | url }}">
Read about next steps to take before requesting your .gov domain.
</a>
</p>
</div>
</div>
`
)
} else {
render_result(`
<div class="usa-alert usa-alert--error usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
${response.message}
</p>
</div>
</div>
`
)
}
}).catch(function(err) {
console.log('parsing failed', err);
})
}

function render_result(content, append = true){
document.getElementById('usa-search--domain_message').innerHTML = (append == true) ? content : `<div></div>`;
}

</script>

<section class="usa-section domain-section padding-bottom-5 bg-accent-cool-lighter">
<div class="grid-container">
<div class="domain-section__image">
Expand Down
100 changes: 0 additions & 100 deletions _includes/layouts/info-page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,106 +6,6 @@
This template is for longer information pages
{% endcomment %}


{% comment %}
Insert custom scripts for all info-pages here.
There is a CSRF issue with scripts directly, so that needs to be fixed
before we can embed this in a js file.

IF YOU NEED TO MAKE AN UPDATE HERE, ALSO UPDATE THE `domain-search.html` FILE
{% endcomment %}
<script>
function checkDomainAvailability() {
// Cancel the default action
event.preventDefault();

const baseUrl = "https://manage.get.gov/api/v1/available/?domain="

var requested_domain = document.getElementById('domain-input').value

if (requested_domain === null || requested_domain.length === 0) {
render_result(``)
}

var searchEndpoint = new URL("", baseUrl + requested_domain);

errorMessage = document.getElementById("grid-row--domain_message-choosing");
if (errorMessage) {
// Check if the 'display-none' class is not already present
if (!errorMessage.classList.contains("display-none")) {
errorMessage.classList.add("display-none");
}
}

fetch(searchEndpoint).then(function(reply) {
return reply.json()
}).then(function(response) {
var requested_domain_display_string = requested_domain
if (!requested_domain_display_string.endsWith('.gov')) {
requested_domain_display_string += '.gov'
}
if (response.available) {
render_result(`
<div class="usa-alert usa-alert--success usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain is available!
<div class="display-inline"></div>
<strong>We’ll try to give you the domain you want, but it's not guaranteed.</strong>
<a class="usa-link" href="{{ '/domains/before/' | url }}">
Read about next steps to take before requesting your .gov domain.
</a>
</p>
</div>
</div>
`
)
}
else if (response.message.includes("That domain isn’t available.")) {
render_result(`
<div class="usa-alert usa-alert--error usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain isn’t available.
</p>
</div>
</div>
`
)
/* TODO: Ticket #267
<a class="usa-link" href="{{ '/domains/whois/' | url }}?domain=${requested_domain_display_string}">
Learn about this domain.
</a>
*/
}
else {
render_result(`
<div class="usa-alert usa-alert--error usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
${response.message}
</p>
</div>
</div>
`
)
}

// show the error
if (errorMessage) {
errorMessage.classList.remove("display-none");
}

}).catch(function(err) {
console.log('parsing failed', err);
})
}

function render_result(content, append = true){
document.getElementById('usa-search--domain_message').innerHTML = (append == true) ? content : `<div></div>`;
}
</script>

<div class="usa-layout-docs" >
<div class="grid-container margin-top-5">
<div class="grid-row grid-gap">
Expand Down
1 change: 1 addition & 0 deletions _includes/layouts/scripts.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<script src="js/get-gov-home.js" defer></script>
105 changes: 105 additions & 0 deletions js/get-gov-home.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,105 @@
function checkDomainAvailability(alertId="usa-search--domain_message", isDomainChoosing=false) {

// Cancel the default action
event.preventDefault();

const baseUrl = "https://manage.get.gov/api/v1/available/?domain="

let requested_domain = document.getElementById('domain-input').value

if (requested_domain === null || requested_domain.length === 0) {
render_result(``)
}

let searchEndpoint = new URL("", baseUrl + requested_domain);
fetch(searchEndpoint).then(function(reply) {
return reply.json()
}).then(function(response) {
let requested_domain_display_string = requested_domain
if (!requested_domain_display_string.endsWith('.gov')) {
requested_domain_display_string += '.gov'
}

let successMessage = `
<div class="usa-alert usa-alert--success usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain is available!
<a class="usa-link" href="{{ '/domains/before/' | url }}">
Read about next steps to take before requesting your .gov domain.
</a>
</p>
</div>
</div>
`

let errorMessage = null
if (isDomainChoosing) {
errorMessage = document.getElementById("grid-row--domain_message-choosing");
if (errorMessage) {
// Check if the 'display-none' class is not already present
if (!errorMessage.classList.contains("display-none")) {
errorMessage.classList.add("display-none");
}
}

successMessage = `
<div class="usa-alert usa-alert--success usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain is available!
<div class="display-inline"></div>
<strong>We’ll try to give you the domain you want, but it's not guaranteed.</strong>
<a class="usa-link" href="{{ '/domains/before/' | url }}">
Read about next steps to take before requesting your .gov domain.
</a>
</p>
</div>
</div>
`
}

let failMessage = `
<div class="usa-alert usa-alert--error usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
${response.message}
</p>
</div>
</div>
`

if (response.available) {
render_result(alertId, successMessage)
} else if (isDomainChoosing && response.message.includes("That domain isn’t available.")){
let unavailableMessage = `
<div class="usa-alert usa-alert--error usa-alert--slim" role="alert">
<div class="usa-alert__body">
<p class="usa-alert__text">
That domain isn’t available.
</p>
</div>
</div>
`
render_result(alertId, unavailableMessage)
/* TODO: Ticket #267
<a class="usa-link" href="{{ '/domains/whois/' | url }}?domain=${requested_domain_display_string}">
Learn about this domain.
</a>
*/
}
else {
render_result(alertId, failMessage)
}

if (isDomainChoosing && errorMessage) {
errorMessage.classList.remove("display-none");
}
}).catch(function(err) {
console.log('parsing failed', err);
})
}

function render_result(elementId, content, append = true){
document.getElementById(elementId).innerHTML = (append == true) ? content : `<div></div>`;
}

0 comments on commit 9490b60

Please sign in to comment.