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">
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
</div>
<div class="row">
<?= $this->paginationControl($comments, null, null, array('preserve' => $this->preserve)); ?>
</div>
<table class="table table-condensed">
<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>
<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">
<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)); ?>
<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>
</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>
<div class="pull-left">
<?= $this->paginationControl($contacts, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -9,11 +9,25 @@ $commandHelper = $this->getHelper('CommandForm');
<?= $this->tabs->render($this); ?>
</div>
</div>
<div data-icinga-component="app/mainDetailGrid" data-icinga-grid-selection-type="single">
<div>
<div class="container pull-left">
<div class="row">
<div class="col-md-12">
<?= $this->sortControl->render($this); ?>
</div>
<div>
</div>
<div class="row">
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
</div>
<div class="row">
<?= $this->selectionToolbar('single'); ?>
</div>
</div>
<?= $this->paginationControl($downtimes, null, null, array('preserve' => $this->preserve)); ?>
<table class="table table-condensed">
<tbody>
@ -66,6 +80,8 @@ $commandHelper = $this->getHelper('CommandForm');
<?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">
<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)); ?>
<table class="table table-condensed">
</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>
<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">
<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)); ?>
<table>
</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>
<div class="container pull-left">
<?= $this->paginationControl($hostgroups, null, null, array('preserve' => $this->preserve)); ?>
</div>
</div>

View File

@ -21,13 +21,13 @@ $viewHelper = $this->getHelper('MonitoringState');
<?= $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">
<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)); ?>
<table class="table table-condensed" >
</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>
<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">
<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)); ?>
<table>
</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>
<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();
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();
};