baculum: Wizards view improvements

diff --git a/gui/baculum/protected/API/Pages/Panel/APIInstallWizard.page b/gui/baculum/protected/API/Pages/Panel/APIInstallWizard.page
index bc0e7f4f9dad2432a3bab289a7002bc1ad4f2b77..92d43f394a05e88a33c234c59c316d62f526d591 100644 (file)
--- a/gui/baculum/protected/API/Pages/Panel/APIInstallWizard.page
+++ b/gui/baculum/protected/API/Pages/Panel/APIInstallWizard.page
@@ -68,10 +68,10 @@
                </com:TWizardStep>
                <com:TWizardStep ID="Step2" Title="<%[ Step 2 - share the Bacula Catalog Database ]%>" StepType="Auto">
                        <p><%[ Do you want to setup and to share the Bacula Catalog Database access for this API instance? ]%></p>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="DatabaseNo" GroupName="SelectDatabase" Attributes.onclick="$('#configure_database').hide();" /> <com:TLabel ForControl="DatabaseNo" Text="<%[ No ]%>" />
                        </div>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="DatabaseYes" GroupName="SelectDatabase" Attributes.onclick="$('#configure_database').show();" /> <com:TLabel ForControl="DatabaseYes" Text="<%[ Yes ]%>" />
                        </div>
                        <div id="configure_database" style="display: <%=($this->DatabaseYes->Checked === true) ? '' : 'none';%>">
@@ -233,10 +233,10 @@
                </com:TWizardStep>
                <com:TWizardStep ID="Step3" Title="<%[ Step 3 - share the Bacula Bconsole commands interface ]%>" StepType="Auto">
                        <p><%[ Do you want to setup and share the Bacula Bconsole interface to execute commands in this API instance? ]%></p>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="ConsoleNo" GroupName="SelectConsole" Attributes.onclick="$('#configure_console').hide();" /> <com:TLabel ForControl="ConsoleNo" Text="<%[ No ]%>" />
                        </div>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="ConsoleYes" GroupName="SelectConsole" Attributes.onclick="$('#configure_console').show();" /> <com:TLabel ForControl="ConsoleYes" Text="<%[ Yes ]%>" />
                        </div>
                        <div id="configure_console" style="display: <%=($this->ConsoleYes->Checked === true) ? '' : 'none';%>">
@@ -286,25 +286,25 @@
                                                </table>
                                        </div>
                                </div>
-                               <div class="line">
+                               <div class="line left">
                                        <span><b><%[ NOTE! ]%></b><br /><em><%[ Baculum needs access to bconsole by the web server. ]%></em></span>
                                </div>
                        </div>
                </com:TWizardStep>
                <com:TWizardStep ID="Step4" Title="<%[ Step 4 - share the Bacula configuration interface ]%>" StepType="Auto">
                        <p><%[ Do you want to setup and share the Bacula configuration interface to configure Bacula components via this API instance? ]%></p>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="ConfigNo" GroupName="SelectConfig" Attributes.onclick="$('#configure_config').hide();" /> <com:TLabel ForControl="ConfigNo" Text="<%[ No ]%>" />
                        </div>
-                       <div class="line">
+                       <div class="line left">
                                <com:TRadioButton ID="ConfigYes" GroupName="SelectConfig" Attributes.onclick="$('#configure_config').show();" /> <com:TLabel ForControl="ConfigYes" Text="<%[ Yes ]%>" />
                        </div>
-                       <div id="configure_config" style="display: <%=($this->ConfigYes->Checked === true) ? '' : 'none';%>">
+                       <div id="configure_config" style="display: <%=($this->ConfigYes->Checked === true) ? 'block' : 'none';%>">
                                <div id="config_fields">
                                        <fieldset class="config_field">
                                                <legend><%[ General configuration ]%></legend>
                                                <div class="config_lines">
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BConfigDir" Text="<%[ Directory path for new config files: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TRequiredFieldValidator ValidationGroup="ConfigGroup" ControlToValidate="BConfigDir" Display="Dynamic" Text="<%[ Directory path field is required. ]%>" />
@@ -312,7 +312,7 @@
                                                                        <com:TTextBox ID="BConfigDir" CssClass="textbox" />
                                                                </div>
                                                        </div>
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BJSONUseSudo" Text="<%[ Use sudo: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCheckBox ID="BJSONUseSudo" />
@@ -326,14 +326,14 @@
                                        <fieldset class="config_field">
                                                <legend>Director</legend>
                                                <div class="config_lines">
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BDirJSONPath" Text="<%[ bdirjson binary file path: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="BDirJSONPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
                                                                        <com:TTextBox ID="BDirJSONPath" CssClass="textbox" />
                                                                </div>
                                                        </div>
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="DirCfgPath" Text="<%[ Main Director config file path (usually bacula-dir.conf): ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="DirCfgPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
@@ -348,14 +348,14 @@
                                        <fieldset class="config_field">
                                                <legend>Storage Daemon</legend>
                                                <div class="config_lines">
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BSdJSONPath" Text="<%[ bsdjson binary file path: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="BSdJSONPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
                                                                        <com:TTextBox ID="BSdJSONPath" CssClass="textbox" />
                                                                </div>
                                                        </div>
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="SdCfgPath" Text="<%[ Main Storage Daemon config file path (usually bacula-sd.conf): ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="SdCfgPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
@@ -370,14 +370,14 @@
                                        <fieldset class="config_field">
                                                <legend>File Daemon/Client</legend>
                                                <div class="config_lines">
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BFdJSONPath" Text="<%[ bfdjson binary file path: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="BFdJSONPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
                                                                        <com:TTextBox ID="BFdJSONPath" CssClass="textbox" />
                                                                </div>
                                                        </div>
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="FdCfgPath" Text="<%[ Main File Daemon config file path (usually bacula-fd.conf): ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="FdCfgPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
@@ -392,14 +392,14 @@
                                        <fieldset class="config_field">
                                                <legend>Bconsole</legend>
                                                <div class="config_lines">
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BBconsJSONPath" Text="<%[ bbconsjson binary file path: ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="BBconsJSONPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
                                                                        <com:TTextBox ID="BBconsJSONPath" CssClass="textbox" />
                                                                </div>
                                                        </div>
-                                                       <div class="line">
+                                                       <div class="line left">
                                                                <div class="text"><com:TLabel ForControl="BconsCfgPath" Text="<%[ Admin Bconsole config file path (usually bconsole.conf): ]%>" /></div>
                                                                <div class="field">
                                                                        <com:TCustomValidator ValidationGroup="ConfigGroup" ControlToValidate="BconsCfgPath" ClientValidationFunction="bjsontools_validator" Display="Dynamic" Text="<%[ There is required to provide both binary file and config file paths. ]%>" />
@@ -426,7 +426,7 @@
                        </div>
                </com:TWizardStep>
                <com:TWizardStep ID="Step5" Title="<%[ Step 5 - authorization to API ]%>" StepType="Auto">
-                       <div class="line">
+                       <div class="line left" style="width:500px; margin: 0 auto">
                                <com:TActiveRadioButton
                                        ID="AuthOAuth2"
                                        GroupName="SelectAuth"
@@ -438,7 +438,7 @@
                                        Text="<%[ Use OAuth2 for authorization and authentication ]%>"
                                />
                        </div>
-                       <div class="line">
+                       <div class="line left" style="width:500px; margin: 0 auto">
                                <com:TActiveRadioButton
                                        ID="AuthBasic"
                                        GroupName="SelectAuth"

diff --git a/gui/baculum/protected/Web/Layouts/Wizard.tpl b/gui/baculum/protected/Web/Layouts/Wizard.tpl
index 2111b93e76c8b3481f6d2f9ea1df75ad0eed46a3..b3b0ca9d27c21885d51e1c7e34fd3fa14f3fca43 100644 (file)
--- a/gui/baculum/protected/Web/Layouts/Wizard.tpl
+++ b/gui/baculum/protected/Web/Layouts/Wizard.tpl
@@ -3,7 +3,11 @@
        <com:THead Title="Baculum - Bacula Web Interface" ShortcutIcon="<%=$this->getPage()->getTheme()->getBaseUrl()%>/favicon.ico" />
        <body>
                <com:TForm>
+                               <com:TClientScript PradoScripts="prado" />
+                               <com:TClientScript ScriptUrl=<%~ ../JavaScript/opentip.js %> />
+                               <com:TClientScript ScriptUrl=<%~ ../JavaScript/tooltip.js %> />
                                <com:TClientScript ScriptUrl=<%~ ../JavaScript/misc.js %> />
+                               <com:TClientScript ScriptUrl=<%~ ../JavaScript/slide-window.js %> />
                                <com:TContentPlaceHolder ID="Wizard" />
                </com:TForm>
        </body>

diff --git a/gui/baculum/protected/Web/Pages/WebConfigWizard.page b/gui/baculum/protected/Web/Pages/WebConfigWizard.page
index eed2fbea3f12f017f4ab11e92788cf37979274e2..91958492597144cc14ebe8f13a26a96d35c8e24e 100644 (file)
--- a/gui/baculum/protected/Web/Pages/WebConfigWizard.page
+++ b/gui/baculum/protected/Web/Pages/WebConfigWizard.page
@@ -3,7 +3,7 @@
        <com:TWizard ID="InstallWizard"
                CssClass="wizard"
                StepStyle.CssClass="steps"
-               HeaderStyle.CssClass="header"
+               HeaderStyle.CssClass="wizard-body"
                NavigationStyle.CssClass="navigation"
                UseDefaultLayout="false"
                ShowSideBar="false"
@@ -11,7 +11,7 @@
                OnCompleteButtonClick="wizardCompleted"
                >
                <prop:HeaderTemplate>
-                       <div class="steps-bar">
+                       <div>
                                <div class="step step-<%=($this->Parent->ActiveStepIndex === 0) ? 'first-active' : (($this->Parent->ActiveStepIndex === 1) ? 'first-next-active' : 'first')%>">
                                        <div><com:TTranslate Text="Language" /></div>
                                </div>

diff --git a/gui/baculum/themes/Baculum-v1/step-head.png b/gui/baculum/themes/Baculum-v1/step-head.png
new file mode 100644 (file)
index 0000000..e7c0902
Binary files /dev/null and b/gui/baculum/themes/Baculum-v1/step-head.png differ

diff --git a/gui/baculum/themes/Baculum-v1/step-last-1.png b/gui/baculum/themes/Baculum-v1/step-last-1.png
new file mode 100644 (file)
index 0000000..c8dde10
Binary files /dev/null and b/gui/baculum/themes/Baculum-v1/step-last-1.png differ

diff --git a/gui/baculum/themes/Baculum-v1/step-last-active-1.png b/gui/baculum/themes/Baculum-v1/step-last-active-1.png
new file mode 100644 (file)
index 0000000..ad409c2
Binary files /dev/null and b/gui/baculum/themes/Baculum-v1/step-last-active-1.png differ

diff --git a/gui/baculum/themes/Baculum-v1/step-last-active.png b/gui/baculum/themes/Baculum-v1/step-last-active.png
deleted file mode 100644 (file)
index b6f2882..0000000
Binary files a/gui/baculum/themes/Baculum-v1/step-last-active.png and /dev/null differ

diff --git a/gui/baculum/themes/Baculum-v1/step-last.png b/gui/baculum/themes/Baculum-v1/step-last.png
deleted file mode 100644 (file)
index 9fbc6b6..0000000
Binary files a/gui/baculum/themes/Baculum-v1/step-last.png and /dev/null differ

diff --git a/gui/baculum/themes/Baculum-v1/style.css b/gui/baculum/themes/Baculum-v1/style.css
index 49badceabcb87c6192383e6115085ebd51ed01aa..7f6234296fa8043ee2ae6d12ea02ddec2371a42a 100644 (file)
--- a/gui/baculum/themes/Baculum-v1/style.css
+++ b/gui/baculum/themes/Baculum-v1/style.css
@@ -174,7 +174,7 @@ a.big {
 
 div.configuration {
        width: 45%;
-       height: 575px;
+       height: 100%;
        margin: 12px;
        float: right;
        background-color: #898889;
@@ -187,6 +187,7 @@ div.configuration {
 #configuration {
        position: absolute;
        width: 100%;
+       height: 99%;
 }
 
 #configuration div.field select {
@@ -200,7 +201,7 @@ div.configuration {
 div.configuration-progress {
        background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
        width: 45%;
-       height: 575px;
+       height: 100%;
        z-index: 10;
        position: absolute;
        top: 12px;
@@ -542,31 +543,21 @@ tr.file-browser-element {
 
 tr.file-browser-element td {
        font-style: italic;
-       padding: 3px 0;
+       min-height: 36px;
        vertical-align: middle;
 }
 
-tr.file-browser-element:hover {
+tr.file-browser-element td:hover {
        cursor: move;
 }
 
-tr.file-browser-element:hover td{
+tr.file-browser-element td:hover {
        background-color: #aeb2b6;
 }
 
-tr.file-browser-header {
-       height: 25px;
-       text-align: left;
-       font-family: monospace;
-       font-size: 9px
-}
-
-tr.file-browser-header th {
-       padding-left: 9px;
-}
-
 .draggable {
        cursor: move;
+       min-height: 30px;
 }
 
 div.slide-window-bar {
@@ -1065,13 +1056,18 @@ span.tab_active {
 }
 
 .config_lines {
-       width: 533px;
+       width: 590px;
        float: left;
 }
 
+
+.config_lines div.field {
+       width: 280px !important;
+}
+
 #config_fields {
        width: 732px;
-       margin-left: 8px;
+       margin: 0 auto;
        padding-top: 7px;
 }
 
@@ -1246,3 +1242,10 @@ label.normal {
 .error {
        color: red;
 }
+
+/* START Overwrite opentip styles */
+.ot-header h1 {
+       font-size: 16px;
+       word-wrap: break-word;
+}
+/* END Overwrite opentip styles */

diff --git a/gui/baculum/themes/Baculum-v1/wizard-bottom-1.png b/gui/baculum/themes/Baculum-v1/wizard-bottom-1.png
new file mode 100644 (file)
index 0000000..c8f9e11
Binary files /dev/null and b/gui/baculum/themes/Baculum-v1/wizard-bottom-1.png differ

diff --git a/gui/baculum/themes/Baculum-v1/wizard-bottom.png b/gui/baculum/themes/Baculum-v1/wizard-bottom.png
deleted file mode 100644 (file)
index e3b991f..0000000
Binary files a/gui/baculum/themes/Baculum-v1/wizard-bottom.png and /dev/null differ

diff --git a/gui/baculum/themes/Baculum-v1/wizard-content.png b/gui/baculum/themes/Baculum-v1/wizard-content.png
deleted file mode 100644 (file)
index 01bdfb5..0000000
Binary files a/gui/baculum/themes/Baculum-v1/wizard-content.png and /dev/null differ

diff --git a/gui/baculum/themes/Baculum-v1/wizard-header-1.png b/gui/baculum/themes/Baculum-v1/wizard-header-1.png
new file mode 100644 (file)
index 0000000..9101fa1
Binary files /dev/null and b/gui/baculum/themes/Baculum-v1/wizard-header-1.png differ

diff --git a/gui/baculum/themes/Baculum-v1/wizard-header.png b/gui/baculum/themes/Baculum-v1/wizard-header.png
deleted file mode 100644 (file)
index 0bfda5f..0000000
Binary files a/gui/baculum/themes/Baculum-v1/wizard-header.png and /dev/null differ

diff --git a/gui/baculum/themes/Baculum-v1/wizard.css b/gui/baculum/themes/Baculum-v1/wizard.css
index 98a99d9daf127020b7c457e77b6bd6526e2738ee..dd0ea6f68fbc4996215d6d85954c3dcc45784c23 100644 (file)
--- a/gui/baculum/themes/Baculum-v1/wizard.css
+++ b/gui/baculum/themes/Baculum-v1/wizard.css
@@ -1,28 +1,40 @@
 .wizard {
+       min-height: 547px;
+       width: 1024px;
        margin: 50px auto;
-       height: 547px;
-       width: 752px;
        font-family: Arial;
        color: white;
- }
- 
+       background-color: #585756;
+       background-image: url('step-head.png');
+       background-repeat: repeat-x;
+       border: 1px solid black;
+       border-radius: 15px;
+}
+
 .steps {
        padding: 8px 20px;
-       min-height: 435px;
-       background-image: url('wizard-content.png');
-       background-repeat: repeat-y;
- }
+}
 
-.steps-bar {
-       background-image: url('step-bar.png');
-       background-repeat: no-repeat;
- }
+.steps div.line {
+       text-align: center;
+}
  
+.steps div.text, .steps div.field {
+       display: inline-block;
+       text-align: left;
+}
+
+.steps div.field {
+       width: 420px;
+}
+
 .navigation {
        text-align: center;
        padding: 5px 0;
-       background-image: url('wizard-bottom.png');
-       background-repeat: no-repeat;
+       background-image: url('wizard-bottom-1.png');
+       background-repeat: repeat-x;
+       border-bottom-left-radius: 14px;
+       border-bottom-right-radius: 14px;
  }
  
 .step {
@@ -59,12 +71,12 @@
 
 .step-last {
        width: 130px;
-       background-image: url('step-last.png');
+       background-image: url('step-last-1.png');
  }
 
  .step-last-active {
        width: 130px;
-       background-image: url('step-last-active.png');
+       background-image: url('step-last-active-1.png');
  }
  
  .step-last-next-active{
@@ -84,78 +96,13 @@
        background-image: url('step-prev-active.png');
  }
  
-#licence {
-       width: 650px;
-       height: 300px;
-       overflow: auto;
-       border: 1px solid gray;
-       margin: auto;
-       padding: 5px;
-}
- 
 #title {
        clear: left;
        font-size: 14px;
        font-weight: bold;
-       background-image: url('wizard-header.png');
-       background-repeat: no-repeat;
-       padding: 4px;
-}
- 
-#licence-agree {
-       width: 670px;
-       margin: 10px auto;
-}
-
-#restore-browser {
-       width: 100%;
-       height: 100%;
-}
-
-#restore-browser-files {
-       width: 315px;
-       height: 434px;
-}
-
-#restore-browser-files, #restore-browser-versions, #restore-browser-selected {
-       overflow: auto;
-       width: 339px;
-       background-color: white;
-       -webkit-border-radius: 4px;
-       -moz-border-radius: 4px;
-       border-radius: 4px;
+       background-image: url('wizard-header-1.png');
+       background-repeat: repeat-x;
        padding: 4px;
-       -moz-user-select: -moz-none;
-       -webkit-user-select: none;
-       -ms-user-select: none;
-}
-
-#restore-browser-files {
-       height: 430px;
-}
-
-#restore-browser-versions {
-       height: 206px;
-}
-
-#restore-browser-selected {
-       height: 206px;
-}
-
-#restore-browser-files-loading {
-       position: absolute;
-       z-index: 10;
-       width: 347px;
-       height: 438px;
-       border-radius: 4px;
-       background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
-}
-
-.file-browser-watermark {
-       padding: 64px 10px;
-       text-align: center;
-       font-size: 21px;
-       color: rgb(185, 184, 184);
 }
 
 div.button-cancel {