Fix bug that caused the detail view to stay open, even when nothing was selected

fixes #4749
This commit is contained in:
Matthias Jentsch 2013-10-22 16:57:28 +02:00
parent a3099c82f2
commit eaa3c81f7a
15 changed files with 268 additions and 112 deletions

View File

@ -0,0 +1,27 @@
<?php
class Zend_View_Helper_SelectionToolbar extends Zend_View_Helper_Abstract
{
/**
* Create a selection toolbar
*
* @param $type
* @param null $target
*
* @return string
*/
public function selectionToolbar($type, $target = null)
{
if ($type == 'multi') {
return 'Select
<a href="' . $target . '"> All </a>
<a href="#"> None </a>';
} else if ($type == 'single') {
return 'Select <a href="#"> None </a>';
} else {
return '';
}
}
}

View File

@ -15,15 +15,26 @@
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<?= $this->sortControl->render($this); ?>
<div class="container pull-left">
<?= $this->paginationControl($comments, null, null, array('preserve' => $this->preserve)); ?>
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<table class="table table-condensed">
<div class="row">
<?= $this->paginationControl($comments, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach ($comments as $comment): ?>
<?php
@ -145,5 +156,7 @@
</tbody>
</table>
<?= $this->paginationControl($comments, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="container pull-left">
<?= $this->paginationControl($comments, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -11,21 +11,21 @@ $contactHelper = $this->getHelper('ContactFlags');
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="none">
<?= $this->sortControl->render($this); ?>
<?= $this->paginationControl($contacts, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed">
<thead>
<tr>
<th> Contact Name </th>
<th> Alias </th>
<th> Email Address </th>
<th> Pager Address / Number </th>
<th> Service Notification Options </th>
<th> Host Notification Options </th>
<th> Service Notification Period </th>
<th> Host Notification Period </th>
</tr>
</thead>
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($contacts, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach($contacts as $contact): ?>
<?php $periodLink = $this->href('monitoring/show/contacts', array('contact' => $contact->contact_name)); ?>
@ -42,5 +42,8 @@ $contactHelper = $this->getHelper('ContactFlags');
<?php endforeach; ?>
</tbody>
</table>
<?= $this->paginationControl($contacts, null, null, array('preserve' => $this->preserve)); ?>
<div class="pull-left">
<?= $this->paginationControl($contacts, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -9,63 +9,79 @@ $commandHelper = $this->getHelper('CommandForm');
<?= $this->tabs->render($this); ?>
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<div>
<?= $this->sortControl->render($this); ?>
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<div>
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed">
<tbody>
<?php foreach ($downtimes as $downtime): ?>
<tr>
<td>
<?= $this->dateFormat()->formatDateTime((int) $downtime->downtime_start); ?> -
<?= $this->dateFormat()->formatDateTime((int) $downtime->downtime_end); ?>
<br />
<small>Duration: <?= $this->util()->showHourMin((int) $downtime->downtime_duration); ?></small>
<br />
<small>The <?php if($downtime->downtime_is_flexible): ?>flexible<?php else: ?>fixed<?php endif; ?> downtime is <?php if(!$downtime->downtime_is_in_effect): ?>not <?php endif; ?>in effect</small>
</td>
<td>
<?php if (isset($downtime->service)): ?>
<a href="<?= $this->href('monitoring/show/service', array(
'host' => (string) $downtime->host,
'service' => (string) $downtime->service
)); ?>"><?= $downtime->service ?></a>
<small>on <?= $downtime->host ?></small>
<?php else: ?>
<a href="<?= $this->href('monitoring/show/host', array(
'host' => (string) $downtime->host
)); ?>"><?= $downtime->host ?> </a>
<?php endif; ?>
<br />
<?= $downtime->downtime_author ?>: <?= $downtime->downtime_comment ?>
<br />
<small>Entry Time: <?= ($downtime->downtime_entry_time) ? $this->dateFormat()->formatDateTime((int) $downtime->downtime_entry_time) : ''; ?>
</small>
<td>
<?php
$data = array(
'downtimeid' => $downtime->downtime_internal_downtime_id,
'host' => $downtime->host
);
if (isset($downtime->service)) {
$data['service'] = $downtime->service;
}
echo $commandHelper->iconSubmitForm(
'icinga-icon-remove',
'Remove Downtime',
'btn-small',
'removedowntime',
$data
);
?>
</td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed">
<tbody>
<?php foreach ($downtimes as $downtime): ?>
<tr>
<td>
<?= $this->dateFormat()->formatDateTime((int) $downtime->downtime_start); ?> -
<?= $this->dateFormat()->formatDateTime((int) $downtime->downtime_end); ?>
<br />
<small>Duration: <?= $this->util()->showHourMin((int) $downtime->downtime_duration); ?></small>
<br />
<small>The <?php if($downtime->downtime_is_flexible): ?>flexible<?php else: ?>fixed<?php endif; ?> downtime is <?php if(!$downtime->downtime_is_in_effect): ?>not <?php endif; ?>in effect</small>
</td>
<td>
<?php if (isset($downtime->service)): ?>
<a href="<?= $this->href('monitoring/show/service', array(
'host' => (string) $downtime->host,
'service' => (string) $downtime->service
)); ?>"><?= $downtime->service ?></a>
<small>on <?= $downtime->host ?></small>
<?php else: ?>
<a href="<?= $this->href('monitoring/show/host', array(
'host' => (string) $downtime->host
)); ?>"><?= $downtime->host ?> </a>
<?php endif; ?>
<br />
<?= $downtime->downtime_author ?>: <?= $downtime->downtime_comment ?>
<br />
<small>Entry Time: <?= ($downtime->downtime_entry_time) ? $this->dateFormat()->formatDateTime((int) $downtime->downtime_entry_time) : ''; ?>
</small>
<td>
<?php
$data = array(
'downtimeid' => $downtime->downtime_internal_downtime_id,
'host' => $downtime->host
);
if (isset($downtime->service)) {
$data['service'] = $downtime->service;
}
echo $commandHelper->iconSubmitForm(
'icinga-icon-remove',
'Remove Downtime',
'btn-small',
'removedowntime',
$data
);
?>
</td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<div class="container pull-left">
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -7,9 +7,18 @@
</div>
</div>
<?php if (!empty($history)): ?>
<div data-icinga-component="app/mainDetailGrid">
<?= $this->paginationControl($history, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed">
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<div class="container pull-left">
<div class="row">
<?= $this->paginationControl($history, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach ($history as $event): ?>
<?php
@ -106,6 +115,10 @@
<? endforeach; ?>
</tbody>
</table>
<?= $this->paginationControl($history, null, null, array('preserve' => $this->preserve)); ?>
<div class="container pull-left">
<?= $this->paginationControl($history, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>
<?php endif; ?>

View File

@ -6,10 +6,25 @@
<?= $this->tabs->render($this); ?>
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<?= $this->sortControl->render($this); ?>
<?= $this->paginationControl($hostgroups, null, null, array('preserve' => $this->preserve)); ?>
<table>
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($hostgroups, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach($hostgroups as $hostgroup): ?>
<tr>
@ -90,5 +105,8 @@
<?php endforeach; ?>
</tbody>
</table>
<?= $this->paginationControl($hostgroups, null, null, array('preserve' => $this->preserve)); ?>
<div class="container pull-left">
<?= $this->paginationControl($hostgroups, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -15,19 +15,19 @@ $viewHelper = $this->getHelper('MonitoringState');
<div class="container pull-left">
<div class="row">
<div class="col-md-5">
<?= $this->filterBox->render($this); ?>
<?= $this->filterBox->render($this); ?>
</div>
<div class="col-md-7">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($hosts, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
Select
<a href='<?=$this->href('monitoring/multi/host',array( 'host' => '*' ))?>'> All </a>
<a href='#'> None </a>
<?= $this->selectionToolbar('multi', $this->href('monitoring/multi/host',array( 'host' => '*' ))); ?>
</div>
</div>

View File

@ -9,9 +9,24 @@
<?php if (!empty($notifications)): ?>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<?= $this->sortControl->render($this); ?>
<?= $this->paginationControl($notifications, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed" >
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($notifications, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach ($notifications as $notification): ?>
<?php
@ -56,7 +71,10 @@
<?php endforeach; ?>
</tbody>
</table>
<?= $this->paginationControl($notifications, null, null, array('preserve' => $this->preserve)); ?>
<div class="container pull-left">
<?= $this->paginationControl($notifications, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>
<?php else: ?>
No notifications yet

View File

@ -6,11 +6,25 @@
<?= $this->tabs->render($this); ?>
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<?= $this->sortControl->render($this); ?>
<?= $this->paginationControl($servicegroups, null, null, array('preserve' => $this->preserve)); ?>
<table>
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($servicegroups, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<table class="table table-condensed pull-left">
<tbody>
<?php foreach($servicegroups as $servicegroup): ?>
<tr>
@ -91,5 +105,8 @@
<?php endforeach; ?>
</tbody>
</table>
<?= $this->paginationControl($servicegroups, null, null, array('preserve' => $this->preserve)); ?>
<div class="container pull-left">
<?= $this->paginationControl($servicegroups, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -24,9 +24,7 @@ $viewHelper = $this->getHelper('MonitoringState');
<?= $this->paginationControl($services, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
Select
<a href='<?=$this->href('monitoring/multi/service',array( 'host' => '*', 'service' => '*' ))?>'> All </a>
<a href='#'> None </a>
<?= $this->selectionToolbar('multi', $this->href('monitoring/multi/service', array( 'service' => '*', 'host' => '*' ))); ?>
</div>
</div>

View File

@ -455,7 +455,12 @@ define(['jquery', 'logging', 'icinga/componentLoader', 'URIjs/URI', 'URIjs/URITe
$(window).on('hashchange', (function() {
urlMgr.syncWithUrl();
Container.getDetailContainer().replaceDomAsync(urlMgr.detailUrl);
if (urlMgr.detailUrl) {
Container.getDetailContainer().replaceDomAsync(urlMgr.detailUrl);
} else {
Container.hideDetail();
}
}));

View File

@ -167,9 +167,11 @@ function(Container, $, logger, URI, tpl, urlMgr, Selectable, TableMultiSelection
this.registerTableLinks = function(domContext) {
domContext = domContext || contentNode;
$('tbody tr', domContext).on('click', function(ev) {
$('tbody tr', domContext).click(function(ev) {
var targetEl = ev.target || ev.toElement || ev.relatedTarget,
a = $(targetEl).closest('a');
ev.preventDefault();
ev.stopPropagation();
var nodeNames = [];
nodeNames.push($(targetEl).prop('nodeName').toLowerCase());
@ -189,15 +191,13 @@ function(Container, $, logger, URI, tpl, urlMgr, Selectable, TableMultiSelection
switch (selectionMode) {
case 'multi':
var selectable = new Selectable(this);
if (ev.ctrlKey || ev.metaKey) {
selection.toggle(selectable);
selection.toggle(new Selectable(this));
} else if (ev.shiftKey) {
// select range ?
selection.add(selectable);
selection.add(new Selectable(this));
} else {
selection.clear();
selection.add(selectable);
selection.add(new Selectable(this));
}
break;
@ -217,7 +217,8 @@ function(Container, $, logger, URI, tpl, urlMgr, Selectable, TableMultiSelection
var segments = url.segment();
if (selection.size() === 0) {
// don't open anything
url.search('?');
urlMgr.setDetailUrl('');
return false;
} else if (selection.size() > 1 && segments.length > 3) {
// open detail view for multiple objects
segments[2] = 'multi';
@ -228,6 +229,18 @@ function(Container, $, logger, URI, tpl, urlMgr, Selectable, TableMultiSelection
urlMgr.setDetailUrl(url);
return false;
});
/*
* Clear the URL when deselected or when a wildcard is used
*/
$(window).on('hashchange', function(){
if (
!location.hash ||
location.hash.match(/(host=%2A)|(service=%2A)/)
) {
selection.clear();
}
});
};
/**

View File

@ -43,6 +43,7 @@ function($, URI, Selectable) {
* @param {URI} The query that contains the selected rows.
*/
return function MultiSelection(table, detailUrl) {
var self = this;
/**
* Contains all selected selectables

View File

@ -72,6 +72,11 @@ define(['jquery', 'URIjs/URI'], function($, URI) {
return href.query(true);
};
/**
* Set the current selection state
*
* @param {boolean} The new state
*/
this.setActive = function(value) {
if (value) {
$(tableRow).addClass('active');
@ -79,5 +84,15 @@ define(['jquery', 'URIjs/URI'], function($, URI) {
$(tableRow).removeClass('active');
}
};
/**
* Return the current selection state
*
* @returns {boolean} True when the object is selected
*/
this.isActive = function()
{
return $(tableRow).hasClass('active');
};
};
});

View File

@ -25,7 +25,7 @@
*/
// {{{ICINGA_LICENSE_HEADER}}}
define(['jquery', 'URIjs/URI'], function($, URI, Container) {
define(['jquery', 'logging', 'URIjs/URI'], function($, log, URI, Container) {
"use strict";
var currentUrl = URI(window.location.href);
@ -126,7 +126,6 @@ define(['jquery', 'URIjs/URI'], function($, URI, Container) {
this.detailUrl = url.clone().fragment('').href();
}
this.detailAnchor = this.getMainAnchor(url);
window.location.hash = this.getUrlHash();
};