58 lines
2.5 KiB
Twig
58 lines
2.5 KiB
Twig
{% extends "layout.twig" %}
|
|
{% block title %}Deploy {{ server.name }}{% endblock %}
|
|
{% block content %}
|
|
<div class="max-w-4xl mx-auto px-4 py-8">
|
|
<h1 class="text-2xl font-bold mb-6">Deploying: {{ server.name }}</h1>
|
|
<div id="deployLog" class="bg-gray-900 text-green-400 p-4 rounded font-mono text-sm h-96 overflow-y-auto mb-4">
|
|
<div>Ready to deploy...</div>
|
|
</div>
|
|
<button id="deployBtn" onclick="deploy()" class="gradient-bg text-white px-6 py-2 rounded hover:opacity-90 transition-all disabled:opacity-50 disabled:cursor-not-allowed">
|
|
<span id="btnText">Start Deployment</span>
|
|
<i id="btnSpinner" class="fas fa-spinner fa-spin ml-2 hidden"></i>
|
|
</button>
|
|
</div>
|
|
<script>
|
|
function deploy() {
|
|
const btn = document.getElementById('deployBtn');
|
|
const btnText = document.getElementById('btnText');
|
|
const btnSpinner = document.getElementById('btnSpinner');
|
|
const log = document.getElementById('deployLog');
|
|
|
|
// Disable button and show spinner
|
|
btn.disabled = true;
|
|
btnText.textContent = 'Deploying...';
|
|
btnSpinner.classList.remove('hidden');
|
|
|
|
log.innerHTML = '<div>📡 Connecting to server...</div>';
|
|
log.innerHTML += '<div>🔧 Installing Docker...</div>';
|
|
log.innerHTML += '<div>📦 Building container...</div>';
|
|
log.innerHTML += '<div>🔐 Generating keys...</div>';
|
|
log.innerHTML += '<div>⚙️ Configuring WireGuard...</div>';
|
|
|
|
fetch('/servers/{{ server.id }}/deploy', {method: 'POST'})
|
|
.then(r => r.json())
|
|
.then(d => {
|
|
if (d.success) {
|
|
log.innerHTML += '<div class="text-green-500 font-bold">✅ Deployment successful!</div>';
|
|
log.innerHTML += '<div class="text-yellow-300">🔌 VPN Port: ' + d.vpn_port + '</div>';
|
|
log.innerHTML += '<div class="text-yellow-300">🔑 Public Key: ' + d.public_key.substring(0, 40) + '...</div>';
|
|
btnText.textContent = 'Redirecting...';
|
|
btnSpinner.classList.add('hidden');
|
|
setTimeout(() => window.location.href = '/servers/{{ server.id }}', 2000);
|
|
} else {
|
|
log.innerHTML += '<div class="text-red-500 font-bold">❌ Error: ' + (d.error || 'Unknown error') + '</div>';
|
|
btn.disabled = false;
|
|
btnText.textContent = 'Retry Deployment';
|
|
btnSpinner.classList.add('hidden');
|
|
}
|
|
})
|
|
.catch(e => {
|
|
log.innerHTML += '<div class="text-red-500 font-bold">❌ Network error: ' + e.message + '</div>';
|
|
btn.disabled = false;
|
|
btnText.textContent = 'Retry Deployment';
|
|
btnSpinner.classList.add('hidden');
|
|
});
|
|
}
|
|
</script>
|
|
{% endblock %}
|