N°2657 - MTP : Progress Bar has disappeared

This commit is contained in:
Eric
2020-01-23 11:28:52 +01:00
parent d6ca08efb8
commit 8ad2b8091c
8 changed files with 241 additions and 141 deletions

View File

@@ -0,0 +1,103 @@
/*!
* Copyright (C) 2013-2020 Combodo SARL
*
* This file is part of iTop.
*
* iTop is free software; you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* iTop is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
*/
$link-hover-color: #EA7D1E !default;
fieldset {
margin-top: 0;
legend {
margin-top: 0;
}
~ fieldset {
margin-top: 13px;
}
p, div {
margin: 7px 0;
}
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
background: #555555;
border: 1px solid #555555;
color: #EEEEEE;
font-weight: bold;
}
.ui-button:hover, .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover,
.ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-focus .ui-state-focus {
background: $link-hover-color;
border: 1px solid $link-hover-color;
color: #EEEEEE;
font-weight: bold;
}
.ui-button:disabled, .ui-button:disabled:hover {
background: #55555533;
border: 1px solid #55555533;
color: #EEEEEE;
font-weight: bold;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
border-bottom-right-radius: 0;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
border-bottom-left-radius: 0;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
border-top-right-radius: 0;
}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
border-top-left-radius: 0;
}
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 1.1em;
}
.ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active {
padding: 0.3em 1em;
text-decoration: none;
}
.ui-button {
cursor: pointer;
display: inline-block;
line-height: normal;
margin-right: 0.1em;
overflow: visible;
position: relative;
text-align: center;
vertical-align: middle;
}
.form-inline {
display: inline-block;
margin-top: 13px;
}
#progress {
margin: 5px auto;
display:block;
width: 280px;
height: 20px;
line-height: 20px;
text-align: center;
.progress {
margin: 0;
}
.text {
margin: 0;
}
}

View File

@@ -23,16 +23,22 @@
Dict::Add('EN US', 'English', 'English', array(
'iTopUpdate:UI:PageTitle' => 'Application Upgrade',
'itop-core-update:UI:SelectUpdateFile' => 'Application Upgrade',
'itop-core-update:UI:ConfirmUpdate' => 'Application Upgrade',
'itop-core-update:UI:UpdateCoreFiles' => 'Application Upgrade',
'itop-core-update:UI:ConfirmUpdate' => 'Confirm Application Upgrade',
'itop-core-update:UI:UpdateCoreFiles' => 'Application Upgrading',
'iTopUpdate:UI:MaintenanceModeActive' => 'The application is currently under maintenance in read-only mode. You have to run a setup to return in normal mode.',
'itop-core-update:UI:UpdateDone' => 'Application Upgrade',
'itop-core-update/Operation:SelectUpdateFile/Title' => 'Application Upgrade',
'itop-core-update/Operation:ConfirmUpdate/Title' => 'Confirm Application Upgrade',
'itop-core-update/Operation:UpdateCoreFiles/Title' => 'Application Upgrading',
'itop-core-update/Operation:UpdateDone/Title' => 'Application Upgrade Done',
'iTopUpdate:UI:SelectUpdateFile' => 'Select an upgrade file to upload',
'iTopUpdate:UI:CheckUpdate' => 'Verify upgrade file',
'iTopUpdate:UI:ConfirmInstallFile' => 'You are about to install %1$s',
'iTopUpdate:UI:DoUpdate' => 'Upgrade',
'iTopUpdate:UI:CurrentVersion' => 'Current installed version',
'iTopUpdate:UI:NewVersion' => 'Newly installed version',
'iTopUpdate:UI:Back' => 'Back',
'iTopUpdate:UI:Cancel' => 'Cancel',
'iTopUpdate:UI:Continue' => 'Continue',

View File

@@ -23,16 +23,22 @@
Dict::Add('FR FR', 'French', 'Français', array(
'iTopUpdate:UI:PageTitle' => 'Mise à jour de l\'application',
'itop-core-update:UI:SelectUpdateFile' => 'Mise à jour',
'itop-core-update:UI:ConfirmUpdate' => 'Mise à jour',
'itop-core-update:UI:UpdateCoreFiles' => 'Mise à jour',
'itop-core-update:UI:ConfirmUpdate' => 'Confirmation de la mise à jour',
'itop-core-update:UI:UpdateCoreFiles' => 'Mise à jour en cours',
'iTopUpdate:UI:MaintenanceModeActive' => 'L\'application est actuellement en maintenance en mode lecture seule. Vous pouvez lancer un Setup pour retourner dans un mode normal.',
'itop-core-update:UI:UpdateDone' => 'Mise à jour effectuée',
'itop-core-update/Operation:SelectUpdateFile/Title' => 'Mise à jour',
'itop-core-update/Operation:ConfirmUpdate/Title' => 'Mise à jour',
'itop-core-update/Operation:UpdateCoreFiles/Title' => 'Mise à jour',
'itop-core-update/Operation:UpdateDone/Title' => 'Mise à jour',
'iTopUpdate:UI:SelectUpdateFile' => 'Sélectionner un fichier de mise à jour',
'iTopUpdate:UI:CheckUpdate' => 'Vérification de la mise à jour',
'iTopUpdate:UI:ConfirmInstallFile' => 'La mise à jour %1$s va être installée',
'iTopUpdate:UI:DoUpdate' => 'Mettre à jour',
'iTopUpdate:UI:CurrentVersion' => 'Version installée',
'iTopUpdate:UI:NewVersion' => 'Nouvelle version',
'iTopUpdate:UI:Back' => 'Annuler',
'iTopUpdate:UI:Cancel' => 'Annuler',
'iTopUpdate:UI:Continue' => 'Continuer',

View File

@@ -108,7 +108,8 @@ class UpdateController extends Controller
$sTransactionId = utils::GetNewTransactionId();
$aParams['sTransactionId'] = $sTransactionId;
$this->DisplayPage($aParams);
$this->AddSaas('env-'.utils::GetCurrentEnvironment().'/itop-core-update/css/itop-core-update.scss');
$this->DisplaySetupPage($aParams);
}
public function OperationUpdateCoreFiles()
@@ -136,8 +137,9 @@ class UpdateController extends Controller
'sAjaxURL' => utils::GetAbsoluteUrlModulePage('itop-core-update', 'ajax.php', array('maintenance' => 'true')),
);
$this->AddLinkedScript(utils::GetAbsoluteUrlAppRoot().'setup/jquery.progression.js');
$this->AddSaas('env-'.utils::GetCurrentEnvironment().'/itop-core-update/css/itop-core-update.scss');
$this->DisplayPage($aParams);
$this->DisplaySetupPage($aParams);
}
public function OperationRunSetup()

View File

@@ -1,104 +1,68 @@
{# @copyright Copyright (C) 2010-2019 Combodo SARL #}
{# @license http://opensource.org/licenses/AGPL-3.0 #}
<div class="page_header"><h1>{{ 'iTopUpdate:UI:PageTitle'|dict_s }}</h1></div>
<div class="display_block display-files">
{% if bSuccess %}
<fieldset>
<fieldset id="update_progress">
<legend>{{ 'iTopUpdate:UI:Status'|dict_s }}</legend>
<div class="header_message message_ok">
<div>
<span>{{ sQuestion }}</span>
</div>
<div class="message message-valid">
{{ sQuestion }}
</div>
<table style="vertical-align:top" class="one-col-details" data-mode="view">
<tbody>
<tr>
<td style="vertical-align:top" class="">
{{ include('DisplayCurrentVersion.html.twig') }}
</td>
</tr>
</tbody>
</table>
{% set sVersion = 'UI:iTopVersion:Long'|dict_format(constant('ITOP_APPLICATION'), constant('ITOP_VERSION'), constant('ITOP_REVISION'), constant('ITOP_BUILD_DATE')) %}
<p>{{ 'iTopUpdate:UI:CurrentVersion'|dict_s }}</p>
<div>
{{ sVersion }}
</div>
</fieldset>
<fieldset>
<legend>{{ 'iTopUpdate:UI:Backup'|dict_s }}</legend>
{% if bDoBackup or bDoFilesArchive %}
<table style="vertical-align:top" class="one-col-details" data-mode="view">
<tbody>
<tr>
<td style="vertical-align:top" class="">
{% if bDoBackup %}
<div class="details">
<div class="field_container field_small">
<div class="field_label label"><span title="">{{ 'iTopUpdate:UI:WithDBBackup'|dict_s }}</span></div>
<div class="field_data">
<div class="field_value">{{ sBackupFile }}</div>
</div>
</div>
</div>
{% endif %}
{% if bDoFilesArchive %}
<div class="details">
<div class="field_container field_small">
<div class="field_label label"><span title="">{{ 'iTopUpdate:UI:WithFilesBackup'|dict_s }}</span></div>
<div class="field_data">
<div class="field_value">{{ sItopArchive }}</div>
</div>
</div>
</div>
{% endif %}
</td>
</tr>
</tbody>
</table>
{% else %}
<div class="header_message message_info">
{% if bDoBackup %}
<p>{{ 'iTopUpdate:UI:WithDBBackup'|dict_s }}</p>
<div>
<span>{{ 'iTopUpdate:UI:WithoutBackup'|dict_s }}</span>
{{ sBackupFile }}
</div>
{% endif %}
{% if bDoFilesArchive %}
<p>{{ 'iTopUpdate:UI:WithFilesBackup'|dict_s }}</p>
<div>
{{ sItopArchive }}
</div>
{% endif %}
{% else %}
<div class="message message-warning">
{{ 'iTopUpdate:UI:WithoutBackup'|dict_s }}
</div>
{% endif %}
</fieldset>
<fieldset>
<legend>{{ 'iTopUpdate:UI:Action'|dict_s }}</legend>
<div class="header_message message_info">
<div>
<span>{{ 'iTopUpdate:UI:WarningReadOnlyDuringUpdate'|dict_s }}</span>
</div>
<div class="message message-warning">
{{ 'iTopUpdate:UI:WarningReadOnlyDuringUpdate'|dict_s }}
</div>
<div>
<table>
<tr>
<td>
<form enctype="multipart/form-data" method="post">
<p><input id="cancel-update" type="submit" value="{{ 'iTopUpdate:UI:Cancel'|dict_s }}"/></p>
</form>
</td>
<td>
<form enctype="multipart/form-data" method="post">
<p><input id="do-update" type="submit" value="{{ 'iTopUpdate:UI:DoUpdate'|dict_s }}"/> <i id="submit-wait" style="display: none" class="fas fa-spinner fa-spin" aria-hidden="true"></i></p>
<input type="hidden" name="operation" value="UpdateCoreFiles"/>
<input type="hidden" name="transaction_id" value="{{ sTransactionId }}">
<input type="hidden" name="filename" value="{{ sName }}">
<input type="hidden" name="doBackup" value="{{ bDoBackup }}">
<input type="hidden" name="doFilesArchive" value="{{ bDoFilesArchive }}">
</form>
</td>
</tr>
</table>
<form enctype="multipart/form-data" method="post" class="form-inline">
<input id="cancel-update" type="submit" value="{{ 'iTopUpdate:UI:Cancel'|dict_s }}" class="ui-button ui-widget ui-state-default ui-corner-all" role="button"/>
</form>
<form enctype="multipart/form-data" method="post" class="form-inline">
<input id="do-update" type="submit" value="{{ 'iTopUpdate:UI:DoUpdate'|dict_s }}" class="ui-button ui-widget ui-state-default ui-corner-all" role="button"/> <i id="submit-wait" style="display: none" class="fas fa-spinner fa-spin" aria-hidden="true"></i>
<input type="hidden" name="operation" value="UpdateCoreFiles"/>
<input type="hidden" name="transaction_id" value="{{ sTransactionId }}">
<input type="hidden" name="filename" value="{{ sName }}">
<input type="hidden" name="doBackup" value="{{ bDoBackup }}">
<input type="hidden" name="doFilesArchive" value="{{ bDoFilesArchive }}">
</form>
</div>
</fieldset>
{% else %}
<fieldset>
<div class="header_message message_error">
<div class="message message-error">
<div>
<span>{{ sError }}</span>
</div>

View File

@@ -1,70 +1,46 @@
{# @copyright Copyright (C) 2010-2019 Combodo SARL #}
{# @license http://opensource.org/licenses/AGPL-3.0 #}
<div class="page_header"><h1>{{ 'iTopUpdate:UI:PageTitle'|dict_s }}</h1></div>
<div class="display_block display-files">
<fieldset id="installation_progress">
<legend>{{ 'iTopUpdate:UI:Status'|dict_s }}</legend>
<div id="current_version" class="header_message message_info">
<div>
<span id="current-version">{{ sCurrentVersion }}</span>
</div>
</div>
<table style="vertical-align:top" class="one-col-details" data-mode="view">
<tbody>
<tr>
<td style="vertical-align:top" class="">
{% if bDoBackup %}
<div id="do_backup_done" class="details" style="display: none;">
<div class="field_container field_small">
<div class="field_label label"><span title="">{{ 'iTopUpdate:UI:WithDBBackup'|dict_s }}</span></div>
<div class="field_data">
<div class="field_value">{{ sBackupFile }}</div>
</div>
</div>
</div>
{% endif %}
{% if bDoFilesArchive %}
<div id="do_files_archive_done" class="details" style="display: none;">
<div class="field_container field_small">
<div class="field_label label"><span title="">{{ 'iTopUpdate:UI:WithFilesBackup'|dict_s }}</span></div>
<div class="field_data">
<div class="field_value">{{ sItopArchive }}</div>
</div>
</div>
</div>
{% endif %}
</td>
</tr>
</tbody>
</table>
</fieldset>
<fieldset id="installation_progress">
<legend>{{ 'iTopUpdate:UI:Progress'|dict_s }}</legend>
<div id="progress_content" style="height: 100px; overflow: auto; text-align: center;">
<div id="progress_content">
<p class="center">
<span id="setup_msg">{{ 'iTopUpdate:UI:SetupMessage:Ready'|dict_s }}</span>
</p>
<div id="progress" style="
margin: 5px auto;
display:block;
border:1px solid #000000;
width: 280px;
height: 20px;
line-height: 20px;
text-align: center;
">0%</div>
<div id="progress">0%</div>
</div>
</fieldset>
<fieldset>
<div id="setup_error_outer" class="header_message message_error" style="display: none;">
<legend>{{ 'iTopUpdate:UI:Status'|dict_s }}</legend>
<p id="new_version" style="display: none;">{{ 'iTopUpdate:UI:NewVersion'|dict_s }}</p>
<div id="current_version" class="message message-info">
<span id="current-version">{{ sCurrentVersion }}</span>
</div>
{% if bDoBackup %}
<div id="do_backup_done" style="display: none;">
<p>{{ 'iTopUpdate:UI:WithDBBackup'|dict_s }}</p>
<div class="message message-valid">
{{ sBackupFile }}
</div>
</div>
{% endif %}
{% if bDoFilesArchive %}
<div id="do_files_archive_done" style="display: none;">
<p>{{ 'iTopUpdate:UI:WithFilesBackup'|dict_s }}</p>
<div class="message message-valid">
{{ sItopArchive }}
</div>
</div>
{% endif %}
</fieldset>
<fieldset>
<div id="setup_error_outer" class="message message-error" style="display: none;">
<div>
<span id="setup_error"></span>
</div>
@@ -82,16 +58,17 @@
<span>{{ 'iTopUpdate:UI:MaintenanceModeActive'|dict_s }}</span>
</div>
</div>
<div id="run_setup" style="display: none;">
<form enctype="multipart/form-data" method="post">
<form enctype="multipart/form-data" method="post" class="form-inline">
<input type="hidden" name="operation" value="RunSetup"/>
<input type="hidden" name="authent" value="{{ sSetupToken }}">
<p><input id="run_setup" type="submit" value="{{ 'iTopUpdate:UI:RunSetup'|dict_s }}"/></p>
<input id="run_setup" type="submit" value="{{ 'iTopUpdate:UI:RunSetup'|dict_s }}" class="ui-button ui-widget ui-state-default ui-corner-all" role="button"/>
</form>
</div>
<form enctype="multipart/form-data" method="post">
<p><input id="setup_continue" type="submit" value="{{ 'iTopUpdate:UI:Continue'|dict_s }}" disabled/></p>
<form enctype="multipart/form-data" method="post" class="form-inline">
<input id="setup_continue" type="submit" value="{{ 'iTopUpdate:UI:Continue'|dict_s }}" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" disabled/>
</form>
</fieldset>
</div>

View File

@@ -43,14 +43,14 @@ function GetAjaxRequest(sOperation)
if (sOperation === "Backup")
{
oAjaxRequest.success = function() {
$("#do_backup_done").show();
$("#do_backup_done").show(300);
};
}
if (sOperation === "FilesArchive")
{
oAjaxRequest.success = function() {
$("#do_files_archive_done").show();
$("#do_files_archive_done").show(300);
};
}
@@ -98,12 +98,11 @@ function ExecNextStep() {
{
$("#setup_error").html({{ 'iTopUpdate:Error:UpdateFailed'|dict_s|json_encode|raw }});
}
$('.progress').css("background-image", "none").css("background-color", "#fcc");
$('#progress').hide();
$("#setup_error_outer").show();
$("#run_setup").show();
$("#setup_continue").hide();
})
;
});
}
else
{
@@ -114,8 +113,9 @@ function ExecNextStep() {
{
$.ajax(oGetCurrentVersion);
$("#setup_continue").removeAttr("disabled");
$("#current_version").removeClass("message_info").addClass("message_ok");
$('.progress').css("background-image", "none").css("background-color", "#cfc");
$('#installation_progress').hide(300);
$('#new_version').show();
$("#current_version").removeClass("message-info").addClass("message-valid");
}
}

View File

@@ -56,6 +56,7 @@ abstract class Controller
private $m_aDefaultParams;
private $m_aLinkedScripts;
private $m_aLinkedStylesheets;
private $m_aSaas;
private $m_aAjaxTabs;
@@ -69,6 +70,7 @@ abstract class Controller
{
$this->m_aLinkedScripts = array();
$this->m_aLinkedStylesheets = array();
$this->m_aSaas = array();
$this->m_aAjaxTabs = array();
$this->m_aDefaultParams = array();
$this->SetViewPath($sViewPath);
@@ -291,6 +293,21 @@ abstract class Controller
$this->DisplayPage($aParams, $sTemplateName, 'ajax');
}
/**
* Display an AJAX page (ajax_page)
*
* @api
*
* @param array $aParams Params used by the twig template
* @param null $sTemplateName Name of the twig template, ie MyTemplate for MyTemplate.html.twig
*
* @throws \Exception
*/
public function DisplaySetupPage($aParams = array(), $sTemplateName = null)
{
$this->DisplayPage($aParams, $sTemplateName, 'setup');
}
/**
* Display the twig page based on the name or the operation
*
@@ -330,6 +347,10 @@ abstract class Controller
{
$this->AddLinkedStylesheetToPage($sLinkedStylesheet);
}
foreach ($this->m_aSaas as $sSaasRelPath)
{
$this->AddSaasToPage($sSaasRelPath);
}
$this->OutputPage();
}
@@ -463,6 +484,18 @@ abstract class Controller
$this->m_aLinkedStylesheets[] = $sStylesheet;
}
/**
* Add an linked stylesheet to the current Page
*
* @api
*
* @param string $sSaasRelPath SCSS Stylesheet relative path to link
*/
public function AddSaas($sSaasRelPath)
{
$this->m_aSaas[] = $sSaasRelPath;
}
/**
* Add an AJAX tab to the current page
*
@@ -529,6 +562,10 @@ abstract class Controller
case 'ajax':
$this->m_oPage = new ajax_page($this->GetOperationTitle());
break;
case 'setup':
$this->m_oPage = new SetupPage($this->GetOperationTitle());
break;
}
}
@@ -572,6 +609,11 @@ abstract class Controller
$this->m_oPage->add_linked_stylesheet($sLinkedStylesheet);
}
private function AddSaasToPage($sSaasRelPath)
{
$this->m_oPage->add_saas($sSaasRelPath);
}
private function AddAjaxTabToPage($sCode, $sTitle, $sURL, $bCache)
{
$this->m_oPage->AddAjaxTab($sCode, $sURL, $bCache, $sTitle);