WIP omnishell

pandora_console/godmode/wizards/Wizard.main.php

@@ -436,11 +436,15 @@ class Wizard
      *
      * @param array   $input  Definition of target block to be printed.
      * @param boolean $return Return as string or direct output.
+     * @param boolean $direct Avoid encapsulation if input print is direct.
      *
      * @return string HTML content.
      */
-    public function printBlock(array $input, bool $return=false, bool $not_direct=false)
+    public function printBlock(
-    {
+        array $input,
+        bool $return=false,
+        bool $direct=false
+    ) {
         $output = '';
         if ($input['hidden'] == 1) {
             $class = ' hidden';
@@ -453,7 +457,7 @@ class Wizard
         }
 
         if (is_array($input['block_content']) === true) {
-            $not_direct = (bool) $input['direct'];
+            $direct = (bool) $input['direct'];
 
             // Print independent block of inputs.
             $output .= '<li id="li-'.$input['block_id'].'" class="'.$class.'">';
@@ -462,17 +466,21 @@ class Wizard
                 $output .= '<'.$input['wrapper'].' id="'.$input['block_id'].'" class="'.$class.'">';
             }
 
-            if (!$not_direct) {
+            if (!$direct) {
                 // Avoid encapsulation if input is direct => 1.
                 $output .= '<ul class="wizard '.$input['block_class'].'">';
             }
 
             foreach ($input['block_content'] as $input) {
-                $output .= $this->printBlock($input, $return, (bool) $not_direct);
+                $output .= $this->printBlock(
+                    $input,
+                    $return,
+                    (bool) $direct
+                );
             }
 
             // Close block.
-            if (!$not_direct) {
+            if (!$direct) {
                 $output .= '</ul>';
             }
 
@@ -483,7 +491,7 @@ class Wizard
             $output .= '</li>';
         } else {
             if ($input['arguments']['type'] != 'hidden') {
-                if (!$not_direct) {
+                if (!$direct) {
                     $output .= '<li id="'.$input['id'].'" class="'.$class.'">';
                 }
 
@@ -491,7 +499,7 @@ class Wizard
                 $output .= $this->printInput($input['arguments']);
                 // Allow dynamic content.
                 $output .= $input['extra'];
-                if (!$not_direct) {
+                if (!$direct) {
                     $output .= '</li>';
                 }
             } else {
@@ -806,8 +814,11 @@ class Wizard
                     $padding_left = isset($column['padding-left']) ? 'padding-left: '.$column['padding-left'].';' : 'padding-left: 0;';
                     $padding_right = isset($column['padding-right']) ? 'padding-right: '.$column['padding-right'].';' : 'padding-right: 0;';
                     $extra_styles = isset($column['style']) ? $column['style'] : '';
+                    $class = isset($column['class']) ? $column['class'] : '';
 
-                    $output .= '<div style="'.$width.$padding_left.$padding_right.$extra_styles.'">';
+                    $output .= '<div class="'.$class.'" ';
+                    $output .= ' style="'.$width.$padding_left.$padding_right;
+                    $output .= $extra_styles.'">';
 
                     foreach ($column['inputs'] as $input) {
                         if (is_array($input)) {

pandora_console/include/styles/discovery.css

@@ -31,7 +31,7 @@ li.discovery > a label {
 }
 
 div.data_container > label {
-  font-family: "lato-bolder", "Open Sans", sans-serif;
+  font-family: "lato", "Open Sans", sans-serif;
   font-weight: lighter;
 }
 

pandora_console/include/styles/omnishell.css

@@ -4,16 +4,6 @@
   margin-bottom: 10px;
 }
 
-li > input[type="text"] {
-  border: 1px solid lightgrey;
-  border-radius: 0;
-  font-family: "lato-bolder", "Open Sans", sans-serif;
-  font-weight: lighter;
-  padding: 0px 0px 2px 0px;
-  box-sizing: border-box;
-  margin-bottom: 4px;
-}
-
 .margin_button {
   margin-right: 5px;
 }
@@ -41,59 +31,413 @@ li > input[type="text"] {
   background-color: #8bbbdd;
 }
 
-h4 {
-  color: #343434;
-  font-family: "lato-bolder", "Open Sans", sans-serif;
-  line-height: 18pt;
-}
-
 .container-msg-target-modal {
   max-height: 400px;
   overflow: initial;
 }
 
-div.container-msg-target-modal p {
+ul.wizard li > textarea {
-  font-size: 10pt;
+  height: 5em;
+}
+
+.label_select {
+  font-family: "lato-lighter", "Open Sans", sans-serif;
   font-weight: bolder;
-  text-align: center;
 }
 
-div.container-msg-target-modal pre {
+.divided select {
-  padding: 20px;
+  width: 100%;
-  white-space: pre-wrap;
-  background-color: #e2e2e2;
-  border: 3px dashed grey;
-  border-radius: 10px;
 }
 
-ul.textarea_script,
+.inline {
-.textarea_script {
+  display: flex;
-  max-height: 125px;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  align-content: center;
+  align-items: center;
 }
 
-.add_button {
+.inline label:first-child {
-  height: 20%;
+  width: 250px;
-  margin-bottom: 35px;
+  vertical-align: top;
+  display: inline-block;
 }
 
-.status_table {
+.inline label:nth-child(3) {
-  margin-top: 20px;
+  margin-right: 1em;
+  margin-left: 1em;
 }
 
-.gr_table {
+.inline select {
-  margin-top: 20px;
+  margin-right: 1em;
-  margin-left: 75px;
 }
 
-.btn_section {
+.middle {
-  width: 1px;
   align-self: center;
 }
-
+.edit_discovery_info {
-.btn_add_agent {
+  padding-top: 0;
-  background-image: url(../../images/darrowright.png);
 }
 
-.btn_del_agent {
+ul.wizard {
-  background-image: url(../../images/darrowleft.png);
+  width: 100%;
+}
+
+.filter_column {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  align-content: center;
+}
+
+.filter_column .edit_discovery_input {
+  flex-grow: 1;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  align-content: baseline;
+  margin-left: 2em;
+}
+.filter_column .edit_discovery_input .label_select {
+  display: inline;
+  margin: 0;
+}
+
+.filter_column .edit_discovery_input select {
+  flex-grow: 1;
+  margin-left: 2em;
+}
+
+.wizard li {
+  display: flex;
+}
+
+/*
+ * Discovery css global
+ */
+
+ul.bigbuttonlist {
+  min-height: 200px;
+}
+
+li.discovery {
+  display: inline-block;
+  float: left;
+  width: 250px;
+  margin: 15px;
+  padding-bottom: 50px;
+}
+
+li.discovery > a {
+  text-decoration: none;
+  color: #333;
+}
+li.discovery > a:hover {
+  color: #000;
+}
+
+li.discovery img {
+  height: 90px;
+}
+
+li.discovery > a label {
+  cursor: pointer;
+}
+
+div.data_container > label {
+  font-family: "lato", "Open Sans", sans-serif;
+  font-weight: lighter;
+}
+
+div.data_container {
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  padding-top: 30px;
+  padding-bottom: 30px;
+}
+
+div.data_container:hover {
+  box-shadow: 2px 2px 10px #ddd;
+}
+
+/*
+ * TODO: This may be at hostdevices.css
+ */
+.texto {
+  height: auto;
+  text-align: center;
+}
+h1.wizard {
+  padding: 0;
+  margin: 0;
+}
+h1.wizard a {
+  margin-left: -20px;
+}
+h1.wizard a:hover {
+  color: #fff;
+}
+#text_wizard {
+  font-weight: bolder;
+  text-decoration: none;
+  font-size: 24px;
+}
+div.arrow_box {
+  display: inline-block;
+  position: relative;
+  color: #888;
+  padding: 1.3em;
+  margin-left: 20px;
+  margin-bottom: 10px;
+  padding-left: 3em;
+}
+
+.arrow_box.selected {
+  background: #424242;
+  color: #ccc;
+}
+
+.arrow_box:after {
+  left: 0%;
+  border-left-color: white;
+  border-width: 20px;
+  margin-top: -20px;
+}
+
+div.arrow_box:before {
+  left: 100%;
+  border-left-color: #ccc;
+  border-width: 20px;
+  margin-top: -20px;
+}
+.arrow_box.selected:before {
+  border-left-color: #424242;
+}
+
+.arrow_box.selected:hover {
+  color: #fff;
+}
+.arrow_box:hover {
+  color: #000;
+}
+
+/*
+ * Breadcrum
+ */
+
+#menu_tab_frame_view_bc {
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 2px solid #82b92e;
+  max-height: 70px;
+  min-height: 55px;
+  width: 100%;
+  padding-right: 0px;
+  margin-left: 0px;
+  margin-bottom: 20px;
+  height: 55px;
+  box-sizing: border-box;
+  background-color: #fafafa;
+  border-top-right-radius: 7px;
+  border-top-left-radius: 7px;
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1);
+}
+
+#menu_tab_frame_view_bc .breadcrumbs_container {
+  align-self: flex-start;
+}
+
+.breadcrumbs_container {
+  padding-top: 4px;
+  text-indent: 0.25em;
+  padding-left: 2.5em;
+}
+
+.breadcrumb_link {
+  color: #848484;
+  font-size: 10pt;
+  font-family: "lato-bolder", "Open Sans", sans-serif;
+  text-decoration: none;
+}
+
+span.breadcrumb_link {
+  color: #d0d0d0;
+  font-size: 12pt;
+}
+
+.breadcrumb_link.selected {
+  color: #95b750;
+}
+
+.breadcrumb_link.selected:hover {
+  color: #95b750;
+}
+.breadcrumb_link:hover {
+  color: #95b750;
+}
+
+/*
+ * Discovery forms structure
+ */
+
+form.discovery * {
+  font-size: 10pt;
+}
+
+form.discovery .label_select b {
+  font-family: "lato", "Open Sans", sans-serif;
+  font-weight: bolder;
+}
+
+.edit_discovery_info {
+  display: flex;
+  align-items: flex-start;
+  padding-top: 25px;
+}
+
+.edit_discovery_input {
+  align-items: center;
+  margin-bottom: 25px;
+}
+
+/*
+ * Discovery text inputs
+ */
+
+.discovery_label_hint {
+  display: flex;
+}
+
+label {
+  color: #343434;
+  font-weight: bold;
+}
+
+.discovery_full_width_input {
+  width: 100%;
+}
+
+li > input[type="text"],
+li > input[type="email"],
+li > input[type="password"],
+li > input[type="email"],
+.discovery_text_input > input[type="password"],
+.discovery_text_input > input[type="text"],
+#interval_manual > input[type="text"] {
+  background-color: transparent;
+  border: none;
+  border-radius: 0;
+  border-bottom: 1px solid #ccc;
+  font-family: "lato-bolder", "Open Sans", sans-serif;
+  font-weight: lighter;
+  padding: 0px 0px 2px 0px;
+  box-sizing: border-box;
+  margin-bottom: 4px;
+}
+
+#interval_manual > input[type="text"] {
+  width: 50px;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.discovery_list_input {
+  width: 100%;
+  border: 1px solid #cbcbcb;
+  overflow-y: auto;
+}
+
+.discovery_list_input option {
+  text-align: left;
+}
+
+.discovery_list_input option:checked {
+  background: #1aab8e -webkit-linear-gradient(bottom, #7db742 0%, #7db742 100%);
+  color: #fff;
+}
+
+.discovery_textarea_input {
+  background-color: #fbfbfb;
+  padding-left: 10px;
+  width: 100%;
+  height: 100px;
+  max-height: 100px;
+  max-width: 100%;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  resize: none;
+}
+
+a.tip {
+  margin-left: 8px;
+}
+
+.inline_switch > label {
+  float: right;
+}
+
+.discovery_interval_select_width {
+  width: 90%;
+}
+
+a.ext_link {
+  margin-left: 1em;
+  font-size: 8pt;
+}
+
+div.ui-tooltip.ui-corner-all.ui-widget-shadow.ui-widget.ui-widget-content.uitooltip {
+  background: grey;
+  opacity: 0.9;
+  border-radius: 4px;
+  box-shadow: 6px 5px 9px -9px black;
+  padding: 6px;
+}
+
+.ui-tooltip-content {
+  background: transparent;
+  color: #fff;
+  font-weight: bold;
+  font-family: "lato-lighter", "Open Sans", sans-serif;
+  letter-spacing: 0.03pt;
+  font-size: 8pt;
+}
+
+.arrow {
+  width: 70px;
+  height: 16px;
+  overflow: hidden;
+  position: absolute;
+  left: 50%;
+  margin-left: -35px;
+  bottom: -16px;
+}
+.arrow.top {
+  top: -16px;
+  bottom: auto;
+}
+.arrow.left {
+  left: 50%;
+}
+.arrow:after {
+  background: grey;
+  content: "";
+  position: absolute;
+  left: 20px;
+  top: -20px;
+  width: 25px;
+  height: 25px;
+  box-shadow: 6px 5px 9px -9px black;
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+.arrow.top:after {
+  bottom: -20px;
+  top: auto;
 }

pandora_console/include/styles/pandora.css

@@ -5698,7 +5698,7 @@ div#status_pie {
   align-items: center;
   flex-wrap: wrap;
   padding: 1em;
-  min-width: fit-content;
+  min-width: 100%;
 }
 
 .white_table_graph_content {