mirror of
https://github.com/pacnpal/simpleguardhome.git
synced 2025-12-20 04:21:13 -05:00
refactor(index.html): simplify domain status rendering by extracting logic into a separate function
This commit is contained in:
@@ -8,14 +8,7 @@
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.3.4/purify.min.js" integrity="sha384-KGmzmwrs7oAU2sG5qfETslFsscVcCaxQrX2d7PW7I9bTrsuTD/eSMFr9jaMS9i+b" crossorigin="anonymous"></script>
|
||||
<script>
|
||||
function escapeHtml(unsafe) {
|
||||
return unsafe
|
||||
.replace(/&/g, "&")
|
||||
.replace(/</g, "<")
|
||||
.replace(/>/g, ">")
|
||||
.replace(/"/g, """)
|
||||
.replace(/'/g, "'");
|
||||
}
|
||||
return unsafe.replace(/[&<"']/g, function (m) {
|
||||
return unsafe.replace(/[&<>"']/g, function(m) {
|
||||
switch (m) {
|
||||
case '&': return '&';
|
||||
case '<': return '<';
|
||||
@@ -26,28 +19,7 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
async function checkDomain(event) {
|
||||
event.preventDefault();
|
||||
const domain = DOMPurify.sanitize(document.getElementById('domain').value);
|
||||
const resultDiv = document.getElementById('result');
|
||||
const unblockDiv = document.getElementById('unblock-action');
|
||||
const submitBtn = document.getElementById('submit-btn');
|
||||
|
||||
try {
|
||||
// Show loading state
|
||||
submitBtn.disabled = true;
|
||||
submitBtn.innerHTML = '<span class="inline-flex items-center">Checking... <svg class="animate-spin ml-2 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg></span>';
|
||||
|
||||
const response = await fetch(`/control/filtering/check_host?name=${encodeURIComponent(domain)}`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
}
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (response.ok) {
|
||||
function renderDomainStatus(resultDiv, unblockDiv, domain, data) {
|
||||
const isBlocked = data.reason.startsWith('Filtered');
|
||||
if (isBlocked) {
|
||||
resultDiv.innerHTML = `
|
||||
@@ -72,6 +44,30 @@
|
||||
</div>`;
|
||||
unblockDiv.innerHTML = '';
|
||||
}
|
||||
}
|
||||
|
||||
async function checkDomain(event) {
|
||||
event.preventDefault();
|
||||
const domain = DOMPurify.sanitize(document.getElementById('domain').value);
|
||||
const resultDiv = document.getElementById('result');
|
||||
const unblockDiv = document.getElementById('unblock-action');
|
||||
const submitBtn = document.getElementById('submit-btn');
|
||||
|
||||
try {
|
||||
submitBtn.disabled = true;
|
||||
submitBtn.innerHTML = '<span class="inline-flex items-center">Checking... <svg class="animate-spin ml-2 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg></span>';
|
||||
|
||||
const response = await fetch(`/control/filtering/check_host?name=${encodeURIComponent(domain)}`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
}
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (response.ok) {
|
||||
renderDomainStatus(resultDiv, unblockDiv, domain, data);
|
||||
} else {
|
||||
let errorMsg = data.message || 'Unknown error occurred';
|
||||
let errorType = response.status === 400 ? 'warning' : 'error';
|
||||
|
||||
Reference in New Issue
Block a user