Kobe/docupulse
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update launch_progress.html

Browse Source
This commit is contained in:
Kobe
2025-06-15 12:52:40 +02:00
parent 6b87fd6fc1
commit d87b3e5b02
1 changed files with 73 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
templates/main/launch_progress.html
View File

@@ -11,8 +11,8 @@
) }}
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<div class="text-center mb-4">
@@ -30,7 +30,7 @@
style="width: 0%">0%</div>
</div>
<div id="stepsContainer">
<div id="stepsContainer" class="launch-steps-container">
<!-- Your custom steps will be added here -->
</div>
@@ -50,6 +50,31 @@
</div>
<style>
.launch-steps-container {
max-height: calc(100vh - 600px);
min-height: 300px;
overflow-y: auto;
padding-right: 1rem;
}
.launch-steps-container::-webkit-scrollbar {
width: 8px;
}
.launch-steps-container::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 4px;
}
.launch-steps-container::-webkit-scrollbar-thumb {
background: #888;
border-radius: 4px;
}
.launch-steps-container::-webkit-scrollbar-thumb:hover {
background: #555;
}
.step-item {
display: flex;
align-items: flex-start;
@@ -168,19 +193,7 @@ function initializeSteps() {
`;
stepsContainer.appendChild(nginxStep);
// Add Proxy Host creation step
const proxyStep = document.createElement('div');
proxyStep.className = 'step-item';
proxyStep.innerHTML = `
<div class="step-icon"><i class="fas fa-server"></i></div>
<div class="step-content">
<h5>Creating Proxy Host</h5>
<p class="step-status">Setting up NGINX proxy host configuration...</p>
</div>
`;
stepsContainer.appendChild(proxyStep);
// Add SSL Certificate generation step
// Add SSL Certificate generation step (now step 3)
const sslStep = document.createElement('div');
sslStep.className = 'step-item';
sslStep.innerHTML = `
@@ -191,6 +204,18 @@ function initializeSteps() {
</div>
`;
stepsContainer.appendChild(sslStep);
// Add Proxy Host creation step (now step 4)
const proxyStep = document.createElement('div');
proxyStep.className = 'step-item';
proxyStep.innerHTML = `
<div class="step-icon"><i class="fas fa-server"></i></div>
<div class="step-content">
<h5>Creating Proxy Host</h5>
<p class="step-status">Setting up NGINX proxy host configuration...</p>
</div>
`;
stepsContainer.appendChild(proxyStep);
}
async function startLaunch(data) {
@@ -269,22 +294,22 @@ async function startLaunch(data) {
nginxStep.classList.add('completed');
nginxStep.querySelector('.step-status').textContent = 'Successfully connected to NGINX Proxy Manager';
// Step 3: Create Proxy Host
await updateStep(3, 'Creating Proxy Host', 'Setting up NGINX proxy host configuration...');
const proxyResult = await createProxyHost(data.webAddresses, data.port);
if (!proxyResult.success) {
throw new Error(proxyResult.error || 'Failed to create proxy host');
}
// Step 4: Generate SSL Certificate
await updateStep(4, 'Generating SSL Certificate', 'Setting up secure HTTPS connection...');
const sslResult = await generateSSLCertificate(data.webAddresses, proxyResult.data.id);
// Step 3: Generate SSL Certificate (moved up)
await updateStep(3, 'Generating SSL Certificate', 'Setting up secure HTTPS connection...');
const sslResult = await generateSSLCertificate(data.webAddresses);
if (!sslResult.success) {
throw new Error(sslResult.error || 'Failed to generate SSL certificate');
}
// Step 4: Create Proxy Host (moved down)
await updateStep(4, 'Creating Proxy Host', 'Setting up NGINX proxy host configuration...');
const proxyResult = await createProxyHost(data.webAddresses, data.port, sslResult.data.certificate.id);
if (!proxyResult.success) {
throw new Error(proxyResult.error || 'Failed to create proxy host');
}
} catch (error) {
showError(error.message);
}
@@ -394,7 +419,7 @@ function updateStatus(step, message, type = 'info', details = '') {
}
}
async function createProxyHost(domains, port) {
async function createProxyHost(domains, port, sslCertificateId) {
try {
// Get NGINX settings from the template
const nginxSettings = {
@@ -599,7 +624,7 @@ async function createProxyHost(domains, port) {
`;
// Update the proxy step to show success and add the results
const proxyStep = document.querySelectorAll('.step-item')[2];
const proxyStep = document.querySelectorAll('.step-item')[3];
proxyStep.classList.remove('active');
proxyStep.classList.add('completed');
const statusText = proxyStep.querySelector('.step-status');
@@ -621,7 +646,7 @@ async function createProxyHost(domains, port) {
}
}
async function generateSSLCertificate(domains, proxyHostId) {
async function generateSSLCertificate(domains) {
try {
// Get NGINX settings from the template
const nginxSettings = {
@@ -717,7 +742,7 @@ async function generateSSLCertificate(domains, proxyHostId) {
}
// Update the SSL step to show success
const sslStep = document.querySelectorAll('.step-item')[3];
const sslStep = document.querySelectorAll('.step-item')[2];
sslStep.classList.remove('active');
sslStep.classList.add('completed');
const sslStatusText = sslStep.querySelector('.step-status');
@@ -776,6 +801,21 @@ async function generateSSLCertificate(domains, proxyHostId) {
}
}
function scrollToStep(stepElement) {
const container = document.querySelector('.launch-steps-container');
const containerRect = container.getBoundingClientRect();
const elementRect = stepElement.getBoundingClientRect();
// Calculate the scroll position to center the element in the container
const scrollTop = elementRect.top - containerRect.top - (containerRect.height / 2) + (elementRect.height / 2);
// Smooth scroll to the element
container.scrollTo({
top: container.scrollTop + scrollTop,
behavior: 'smooth'
});
}
function updateStep(stepNumber, title, description) {
return new Promise((resolve) => {
// Update the current step in the header
@@ -800,6 +840,8 @@ function updateStep(stepNumber, title, description) {
} else if (step === stepNumber) {
item.classList.add('active');
item.querySelector('.step-status').textContent = description;
// Scroll to the active step
scrollToStep(item);
}
});