Merge branch 'ent-8587-nueva-representacion-de-servicios-sunburst' into 'develop'

Ent 8587 nueva representacion de servicios sunburst

See merge request artica/pandorafms!4819

pandora_console/extras/mr/55.sql

@@ -0,0 +1,5 @@
+START TRANSACTION;
+
+ALTER TABLE `tservice` ADD COLUMN `enable_sunburst` tinyint(1) NOT NULL default 0;
+
+COMMIT;

pandora_console/include/graphs/functions_d3.php

@@ -150,7 +150,7 @@ function d3_tree_map_graph($data, $width=700, $height=700, $return=false)
 }
 
 
-function d3_sunburst_graph($data, $width=700, $height=700, $return=false)
+function d3_sunburst_graph($data, $width=700, $height=700, $return=false, $tooltip=true)
 {
     global $config;
 
@@ -167,7 +167,7 @@ function d3_sunburst_graph($data, $width=700, $height=700, $return=false)
 					}
 				</style>';
     $output .= "<script language=\"javascript\" type=\"text/javascript\">
-					sunburst('#sunburst', $data, '$width', '$height');
+					sunburst('#sunburst', $data, '$width', '$height', '$tooltip');
 				</script>";
 
     if (!$return) {

pandora_console/include/graphs/pandora.d3.js

@@ -796,7 +796,7 @@ function treeMap(recipient, data, width, height) {
 // The area (or angle, depending on implementation) of each arc corresponds to its value.
 // Sunburst design by John Stasko. Data courtesy Jeff Heer.
 // http://bl.ocks.org/mbostock/4348373
-function sunburst(recipient, data, width, height) {
+function sunburst(recipient, data, width, height, tooltip = true) {
   if (width === "auto") {
     width = $(recipient).innerWidth();
   }
@@ -858,11 +858,14 @@ function sunburst(recipient, data, width, height) {
     })
     .style("cursor", "pointer")
     .on("click", click)
-    .on("mouseover", over_user)
+    .on("mouseover", tooltip === "1" ? over_user : "")
     .on("mouseout", out_user)
     .on("mousemove", move_tooltip);
 
   function computeTextRotation(d) {
+    if (d.type === "central_service") {
+      return 0;
+    }
     var ang = ((x(d.x + d.dx / 2) - Math.PI / 2) / Math.PI) * 180;
     return ang > 90 ? 180 + ang : ang;
   }
@@ -882,9 +885,18 @@ function sunburst(recipient, data, width, height) {
       return computeTextRotation(d) > 180 ? -40 : -30;
     })
     .attr("dx", "6") // margin
-    .attr("dy", ".35em") // vertical-align
+    .attr("dy", function(d) {
+      if (d.type === "central_service") {
+        return "-7em";
+      }
+      return ".35em";
+    }) // vertical-align
     .attr("opacity", function(d) {
-      if (typeof d.show_name != "undefined" && d.show_name) return 1;
+      if (
+        (typeof d.show_name != "undefined" && d.show_name) ||
+        d.type === "central_service"
+      )
+        return 1;
       else return 0;
     })
     .text(function(d) {
@@ -899,7 +911,11 @@ function sunburst(recipient, data, width, height) {
       window.location.href = d.link;
     } else {
       // fade out all text elements
-      text.transition().attr("opacity", 0);
+      if (d.type === "central_service") {
+        text.transition().attr("opacity", 1);
+      } else {
+        text.transition().attr("opacity", 0);
+      }
 
       path
         .transition()
@@ -965,8 +981,8 @@ function sunburst(recipient, data, width, height) {
   }
 
   function move_tooltip(d) {
-    var x = d3.event.pageX + 10;
+    var x = d3.event.pageX + 10 - $("#menu_full").width();
-    var y = d3.event.pageY + 10;
+    var y = d3.event.pageY - 90;
 
     $("#tooltip").css("left", x + "px");
     $("#tooltip").css("top", y + "px");
@@ -1017,10 +1033,10 @@ function sunburst(recipient, data, width, height) {
         "-moz-box-shadow:    7px 7px 5px rgba(50, 50, 50, 0.75);" +
         "box-shadow:         7px 7px 5px rgba(50, 50, 50, 0.75);" +
         "left: " +
-        x +
+        100 +
         "px;" +
         "top: " +
-        y +
+        100 +
         "px;"
     );
   }

pandora_console/include/lib/Dashboard/Widgets/service_map.php

@@ -235,6 +235,10 @@ class ServiceMapWidget extends Widget
             $values['showLegend'] = $decoder['showLegend'];
         }
 
+        if (isset($decoder['sunburst']) === true) {
+            $values['sunburst'] = $decoder['sunburst'];
+        }
+
         return $values;
     }
 
@@ -296,19 +300,16 @@ class ServiceMapWidget extends Widget
             ],
         ];
 
-        // TODO refactoriced services: Hidden legend.
+        $inputs[] = [
-        /*
+            'label'     => __('Enable sunburst'),
-            // Show legend.
-            $inputs[] = [
-            'label'     => __('Show legend'),
             'arguments' => [
-                'name'  => 'showLegend',
+                'type'   => 'switch',
-                'id'    => 'showLegend',
+                'name'   => 'sunburst',
-                'type'  => 'switch',
+                'class'  => 'event-widget-input',
-                'value' => $values['showLegend'],
+                'value'  => $values['sunburst'],
+                'return' => true,
             ],
-            ];
+        ];
-        */
 
         return $inputs;
     }
@@ -325,7 +326,9 @@ class ServiceMapWidget extends Widget
         $values = parent::getPost();
 
         $values['serviceId'] = \get_parameter('serviceId', 0);
-        // $values['showLegend'] = \get_parameter_switch('showLegend');
+
+        $values['sunburst'] = \get_parameter_switch('sunburst', 0);
+
         return $values;
     }
 
@@ -341,6 +344,7 @@ class ServiceMapWidget extends Widget
 
         $size = parent::getSize();
 
+        $output = '';
         if (check_acl($config['id_user'], 0, 'AR') === 0) {
             $output .= '<div class="container-center">';
             $output .= \ui_print_error_message(
@@ -367,42 +371,6 @@ class ServiceMapWidget extends Widget
         $style = 'position: relative; text-align: center;';
         $output .= "<div id='".$containerId."' style='".$style."'>";
 
-        // TODO refactoriced services: Hidden legend.
-        /*
-            if ($this->values['showLegend'] === 1) {
-            $output .= "<div id='container_servicemap_legend".$this->values['serviceId'].'_'.$this->cellId."'>";
-            $output .= '<table>';
-            $output .= "<tr class='legend_servicemap_title'><td colspan='3' style='padding-bottom: 10px; min-width: 177px;'><b>".__('Legend').'</b></td>';
-            $output .= "<td><img class='legend_servicemap_toggle' style='padding-bottom: 10px;' src='images/darrowup.png'></td></tr>";
-
-            $output .= "<tr class='legend_servicemap_item'><td>";
-            $output .= "<img src='images/service.png'>";
-            $output .= '</td><td>'.__('Services').'</td>';
-
-            // Coulour legend.
-            $output .= "<td rowspan='3'>";
-            $output .= '<table>';
-            $output .= "<tr><td class='legend_square'><div style='background-color: ".COL_CRITICAL.";'></div></td><td>".__('Critical').'</td></tr>';
-            $output .= "<tr><td class='legend_square'><div style='background-color: ".COL_WARNING.";'></div></td><td>".__('Warning').'</td></tr>';
-            $output .= "<tr><td class='legend_square'><div style='background-color: ".COL_NORMAL.";'></div></td><td>".__('Ok').'</td></tr>';
-            $output .= "<tr><td class='legend_square'><div style='background-color: ".COL_UNKNOWN.";'></div></td><td>".__('Unknown').'</td></tr>';
-            $output .= '</table>';
-            $output .= '</td></tr>';
-
-            $output .= "<tr class='legend_servicemap_item'><td>";
-            $output .= "<img src='images/agent.png'>";
-            $output .= '</td><td>'.__('Agents').'</td>';
-            $output .= '</tr>';
-
-            $output .= "<tr class='legend_servicemap_item'><td>";
-            $output .= "<img src='images/module.png'>";
-            $output .= '</td><td>'.__('Modules').'</td>';
-            $output .= '</tr>';
-            $output .= '</table>';
-            $output .= '</div>';
-            }
-        */
-
         // TODO: removed refactoriced services. Only 1 widget Zoom.
         $sql = sprintf(
             'SELECT COUNT(*)
@@ -425,14 +393,21 @@ class ServiceMapWidget extends Widget
         );
         // TODO:XXX fix draw service map.
         ob_start();
-        servicemap_print_servicemap(
+
-            $this->values['serviceId'],
+        if ($this->values['sunburst'] === 0) {
-            false,
+            servicemap_print_servicemap(
-            $size['width'],
+                $this->values['serviceId'],
-            $size['height'],
+                false,
-            $this->cellId,
+                $size['width'],
-            $disableZoom
+                $size['height'],
-        );
+                $this->cellId,
+                $disableZoom
+            );
+        } else {
+            include_once $config['homedir'].'/include/graphs/functions_d3.php';
+            servicemap_print_sunburst($this->values['serviceId'], $size['width'], $size['height'], false);
+        }
+
         $output .= ob_get_clean();
         $output .= '</div>';
         return $output;

pandora_console/pandoradb.sql

@@ -2817,6 +2817,7 @@ CREATE TABLE IF NOT EXISTS `tservice` (
   `cascade_protection` TINYINT NOT NULL DEFAULT 0,
   `evaluate_sla` INT NOT NULL DEFAULT 0,
   `is_favourite` TINYINT NOT NULL DEFAULT 0,
+  `enable_sunburst` TINYINT NOT NULL DEFAULT 0,
   PRIMARY KEY  (`id`)
 ) ENGINE=InnoDB 
 COMMENT = 'Table to define services to monitor'