tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-25 23:04:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Improve timeline layout

Browse Source 
refs #4190
This commit is contained in:
Johannes Meyer 2013-10-25 11:25:20 +02:00
parent 25f4b50ce7
commit 9d3935f15b
1 changed files with 22 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
library/Icinga/Timeline/TimeLine.php
View File

@ -294,36 +294,50 @@ class TimeLine extends Form
$elements = array(); $elements = array();
foreach ($this->range as $timestamp => $timeframe) { foreach ($this->range as $timestamp => $timeframe) {
$elementGroups = array(); $elementGroups = array();
$biggestWidth = 0;
if (array_key_exists($timestamp, $timelineGroups)) { if (array_key_exists($timestamp, $timelineGroups)) {
foreach ($timelineGroups[$timestamp] as $group) { foreach ($timelineGroups[$timestamp] as $group) {
$eventCount = empty($elements) ? $this->extrapolateEventCount($group, 4) : $group->getValue(); $circleWidth = $this->calculateCircleWidth(
empty($elements) ? $this->extrapolateEventCount($group, 4) : $group->getValue()
);
$groupColor = $group->getColor() !== null ? $group->getColor() : $this->getRandomCssColor(); $groupColor = $group->getColor() !== null ? $group->getColor() : $this->getRandomCssColor();
$elementGroups[] = sprintf( $elementGroups[] = sprintf(
'<div class="col-sm-1 col-xs-1 col-md-1 col-lg-1">' . '<div class="col-sm-12 col-xs-12 col-md-6 col-lg-3" style="width:%4$s%2$s;margin:10px 10px;float:left;">' .
' <a href="%2$s" data-icinga-target="detail">' . ' <a href="%1$s" data-icinga-target="detail">' .
' <div style="width:%1$s%3$s;height:%1$s%3$s;border-radius:50%%;' . // TODO: Put this in some sort of dedicated stylesheet ' <div style="width:%4$s%2$s;height:%4$s%2$s;border-radius:50%%;' . // TODO: Put this in some sort of dedicated stylesheet
'box-shadow:4px 4px 8px grey;border:2px solid black;' . 'box-shadow:4px 4px 8px grey;border:2px solid black;' .
'margin:auto;background-color:%5$s;text-align:center;' . 'margin:auto;background-color:%5$s;text-align:center;' .
'padding-top:25%%;color:black;">' . 'padding-top:25%%;color:black;">' .
' %4$s' . ' %3$s' .
' </div>' . ' </div>' .
' </a>' . ' </a>' .
'</div>', '</div>',
$this->calculateCircleWidth($eventCount),
$group->getDetailUrl(), $group->getDetailUrl(),
$this->diameterUnit, $this->diameterUnit,
$group->getValue(), $group->getValue(),
$circleWidth,
$groupColor $groupColor
); );
if ($circleWidth > $biggestWidth) {
$biggestWidth = $circleWidth;
}
} }
} }
$timeframeUrl = $this->getRequest()->getBaseUrl() . '/monitoring/list/eventhistory?timestamp<=' . $timeframeUrl = $this->getRequest()->getBaseUrl() . '/monitoring/list/eventhistory?timestamp<=' .
$timeframe->start->getTimestamp() . '&timestamp>=' . $timeframe->end->getTimestamp(); $timeframe->start->getTimestamp() . '&timestamp>=' . $timeframe->end->getTimestamp();
$elements[] = '<div class="row" style="margin:10px 0;">' . implode('', $elementGroups) . '</div>'; $elements[] = sprintf(
'<div class="row" style="height:%3$s%2$s;">%1$s</div>',
implode('', $elementGroups),
$this->diameterUnit,
$biggestWidth
);
$elements[] = '<br style="clear:all;" />';
$elements[] = '<div><a href="' . $timeframeUrl . '" data-icinga-target="detail">' . $elements[] = '<div><a href="' . $timeframeUrl . '" data-icinga-target="detail">' .
$timeframe->end->format($this->getIntervalFormat()) . '</a></div>'; $timeframe->end->format($this->getIntervalFormat()) . '</a>' .
'<hr style="margin-top:0;"></div>';
} }
return implode('', $elements); return implode('', $elements);