Skip to content

Commit

Permalink
Added Upgrade Progress Log
Browse files Browse the repository at this point in the history 
Added Upgrade Progress Log that works.
But upgrader does still not fully work.
  • Loading branch information
@master3395
master3395 committed Nov 13, 2023
1 parent 5e2699b commit 66925cc
Showing 1 changed file with 95 additions and 85 deletions.
180 changes: 95 additions & 85 deletions baseTemplate/templates/baseTemplate/versionManagment.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
{% extends "baseTemplate/index.html" %}
{% load i18n %}
{% block title %}{% trans "Version Management - CyberPanel" %}"{% endblock %}
{% block title %}{% trans "Version Management - CyberPanel" %}{% endblock %}

{% block content %}

{% load static %}
Expand All @@ -23,11 +24,6 @@
background-color: darken(rgb(62, 72, 85), 10%);
}

/* Add these styles for the progress bar */
#upgradeProgress {
background-color: rgb(62, 72, 85);
}

/* Add these styles for the textarea */
textarea {
background-color: rgb(62, 72, 85);
Expand All @@ -52,19 +48,17 @@ <h3 class="title-hero">
CyberPanel
</h3>
<div ng-controller="versionManagment" class="example-box-wrapper">
<div class="form-group">
<progress id="upgradeProgress" value="0" max="100"></progress>
</div>
<div class="form-group">
<label for="branchSelect">{% trans "Select Branch:" %}</label>
<select id="branchSelect" class="button-style"></select>
</div>
<div class="form-group">
<button type="submit" onclick="upgradeCyberPanel()" class="button-style">{% trans "Upgrade CyberPanel to selected branch" %}</button>
<button type="submit" onclick="refreshPage()" class="button-style line-over">{% trans "Refresh page" %}</button>
</div>
</div>

<form action="/" class="form-horizontal bordered-row">
<form action="/" class="form-horizontal bordered-row">
<!-- Existing Commit Information -->
<div class="form-group">
<label class="col-sm-3 control-label" style="margin: 0px!important; padding: 0px!important;">{% trans "Current Version:" %}&nbsp&nbsp</label>
<div class="current-pack col-sm-9" style="margin: 0px!important; padding: 0px!important;">{{ currentVersion }}</div>
Expand All @@ -82,10 +76,17 @@ <h3 class="title-hero">
<div class="form-group">
<label class="col-sm-3 control-label" style="margin: 0px!important; padding: 0px!important;">{% trans "Latest Build:" %}&nbsp&nbsp</label>
<div class="current-pack col-sm-9" style="margin: 0px!important; padding: 0px!important;">{{ latestBuild }}</div>
<label class="col-sm-3 control-label" style="margin: 0px!important; padding: 0px!important;">{% trans "Latest Commit:" %}&nbsp&nbsp</label>
<label class="col-sm-3 control-label" style="margin: 0px!important; padding: 0px!important;">{% trans "Latest Commit:" %}&nbsp&nbsp</label>
<div class="current-pack col-sm-9" style="margin: 0px!important; padding: 0px!important;">{{ latestcomit }}</div>
</div>

<!-- New Upgrade Progress Log Section -->
<div class="form-group">
<label class="col-sm-3 control-label" style="margin: 0px!important; padding: 0px!important;">{% trans "Upgrade Progress Log:" %}</label>
<div id="upgradeProgressLog" class="current-pack col-sm-9" style="margin: 0px!important; padding: 0px!important;"></div>
</div>
</form>

<div ng-hide="upgradelogBox" class="form-group">
<div class="col-sm-12">
<textarea ng-model="upgradeLog" rows="30" class="form-control">{{ logs }}</textarea>
Expand All @@ -97,88 +98,97 @@ <h3 class="title-hero">
</div>

<script>
// Function to populate the branch dropdown
function populateBranches(branches) {
var branchSelect = document.getElementById("branchSelect");
branches.forEach((branch) => {
var option = document.createElement("option");
option.value = branch;
option.text = branch;
branchSelect.appendChild(option);
});
}

function getBranches(url, branches, page) {
if (!page) page = 1;
fetch(url + '?page=' + page)
.then((response) => response.json())
.then((data) => {
if (data.length === 0) {
populateBranches(branches);
} else {
const branchNames = data.map(branch => branch.name);
branches = branches.concat(branchNames);
getBranches(url, branches, page + 1);
}
})
.catch((error) => {
console.error('Error fetching branches: ' + error);
// Function to populate the branch dropdown
function populateBranches(branches) {
var branchSelect = document.getElementById("branchSelect");
branches.forEach((branch) => {
var option = document.createElement("option");
option.value = branch;
option.text = branch;
branchSelect.appendChild(option);
});
}

// Call the function to get all branches
getBranches('https://api.github.com/repos/usmannasir/cyberpanel/branches', [], 1);

function upgradeCyberPanel() {
var selectedBranch = document.getElementById("branchSelect").value;
var upgradeURL = 'https://raw.githubusercontent.com/usmannasir/cyberpanel/' + selectedBranch + '/cyberpanel_upgrade.sh';
}

if (confirm("Are you sure you want to upgrade to the selected branch from GitHub?")) {
var xhr = new XMLHttpRequest();
xhr.open('GET', upgradeURL, true);
xhr.responseType = 'text';
function getBranches(url, branches, page) {
if (!page) page = 1;
fetch(url + '?page=' + page)
.then((response) => response.json())
.then((data) => {
if (data.length === 0) {
populateBranches(branches);
} else {
const branchNames = data.map(branch => branch.name);
branches = branches.concat(branchNames);
getBranches(url, branches, page + 1);
}
})
.catch((error) => {
console.error('Error fetching branches: ' + error);
});
}

xhr.addEventListener('progress', function (e) {
if (e.lengthComputable) {
var percent = (e.loaded / e.total) * 100;
document.getElementById("upgradeProgress").value = percent;
console.log('Upgrade progress: ' + percent + '%');
// Call the function to get all branches
getBranches('https://api.github.com/repos/usmannasir/cyberpanel/branches', [], 1);

function upgradeCyberPanel() {
try {
var selectedBranch = document.getElementById("branchSelect").value;

// Use the shell script URL based on the selected branch
var shellScriptUrl = `https://raw.githubusercontent.com/usmannasir/cyberpanel/${selectedBranch}/preUpgrade.sh`;

if (confirm("Are you sure you want to upgrade to the selected branch from the remote script?")) {
// Use fetch to trigger a server-side action (execute shell script)
fetch('/upgrade', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
scriptUrl: shellScriptUrl,
}),
})
.then(response => {
if (!response.ok) {
throw new Error(`Failed to start upgrade. HTTP status ${response.status}`);
}
return response.json();
})
.then(data => {
// Log the response from the server
console.log('Upgrade response:', data);

// Check if the progress value is a finite number before setting it on the progress bar
if (isFinite(data.progress)) {
var upgradeProgressLog = document.getElementById("upgradeProgressLog");
upgradeProgressLog.innerText = 'Upgrade Progress: ' + data.progress + '%';
// You may also update other UI elements based on the response data
} else {
console.error('Invalid progress value received from the server:', data.progress);
var upgradeProgressLog = document.getElementById("upgradeProgressLog");
upgradeProgressLog.innerText = 'Upgrade failed. Invalid progress value received from the server.';
}
})
.catch(error => {
console.error('Upgrade failed. Error starting upgrade:', error);
alert('Upgrade failed. Error starting upgrade. Check the console for details.');
});
}
});
} catch (error) {
console.error('An unexpected error occurred:', error);

xhr.addEventListener('load', function () {
if (xhr.status === 200) {
console.log('Upgrade started. Please be patient, the upgrade process may take some time.');
console.log('Upgrade response received.');
// Additional error handling
alert('An unexpected error occurred during the upgrade. Check the console for details.');

// Save the response content as a Bash script
var bashScriptContent = xhr.responseText;

try {
// Execute the Bash script using eval (handle with caution)
eval(bashScriptContent);
console.log('Upgrade script executed.');
} catch (error) {
console.error('Error executing the upgrade script:', error);
}
} else if (xhr.status === 0) {
console.error('Upgrade failed. Server is not responding.');
} else if (xhr.status >= 400 && xhr.status < 500) {
console.error('Upgrade failed. Client error. Please check your request.');
} else if (xhr.status >= 500) {
console.error('Upgrade failed. Server error. Please check the server logs.');
} else {
console.error('Upgrade failed. Please check the logs for details.');
}
});
// Log detailed error information
console.error('Detailed error information:', error);
}
}

xhr.send();
function refreshPage() {
location.reload();
}
}

function refreshPage() {
window.location.reload();
}
</script>

{% endblock %}

0 comments on commit 66925cc

Please sign in to comment.