weyne/DCSOlympus
1
0
Fork 0
mirror of https://github.com/Pax1601/DCSOlympus.git synced 2025-10-29 16:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added success/failure banner and fixed instance status

Browse Source
This commit is contained in:
Pax1601 2024-01-29 13:24:09 +01:00
parent c2f6edfd74
commit 7ee3fb883b
10 changed files with 85 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
manager/.vscode/tasks.json vendored
View File

@ -6,7 +6,7 @@
{
"label": "mirror-package",
"type": "shell",
"command": "./scripts/mirror-package.bat",
"command": "call ./scripts/mirror-package.bat",
"isBackground": true
}
]

6
manager/ejs/instances.ejs
View File

@ -3,6 +3,12 @@
</style>
<div class="dashboard">
<div class="result-summary success <%= (typeof activeInstance !== 'undefined' && !activeInstance["error"])? "": "hide" %>">
<div class="title"><img src="./icons/check-solid-background.svg">Olympus settings updated for <i style="margin-left: 3px"><%= typeof activeInstance !== 'undefined'? activeInstance["name"]: "" %></i>!</div>
</div>
<div class="result-summary error <%= (typeof activeInstance !== 'undefined' && activeInstance["error"])? "": "hide" %>">
<div class="title"><img src="./icons/triangle-exclamation-solid-background.svg">An error occurred while updating Olympus settings for <i><%= typeof activeInstance !== 'undefined'? activeInstance["name"]: "" %></i></div>
</div>
<div class="content">
<div class="instructions">
<span class="title">

34
manager/ejs/result.ejs
View File

@ -5,39 +5,7 @@
row-gap: 30px;
padding: 60px 120px;
}
#result-page .result-summary {
padding: 25px 15px;
display: flex;
flex-direction: column;
row-gap: 10px;
}
#result-page .result-summary .title {
font-weight: bold;
font-size: var(--big);
display: flex;
align-items: center;
}
#result-page .result-summary .title img {
margin-right: 10px;
}
#result-page .result-summary .description {
font-size: var(--normal);
}
#result-page .result-summary.success{
color: var(--background-color);
background-color: var(--green);
}
#result-page .result-summary.error{
color: var(--background-color);
background-color: var(--red);
}
#result-page .instructions-group {
display: flex;
color: var(--offwhite);

8
manager/ejs/settings.ejs
View File

@ -2,9 +2,15 @@
</style>
<div class="dashboard">
<div class="cancel" style="font-size: var(--normal); font-weight: 600; color: var(--offwhite); display: flex; align-items: center; column-gap: 10px; cursor: pointer; text-decoration: underline; " onclick="signal('onBackClicked')">
<div class="cancel" style="font-size: var(--normal); font-weight: 600; color: var(--offwhite); display: flex; align-items: center; column-gap: 10px; cursor: pointer; text-decoration: underline; " onclick="signal('onCancelClicked')">
<img src="./icons/chevron-left-solid.svg" style=" height: 14px;">Back to menu
</div>
<div class="result-summary success <%= (typeof activeInstance !== 'undefined' && !activeInstance["error"])? "": "hide" %>">
<div class="title"><img src="./icons/check-solid-background.svg">Olympus settings updated for <i style="margin-left: 3px"><%= typeof activeInstance !== 'undefined'? activeInstance["name"]: "" %></i>!</div>
</div>
<div class="result-summary error <%= (typeof activeInstance !== 'undefined' && activeInstance["error"])? "": "hide" %>">
<div class="title"><img src="./icons/triangle-exclamation-solid-background.svg">An error occurred while updating Olympus settings for <i><%= typeof activeInstance !== 'undefined'? activeInstance["name"]: "" %></i></div>
</div>
<div class="content">
<div class="instructions">
<span class="title">

1
manager/icons/triangle-exclamation-solid-orange.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path opacity="1" fill="#ffa500" d="M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24V296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 584 B

3
manager/javascripts/dcsinstance.js
View File

@ -474,9 +474,10 @@ class DCSInstance {
logger.log(`Editing completed successfully`);
hidePopup();
getManager().options.mode === "basic"? getManager().menuPage.show(): getManager().instancesPage.show();
getManager().options.mode === "basic"? getManager().settingsPage.show(): getManager().instancesPage.show();
} catch (err) {
logger.log(`An error occurred during editing: ${err}`);
getManager().getActiveInstance().error = true;
hidePopup();
showErrorPopup(`A critical error occurred, check ${getManager().options.logLocation} for more info.`)
}

9
manager/javascripts/manager.js
View File

@ -359,12 +359,19 @@ class Manager {
/* When the back button of a wizard page is clicked */
onBackClicked() {
this.activePage.hide();
/* If we have backed to the menu, instances or settings page, reset the active instance */
if ([this.instancesPage, this.settingsPage].includes(this.activePage.previousPage)) {
delete this.options.activeInstance;
}
this.activePage.previousPage.show(true); // Don't change the previous page
this.updateInstances();
}
onCancelClicked() {
this.activePage.hide();
delete this.options.activeInstance;
if (this.options.mode === "basic")
this.menuPage.show(true);
else
@ -606,7 +613,7 @@ class Manager {
document.getElementById("loader").style.opacity = "0%";
window.setTimeout(() => {
document.getElementById("loader").classList.add("hide");
}, 200);
}, 250);
}
}

9
manager/javascripts/managerpage.js
View File

@ -40,20 +40,17 @@ class ManagerPage {
this.element.style.opacity = "0%";
window.setTimeout(() => {
this.element.classList.add("hide");
}, 200);
}, 250);
}
render(str) {
this.element.innerHTML = str;
this.element.style.opacity = "0%";
window.setTimeout(() => {
this.element.classList.remove("hide");
}, 200)
this.element.classList.remove("hide");
window.setTimeout(() => {
this.element.style.opacity = "100%";
}, 300)
}, 0)
/* Connect all the collapsable buttons */
let buttons = document.querySelectorAll(".button.collapse");

2
manager/javascripts/popup.js
View File

@ -97,7 +97,7 @@ function hidePopup() {
window.setTimeout(() => {
document.getElementById("grayout").classList.add("hide");
document.getElementById("popup").classList.add("hide");
}, 200);
}, 250);
}
function setPopupLoadingProgress(message, percent) {

59
manager/stylesheets/style.css
View File

@ -212,9 +212,10 @@ body {
/* Manager page */
/************************************************/
.manager-page {
position: absolute;
min-width: 1200px;
overflow-y: auto;
transition: opacity 0.2s linear;
transition: opacity 0.25s linear;
opacity: 0%;
/* By default has 0% opacity to allow for fade transition */
}
@ -230,7 +231,7 @@ body {
height: 100%;
background-color: rgba(0, 0, 0, 0.30);
z-index: 999;
transition: opacity 0.2s linear;
transition: opacity 0.25s linear;
opacity: 0%;
/* By default has 0% opacity to allow for fade transition */
}
@ -250,7 +251,7 @@ body {
padding: 20px 40px;
align-items: start;
z-index: 999;
transition: opacity 0.2s linear;
transition: opacity 0.25s linear;
opacity: 0%;
/* By default has 0% opacity to allow for fade transition */
}
@ -472,7 +473,7 @@ input {
flex-direction: column;
row-gap: 15px;
height: 100%;
padding: 80px;
padding: 40px 80px;
}
.dashboard .scroll-container {
@ -625,6 +626,9 @@ input {
font-size: var(--normal);
font-weight: 600;
color: var(--lightgray);
display: flex;
flex-direction: row;
column-gap: 8px;
}
.dashboard .instance-info>.status.installed {
@ -632,11 +636,23 @@ input {
color: var(--green);
}
.dashboard .instance-info>.status.installed::before {
content: url("../icons/check-solid-green.svg");
height: 14px;
width: 14px;
}
.dashboard .instance-info>.status.error {
font-weight: 600;
color: orange;
}
.dashboard .instance-info>.status.error::before {
content: url("../icons/triangle-exclamation-solid-orange.svg");
height: 14px;
width: 14px;
}
.dashboard .instance-buttons {
display: flex;
flex-direction: row;
@ -724,6 +740,41 @@ input {
cursor: default;
}
/************************************************/
/* Result summary */
/************************************************/
.result-summary {
padding: 25px 15px;
display: flex;
flex-direction: column;
row-gap: 10px;
}
.result-summary .title {
font-weight: bold;
font-size: var(--big);
display: flex;
align-items: center;
}
.result-summary .title img {
margin-right: 10px;
}
.result-summary .description {
font-size: var(--normal);
}
.result-summary.success{
color: var(--background-color);
background-color: var(--green);
}
.result-summary.error{
color: var(--background-color);
background-color: var(--red);
}
/************************************************/
/* Misc */
/************************************************/