File size: 3,218 Bytes
8befdfa | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test /add_points_and_refresh_fn API</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.js"></script>
</head>
<body class="bg-gray-100 p-8">
<div class="max-w-2xl mx-auto bg-white rounded-lg shadow-lg p-6">
<h1 class="text-3xl font-bold mb-6">Test /add_points_and_refresh_fn API</h1>
<div class="mb-4">
<label class="block text-gray-700 text-sm font-bold mb-2" for="email">
Email
</label>
<input type="email"
id="email"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
placeholder="Enter email">
</div>
<div class="mb-4">
<button id="submit"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
Submit
</button>
</div>
<div class="mb-4">
<label class="block text-gray-700 text-sm font-bold mb-2">
Status
</label>
<div id="status"
class="border rounded w-full py-2 px-3 text-gray-700 bg-gray-100">
</div>
</div>
<div class="mb-4">
<label class="block text-gray-700 text-sm font-bold mb-2">
Value
</label>
<div id="value"
class="border rounded w-full py-2 px-3 text-gray-700 bg-gray-100">
</div>
</div>
</div>
<script>
document.getElementById('submit').addEventListener('click', async () => {
const email = document.getElementById('email').value;
const statusElement = document.getElementById('status');
const valueElement = document.getElementById('value');
// Reset output fields
statusElement.textContent = 'Processing...';
valueElement.innerHTML = '';
try {
const response = await fetch('https://ginipick-Dokdo-pay.hf.space/add_points_and_refresh_fn', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ email: email })
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
// Assuming the API returns an array with status and value
statusElement.textContent = data[0];
valueElement.innerHTML = data[1];
} catch (error) {
statusElement.textContent = `Error: ${error.message}`;
valueElement.innerHTML = 'Error occurred';
console.error('Error:', error);
}
});
</script>
</body>
</html> |