fixed CV in console mobile metaconsole #8676

pandora_console/godmode/reporting/visual_console_builder.data.php

@@ -170,7 +170,7 @@ $table->data[2][0] = __('Background');
 $table->data[2][1] = html_print_select(
     $backgrounds_list,
     'background',
-    $background,
+    io_safe_output($background),
     '',
     'None',
     'None.png',

pandora_console/include/javascript/pandora_dashboards.js

@@ -1208,35 +1208,39 @@ function refresh_pagination_callback(
 
 // eslint-disable-next-line no-unused-vars
 function dashboardLoadVC(settings) {
+  var headerMobileFix = 40;
+
   var container = document.getElementById(
     "visual-console-container-" + settings.cellId
   );
 
+  var interval = 300 * 1000;
+
   // Add the datetime when the item was received.
   var receivedAt = new Date();
 
-  var beforeUpdate = function(items, visualConsole, props) {
+  var beforeUpdate = function(items, visualConsole, props, size) {
     var ratio_visualconsole = props.height / props.width;
-    var ratio_w = settings.size.width / props.width;
+    var ratio_w = size.width / props.width;
-    var ratio_h = settings.size.height / props.height;
+    var ratio_h = size.height / props.height;
 
-    props.width = settings.size.width;
+    props.width = size.width;
-    props.height = settings.size.width * ratio_visualconsole;
+    props.height = size.width * ratio_visualconsole;
 
     var ratio = ratio_w;
     if (settings.mobile != undefined && settings.mobile === true) {
       if (props.height < props.width) {
-        if (props.height > settings.size.height) {
+        if (props.height > size.height) {
           ratio = ratio_h;
-          props.height = settings.size.height;
+          props.height = size.height;
-          props.width = settings.size.height / ratio_visualconsole;
+          props.width = size.height / ratio_visualconsole;
         }
       }
     } else {
-      if (props.height > settings.size.height) {
+      if (props.height > size.height) {
         ratio = ratio_h;
-        props.height = settings.size.height;
+        props.height = size.height;
-        props.width = settings.size.height / ratio_visualconsole;
+        props.width = size.height / ratio_visualconsole;
       }
     }
 
@@ -1275,18 +1279,32 @@ function dashboardLoadVC(settings) {
           var regex_hash = /(hash=)[^&]+(&?)/gi;
           var replacement_hash = "$1" + props.hash + "$2";
 
+          var regex_width = /(width=)[^&]+(&?)/gi;
+          var replacement_width = "$1" + size.width + "$2";
+
+          var regex_height = /(height=)[^&]+(&?)/gi;
+          var replacement_height =
+            "$1" + (size.height + headerMobileFix) + "$2";
+
           // Change the URL (if the browser has support).
           if ("history" in window) {
             var href = window.location.href.replace(regex, replacement);
             href = href.replace(regex_hash, replacement_hash);
+            href = href.replace(regex_width, replacement_width);
+            href = href.replace(regex_height, replacement_height);
             window.history.replaceState({}, document.title, href);
+          }
+          //Remove spinner change VC.
+          container.classList.remove("is-updating");
+          container.classList.remove("cv-overflow");
 
-            $(window).on("orientationchange", function() {
+          var div = container.querySelector(".div-visual-console-spinner");
-              window.location.href =
+
-                settings.baseUrl +
+          if (div !== null) {
-                "mobile/index.php?page=visualmap&id=" +
+            var parent = div.parentElement;
-                props.id;
+            if (parent !== null) {
-            });
+              parent.removeChild(div);
+            }
           }
         }
       },
@@ -1297,17 +1315,7 @@ function dashboardLoadVC(settings) {
   };
 
   var handleUpdate = function() {
-    //Remove spinner change VC.
+    return;
-    container.classList.remove("is-updating");
-
-    var div = container.querySelector(".div-visual-console-spinner");
-
-    if (div !== null) {
-      var parent = div.parentElement;
-      if (parent !== null) {
-        parent.removeChild(div);
-      }
-    }
   };
 
   settings.items.map(function(item) {
@@ -1320,12 +1328,12 @@ function dashboardLoadVC(settings) {
     return item;
   });
 
-  createVisualConsole(
+  var visualConsoleManager = createVisualConsole(
     container,
     settings.props,
     settings.items,
     settings.baseUrl,
-    300 * 1000,
+    interval,
     handleUpdate,
     beforeUpdate,
     settings.size,
@@ -1335,6 +1343,41 @@ function dashboardLoadVC(settings) {
       ? "mobile"
       : "dashboard"
   );
+
+  $(window).on("orientationchange", function() {
+    $(container).width($(window).height());
+    $(container).height($(window).width() - headerMobileFix);
+    //Remove spinner change VC.
+    container.classList.remove("is-updating");
+    container.classList.remove("cv-overflow");
+
+    var div = container.querySelector(".div-visual-console-spinner");
+
+    if (div !== null) {
+      var parent = div.parentElement;
+      if (parent !== null) {
+        parent.removeChild(div);
+      }
+    }
+
+    container.classList.add("is-updating");
+    container.classList.add("cv-overflow");
+    const divParent = document.createElement("div");
+    divParent.className = "div-visual-console-spinner";
+
+    const divSpinner = document.createElement("div");
+    divSpinner.className = "visual-console-spinner";
+
+    divParent.appendChild(divSpinner);
+    container.appendChild(divParent);
+
+    var dimensions = {
+      width: $(window).height(),
+      height: $(window).width() - 40
+    };
+
+    visualConsoleManager.changeDimensionsVc(dimensions, interval);
+  });
 }
 
 // eslint-disable-next-line no-unused-vars

pandora_console/include/javascript/pandora_visual_console.js

@@ -42,9 +42,18 @@ function createVisualConsole(
   var visualConsole = null;
   var asyncTaskManager = new AsyncTaskManager();
 
-  function updateVisualConsole(visualConsoleId, updateInterval, tts) {
+  function updateVisualConsole(
+    visualConsoleId,
+    updateInterval,
+    tts,
+    dimensions
+  ) {
     if (tts == null) tts = 0; // Time to start.
 
+    if (dimensions != undefined && dimensions != null && dimensions != "") {
+      size = dimensions;
+    }
+
     asyncTaskManager.add(
       "visual-console",
       function(done) {
@@ -93,7 +102,7 @@ function createVisualConsole(
                 var receivedAt = new Date();
                 var prevProps = visualConsole.props;
                 if (beforeUpdate) {
-                  beforeUpdate(items, visualConsole, props);
+                  beforeUpdate(items, visualConsole, props, size);
                 } else {
                   // Add the datetime when the item was received.
                   items.map(function(item) {
@@ -459,6 +468,11 @@ function createVisualConsole(
         asyncTaskManager.cancel("visual-console-start");
       }
     },
+    changeDimensionsVc: function(dimensions, interval) {
+      if (dimensions != null) {
+        updateVisualConsole(visualConsole.props.id, interval, null, dimensions);
+      }
+    },
     createItem: function(typeString) {
       var type;
       switch (typeString) {

pandora_console/mobile/include/style/main.css

@@ -1493,3 +1493,15 @@ div.nodata_container {
   padding: 0;
   margin: 0.5em 0 !important;
 }
+
+.div-visual-console-spinner {
+  opacity: 1 !important;
+}
+
+.cv-overflow {
+  overflow: hidden !important;
+}
+
+.visual-console-container-dashboard a:visited {
+  color: inherit !important;
+}

pandora_console/mobile/include/ui.class.php

@@ -985,6 +985,30 @@ class Ui
     }
 
 
+    /**
+     * Load VC.
+     *
+     * @param string  $settings        Json object.
+     * @param integer $visualConsoleId Id.
+     *
+     * @return void Output script.
+     */
+    public function loadVc($settings, $visualConsoleId)
+    {
+        $this->contentAddHtml(
+            '<script type="text/javascript">
+            var settings = '.$settings.';
+            var fullUrl = "'.ui_get_full_url('/', false, false, false).'";
+            var visualConsoleId = '.$visualConsoleId.';
+
+            $(document).ready(function () {
+                dashboardLoadVC(settings);
+            });
+        </script>'
+        );
+    }
+
+
 }
 
 class Table

pandora_console/mobile/include/user.class.php

@@ -81,41 +81,20 @@ class User
 
     public function isLogged()
     {
-        global $config;
         $system = System::getInstance();
 
+        $loginhash = $system->getRequest('loginhash', null);
         $autologin = $system->getRequest('autologin', false);
-        if ($autologin) {
+        if ($autologin !== false) {
             $user = $system->getRequest('user', null);
             $password = $system->getRequest('password', null);
-
             $this->login($user, $password);
         } else {
-            if (isset($_GET['loginhash']) === true) {
+            if (empty($loginhash) === false) {
                 // Hash login process.
-                $loginhash_data = get_parameter('loginhash_data', '');
+                $loginhash_data = $system->getRequest('loginhash_data', null);
-                $loginhash_user = str_rot13(get_parameter('loginhash_user', ''));
+                $loginhash_user = str_rot13($system->getRequest('loginhash_user', null));
-                if ($config['loginhash_pwd'] != ''
+                $this->login($loginhash_user, null, $loginhash_data);
-                    && $loginhash_data == md5(
-                        $loginhash_user.io_output_password(
-                            $config['loginhash_pwd']
-                        )
-                    )
-                ) {
-                    $this->login($loginhash_user, $config['loginhash_pwd']);
-                } else {
-                    include_once 'general/login_page.php';
-                    db_pandora_audit(
-                        AUDIT_LOG_USER_REGISTRATION,
-                        'Loginhash failed',
-                        'system'
-                    );
-                    while (ob_get_length() > 0) {
-                        ob_end_flush();
-                    }
-
-                    exit('</html>');
-                }
             }
         }
 
@@ -123,10 +102,41 @@ class User
     }
 
 
-    public function login($user=null, $password=null)
+    public function login($user=null, $password=null, $loginhash_data='')
     {
+        global $config;
         $system = System::getInstance();
 
+        if (empty($loginhash_data) === false) {
+            if ($config['loginhash_pwd'] != ''
+                && $loginhash_data == md5(
+                    $user.io_output_password(
+                        $config['loginhash_pwd']
+                    )
+                )
+            ) {
+                $this->logged = true;
+                $this->user = $user;
+                $this->loginTime = time();
+                $this->errorLogin = false;
+                $this->saveLogin();
+            } else {
+                include_once 'general/login_page.php';
+                db_pandora_audit(
+                    AUDIT_LOG_USER_REGISTRATION,
+                    'Loginhash failed',
+                    'system'
+                );
+                while (ob_get_length() > 0) {
+                    ob_end_flush();
+                }
+
+                exit('</html>');
+            }
+
+            return $this->logged;
+        }
+
         if ($system->getConfig('auth', 'mysql') === 'saml') {
             if ((bool) $system->getRequest('saml', false) === true) {
                 \enterprise_include_once('include/auth/saml.php');

pandora_console/mobile/operation/visualmap.php

@@ -141,12 +141,13 @@ class Visualmap
         if (empty($this->width) === true
             && empty($this->height) === true
         ) {
-            $this->show_fail_acl();
+            // Reload forcing user to send width and height.
+            $ui = Ui::getInstance();
+            $ui->retrieveViewPort();
         }
 
-        // Padding.
+        // Header.
         $this->height -= 40;
-        $this->width -= 0;
 
         $this->visualmap = db_get_row(
             'tlayout',
@@ -348,30 +349,12 @@ class Visualmap
                 'cellId'  => $uniq,
                 'uniq'    => $uniq,
                 'mobile'  => true,
+                'vcId'    => $visualConsoleId,
             ]
         );
 
-        $output .= '<script type="text/javascript">';
-        $output .= '$(document).ready(function () {';
-        $output .= 'dashboardLoadVC('.$settings.')';
-        $output .= '});';
-        if ($this->rotate === true) {
-            $output .= "$('.container-center').css('transform', 'rotate(90deg)');";
-        }
-
-        $output .= '$( window ).on( "orientationchange", function( event ) {';
-        $output .= ' $(".container-center").empty();';
-        $output .= ' $.mobile.loading("show");';
-        $output .= ' var dimensions = "&width="+$(window).height();';
-        $output .= ' dimensions += "&height="+$(window).width();';
-        $output .= ' window.location.href = "';
-        $output .= ui_get_full_url('/', false, false, false);
-        $output .= 'mobile/index.php?page=visualmap&id='.$visualConsoleId;
-        $output .= '"+dimensions; });';
-
-        $output .= '</script>';
-
         $ui->contentAddHtml($output);
+        $ui->loadVc($settings, $visualConsoleId);
 
         $javascript = ob_get_clean();
         $ui->contentAddHtml($javascript);