tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixed errors VC

This commit is contained in:
Daniel Barbero Martin 2020-02-10 17:31:48 +01:00
parent d99d31b432
commit 0042f390ef
12 changed files with 238 additions and 191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
pandora_console/general/header.php
View File

@ -213,8 +213,10 @@ if ($config['menu_type'] == 'classic') {
$select[0]['autorefresh_white_list']
);
if ($_GET['sec2'] === 'operation/visual_console/render_view'
&& $config['legacy_vc']
if ($config['legacy_vc']
|| ($_GET['sec2'] !== 'operation/visual_console/render_view')
|| (($_GET['sec2'] !== 'operation/visual_console/render_view')
&& $config['legacy_vc'])
) {
if ($autorefresh_list !== null
&& array_search($_GET['sec2'], $autorefresh_list) !== false

328
pandora_console/include/graphs/bullet.js
View File

@ -1,10 +1,11 @@
/* globals d3 */
(function() {
// Chart design based on the recommendations of Stephen Few. Implementation
// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
// http://projects.instantcognition.com/protovis/bulletchart/
// Chart design based on the recommendations of Stephen Few. Implementation
// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
// http://projects.instantcognition.com/protovis/bulletchart/
d3.bullet = function() {
var orient = "right", // TODO top & bottom
d3.bullet = function() {
var orient = "right", // TODO top & bottom
reverse = false,
duration = 0,
ranges = bulletRanges,
@ -14,228 +15,259 @@ d3.bullet = function() {
height = 30,
tickFormat = null;
// For each small multiple…
function bullet(g) {
g.each(function(d, i) {
var rangez = ranges.call(this, d, i).slice().sort(d3.descending),
markerz = markers.call(this, d, i).slice().sort(d3.descending),
measurez = measures.call(this, d, i).slice().sort(d3.descending),
// For each small multiple…
function bullet(g) {
g.each(function(d, i) {
var rangez = ranges
.call(this, d, i)
.slice()
.sort(d3.descending),
markerz = markers
.call(this, d, i)
.slice()
.sort(d3.descending),
measurez = measures
.call(this, d, i)
.slice()
.sort(d3.descending),
g = d3.select(this);
// Compute the new x-scale.
var x1 = d3.scale.linear()
// Compute the new x-scale.
var x1 = d3.scale
.linear()
.domain([0, Math.max(rangez[0], markerz[0], measurez[0])])
.range(reverse ? [width, 0] : [0, width-160]);
.range(reverse ? [width, 0] : [0, width - 160]);
// Retrieve the old x-scale, if this is an update.
var x0 = this.__chart__ || d3.scale.linear()
.domain([0, Infinity])
.range(x1.range());
// Retrieve the old x-scale, if this is an update.
var x0 =
this.__chart__ ||
d3.scale
.linear()
.domain([0, Infinity])
.range(x1.range());
// Stash the new scale.
this.__chart__ = x1;
// Stash the new scale.
this.__chart__ = x1;
// Derive width-scales from the x-scales.
var w0 = bulletWidth(x0),
// Derive width-scales from the x-scales.
var w0 = bulletWidth(x0),
w1 = bulletWidth(x1);
// Update the range rects.
var range = g.selectAll("rect.range")
.data(rangez);
// Update the range rects.
var range = g.selectAll("rect.range").data(rangez);
range.enter().append("rect")
.attr("class", function(d, i) { return "range s" + i; })
range
.enter()
.append("rect")
.attr("class", function(d, i) {
return "range s" + i;
})
.attr("width", w0)
.attr("height", height)
.attr("x", reverse ? x0 : 0)
.transition()
.transition()
.duration(duration)
.attr("width", w1)
.attr("x", reverse ? x1 : 0);
range.transition()
range
.transition()
.duration(duration)
.attr("x", reverse ? x1 : 0)
.attr("width", w1)
.attr("height", height);
// Update the measure rects.
var measure = g.selectAll("rect.measure")
.data(measurez);
// Update the measure rects.
var measure = g.selectAll("rect.measure").data(measurez);
measure.enter().append("rect")
.attr("class", function(d, i) { return "measure s" + i; })
measure
.enter()
.append("rect")
.attr("class", function(d, i) {
return "measure s" + i;
})
.attr("width", w0)
.attr("height", height / 3)
.attr("x", reverse ? x0 : 0)
.attr("y", height / 3)
.transition()
.transition()
.duration(duration)
.attr("width", w1)
.attr("x", reverse ? x1 : 0);
measure.transition()
measure
.transition()
.duration(duration)
.attr("width", w1)
.attr("height", height / 3)
.attr("x", reverse ? x1 : 0)
.attr("y", height / 3);
// Update the marker lines.
var marker = g.selectAll("line.marker")
.data(markerz);
// Update the marker lines.
var marker = g.selectAll("line.marker").data(markerz);
marker.enter().append("line")
.attr("class", function(d, i) { return "marker s" + i; })
marker
.enter()
.append("line")
.attr("class", function(d, i) {
return "marker s" + i;
})
.attr("x1", x0)
.attr("x2", x0)
.attr("y1", height / 6)
.attr("y2", height * 5 / 6)
.transition()
.attr("y2", (height * 5) / 6)
.transition()
.duration(duration)
.attr("x1", x1)
.attr("x2", x1);
marker.transition()
marker
.transition()
.duration(duration)
.attr("x1", x1)
.attr("x2", x1)
.attr("y1", height / 6)
.attr("y2", height * 5 / 6);
.attr("y2", (height * 5) / 6);
// Compute the tick format.
var format = tickFormat || x1.tickFormat(8);
// Compute the tick format.
var format = tickFormat || x1.tickFormat(8);
// Update the tick groups.
var tick = g.selectAll("g.tick")
.data(x1.ticks(8), function(d) {
return this.textContent || format(d);
});
// Update the tick groups.
var tick = g.selectAll("g.tick").data(x1.ticks(8), function(d) {
return this.textContent || format(d);
});
// Initialize the ticks with the old scale, x0.
var tickEnter = tick.enter().append("g")
// Initialize the ticks with the old scale, x0.
var tickEnter = tick
.enter()
.append("g")
.attr("class", "tick")
.attr("transform", bulletTranslate(x0))
.style("opacity", 1e-6);
tickEnter.append("line")
tickEnter
.append("line")
.attr("y1", height)
.attr("y2", height * 7 / 6);
.attr("y2", (height * 7) / 6);
tickEnter.append("text")
tickEnter
.append("text")
.attr("text-anchor", "middle")
.attr("dy", "1em")
.attr("y", height * 7 / 6)
.attr("y", (height * 7) / 6)
.text(format);
// Transition the entering ticks to the new scale, x1.
tickEnter.transition()
// Transition the entering ticks to the new scale, x1.
tickEnter
.transition()
.duration(duration)
.attr("transform", bulletTranslate(x1))
.style("opacity", 1);
// Transition the updating ticks to the new scale, x1.
var tickUpdate = tick.transition()
// Transition the updating ticks to the new scale, x1.
var tickUpdate = tick
.transition()
.duration(duration)
.attr("transform", bulletTranslate(x1))
.style("opacity", 1);
tickUpdate.select("line")
tickUpdate
.select("line")
.attr("y1", height)
.attr("y2", height + 7);
tickUpdate.select("text")
.attr("y", height + 7);
tickUpdate.select("text").attr("y", height + 7);
// Transition the exiting ticks to the new scale, x1.
tick.exit().transition()
// Transition the exiting ticks to the new scale, x1.
tick
.exit()
.transition()
.duration(duration)
.attr("transform", bulletTranslate(x1))
.style("opacity", 1e-6)
.remove();
});
d3.timer.flush();
});
d3.timer.flush();
}
// left, right, top, bottom
bullet.orient = function(x) {
if (!arguments.length) return orient;
orient = x;
reverse = orient == "right" || orient == "bottom";
return bullet;
};
// ranges (bad, satisfactory, good)
bullet.ranges = function(x) {
if (!arguments.length) return ranges;
ranges = x;
return bullet;
};
// markers (previous, goal)
bullet.markers = function(x) {
if (!arguments.length) return markers;
markers = x;
return bullet;
};
// measures (actual, forecast)
bullet.measures = function(x) {
if (!arguments.length) return measures;
measures = x;
return bullet;
};
bullet.width = function(x) {
if (!arguments.length) return width;
width = x;
return bullet;
};
bullet.height = function(x) {
if (!arguments.length) return height;
height = x;
return bullet;
};
bullet.tickFormat = function(x) {
if (!arguments.length) return tickFormat;
tickFormat = x;
return bullet;
};
bullet.duration = function(x) {
if (!arguments.length) return duration;
duration = x;
return bullet;
};
return bullet;
};
function bulletRanges(d) {
return d.ranges;
}
// left, right, top, bottom
bullet.orient = function(x) {
if (!arguments.length) return orient;
orient = x;
reverse = orient == "right" || orient == "bottom";
return bullet;
};
function bulletMarkers(d) {
return d.markers;
}
// ranges (bad, satisfactory, good)
bullet.ranges = function(x) {
if (!arguments.length) return ranges;
ranges = x;
return bullet;
};
function bulletMeasures(d) {
return d.measures;
}
// markers (previous, goal)
bullet.markers = function(x) {
if (!arguments.length) return markers;
markers = x;
return bullet;
};
function bulletTranslate(x) {
return function(d) {
return "translate(" + x(d) + ",0)";
};
}
// measures (actual, forecast)
bullet.measures = function(x) {
if (!arguments.length) return measures;
measures = x;
return bullet;
};
bullet.width = function(x) {
if (!arguments.length) return width;
width = x;
return bullet;
};
bullet.height = function(x) {
if (!arguments.length) return height;
height = x;
return bullet;
};
bullet.tickFormat = function(x) {
if (!arguments.length) return tickFormat;
tickFormat = x;
return bullet;
};
bullet.duration = function(x) {
if (!arguments.length) return duration;
duration = x;
return bullet;
};
return bullet;
};
function bulletRanges(d) {
return d.ranges;
}
function bulletMarkers(d) {
return d.markers;
}
function bulletMeasures(d) {
return d.measures;
}
function bulletTranslate(x) {
return function(d) {
return "translate(" + x(d) + ",0)";
};
}
function bulletWidth(x) {
var x0 = x(0);
return function(d) {
return Math.abs(x(d) - x0);
};
}
})();
function bulletWidth(x) {
var x0 = x(0);
return function(d) {
return Math.abs(x(d) - x0);
};
}
})();

40
pandora_console/include/graphs/functions_d3.php
View File

@ -175,12 +175,15 @@ function d3_bullet_chart(
$output = '';
$output .= include_javascript_d3(true);
$output .= '<script language="javascript" type="text/javascript">';
$output .= file_get_contents($homeurl.'include/graphs/bullet.js');
$output .= '</script>';
$id_bullet = uniqid();
$font = array_shift(explode('.', array_pop(explode('/', $font))));
$output .= '<div id="bullet_graph_'.$id_bullet.'" class="bullet" style="overflow: hidden; width: '.$width.'px; margin-left: auto; margin-right: auto;"></div>
<style>
.bullet_graph {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: auto;
@ -188,7 +191,7 @@ function d3_bullet_chart(
position: relative;
width: 100%;
}
.bullet { font: 7px sans-serif; }
.bullet .marker.s0 { stroke: #e63c52; stroke-width: 2px; }
.bullet .marker.s1 { stroke: #f3b200; stroke-width: 2px; }
@ -204,14 +207,13 @@ function d3_bullet_chart(
.bullet g text { font-size:'.$font_size.'pt;}
</style>
<script src="'.$homeurl.'include/graphs/bullet.js"></script>
<script language="javascript" type="text/javascript">
var margin = {top: 5, right: 40, bottom: 20, left: 120};
width = ('.$width.'+10);
height = '.$height.'- margin.top - margin.bottom;
var width = ('.$width.'+10);
var height = '.$height.'- margin.top - margin.bottom;
var chart = d3.bullet()
.width(width)
.height(height)
@ -240,7 +242,6 @@ function d3_bullet_chart(
$output .= 'var data = ['.implode(',', $temp).'];
';
$output .= '
var svg = d3.select("#bullet_graph_'.$id_bullet.'").selectAll("svg")
.data(data)
.enter().append("svg")
@ -250,33 +251,30 @@ function d3_bullet_chart(
.append("g")
.attr("transform", "translate(" + (margin.left) + "," + margin.top + ")")
.call(chart);
var title = svg.append("g")
.style("text-anchor", "end")
.attr("transform", "translate(-10, 15)");
title.append("text")
.attr("class", "'.$font.'")
.text(function(d) { return d.title; });
title.append("text")
.attr("class", "subtitle")
.attr("dy", "1em")
.text(function(d) { return d.subtitle; });
.attr("class", "subtitle")
.attr("dy", "1em")
.text(function(d) { return d.subtitle; });
$(".tick>text").each(function() {
label = $(this).text().replace(/,/g,"");
var label = $(this).text().replace(/,/g,"");
label = parseFloat(label);
text = label.toLocaleString();
var text = label.toLocaleString();
if ( label >= 1000000)
text = text.substring(0,3) + "M";
else if (label >= 100000)
text = text.substring(0,3) + "K";
else if (label >= 1000)
text = text.substring(0,2) + "K";
$(this).text(text);
});
</script>';

16
pandora_console/include/rest-api/models/VisualConsole/Item.php
View File

@ -2248,8 +2248,6 @@ class Item extends CachedModel
);
}
$fields[0] = __('None');
$getAllVisualConsoleValue = $values['linkedLayoutId'];
if (\is_metaconsole() === true) {
$getAllVisualConsoleValue = $values['linkedLayoutId'];
@ -2262,12 +2260,14 @@ class Item extends CachedModel
$inputs[] = [
'label' => __('Linked visual console'),
'arguments' => [
'type' => 'select',
'fields' => $fields,
'name' => 'getAllVisualConsole',
'selected' => $getAllVisualConsoleValue,
'script' => 'linkedVisualConsoleChange()',
'return' => true,
'type' => 'select',
'fields' => $fields,
'name' => 'getAllVisualConsole',
'selected' => $getAllVisualConsoleValue,
'script' => 'linkedVisualConsoleChange()',
'return' => true,
'nothing' => __('None'),
'nothing_value' => 0,
],
];

14
pandora_console/include/rest-api/models/VisualConsole/Items/ModuleGraph.php
View File

@ -426,8 +426,6 @@ final class ModuleGraph extends Item
[]
);
$data[0] = __('None');
return $data;
}
@ -573,11 +571,13 @@ final class ModuleGraph extends Item
'hidden' => $hiddenCustom,
'label' => __('Custom graph'),
'arguments' => [
'type' => 'select',
'fields' => $fields,
'name' => 'customGraphId',
'selected' => $values['customGraphId'],
'return' => true,
'type' => 'select',
'fields' => $fields,
'name' => 'customGraphId',
'selected' => $values['customGraphId'],
'return' => true,
'nothing' => __('None'),
'nothing_value' => 0,
],
];

4
pandora_console/include/visual-console-client/vc.main.css
View File

@ -710,6 +710,10 @@ div.module-graph {
min-height: fit-content;
}
.textDecorationNone:hover {
text-decoration: none;
}
/* Styles for the solid icons */
.fa {

2
pandora_console/include/visual-console-client/vc.main.css.map
View File

File diff suppressed because one or more lines are too long

2
pandora_console/include/visual-console-client/vc.main.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
pandora_console/include/visual-console-client/vc.main.min.js.map
View File

File diff suppressed because one or more lines are too long

1
pandora_console/operation/visual_console/view.php
View File

@ -505,6 +505,7 @@ if ($edit_capable === true) {
$('#edit-controls').css('visibility', '');
} else {
visualConsoleManager.visualConsole.disableEditMode();
visualConsoleManager.visualConsole.unSelectItems();
visualConsoleManager.changeUpdateInterval(<?php echo ($refr * 1000); ?>); // To ms.
$('#edit-controls').css('visibility', 'hidden');
}

10
visual_console_client/src/Item.ts
View File

@ -486,12 +486,18 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
let box;
if (this.props.isLinkEnabled) {
box = document.createElement("a") as HTMLAnchorElement;
if (this.props.link) box.href = this.props.link;
if (this.props.link) {
box.href = this.props.link;
} else {
box.className = "textDecorationNone";
}
} else {
box = document.createElement("div") as HTMLDivElement;
box.className = "textDecorationNone";
}
box.className = "visual-console-item";
box.classList.add("visual-console-item");
if (this.props.isOnTop) {
box.classList.add("is-on-top");
}

4
visual_console_client/src/main.css
View File

@ -531,3 +531,7 @@ div.module-graph {
min-width: fit-content;
min-height: fit-content;
}
.textDecorationNone:hover {
text-decoration: none;
}