servii-backend/api_sender.html

245 lines
8.9 KiB
HTML
Raw Normal View History

2024-06-14 21:33:55 +00:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
2024-09-09 23:05:36 +00:00
<title>File Upload and API Interaction Form</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 600px;
margin: 0 auto;
padding: 20px;
background-color: #f0f0f0;
}
form {
display: flex;
flex-direction: column;
gap: 15px;
background-color: #ffffff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
input[type="file"], input[type="text"], input[type="number"] {
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
padding: 12px;
background-color: #007bff;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #0056b3;
}
.message {
margin-top: 10px;
padding: 12px;
border-radius: 4px;
}
.success {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.error {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
</style>
2024-06-14 21:33:55 +00:00
</head>
<body>
2024-09-09 23:05:36 +00:00
<h2>File Upload Form</h2>
<form id="uploadForm">
<input type="file" id="files" accept=".zip,.jar,.txt" multiple required>
<button type="submit">Upload File</button>
</form>
<div id="message" class="message"></div>
<h2>API Interaction Form</h2>
2024-06-14 21:33:55 +00:00
<form id="genericForm">
2024-09-09 23:05:36 +00:00
Email: <input type="text" id="accountEmail"><br>
Port: <input type="number" id="accountPort"><br>
Name: <input type="text" id="serverName"><br>
Version: <input type="text" id="serverVersion"><br>
Framework: <input type="text" id="serverFramework"><br>
2024-06-14 21:33:55 +00:00
<button type="button" class="actionButton" data-action="AccountCreate">Create Account</button>
<button type="button" class="actionButton" data-action="AccountDelete">Delete Account</button>
<button type="button" class="actionButton" data-action="ServerCreate">Create Server</button>
<button type="button" class="actionButton" data-action="ServerDelete">Delete Server</button>
<button type="button" class="actionButton" data-action="ServerRun">Start Server</button>
<button type="button" class="actionButton" data-action="ServerStop">Stop Server</button>
<button type="button" class="actionButton" data-action="FetchServers">Fetch Servers</button>
2024-08-15 10:07:45 +00:00
<button type="button" class="actionButton" data-action="FetchLogs">Fetch Logs</button>
<button type="button" class="actionButton" data-action="FetchPlayersStatus">Fetch Players Status</button>
2024-06-14 21:33:55 +00:00
</form>
<h2>Update Property</h2>
<form id="updatePropertyForm">
2024-09-09 23:05:36 +00:00
Property: <input type="text" id="update_property"><br>
Value: <input type="text" id="update_value"><br>
<button type="button" class="actionButton" data-action="UpdateProperties">Update Property</button>
2024-06-14 21:33:55 +00:00
</form>
<h2>Send Command</h2>
<form id="sendCommandForm">
2024-09-09 23:05:36 +00:00
Command: <input type="text" id="command"><br>
2024-06-14 21:33:55 +00:00
<button type="button" class="actionButton" data-action="Command">Send command</button>
</form>
<h2>Set Subdomain</h2>
2024-09-09 23:05:36 +00:00
<form id="setSubdomainForm">
Subdomain: <input type="text" id="subdomain"><br>
<button type="button" class="actionButton" data-action="SetSubdomain">Set Subdomain</button>
</form>
2024-06-14 21:33:55 +00:00
<script>
document.addEventListener('DOMContentLoaded', () => {
2024-09-09 23:05:36 +00:00
const uploadForm = document.getElementById('uploadForm');
const genericForm = document.getElementById('genericForm');
const updatePropertyForm = document.getElementById('updatePropertyForm');
const sendCommandForm = document.getElementById('sendCommandForm');
const setSubdomainForm = document.getElementById('setSubdomainForm');
const messageDiv = document.getElementById('message');
// File Upload functionality
uploadForm.addEventListener('submit', async event => {
event.preventDefault();
const fileInput = document.getElementById('files');
const filesLength = fileInput.files.length;
if (filesLength === 0) {
showMessage('Please select at least one file.', 'error');
return;
}
const formData = new FormData();
formData.append('name', 'local');
formData.append('token', 'MpkbDMOO8PQddQgB5VgBQdTMWF53');
for (let i = 0; i < filesLength; i++) {
formData.append(`${i}`, fileInput.files[i]);
}
try {
const response = await fetch('http://localhost:3000/Upload', {
method: 'POST',
body: formData
});
if (!response.ok) {
const errorMessage = await response.text();
const parser = new DOMParser();
const doc = parser.parseFromString(errorMessage, 'text/html');
const title = doc.querySelector('title')?.textContent || 'Unknown Error';
const description = doc.querySelector('p')?.textContent || 'Unable to determine error description.';
showMessage(`${title}: ${description}`, 'error');
} else {
const result = await response.json();
showMessage(`File uploaded successfully. Filename: ${result.filename}`, 'success');
}
} catch (error) {
console.error('Error:', error);
showMessage('An error occurred. Please try again.', 'error');
}
});
// API Interaction functionality
2024-06-14 21:33:55 +00:00
const buttons = document.querySelectorAll('.actionButton');
buttons.forEach(button => {
button.addEventListener('click', async event => {
2024-09-09 23:05:36 +00:00
event.preventDefault();
2024-06-14 21:33:55 +00:00
const action = button.dataset.action;
2024-09-06 10:42:07 +00:00
const token = "MpkbDMOO8PQddQgB5VgBQdTMWF53";
const framework = document.getElementById('serverFramework').value;
const subdomain = document.getElementById('subdomain').value;
2024-06-14 21:33:55 +00:00
const email = document.getElementById('accountEmail').value;
const port = document.getElementById('accountPort').value;
const name = document.getElementById('serverName').value;
const version = document.getElementById('serverVersion').value;
const prop = document.getElementById('update_property').value;
2024-06-14 21:33:55 +00:00
const value = document.getElementById('update_value').value;
const command = document.getElementById('command').value;
const props = [[prop, value], ["max-players", "666"]];
let data = {};
2024-09-09 23:05:36 +00:00
2024-06-14 21:33:55 +00:00
switch(action) {
case 'FetchServers':
data = {token};
break;
2024-08-15 10:07:45 +00:00
case 'FetchLogs':
data = {token, name};
break;
case 'FetchPlayersStatus':
data = {token, name};
break;
2024-06-14 21:33:55 +00:00
case 'AccountCreate':
data = {email, port, token};
2024-06-14 21:33:55 +00:00
break;
case 'AccountDelete':
data = {subdomain, port, token};
2024-06-14 21:33:55 +00:00
break;
case 'ServerCreate':
data = {port, name, version, token, framework};
2024-06-14 21:33:55 +00:00
break;
case 'ServerDelete':
data = {port, name, token};
2024-06-14 21:33:55 +00:00
break;
case 'ServerRun':
data = {port, name, token};
2024-06-14 21:33:55 +00:00
break;
case 'ServerStop':
data = {port, name, token};
2024-06-14 21:33:55 +00:00
break;
case 'UpdateProperties':
data = {port, name, props, value, token};
2024-06-14 21:33:55 +00:00
break;
case 'Command':
data = {port, name, command, token};
break;
case 'SetSubdomain':
2024-09-09 23:05:36 +00:00
data = {token, subdomain};
2024-06-14 21:33:55 +00:00
break;
}
2024-09-09 23:05:36 +00:00
2024-06-14 21:33:55 +00:00
sendRequest(action, data)
2024-09-09 23:05:36 +00:00
.then(response => response.text())
.then(data => alert(`Response: ${data}`))
.catch(error => console.error('Error:', error));
2024-06-14 21:33:55 +00:00
});
});
function sendRequest(endpoint, payload) {
return fetch(`http://localhost:3000/${endpoint}`, {
2024-06-14 21:33:55 +00:00
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(payload)
});
}
2024-09-09 23:05:36 +00:00
function showMessage(message, type) {
messageDiv.textContent = message;
messageDiv.className = `message ${type}`;
setTimeout(() => {
messageDiv.textContent = '';
messageDiv.className ='message';
}, 5000);
}
2024-06-14 21:33:55 +00:00
});
</script>
</body>
</html>