composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-02-12 23:14:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

N°3913 UI improvements for setup, also remove A LOT of <table> 😬

Browse Source
This commit is contained in:
Stephen Abello
2021-08-13 12:23:21 +02:00
parent e666631f63
commit fabdef37d2
17 changed files with 383 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

169
css/setup.css
View File

@@ -605,7 +605,7 @@ ul.cke_autocomplete_panel, .ibo-quick-create--input.selectize-control.single .se
/* NOTE: Those helpers allow to easily use an icon from libs. like FontAwesome or FontCombodo within a CSS rule (eg. ::after) */
/* To use it, simply "@extend %fa-regular-base" in a rule and put the desired icon "content: '\f054'" */
/******************************************************************************************************************************/
.dataTables_scrollHead thead tr th.sorting::after, .ibo-breadcrumbs--item:not(:last-child)::after, .ibo-prop--apply.ui-state-error:after, .ibo-sort-order::after {
.dataTables_scrollHead thead tr th.sorting::after, .ibo-breadcrumbs--item:not(:last-child)::after, .ibo-prop--apply.ui-state-error:after, .ibo-sort-order::after, .collapsable-options:not(.setup-is-opened)::before, .collapsable-options.setup-is-opened::before, #params_summary div.closed .title::before, #params_summary div:not(.closed) .title::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
-webkit-font-smoothing: antialiased;
@@ -750,7 +750,7 @@ ul.cke_autocomplete_panel, .ibo-quick-create--input.selectize-control.single .se
-moz-font-feature-settings: "lnum";
font-feature-settings: "lnum";
}
.ibo-font-ral-nor-250, .ui-dialog-title, .ibo-navigation-menu--user-info .ibo-navigation-menu--user-welcome-message, .ibo-welcome-popup--text {
.ibo-font-ral-nor-250, .ui-dialog-title, .ibo-navigation-menu--user-info .ibo-navigation-menu--user-welcome-message, .ibo-welcome-popup--text, #ibo_setup_container .ibo-setup--body .setup-content-title, #ibo_setup_container .ibo-setup--body h2, .setup-end-placeholder a {
font-size: 1.5rem;
font-family: "Raleway", "sans-serif", "system-ui";
font-weight: 400;
@@ -1364,6 +1364,9 @@ body.ibo-has-fullscreen-descendant {
* A single class to handle WYSIWYG generated content, where only HTML tags are available
* See https://bulma.io/documentation/elements/content/
*/
.ibo-is-html-content code {
color: initial;
}
/***********************************************************************/
/* Sticky headers */
/* */
@@ -1419,6 +1422,10 @@ body.ibo-has-fullscreen-descendant {
*
* You should have received a copy of the GNU Affero General Public License
*/
/**
* customize Bulma content variables
* See https://bulma.io/documentation/elements/content/
*/
/*! bulma.io v0.9.0 | MIT License | github.com/jgthms/bulma */
@keyframes spinAround {
from {
@@ -2964,8 +2971,8 @@ a.box:active {
width: 100%;
}
.content table td, .ibo-is-html-content table td, .content table th, .ibo-is-html-content table th {
border: 1px solid #dbdbdb;
border-width: 0 0 1px;
border: 1px solid black;
border-width: 1px;
padding: 0.5em 0.75em;
vertical-align: top;
}
@@ -2976,12 +2983,12 @@ a.box:active {
text-align: inherit;
}
.content table thead td, .ibo-is-html-content table thead td, .content table thead th, .ibo-is-html-content table thead th {
border-width: 0 0 2px;
border-width: 1px;
color: #363636;
}
.content table tfoot td, .ibo-is-html-content table tfoot td, .content table tfoot th, .ibo-is-html-content table tfoot th {
border-width: 2px 0 0;
color: #363636;
border-width: 1px;
color: black;
}
.content table tbody tr:last-child td, .ibo-is-html-content table tbody tr:last-child td, .content table tbody tr:last-child th, .ibo-is-html-content table tbody tr:last-child th {
border-bottom-width: 0;
@@ -10349,7 +10356,7 @@ a.has-text-danger-dark:hover, .ibo-quick-create--compartment-results--element >
padding: 0.9rem !important;
box-shadow: 0 0px 3px 2px inset rgba(0, 0, 0, 0.4);
border-radius: 3px;
white-space: pre-wrap;
white-space: pre-line;
}
/* Mentions in caselogs */
/* Note: Mind the "ul", it allows us to have a more precise rule than the original plugin's CSS so we can override it */
@@ -10366,14 +10373,19 @@ ul.cke_autocomplete_panel .ibo-vendors-ckeditor--autocomplete-item {
ul.cke_autocomplete_panel .ibo-vendors-ckeditor--autocomplete-item-image {
width: 25px;
height: 25px;
/* min-xxx are here to avoid medallion to be horizontally compressed when the title is to long */
min-width: 25px;
min-height: 25px;
background-position: center center;
background-size: 100%;
border-radius: 100%;
margin-right: 0.5rem;
background-color: #e1e7ec;
background-color: #ebf8ff;
border: 1px solid #929fb1;
}
ul.cke_autocomplete_panel .ibo-vendors-ckeditor--autocomplete-item-title {
white-space: nowrap;
/* Here we don't want to truncate the text as in an autocomplete we might have similar values and we need the user to see the entire text to be able to differenciate them */
color: #3A3A3A;
}
/*!
@@ -10828,6 +10840,9 @@ ul.cke_autocomplete_panel .ibo-vendors-ckeditor--autocomplete-item-title {
cursor: default;
z-index: 100;
}
.ui-autocomplete .ui-menu-item {
padding: 0;
}
.ui-autocomplete-input {
width: auto;
display: inline;
@@ -13772,7 +13787,7 @@ img.ibo-navigation-menu--notifications--item--image:not([src=""]) ~ i.ibo-naviga
}
.ibo-field:not([data-attribute-type="AttributeBlob"]):not([data-attribute-type="AttributeFile"]):not([data-attribute-type="AttributeImage"]):not([data-attribute-type="AttributeCustomFields"]):not(.ibo-input-file-select--container) .ibo-field--value * {
word-break: break-word;
white-space: pre-wrap;
white-space: pre-line;
}
.ibo-field ~ .ibo-field {
margin-top: 16px;
@@ -14405,7 +14420,7 @@ img.ibo-navigation-menu--notifications--item--image:not([src=""]) ~ i.ibo-naviga
}
.search_form_handler .sf_criterion_area .sf_more_criterion > * {
background-color: white;
color: #dd6c20;
color: #37474f;
}
.search_form_handler .sf_criterion_area .sf_more_criterion .sfm_toggler .sfm_tg_title {
margin-right: 7px;
@@ -16240,7 +16255,7 @@ input:checked + .ibo-dashboard--slider:after {
/* Avoid pre (code snippets) to overflow outside the entry */
}
.ibo-activity-entry--main-information-content pre {
white-space: pre-wrap;
white-space: pre-line;
/* Avoid table to overflow outside the entry (see N°2127) */
}
.ibo-activity-entry--main-information-content table {
@@ -17139,6 +17154,8 @@ tr.row_added td {
*/
}
#ibo-main-content .ibo-panel.ibo-has-sticky-header {
margin-bottom: 200px;
/* Add a margin below the panel so the dropdown lists can open without problem (N°4039) */
/* Stickable header rules */
}
#ibo-main-content .ibo-panel.ibo-has-sticky-header > .ibo-sticky-sentinel-top {
@@ -17450,10 +17467,9 @@ h3.clickable.open {
fieldset {
border: none;
padding: 0;
margin: 30px 0 0 0;
margin: 15px 0 0 0;
}
fieldset > legend {
margin-top: 25px;
margin-bottom: 7px;
padding-bottom: 7px;
width: 100%;
@@ -17505,14 +17521,11 @@ body {
border-bottom: none;
border-radius: 3px 3px 0 0;
}
#ibo_setup_container .ibo-setup--header img {
#ibo_setup_container .ibo-setup--header .ibo-title--icon {
border: 0;
vertical-align: middle;
margin-right: 20px;
}
#ibo_setup_container .ibo-setup--header h1 {
margin-top: 10px;
}
#ibo_setup_container .ibo-setup--body {
display: flex;
flex-direction: column;
@@ -17562,10 +17575,10 @@ body {
margin-top: 5px;
}
#ibo_setup_container .ibo-setup--body .ibo-fieldset, #ibo_setup_container .ibo-setup--body fieldset {
margin-top: 25px;
margin-top: 12px;
}
#ibo_setup_container .ibo-setup--body .ibo-fieldset ~ .ibo-fieldset, #ibo_setup_container .ibo-setup--body fieldset ~ .ibo-fieldset, #ibo_setup_container .ibo-setup--body .ibo-fieldset ~ fieldset, #ibo_setup_container .ibo-setup--body fieldset ~ fieldset {
margin-top: 25px;
margin-top: 12px;
}
#ibo_setup_container .ibo-setup--body .ibo-field {
margin-top: 5px;
@@ -17599,6 +17612,19 @@ body {
max-height: 400px;
overflow: auto;
}
#ibo_setup_container .ibo-setup--body .ibo-input, #ibo_setup_container .ibo-setup--body .ui-autocomplete-input, #ibo_setup_container .ibo-setup--body .ui-multiselect, #ibo_setup_container .ibo-setup--body .dataTables_length select, .dataTables_length #ibo_setup_container .ibo-setup--body select, #ibo_setup_container .ibo-setup--body .ui_tpicker_hour_slider > select, #ibo_setup_container .ibo-setup--body .ui_tpicker_minute_slider > select, #ibo_setup_container .ibo-setup--body .ui_tpicker_second_slider > select, #ibo_setup_container .ibo-setup--body .search_form_handler .sf_criterion_area .search_form_criteria .sfc_form_group .sfc_fg_operators .sfc_fg_operator .sfc_op_content input[type="text"], .search_form_handler .sf_criterion_area .search_form_criteria .sfc_form_group .sfc_fg_operators .sfc_fg_operator .sfc_op_content #ibo_setup_container .ibo-setup--body input[type="text"], #ibo_setup_container .ibo-setup--body .search_form_handler .sf_filter .sff_input_wrapper input[type="text"], .search_form_handler .sf_filter .sff_input_wrapper #ibo_setup_container .ibo-setup--body input[type="text"] {
width: auto;
display: inline-block;
}
#ibo_setup_container .ibo-setup--body table td {
white-space: nowrap;
line-height: 2.5rem;
padding-right: 8px;
padding-bottom: 1rem;
}
#ibo_setup_container .ibo-setup--body .setup-content-title, #ibo_setup_container .ibo-setup--body h2 {
margin-bottom: 18px;
}
.ibo-setup--button-bar {
margin-top: 16px;
}
@@ -17611,4 +17637,107 @@ body {
.ibo-setup-summary-title {
font-size: 1.17rem;
}
.setup-prefix-toggler--input--container, .setup-tls--input--container, .setup-disk-location--input--container, .setup-backup--input--container {
display: flex;
line-height: 2.5rem;
margin: 1rem 0;
}
.setup-prefix-toggler--input--container input, .setup-tls--input--container input, .setup-disk-location--input--container input, .setup-backup--input--container input {
margin: 0 8px;
}
.setup-disk-location--input--container input, .setup-backup--input--container input {
flex-grow: 1;
}
.collapsable-options {
margin-bottom: 18px;
}
.collapsable-options:not(.setup-is-opened)::before {
margin-right: 8px;
content: '\f078';
}
.collapsable-options.setup-is-opened::before {
margin-right: 8px;
content: '\f077';
}
.setup-input--hint--icon {
color: #6e7a8a;
}
.setup-invalid-field--icon {
color: #c53030;
margin-left: 8px;
}
.setup-accept-licenses {
margin-top: 18px;
}
.setup-accept-licenses input {
margin-right: 8px;
}
.module-selection-banner {
display: flex;
}
.module-selection-banner > img {
margin-right: 12px;
}
.setup-end-placeholder {
display: flex;
flex-direction: row;
align-items: center;
}
.setup-end-placeholder > div {
padding: 0px 15px;
}
.setup-end-placeholder a {
display: flex;
flex-direction: column;
align-items: center;
}
.setup-end-placeholder a svg {
max-height: 150px;
margin-bottom: 15px;
width: auto;
}
/* integrityCheck: end (do not remove/edit) */
/* Legacy inline stuff */
#params_summary {
overflow: auto;
}
#params_summary div {
width: 100%;
margin-top: 0;
padding-top: 0.5em;
padding-left: 0;
}
#params_summary div ul {
margin-left: 0;
padding-left: 40px;
}
#params_summary div.closed ul {
display: none;
}
#params_summary div li {
list-style: none;
width: 100%;
margin-left: 0;
padding-left: 0em;
}
.title {
padding-left: 20px;
font-weight: bold;
cursor: pointer;
}
#params_summary div.closed .title::before {
margin-right: 5px;
content: '\f078';
}
#params_summary div:not(.closed) .title::before {
margin-right: 5px;
content: '\f077';
}
#progress_content {
height: 200px;
overflow: auto;
text-align: center;
}
#installation_progress {
display: none;
}

146
css/setup.scss
View File

@@ -288,10 +288,9 @@ h3.clickable.open {
fieldset {
border: none;
padding: 0;
margin: 30px 0 0 0;
margin: 15px 0 0 0;
> legend {
margin-top: 25px;
margin-bottom: 7px;
padding-bottom: 7px;
width: 100%;
@@ -367,15 +366,11 @@ body {
border-bottom: none;
border-radius: $ibo-border-radius-300 $ibo-border-radius-300 0 0;
img {
.ibo-title--icon {
border: 0;
vertical-align: middle;
margin-right: 20px;
}
h1 {
margin-top: 10px;
}
}
.ibo-setup--body {
@@ -433,10 +428,10 @@ body {
}
.ibo-fieldset {
margin-top: 25px;
margin-top: 12px;
& ~ .ibo-fieldset {
margin-top: 25px;
margin-top: 12px;
}
}
@@ -485,6 +480,22 @@ body {
overflow: auto;
}
}
.ibo-input{
width: auto;
display: inline-block;
}
table {
td{
white-space: nowrap;
line-height: 2.5rem;
padding-right: 8px;
padding-bottom: 1rem;
}
}
.setup-content-title, h2{
@extend %ibo-font-ral-nor-250;
margin-bottom: 18px;
}
}
}
@@ -506,4 +517,119 @@ body {
font-size: $ibo-font-size-150;
}
/* integrityCheck: end (do not remove/edit) */
.setup-prefix-toggler--input--container, .setup-tls--input--container, .setup-disk-location--input--container, .setup-backup--input--container {
display: flex;
line-height: 2.5rem;
margin: 1rem 0;
input{
margin: 0 8px;
}
}
.setup-disk-location--input--container, .setup-backup--input--container{
input{
flex-grow: 1;
}
}
.collapsable-options{
margin-bottom: 18px;
&:not(.setup-is-opened)::before{
margin-right: 8px;
@extend %fa-solid-base;
content: '\f078';
}
&.setup-is-opened::before{
margin-right: 8px;
@extend %fa-solid-base;
content: '\f077';
}
}
.setup-input--hint--icon{
color: $ibo-color-grey-700
}
.setup-invalid-field--icon{
color: $ibo-color-red-700;
margin-left: 8px;
}
.setup-accept-licenses{
margin-top: 18px;
input{
margin-right: 8px;
}
}
.module-selection-banner{
display: flex;
>img{
margin-right: 12px;
}
}
.setup-end-placeholder{
display: flex;
flex-direction: row;
align-items: center;
>div {
padding: 0px 15px;
}
a {
display: flex;
flex-direction: column;
align-items: center;
@extend %ibo-font-ral-nor-250;
svg{
max-height: 150px;
margin-bottom: 15px;
width: auto;
}
}
}
/* integrityCheck: end (do not remove/edit) */
/* Legacy inline stuff */
#params_summary {
overflow: auto;
}
#params_summary div {
width:100%;
margin-top:0;
padding-top: 0.5em;
padding-left: 0;
}
#params_summary div ul {
margin-left:0;
padding-left: 40px;
}
#params_summary div.closed ul {
display:none;
}
#params_summary div li {
list-style: none;
width: 100%;
margin-left:0;
padding-left: 0em;
}
.title {
padding-left: 20px;
font-weight: bold;
cursor: pointer;
}
#params_summary div {
&.closed .title::before {
margin-right: 5px;
@extend %fa-solid-base;
content: '\f078';
}
&:not(.closed) .title::before {
margin-right: 5px;
@extend %fa-solid-base;
content: '\f077';
}
}
#progress_content {
height: 200px;
overflow: auto;
text-align: center;
}
#installation_progress {
display: none;
}

10
datamodels/2.x/installation.xml
View File

@@ -4,7 +4,7 @@
<step>
<title>Configuration Management options</title>
<description><![CDATA[<h2>The options below allow you to configure the type of elements that are to be managed inside iTop.</h2>]]></description>
<banner>/images/modules.png</banner>
<banner>/images/icons/icons8-apps-tab.svg</banner>
<options type="array">
<choice>
<extension_code>itop-config-mgmt-core</extension_code>
@@ -65,7 +65,7 @@
<step>
<title>Service Management options</title>
<description><![CDATA[<h2>Select the choice that best describes the relationships between the services and the IT infrastructure in your IT environment.</h2>]]></description>
<banner>./wizard-icons/service.png</banner>
<banner>/images/icons/icons8-services.svg</banner>
<alternatives type="array">
<choice>
<extension_code>itop-service-mgmt-enterprise</extension_code>
@@ -89,7 +89,7 @@
<step>
<title>Tickets Management options</title>
<description><![CDATA[<h2>Select the type of tickets you want to use in order to respond to user requests and incidents.</h2>]]></description>
<banner>./itop-incident-mgmt-itil/images/incident-escalated.png</banner>
<banner>/images/icons/icons8-discussion-forum.svg</banner>
<alternatives type="array">
<choice>
<extension_code>itop-ticket-mgmt-simple-ticket</extension_code>
@@ -161,7 +161,7 @@
<step>
<title>Change Management options</title>
<description><![CDATA[<h2>Select the type of tickets you want to use in order to manage changes to the IT infrastructure.</h2>]]></description>
<banner>./itop-change-mgmt/images/change.png</banner>
<banner>/images/icons/icons8-change.svg</banner>
<alternatives type="array">
<choice>
<extension_code>itop-change-mgmt-simple</extension_code>
@@ -192,7 +192,7 @@
<step>
<title>Additional ITIL tickets</title>
<description><![CDATA[<h2>Pick from the list below the additional ITIL processes that are to be implemented in iTop.</h2>]]></description>
<banner>./itop-knownerror-mgmt/images/known-error.png</banner>
<banner>/images/icons/icons8-important-book.svg</banner>
<options type="array">
<choice>
<extension_code>itop-kown-error-mgmt</extension_code>

BIN
datamodels/2.x/wizard-icons/portal.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.4 KiB

BIN
datamodels/2.x/wizard-icons/service.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.6 KiB

1
images/icons/icons8-apps-tab.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><linearGradient id="ldLw80Wb5w9tTRcKjgX8Ga" x1="2.252" x2="34.131" y1="12.996" y2="42.423" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0077d2"/><stop offset="1" stop-color="#0b59a2"/></linearGradient><path fill="url(#ldLw80Wb5w9tTRcKjgX8Ga)" d="M23.008,22.387L6.256,31.181c-1.523,0.8-1.523,2.98,0,3.779l16.752,8.795 c0.621,0.326,1.363,0.326,1.984,0l16.752-8.795c1.523-0.8,1.523-2.98,0-3.779l-16.752-8.795 C24.371,22.06,23.629,22.06,23.008,22.387z"/><path d="M25.457,35.569L37.78,29.1l-12.787-6.713c-0.621-0.326-1.363-0.326-1.984,0L10.22,29.1l12.322,6.469 c0.447,0.235,0.952,0.36,1.458,0.36S25.011,35.805,25.457,35.569z" opacity=".05"/><path d="M25.225,35.127l12.017-6.309l-12.25-6.431c-0.621-0.326-1.363-0.326-1.984,0l-12.25,6.431 l12.017,6.309c0.376,0.198,0.8,0.303,1.225,0.303S24.849,35.325,25.225,35.127z" opacity=".07"/><linearGradient id="ldLw80Wb5w9tTRcKjgX8Gb" x1="6.773" x2="38.652" y1="8.098" y2="37.525" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2aa4f4"/><stop offset="1" stop-color="#007ad9"/></linearGradient><path fill="url(#ldLw80Wb5w9tTRcKjgX8Gb)" d="M23.008,13.316L6.256,22.11c-1.523,0.8-1.523,2.98,0,3.779l16.752,8.795 c0.621,0.326,1.363,0.326,1.984,0l16.752-8.795c1.523-0.8,1.523-2.98,0-3.779l-16.752-8.795 C24.371,12.989,23.629,12.989,23.008,13.316z"/><path d="M25.457,26.498l12.322-6.469l-12.787-6.713c-0.621-0.326-1.363-0.326-1.984,0l-12.787,6.713 l12.321,6.469c0.447,0.235,0.952,0.36,1.458,0.36S25.011,26.733,25.457,26.498z" opacity=".05"/><path d="M25.225,26.056l12.017-6.309l-12.25-6.431c-0.621-0.326-1.363-0.326-1.984,0l-12.25,6.431 l12.017,6.309c0.376,0.198,0.8,0.303,1.225,0.303S24.849,26.254,25.225,26.056z" opacity=".07"/><linearGradient id="ldLw80Wb5w9tTRcKjgX8Gc" x1="11.294" x2="43.173" y1="3.201" y2="32.627" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#75daff"/><stop offset="1" stop-color="#1ea2e4"/></linearGradient><path fill="url(#ldLw80Wb5w9tTRcKjgX8Gc)" d="M23.008,4.245L6.256,13.039c-1.523,0.8-1.523,2.98,0,3.779l16.752,8.795 c0.621,0.326,1.363,0.326,1.984,0l16.752-8.795c1.523-0.8,1.523-2.98,0-3.779L24.992,4.245C24.371,3.918,23.629,3.918,23.008,4.245z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

1
images/icons/icons8-archive-folder.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><linearGradient id="bwc2gTApiQRdrgZvACv8Ha" x1="24" x2="24" y1="6.708" y2="14.977" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#eba600"/><stop offset="1" stop-color="#c28200"/></linearGradient><path fill="url(#bwc2gTApiQRdrgZvACv8Ha)" d="M24.414,10.414l-2.536-2.536C21.316,7.316,20.553,7,19.757,7L5,7C3.895,7,3,7.895,3,9l0,30 c0,1.105,0.895,2,2,2l38,0c1.105,0,2-0.895,2-2V13c0-1.105-0.895-2-2-2l-17.172,0C25.298,11,24.789,10.789,24.414,10.414z"/><linearGradient id="bwc2gTApiQRdrgZvACv8Hb" x1="24" x2="24" y1="10.854" y2="40.983" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffd869"/><stop offset="1" stop-color="#fec52b"/></linearGradient><path fill="url(#bwc2gTApiQRdrgZvACv8Hb)" d="M21.586,14.414l3.268-3.268C24.947,11.053,25.074,11,25.207,11H43c1.105,0,2,0.895,2,2v26 c0,1.105-0.895,2-2,2H5c-1.105,0-2-0.895-2-2V15.5C3,15.224,3.224,15,3.5,15h16.672C20.702,15,21.211,14.789,21.586,14.414z"/><path fill="#c28200" d="M36,11.5v1c0,0.276-0.224,0.5-0.5,0.5H34c-0.552,0-1-0.448-1-1c0-0.552,0.448-1,1-1h1.5 C35.776,11,36,11.224,36,11.5z M34,14c0-0.552-0.448-1-1-1h-1.5c-0.276,0-0.5,0.224-0.5,0.5v1c0,0.276,0.224,0.5,0.5,0.5H33 C33.552,15,34,14.552,34,14z M33,16c0,0.552,0.448,1,1,1h1.5c0.276,0,0.5-0.224,0.5-0.5v-1c0-0.276-0.224-0.5-0.5-0.5H34 C33.448,15,33,15.448,33,16z M34,18c0-0.552-0.448-1-1-1h-1.5c-0.276,0-0.5,0.224-0.5,0.5v1c0,0.276,0.224,0.5,0.5,0.5H33 C33.552,19,34,18.552,34,18z M33,20c0,0.552,0.448,1,1,1h1.5c0.276,0,0.5-0.224,0.5-0.5v-1c0-0.276-0.224-0.5-0.5-0.5H34 C33.448,19,33,19.448,33,20z M33,24c0,0.552,0.448,1,1,1h1.5c0.276,0,0.5-0.224,0.5-0.5v-1c0-0.276-0.224-0.5-0.5-0.5H34 C33.448,23,33,23.448,33,24z M34,22c0-0.552-0.448-1-1-1h-1.5c-0.276,0-0.5,0.224-0.5,0.5v1c0,0.276,0.224,0.5,0.5,0.5H33 C33.552,23,34,22.552,34,22z"/><linearGradient id="bwc2gTApiQRdrgZvACv8Hc" x1="33.5" x2="33.5" y1="25.944" y2="37.581" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4b4b4b"/><stop offset="1" stop-color="#3b3b3b"/></linearGradient><path fill="url(#bwc2gTApiQRdrgZvACv8Hc)" d="M36.128,26.848C36.055,26.358,35.635,26,35.139,26h-3.279c-0.495,0-0.915,0.358-0.988,0.848 C30.603,28.65,30,32.761,30,33.5c0,1.933,1.567,3.5,3.5,3.5s3.5-1.567,3.5-3.5C37,32.761,36.397,28.65,36.128,26.848z M33.5,35 c-0.828,0-1.5-0.672-1.5-1.5s0.672-1.5,1.5-1.5s1.5,0.672,1.5,1.5S34.328,35,33.5,35z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

1
images/icons/icons8-discussion-forum.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><linearGradient id="dXHSUfh5hrWnbqlt~U9wLa" x1="16.293" x2="29.836" y1="5.793" y2="19.336" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#33bef0"/><stop offset="1" stop-color="#0a85d9"/></linearGradient><path fill="url(#dXHSUfh5hrWnbqlt~U9wLa)" d="M33,6H10C8.895,6,8,6.895,8,8v1H5.369C4.864,9,4.611,9.611,4.968,9.968L8,13v1 c0,1.105,0.895,2,2,2h23c1.105,0,2-0.895,2-2V8C35,6.895,34.105,6,33,6z"/><linearGradient id="dXHSUfh5hrWnbqlt~U9wLb" x1="23.069" x2="33.24" y1="21.569" y2="31.74" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#33bef0"/><stop offset="1" stop-color="#0a85d9"/></linearGradient><path fill="url(#dXHSUfh5hrWnbqlt~U9wLb)" d="M37,19H14c-1.105,0-2,0.895-2,2v1H9.369c-0.505,0-0.758,0.611-0.401,0.968L12,26v1 c0,1.105,0.895,2,2,2h23c1.105,0,2-0.895,2-2v-6C39,19.895,38.105,19,37,19z"/><linearGradient id="dXHSUfh5hrWnbqlt~U9wLc" x1="26.867" x2="39.133" y1="34.367" y2="46.633" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#33bef0"/><stop offset="1" stop-color="#0a85d9"/></linearGradient><path fill="url(#dXHSUfh5hrWnbqlt~U9wLc)" d="M41,32H18c-1.105,0-2,0.895-2,2v1h-2.631c-0.505,0-0.758,0.611-0.401,0.968L16,39v1 c0,1.105,0.895,2,2,2h23c1.105,0,2-0.895,2-2v-6C43,32.895,42.105,32,41,32z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

1
images/icons/icons8-important-book.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill="#d35230" d="M41,6v36c0,1.105-0.895,2-2,2h-5V4h5C40.105,4,41,4.895,41,6z"/><linearGradient id="dtB3~Rmk9s1reNExHNnKMa" x1="461.857" x2="461.857" y1="413.305" y2="410.163" gradientTransform="matrix(0 -1 -1 0 448.277 485.857)" gradientUnits="userSpaceOnUse"><stop offset=".441" stop-color="#999998"/><stop offset=".653" stop-color="#c1c1c0"/><stop offset=".88" stop-color="#e5e5e5"/><stop offset="1" stop-color="#f3f3f3"/></linearGradient><path fill="url(#dtB3~Rmk9s1reNExHNnKMa)" d="M39,6v36c0,1.105-0.895,2-2,2h-6V4h6C38.105,4,39,4.895,39,6z"/><linearGradient id="dtB3~Rmk9s1reNExHNnKMb" x1="3.638" x2="15.691" y1="-26.572" y2="-59.405" gradientTransform="matrix(1 0 0 -1 0 -18)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ca4e2a"/><stop offset="1" stop-color="#b63016"/></linearGradient><path fill="url(#dtB3~Rmk9s1reNExHNnKMb)" d="M7,6v36c0,1.105,0.895,2,2,2h2V4H9C7.895,4,7,4.895,7,6z"/><path fill="#ed6c47" d="M35,4H11v40h24c1.105,0,2-0.895,2-2V6C37,4.895,36.105,4,35,4z"/><path d="M25.892,31.233c-0.494-0.449-1.126-0.677-1.879-0.677c-0.744,0-1.376,0.224-1.878,0.665 c-0.524,0.458-0.79,1.053-0.79,1.767c0,0.684,0.259,1.271,0.771,1.75c0.502,0.468,1.14,0.705,1.896,0.705 c0.762,0,1.398-0.231,1.89-0.688c0.5-0.467,0.753-1.061,0.753-1.768C26.655,32.287,26.398,31.697,25.892,31.233z" opacity=".07"/><path d="M21.392,28.312l-0.406-13.521c-0.015-0.476,0.159-0.924,0.489-1.265 c0.33-0.34,0.774-0.527,1.25-0.527h2.525c0.468,0,0.923,0.193,1.25,0.529c0.326,0.336,0.504,0.797,0.489,1.265v0.001l-0.43,13.521 C26.529,29.261,25.766,30,24.821,30h-1.69C22.185,30,21.421,29.259,21.392,28.312z M26.228,30.864 c-0.588-0.536-1.334-0.808-2.216-0.808c-0.869,0-1.612,0.266-2.207,0.788c-0.628,0.55-0.96,1.291-0.96,2.144 c0,0.815,0.322,1.547,0.931,2.115c0.598,0.558,1.351,0.84,2.237,0.84c0.893,0,1.643-0.276,2.23-0.822 c0.597-0.557,0.913-1.294,0.913-2.133C27.155,32.152,26.835,31.419,26.228,30.864z" opacity=".05"/><path d="M23.131,29.5h1.69c0.673,0,1.218-0.527,1.239-1.2l0.43-13.521c0.011-0.338-0.113-0.658-0.349-0.901 c-0.235-0.243-0.552-0.377-0.89-0.377h-2.525c-0.339,0-0.656,0.134-0.891,0.376c-0.235,0.242-0.359,0.562-0.349,0.9l0.406,13.521 C21.913,28.972,22.457,29.5,23.131,29.5z" opacity=".07"/><path fill="#fff" d="M24.012,34.944c-0.628,0-1.146-0.19-1.555-0.571s-0.613-0.842-0.613-1.384 c0-0.565,0.206-1.029,0.619-1.39c0.412-0.361,0.928-0.541,1.549-0.541c0.628,0,1.143,0.183,1.543,0.547 c0.401,0.366,0.601,0.826,0.601,1.384c0,0.565-0.198,1.032-0.595,1.401C25.164,34.758,24.648,34.944,24.012,34.944z M25.99,14.763 L25.56,28.284C25.548,28.683,25.22,29,24.821,29h-1.69c-0.4,0-0.727-0.318-0.739-0.717l-0.406-13.52 C21.973,14.343,22.306,14,22.725,14h2.525C25.668,14,26.003,14.346,25.99,14.763z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

1
images/icons/icons8-puzzle.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><circle cx="22" cy="9" r="2" fill="#c767e5"/><circle cx="12" cy="9" r="2" fill="#c767e5"/><path fill="#c767e5" d="M34,9c0-1.1-0.9-2-2-2H22l-2,2c0,3,3,3,3,7c0,0.702-0.127,1.374-0.349,2H34V9z"/><path fill="#c767e5" d="M11,16c0-4,3-4,3-7l-2-2H2C0.9,7,0,7.9,0,9v9h11.349C11.127,17.374,11,16.702,11,16z"/><path fill="#a238c2" d="M34,39v-9H0v9c0,1.1,0.9,2,2,2h30C33.1,41,34,40.1,34,39z"/><path fill="#ba54d9" d="M34,29.806c0-1.854,2.204-2.772,3.558-1.507C38.513,29.19,39.75,30,42,30 c3.675,0,6.578-3.303,5.902-7.102c-0.572-3.218-3.665-5.24-6.909-4.838c-1.663,0.206-2.671,0.92-3.479,1.684 C36.185,20.998,34,20.028,34,18.2V18H22.651c-0.825,2.329-3.04,4-5.651,4s-4.827-1.671-5.651-4H0v12h34V29.806z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 786 B

1
images/illustrations/undraw_active_support.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

1
images/illustrations/undraw_education.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

1
images/illustrations/undraw_newsletter.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

4
setup/setup.js
View File

@@ -51,4 +51,6 @@ function ExecuteStep(sStep)
$('#wiz_form').data('installation_status', 'error');
WizardUpdateButtons();
} );
}
}
CombodoTooltip.InitAllNonInstantiatedTooltips();

5
setup/setuppage.class.inc.php
View File

@@ -39,9 +39,14 @@ class SetupPage extends NiceWebPage
{
parent::__construct($sTitle);
$this->add_linked_script("../js/jquery.blockUI.js");
$this->add_linked_script(utils::GetAbsoluteUrlAppRoot().'node_modules/@popperjs/core/dist/umd/popper.js');
$this->add_linked_script(utils::GetAbsoluteUrlAppRoot().'node_modules/tippy.js/dist/tippy-bundle.umd.js');
$this->add_linked_script("../setup/setup.js");
$this->add_linked_stylesheet(utils::GetAbsoluteUrlAppRoot().'css/font-awesome/css/all.min.css');
$this->add_linked_stylesheet(utils::GetAbsoluteUrlAppRoot().'css/font-combodo/font-combodo.css');
$this->add_linked_stylesheet(utils::GetAbsoluteUrlAppRoot().'node_modules/tippy.js/dist/tippy.css');
$this->add_linked_stylesheet(utils::GetAbsoluteUrlAppRoot().'node_modules/tippy.js/animations/shift-away-subtle.css');
$this->LoadTheme();
$this->add_saas("css/setup.scss");

87
setup/setuputils.class.inc.php
View File

@@ -1016,82 +1016,66 @@ class SetupUtils
$sWikiVersion = utils::GetItopVersionWikiSyntax(); //eg : '2_7_0';
$sMysqlTlsWikiPageUrl = 'https://www.itophub.io/wiki/page?id='.$sWikiVersion.':install:php_and_mysql_tls';
$oPage->add('<tr><td colspan="2">');
$oPage->add('<fieldset><legend>Database Server Connection</legend>');
$oPage->add('<table id="table_db_options">');
//-- DB connection params
$oPage->add('<tbody>');
$oPage->add('<tr><td>Server Name:</td><td><input id="db_server" type="text" name="db_server" value="'.htmlentities($sDBServer, ENT_QUOTES, 'UTF-8').'" size="15"/></td><td>E.g. "localhost", "dbserver.mycompany.com" or "192.142.10.23"</td></tr>');
$oPage->add('<tr><td>Login:</td><td><input id="db_user" type="text" name="db_user" value="'
$oPage->add('<tr><td>Server Name:</td><td><input id="db_server" class="ibo-input" type="text" name="db_server" value="'.htmlentities($sDBServer, ENT_QUOTES, 'UTF-8').'" size="15"/></td><td><i class="fas fa-question-circle setup-input--hint--icon" data-tooltip-content="E.g. \'localhost\', \'dbserver.mycompany.com\' or \'192.142.10.23\'"></i></td></tr>');
$oPage->add('<tr><td>Login:</td><td><input id="db_user" class="ibo-input" type="text" name="db_user" value="'
.htmlentities($sDBUser, ENT_QUOTES, 'UTF-8')
.'" size="15"/></td><td rowspan="2" style="vertical-align:top">The account must have the following privileges on the database: SELECT, INSERT, UPDATE, DELETE, DROP, CREATE, ALTER, CREATE VIEW, SHOW VIEW, LOCK TABLE, SUPER, TRIGGER</td></tr>');
$oPage->add('<tr><td>Password:</td><td><input id="db_pwd" autocomplete="off" type="password" name="db_pwd" value="'.htmlentities($sDBPwd, ENT_QUOTES, 'UTF-8').'" size="15"/></td></tr>');
$oPage->add('</tbody>');
.'" size="15"/></td><td><i class="fas fa-question-circle setup-input--hint--icon" data-tooltip-content="The account must have the following privileges on the database: SELECT, INSERT, UPDATE, DELETE, DROP, CREATE, ALTER, CREATE VIEW, SHOW VIEW, LOCK TABLE, SUPER, TRIGGER"></i></td></tr>');
$oPage->add('<tr><td>Password:</td><td><input id="db_pwd" class="ibo-input" autocomplete="off" type="password" name="db_pwd" value="'.htmlentities($sDBPwd, ENT_QUOTES, 'UTF-8').'" size="15"/></td></tr>');
$oPage->add('</tbody></table>');
//-- TLS params (N°1260)
$sTlsEnabledChecked = $bTlsEnabled ? ' checked' : '';
$sTlsCaDisabled = $bTlsEnabled ? '' : ' disabled';
$oPage->add('<tbody id="tls_options" class="collapsable-options">');
$oPage->add('<tr><th colspan="3" style="text-align: left; background-color: transparent"><label style="margin: 6em; font-weight: normal; color: #696969"><img style="vertical-align:bottom" id="db_tls_img">Use TLS encrypted connection</label></th></tr>');
$oPage->add('<tr style="display:none"><td colspan="3" class="message message-error">Before configuring MySQL with TLS encryption, read the documentation <a href="'.$sMysqlTlsWikiPageUrl.'" target="_blank">on Combodo\'s Wiki</a></td></tr>');
$oPage->add('<tr style="display:none"><td colspan="3"><label><input id="db_tls_enabled" type="checkbox"'.$sTlsEnabledChecked.' name="db_tls_enabled" value="1"> Encrypted connection enabled</label></td></tr>');
$oPage->add('<tr style="display:none"><td>SSL CA:</td>');
$oPage->add('<td><input id="db_tls_ca" autocomplete="off" type="text" name="db_tls_ca" value="'.htmlentities($sTlsCA,
ENT_QUOTES, 'UTF-8').'" size="15"'.$sTlsCaDisabled.'></td>');
$oPage->add('<td>Path to certificate authority file for SSL</td></tr>');
$oPage->add('</tbody>');
$oPage->add('<div id="tls_options" class="collapsable-options">');
$oPage->add('<span data-role="setup-collapsable-options--toggler"><img id="db_tls_img"><label>Use TLS encrypted connection</label></span>');
$oPage->add('<div class="message message-error" style="display:none;">Before configuring MySQL with TLS encryption, read the documentation <a href="'.$sMysqlTlsWikiPageUrl.'" target="_blank">on Combodo\'s Wiki</a></div>');
$oPage->add('<label style="display:none;"><input id="db_tls_enabled" type="checkbox" '.$sTlsEnabledChecked.' name="db_tls_enabled" value="1"> Encrypted connection enabled</label>');
$oPage->add('<div class="setup-tls--input--container" style="display:none">SSL CA:');
$oPage->add('<input id="db_tls_ca" class="ibo-input" autocomplete="off" type="text" name="db_tls_ca" value="'.htmlentities($sTlsCA,
ENT_QUOTES, 'UTF-8').'" size="15"'.$sTlsCaDisabled.'>');
$oPage->add('Path to certificate authority file for SSL</div>');
$oPage->add('</div>');
$oPage->add('</table>');
$oPage->add('</fieldset>');
$oPage->add('</td></tr>');
$oPage->add('<tr><td colspan="2"><div id="db_info"></div></td></tr>');
$oPage->add('<div id="db_info"></div>');
$oPage->add('<tr><td colspan="2">');
$oPage->add('');
$oPage->add('<fieldset><legend>Database</legend>');
$oPage->add('<table>');
if ($bIsItopInstall)
{
$oPage->add('<tr><td><input type="radio" id="create_db" name="create_db" value="yes"/><label for="create_db">&nbsp;Create a new database:</label></td>');
$oPage->add('<td><input id="db_new_name" type="text" name="db_new_name" value="'.htmlentities($sNewDBName, ENT_QUOTES, 'UTF-8').'" size="15" maxlength="32"/><span style="width:20px;" id="v_db_new_name"></span></td></tr>');
$oPage->add('<td><input id="db_new_name" class="ibo-input" type="text" name="db_new_name" value="'.htmlentities($sNewDBName, ENT_QUOTES, 'UTF-8').'" size="15" maxlength="32"/><span style="width:20px;" id="v_db_new_name"></span></td></tr>');
$oPage->add('<tr><td><input type="radio" id="existing_db" name="create_db" value="no"/><label for="existing_db">&nbsp;Use the existing database:</label></td>');
$oPage->add('<td id="db_name_container"><input id="db_name" name="db_name" size="15" maxlen="32" value="'.htmlentities($sDBName, ENT_QUOTES, 'UTF-8').'"/><span style="width:20px;" id="v_db_name"></span></td></tr>');
$oPage->add('</tbody>');
$oPage->add('<tbody id="prefix_option" class="collapsable-options">');
$oPage->add('<tr><th colspan="3" style="text-align: left; background-color: transparent"><label style="margin: 0.4em; font-weight: normal; color: #696969"><img style="vertical-align:bottom">Use shared database</label></th></tr>');
$oPage->add('<tr style="display:none"><td>Use a prefix for the tables:</td><td><input id="db_prefix" type="text" name="db_prefix" value="'.htmlentities($sDBPrefix,
ENT_QUOTES, 'UTF-8').'" size="15"/><span style="width:20px;" id="v_db_prefix"></span></td></tr>');
$oPage->add('</tbody>');
$oPage->add('<td id="db_name_container" class="ibo-input-select-wrapper"><input id="db_name" class="ibo-input ibo-input-select" name="db_name" size="15" maxlen="32" value="'.htmlentities($sDBName, ENT_QUOTES, 'UTF-8').'"/><span style="width:20px;" id="v_db_name"></span></td></tr>');
}
else
{
$oPage->add('<tr><td>Database Name:</td><td id="db_name_container"><input id="db_name" name="db_name" size="15" maxlen="32" value="'.htmlentities($sDBName, ENT_QUOTES, 'UTF-8').'"/><span style="width:20px;" id="v_db_name"></span></td></tr>');
$oPage->add('</tbody>');
$oPage->add('<tbody id="prefix_option" class="collapsable-options">');
$oPage->add('<tr><th colspan="3" style="text-align: left; background-color: transparent"><label style="margin: 0.4em; font-weight: normal; color: #696969"><img style="vertical-align:bottom">Use shared database</label></th></tr>');
$oPage->add('<tr style="display:none"><td>Use a prefix for the tables:</td><td><input id="db_prefix" type="text" name="db_prefix" value="'.htmlentities($sDBPrefix,
ENT_QUOTES, 'UTF-8').'" size="15"/><span style="width:20px;" id="v_db_prefix"></span></td></tr>');
$oPage->add('</tbody>');
$oPage->add('<tr><td>Database Name:</td><td id="db_name_container" class="ibo-input-select-wrapper"><input id="db_name" class="ibo-input ibo-input-select" name="db_name" size="15" maxlen="32" value="'.htmlentities($sDBName, ENT_QUOTES, 'UTF-8').'"/><span style="width:20px;" id="v_db_name"></span></td></tr>');
}
$oPage->add('</table>');
$oPage->add('<div id="prefix_option" class="collapsable-options">');
$oPage->add('<span data-role="setup-collapsable-options--toggler"><label style="font-weight: normal;"><img>Use shared database</label></span>');
$oPage->add('<div class="setup-prefix-toggler--input--container" style="display:none">Use a prefix for the tables:<input id="db_prefix" class="ibo-input" type="text" name="db_prefix" value="'.htmlentities($sDBPrefix,
ENT_QUOTES, 'UTF-8').'" size="15"/><span style="width:20px;" id="v_db_prefix"></span></div>');
$oPage->add('</div>');
$oPage->add('</fieldset>');
$oPage->add('<tr><td colspan="2"><span id="table_info">&nbsp;</span></td></tr>');
$oPage->add('</td></tr>');
$oPage->add('<span id="table_info"></span>');
// Sub options toggle (TLS, prefix)
$oPage->add_script(<<<'JS'
function toggleCollapsableOptions($tbody) {
$tbody.find("tr").not("tr:first-child").toggle();
$tbody.children().not(":first-child").toggle();
updateCollapsableImage($tbody);
}
function updateCollapsableImage($tbody) {
$collapsableImg = $tbody.find("tr:first-child>th>label>img");
imgPath = "../images/";
imgUrl = ($tbody.find("tr:nth-child(2)>td:visible").length > 0)
? "minus.gif"
: "plus.gif";
$collapsableImg.attr("src", imgPath+imgUrl);
$tbody.toggleClass('setup-is-opened');
}
JS
);
@@ -1101,17 +1085,14 @@ JS
}
$oPage->add_ready_script(
<<<'JS'
$("tbody.collapsable-options>tr>th>label").on('click', function() {
var $tbody = $(this).closest("tbody");
$("[data-role=\"setup-collapsable-options--toggler\"").on('click', function() {
var $tbody = $(this).closest("div");
toggleCollapsableOptions($tbody);
});
$("#db_tls_enabled").on('click', function() {
var bTlsEnabled = $("#db_tls_enabled").is(":checked");
$("#db_tls_ca").prop("disabled", !bTlsEnabled);
});
$("tbody.collapsable-options").each(function() {
updateCollapsableImage($(this));
})
JS
);
@@ -1206,13 +1187,13 @@ function ValidateField(sFieldId, bUsed)
}
else
{
$("#v_"+sFieldId).html('<img src="../images/validation_error.png" title="Only the characters [A-Za-z0-9_] are allowed"/>');
$("#v_"+sFieldId).html('<i class="fas fa-exclamation-triangle setup-invalid-field--icon" title="Only the characters [A-Za-z0-9_] are allowed"></i>');
return false;
}
}
else if (bMandatory)
{
$("#v_"+sFieldId).html('<img src="../images/validation_error.png" title="This field cannot be empty"/>');
$("#v_"+sFieldId).html('<i class="fas fa-exclamation-triangle setup-invalid-field--icon" title="This field cannot be empty"></i>');
return false;
}
else
@@ -1507,7 +1488,7 @@ JS
}
else
{
$sDBNameInput = '<select id="db_name" name="db_name">';
$sDBNameInput = '<select id="db_name" class="ibo-input ibo-input-select" name="db_name">';
foreach ($checks['databases'] as $sDatabaseName)
{
if ($sDatabaseName != 'information_schema')
@@ -1556,7 +1537,7 @@ JS
public static function GetLanguageSelect($sSourceDir, $sInputName, $sDefaultLanguageCode)
{
$sHtml = '<select id="'.$sInputName.'" name="'.$sInputName.'">';
$sHtml = '<div class="ibo-input-select-wrapper"><select id="'.$sInputName.'" class="ibo-input ibo-input-select" name="'.$sInputName.'">';
$sSourceDir = APPROOT.'dictionaries/';
$aLanguages = SetupUtils::GetAvailableLanguages($sSourceDir);
foreach ($aLanguages as $sCode => $aInfo) {
@@ -1564,7 +1545,7 @@ JS
$sHtml .= '<option value="'.$sCode.'" '.$sSelected.'>'.htmlentities($aInfo['description'], ENT_QUOTES,
'UTF-8').' ('.htmlentities($aInfo['localized_description'], ENT_QUOTES, 'UTF-8').')</option>';
}
$sHtml .= '</select></td></tr>';
$sHtml .= '</select></div>';
return $sHtml;
}

132
setup/wizardsteps.class.inc.php
View File

@@ -267,7 +267,7 @@ class WizStepInstallOrUpgrade extends WizardStep
{
$sUpgradeInfoStyle = ' style="display: none;" ';
}
$oPage->add('<h2>What do you want to do?</h2>');
$oPage->add('<div class="setup-content-title">What do you want to do?</div>');
$sChecked = ($sInstallMode == 'install') ? ' checked ' : '';
$oPage->p('<input id="radio_install" type="radio" name="install_mode" value="install" '.$sChecked.'/><label for="radio_install">&nbsp;Install a new '.ITOP_APPLICATION.'</label>');
$sChecked = ($sInstallMode == 'upgrade') ? ' checked ' : '';
@@ -276,12 +276,9 @@ class WizStepInstallOrUpgrade extends WizardStep
$sUpgradeDir = utils::HtmlEntities($sPreviousVersionDir);
$oPage->add(<<<HTML
<table id="upgrade_info"'.$sUpgradeInfoStyle.'>
<tr>
<td>Location on the disk:</td>
<td><input id="previous_version_dir_display" type="text" value="$sUpgradeDir" style="width: 98%;" disabled>
<input type="hidden" name="previous_version_dir" value="$sUpgradeDir"></td>
</tr>
<div id="upgrade_info"'.$sUpgradeInfoStyle.'>
<div class="setup-disk-location--input--container">Location on the disk:<input id="previous_version_dir_display" type="text" value="$sUpgradeDir" class="ibo-input" disabled>
<input type="hidden" name="previous_version_dir" value="$sUpgradeDir"></div>
HTML
);
@@ -307,19 +304,18 @@ HTML
}
$sChecked = ($bCanBackup && $bDBBackup) ? ' checked ' : '';
$sDisabled = $bCanBackup ? '' : ' disabled ';
$oPage->add('<tr><td colspan="2"><input id="db_backup" type="checkbox" name="db_backup" '.$sChecked.$sDisabled.' value="1"/><label for="db_backup">&nbsp;Backup the '.ITOP_APPLICATION.' database before upgrading</label></td></tr>');
$oPage->add('<tr><td style="width: 8rem; text-align: right;">Save the backup to:</td><td><input id="db_backup_path" type="text" name="db_backup_path"
$oPage->add('<input id="db_backup" type="checkbox" name="db_backup" '.$sChecked.$sDisabled.' value="1"/><label for="db_backup">Backup the '.ITOP_APPLICATION.' database before upgrading</label>');
$oPage->add('<div class="setup-backup--input--container">Save the backup to:<input id="db_backup_path" class="ibo-input" type="text" name="db_backup_path"
'.$sDisabled.'value="'
.htmlentities($sDBBackupPath, ENT_QUOTES, 'UTF-8').'" style="width: 98%;"/></td></tr>');
.htmlentities($sDBBackupPath, ENT_QUOTES, 'UTF-8').'"/></div>');
$fFreeSpace = SetupUtils::CheckDiskSpace($sDBBackupPath);
$sMessage = '';
if ($fFreeSpace !== false)
{
$sMessage .= SetupUtils::HumanReadableSize($fFreeSpace).' free in '.dirname($sDBBackupPath);
}
$oPage->add('<tr><td colspan="2">');
$oPage->add($sMySQLDumpMessage.'<br/><span id="backup_info" style="font-size:small;color:#696969;">'.$sMessage.'</span></td></tr>');
$oPage->add('</table>');
$oPage->add($sMySQLDumpMessage.'<span id="backup_info" style="font-size:small;color:#696969;">'.$sMessage.'</span>');
$oPage->add('</div>');
$sAuthentToken = $this->oWizard->GetParameter('authent', '');
$oPage->add('<input type="hidden" id="authent_token" value="'.$sAuthentToken.'"/>');
//$oPage->add('</fieldset>');
@@ -708,7 +704,7 @@ class WizStepLicense extends WizardStep
$oPage->add_style(
<<<CSS
fieldset ul {
max-height: 18em;
max-height: 30em;
overflow: auto;
}
CSS
@@ -724,7 +720,7 @@ CSS
foreach ($aLicenses as $oLicense)
{
$oPage->add('<li><b>'.$oLicense->product.'</b>, &copy; '.$oLicense->author.' is licensed under the <b>'.$oLicense->license_type.' license</b>. (<span class="toggle" id="toggle_'.$index.'">Details</span>)');
$oPage->add('<div id="license_'.$index.'" class="license_text" style="display:none;overflow:auto;max-height:10em;font-size:small;border:1px #696969 solid;margin-bottom:1em; margin-top:0.5em;padding:0.5em;"><pre>'.$oLicense->text.'</pre></div>');
$oPage->add('<div id="license_'.$index.'" class="license_text" style="display:none;overflow:auto;max-height:10em;font-size:12px;border:1px #696969 solid;margin-bottom:1em; margin-top:0.5em;padding:0.5em;"><pre>'.$oLicense->text.'</pre></div>');
$oPage->add_ready_script('$(".license_text a").attr("target", "_blank").addClass("no-arrow");');
$oPage->add_ready_script('$("#toggle_'.$index.'").on("click", function() { $("#license_'.$index.'").toggle(); } );');
$index++;
@@ -732,7 +728,7 @@ CSS
$oPage->add('</ul>');
$oPage->add('</fieldset>');
$sChecked = ($this->oWizard->GetParameter('accept_license', 'no') == 'yes') ? ' checked ' : '';
$oPage->p('<input type="checkbox" name="accept_license" id="accept" value="yes" '.$sChecked.'><label for="accept">&nbsp;I accept the terms of the licenses of the '.count($aLicenses).' components mentioned above.</label>');
$oPage->add('<div class="setup-accept-licenses"><input type="checkbox" name="accept_license" id="accept" value="yes" '.$sChecked.'><label for="accept">I accept the terms of the licenses of the '.count($aLicenses).' components mentioned above.</label></div>');
$oPage->add_ready_script('$("#accept").bind("click change", function() { WizardUpdateButtons(); });');
}
@@ -890,9 +886,9 @@ class WizStepAdminAccount extends WizardStep
$oPage->add('<fieldset>');
$oPage->add('<legend>Administrator Account</legend>');
$oPage->add('<table>');
$oPage->add('<tr><td>Login: </td><td><input id="admin_user" name="admin_user" type="text" size="25" maxlength="64" value="'.htmlentities($sAdminUser, ENT_QUOTES, 'UTF-8').'"><span id="v_admin_user"/></td><tr>');
$oPage->add('<tr><td>Password: </td><td><input id="admin_pwd" autocomplete="off" name="admin_pwd" type="password" size="25" maxlength="64" value="'.htmlentities($sAdminPwd, ENT_QUOTES, 'UTF-8').'"><span id="v_admin_pwd"/></td><tr>');
$oPage->add('<tr><td>Confirm password: </td><td><input id="confirm_pwd" autocomplete="off" name="confirm_pwd" type="password" size="25" maxlength="64" value="'.htmlentities($sConfirmPwd, ENT_QUOTES, 'UTF-8').'"></td><tr>');
$oPage->add('<tr><td>Login: </td><td><input id="admin_user" class="ibo-input" name="admin_user" type="text" size="25" maxlength="64" value="'.htmlentities($sAdminUser, ENT_QUOTES, 'UTF-8').'"><span id="v_admin_user"/></td></tr>');
$oPage->add('<tr><td>Password: </td><td><input id="admin_pwd" class="ibo-input" autocomplete="off" name="admin_pwd" type="password" size="25" maxlength="64" value="'.htmlentities($sAdminPwd, ENT_QUOTES, 'UTF-8').'"><span id="v_admin_pwd"/></td></tr>');
$oPage->add('<tr><td>Confirm password: </td><td><input id="confirm_pwd" class="ibo-input" autocomplete="off" name="confirm_pwd" type="password" size="25" maxlength="64" value="'.htmlentities($sConfirmPwd, ENT_QUOTES, 'UTF-8').'"></td></tr>');
$sSourceDir = APPROOT.'dictionaries/';
$aLanguages = SetupUtils::GetAvailableLanguages($sSourceDir);
$oPage->add('<tr><td>Language: </td><td>');
@@ -920,7 +916,7 @@ EOF
bRet = ($('#admin_user').val() != '');
if (!bRet)
{
$("#v_admin_user").html('<img src="../images/validation_error.png" title="This field cannot be empty"/>');
$("#v_admin_user").html('<i class="fas fa-exclamation-triangle setup-invalid-field--icon" title="This field cannot be empty"></i>');
}
else
{
@@ -930,7 +926,7 @@ EOF
bPasswordsMatch = ($('#admin_pwd').val() == $('#confirm_pwd').val());
if (!bPasswordsMatch)
{
$('#v_admin_pwd').html('<img src="../images/validation_error.png" title="Retyped password do not match"/>');
$('#v_admin_pwd').html('<i class="fas fa-exclamation-triangle setup-invalid-field--icon" title="Retyped password does not match"></i>');
}
else
{
@@ -1022,17 +1018,17 @@ class WizStepInstallMiscParams extends AbstractWizStepMiscParams
$oPage->add('<fieldset>');
$oPage->add('<legend>Application URL</legend>');
$oPage->add('<table>');
$oPage->add('<tr><td>URL: </td><td><input id="application_url" name="application_url" type="text" size="35" maxlength="1024" value="'.htmlentities($sApplicationURL, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_application_url"/></td><tr>');
$oPage->add('<tr><td colspan="2"><div class="message message-warning">Change the value above if the end-users will be accessing the application by another path due to a specific configuration of the web server.</div></td><tr>');
$oPage->add('<tr><td>URL: </td><td><input id="application_url" class="ibo-input" name="application_url" type="text" size="35" maxlength="1024" value="'.htmlentities($sApplicationURL, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_application_url"/></td><tr>');
$oPage->add('</table>');
$oPage->add('<div class="message message-warning">Change the value above if the end-users will be accessing the application by another path due to a specific configuration of the web server.</div>');
$oPage->add('</fieldset>');
$oPage->add('<fieldset>');
$oPage->add('<legend>Path to Graphviz\' dot application</legend>');
$oPage->add('<table style="width: 100%;">');
$oPage->add('<tr><td>Path: </td><td><input id="graphviz_path" name="graphviz_path" type="text" size="35" maxlength="1024" value="'.htmlentities($sGraphvizPath, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_graphviz_path"/></td><tr>');
$oPage->add('<tr><td colspan="2"><a href="http://www.graphviz.org" target="_blank">Graphviz</a> is required to display the impact analysis graph (i.e. impacts / depends on).</td><tr>');
$oPage->add('<tr><td colspan="2"><span id="graphviz_status"></span></td><tr>');
$oPage->add('<table>');
$oPage->add('<tr><td>Path: </td><td><input id="graphviz_path" class="ibo-input" name="graphviz_path" type="text" size="35" maxlength="1024" value="'.htmlentities($sGraphvizPath, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_graphviz_path"/></td>');
$oPage->add('<td><i class="fas fa-question-circle setup-input--hint--icon" data-tooltip-content="Graphviz is required to display the impact analysis graph (i.e. impacts / depends on)."></i></td><tr>');
$oPage->add('</table>');
$oPage->add('<span id="graphviz_status"></span>');
$oPage->add('</fieldset>');
$oPage->add('<fieldset>');
$oPage->add('<legend>Sample Data</legend>');
@@ -1170,17 +1166,17 @@ class WizStepUpgradeMiscParams extends AbstractWizStepMiscParams
$oPage->add('<fieldset>');
$oPage->add('<legend>Application URL</legend>');
$oPage->add('<table>');
$oPage->add('<tr><td>URL: </td><td><input id="application_url" name="application_url" type="text" size="35" maxlength="1024" value="'.htmlentities($sApplicationURL, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_application_url"/></td><tr>');
$oPage->add('<tr><td colspan="2"><div class="message message-warning">Change the value above if the end-users will be accessing the application by another path due to a specific configuration of the web server.</div></td><tr>');
$oPage->add('<tr><td>URL: </td><td><input id="application_url" class="ibo-input" name="application_url" type="text" size="35" maxlength="1024" value="'.htmlentities($sApplicationURL, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_application_url"/></td><tr>');
$oPage->add('</table>');
$oPage->add('<div class="message message-warning">Change the value above if the end-users will be accessing the application by another path due to a specific configuration of the web server.</div>');
$oPage->add('</fieldset>');
$oPage->add('<fieldset>');
$oPage->add('<legend>Path to Graphviz\' dot application</legend>');
$oPage->add('<table style="width: 100%;">');
$oPage->add('<tr><td>Path: </td><td><input id="graphviz_path" name="graphviz_path" type="text" size="35" maxlength="1024" value="'.htmlentities($sGraphvizPath, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_graphviz_path"/></td><tr>');
$oPage->add('<tr><td colspan="2"><a href="http://www.graphviz.org" target="_blank">Graphviz</a> is required to display the impact analysis graph (i.e. impacts / depends on).</td><tr>');
$oPage->add('<tr><td colspan="2"><span id="graphviz_status"></span></td><tr>');
$oPage->add('<table>');
$oPage->add('<tr><td>Path: </td><td><input id="graphviz_path" class="ibo-input" name="graphviz_path" type="text" size="35" maxlength="1024" value="'.htmlentities($sGraphvizPath, ENT_QUOTES, 'UTF-8').'" style="width: 100%;box-sizing: border-box;"><span id="v_graphviz_path"/></td>');
$oPage->add('<td><i class="fas fa-question-circle setup-input--hint--icon" data-tooltip-content="Graphviz is required to display the impact analysis graph (i.e. impacts / depends on)."></i></td><tr>');
$oPage->add('</table>');
$oPage->add('<span id="graphviz_status"></span>');
$oPage->add('</fieldset>');
$sAuthentToken = $this->oWizard->GetParameter('authent', '');
$oPage->add('<input type="hidden" id="authent_token" value="'.$sAuthentToken.'"/>');
@@ -1416,7 +1412,7 @@ class WizStepModulesChoice extends WizardStep
$oPage->warning($sManualInstallError);
}
$oPage->add('<table class="module-selection-banner"><tr>');
$oPage->add('<div class="module-selection-banner">');
$sBannerPath = isset($aStepInfo['banner']) ? $aStepInfo['banner'] : '';
if (!empty($sBannerPath))
{
@@ -1432,11 +1428,11 @@ class WizStepModulesChoice extends WizardStep
$sRealPath = realpath($sFullPath);
$sBannerUrl = utils::GetDefaultUrlAppRoot(true).str_replace(realpath(APPROOT), '', $sRealPath);
}
$oPage->add('<td><img src="'.$sBannerUrl.'"/><td>');
$oPage->add('<img src="'.$sBannerUrl.'"/>');
}
$sDescription = isset($aStepInfo['description']) ? $aStepInfo['description'] : '';
$oPage->add('<td>'.$sDescription.'<td>');
$oPage->add('</tr></table>');
$oPage->add('<span>'.$sDescription.'</span>');
$oPage->add('</div>');
// Build the default choices
$aDefaults = $this->GetDefaults($aStepInfo, $aModules);
@@ -1902,7 +1898,7 @@ EOF
$aStepDefinition = array(
'title' => 'Extensions',
'description' => '<h2>Select additional extensions to install. You can launch the installation again to install new extensions, but you cannot remove already installed extensions.</h2>',
'banner' => '/images/extension.png',
'banner' => '/images/icons/icons8-puzzle.svg',
'options' => array()
);
@@ -1935,7 +1931,7 @@ EOF
$aStepDefinition = array(
'title' => 'Modules Selection',
'description' => '<h2>Select the modules to install. You can launch the installation again to install new modules, but you cannot remove already installed modules.</h2>',
'banner' => '/images/modules.png',
'banner' => '/images/icons/icons8-apps-tab.svg',
'options' => array()
);
foreach($this->oExtensionsMap->GetAllExtensions() as $oExtension)
@@ -2192,48 +2188,6 @@ class WizStepSummary extends WizardStep
public function Display(WebPage $oPage)
{
$oPage->add_style(
<<<CSS
#params_summary {
overflow: auto;
}
#params_summary div {
width:100%;
margin-top:0;
padding-top: 0.5em;
padding-left: 0;
}
#params_summary div ul {
margin-left:0;
padding-left: 20px;
}
#params_summary div.closed ul {
display:none;
}
#params_summary div li {
list-style: none;
width: 100%;
margin-left:0;
padding-left: 0em;
}
.title {
padding-left: 20px;
font-weight: bold;
cursor: pointer;
}
#params_summary div.closed .title {
background: url(../images/plus.gif) 2px 2px no-repeat;
}
#progress_content {
height: 200px;
overflow: auto;
text-align: center;
}
#installation_progress {
display: none;
}
CSS
);
$aInstallParams = $this->BuildConfig();
@@ -2272,7 +2226,7 @@ CSS
}
$oPage->add('</ul></div>');
$oPage->add('<div><span class="title ibo-setup-summary-title">Data Model Configuration</span>');
$oPage->add('<div class="closed"><span class="title ibo-setup-summary-title">Data Model Configuration</span>');
$oPage->add($this->oWizard->GetParameter('display_choices'));
$oPage->add('</div>');
@@ -2593,7 +2547,7 @@ class WizStepDone extends WizardStep
{
// To mitigate security risks: pass only the filename without the extension, the download will add the extension itself
$oPage->p('Your backup is ready');
$oPage->p('<a style="background:transparent;" href="'.utils::GetAbsoluteUrlAppRoot(true).'setup/ajax.dataloader.php?operation=async_action&step_class=WizStepDone&params[backup]='.urlencode($sBackupDestination).'&authent='.$this->oWizard->GetParameter('authent','').'" target="_blank"><img src="../images/tar.png" style="border:0;vertical-align:middle;">&nbsp;Download '.basename($sBackupDestination).'</a>');
$oPage->p('<a style="background:transparent;" href="'.utils::GetAbsoluteUrlAppRoot(true).'setup/ajax.dataloader.php?operation=async_action&step_class=WizStepDone&params[backup]='.urlencode($sBackupDestination).'&authent='.$this->oWizard->GetParameter('authent','').'" target="_blank"><img src="../images/icons/icons8-archive-folder.svg" style="border:0;vertical-align:middle;">&nbsp;Download '.basename($sBackupDestination).'</a>');
}
else
{
@@ -2602,11 +2556,11 @@ class WizStepDone extends WizardStep
}
// Form goes here.. No back button since the job is done !
$oPage->add('<table id="placeholder" style="width:600px;border:0;padding:0;"><tr>');
$oPage->add("<td><a style=\"background:transparent;padding:0;\" title=\"Subscribe to Combodo Newsletter.\" href=\"https://www.combodo.com/newsletter-subscription?var_mode=recalcul\" target=\"_blank\"><img style=\"border:0\" src=\"../images/setup-register.gif\"/></td></a>");
$oPage->add("<td><a style=\"background:transparent;padding:0;\" title=\"Get Professional Support from Combodo\" href=\"https://support.combodo.com\" target=\"_blank\"><img style=\"border:0\" src=\"../images/setup-support.gif\"/></td></a>");
$oPage->add("<td><a style=\"background:transparent;padding:0;\" title=\"Get Professional Training from Combodo\" href=\"http://www.combodo.com/training\" target=\"_blank\"><img style=\"border:0\" src=\"../images/setup-training.gif\"/></td></a>");
$oPage->add('</tr></table>');
$oPage->add('<div id="placeholder" class="setup-end-placeholder">');
$oPage->add("<div><a class=\"ibo-svg-illustration--container\" title=\"Subscribe to Combodo Newsletter.\" href=\"https://www.combodo.com/newsletter-subscription?var_mode=recalcul\" target=\"_blank\">".file_get_contents(APPROOT.'images/illustrations/undraw_newsletter.svg')." Register now</a></div>");
$oPage->add("<div><a class=\"ibo-svg-illustration--container\" title=\"Get Professional Support from Combodo\" href=\"https://support.combodo.com\" target=\"_blank\">".file_get_contents(APPROOT.'images/illustrations/undraw_active_support.svg')."Get professional support</a></div>");
$oPage->add("<div><a class=\"ibo-svg-illustration--container\" title=\"Get Professional Training from Combodo\" href=\"http://www.combodo.com/training\" target=\"_blank\">".file_get_contents(APPROOT.'images/illustrations/undraw_education.svg')."Get professional training</a></div>");
$oPage->add('</div>');
$oPage->add('</div>');
@@ -2711,7 +2665,7 @@ class WizStepDone extends WizardStep
}
$sImgUrl .= '&m='.urlencode(implode(' ', $aReportedModules));
$oPage->add('<img style="border:0" src="'.$sImgUrl.'"/>');
$oPage->add('<img style="visibility: hidden;border:0" src="'.$sImgUrl.'"/>');
$sForm = addslashes($sForm);
$oPage->add_ready_script("$('#wiz_form').after('$sForm');");
SetupUtils::EraseSetupToken();