Highlight selected table rows in related actions

Allow declaring related controllers for action tables and highlight table rows based on the queries in links pointing to those actions.

fixes #10155

modules/monitoring/application/views/scripts/list/comments.phtml

@@ -15,6 +15,7 @@
   <table data-base-target="_next"
          class="action comments multiselect"
          data-icinga-multiselect-url="/icingaweb2/monitoring/comments/show"
+         data-icinga-multiselect-related="<?= $this->href("monitoring/comments") ?>"
          data-icinga-multiselect-data="comment_id">
     <tbody>
     <?php foreach ($comments->peekAhead($this->compact) as $comment): ?>

modules/monitoring/application/views/scripts/list/downtimes.phtml

@@ -21,6 +21,7 @@ if (! $this->compact): ?>
   <table data-base-target="_next"
          class="action multiselect"
          data-icinga-multiselect-url="/icingaweb2/monitoring/downtimes/show"
+         data-icinga-multiselect-controllers="<?= $this->href("monitoring/downtimes") ?>"
          data-icinga-multiselect-data="downtime_id">
     <tbody>
     <?php foreach ($downtimes as $downtime): ?>

modules/monitoring/application/views/scripts/list/hosts.phtml

@@ -23,6 +23,7 @@ if (! $this->compact): ?>
     data-base-target="_next"
     class="action multiselect"
     data-icinga-multiselect-url="<?= $this->href('monitoring/hosts/show') ?>"
+    data-icinga-multiselect-controllers="<?= $this->href("monitoring/hosts") ?>"
     data-icinga-multiselect-data="host"
 >
   <tbody>

modules/monitoring/application/views/scripts/list/services.phtml

@@ -24,6 +24,7 @@ if (! $this->compact): ?>
 <table data-base-target="_next"
     class="action multiselect <?php if ($this->compact): ?> compact<?php endif ?>" style="table-layout: auto;"
     data-icinga-multiselect-url="<?= $this->href("monitoring/services/show") ?>"
+    data-icinga-multiselect-controllers="<?= $this->href("monitoring/services") ?>"
     data-icinga-multiselect-data="service,host">
   <tbody>
 <?php foreach ($services as $service):

public/js/icinga/behavior/actiontable.js

@@ -50,6 +50,7 @@
     var Selection = function(table, icinga) {
         this.$el = $(table);
         this.icinga = icinga;
+        this.col = this.$el.closest('div.container').attr('id');
         
         if (this.hasMultiselection()) {
             if (! this.getMultiselectionKeys().length) {
@@ -63,6 +64,11 @@
 
     Selection.prototype = {
 
+        /**
+         * The container id in which this selection happens
+         */
+        col: null,
+
         /**
          * Return all rows as jQuery selector
          *
@@ -110,7 +116,7 @@
         },
 
         /**
-         * Return the target URL that is used when multi selecting rows
+         * Return the main target URL that is used when multi selecting rows
          *
          * This URL may differ from the url that is used when applying single rows
          *
@@ -120,6 +126,28 @@
             return this.$el.data('icinga-multiselect-url');
         },
 
+        /**
+         * Check whether the given url is
+         *
+         * @param {String}  url
+         */
+        hasMultiselectionUrl: function(url) {
+            var urls = this.$el.data('icinga-multiselect-url').split(' ');
+
+            var related = this.$el.data('icinga-multiselect-controllers');
+            if (related && related.length) {
+                urls = urls.concat(this.$el.data('icinga-multiselect-controllers').split(' '));
+            }
+
+            var hasSelection = false;
+            $.each(urls, function (i, object) {
+                if (url.indexOf(object) === 0) {
+                    hasSelection = true;
+                }
+            });
+            return hasSelection;
+        },
+
         /**
          * Read all filter data from the given row
          *
@@ -227,7 +255,17 @@
          * @param   url     {String}    The target url
          */
         selectUrl: function(url) {
-            this.rows().filter('[href="' + url + '"]').addClass('active');
+            var $row = this.rows().filter('[href="' + url + '"]');
+            if ($row.length) {
+               $row.addClass('active');
+            } else {
+                // rows sometimes need to be displayed as active when related actions
+                // like command actions are being opened. Do not do this for col2, as it
+                // would always select the opened URL itself.
+                if (this.col !== 'col2') {
+                    this.rows().filter('[href$="' + icinga.utils.parseUrl(url).query + '"]').addClass('active');
+                }
+            }
         },
 
         /**
@@ -264,7 +302,7 @@
             var hash = icinga.history.getCol2State().replace(/^#!/, '');
             if (this.hasMultiselection()) {
                 var query = parseSelectionQuery(hash);
-                if (query.length > 1 && this.getMultiselectionUrl() === this.icinga.utils.parseUrl(hash).path) {
+                if (query.length > 1 && this.hasMultiselectionUrl(this.icinga.utils.parseUrl(hash).path)) {
                     // select all rows with matching filters
                     var self = this;
                     $.each(query, function(i, selection) {