1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
/* Icinga Web 2 | (c) 2017 Icinga Development Team | GPLv2+ */
/**
* Icinga.Behavior.Flyover
*
* A toggleable flyover
*/
(function(Icinga, $) {
'use strict';
var expandedFlyovers = {};
function Flyover(icinga) {
Icinga.EventListener.call(this, icinga);
this.on('rendered', '#main > .container', this.onRendered, this);
this.on('click', this.onClick, this);
this.on('click', '.flyover-toggle', this.onClickFlyoverToggle, this);
}
Flyover.prototype = new Icinga.EventListener();
Flyover.prototype.onRendered = function(event) {
// Re-expand expanded containers after an auto-refresh
$(event.target).find('.flyover').each(function() {
var $this = $(this);
if (typeof expandedFlyovers['#' + $this.attr('id')] !== 'undefined') {
var $container = $this.closest('.container');
if ($this.offset().left - $container.offset().left > $container.innerWidth() / 2) {
$this.addClass('flyover-right');
}
$this.toggleClass('flyover-expanded');
}
});
};
Flyover.prototype.onClick = function(event) {
// Close flyover on click outside the flyover
var $target = $(event.target);
if (! $target.closest('.flyover').length) {
var _this = event.data.self;
$.each(expandedFlyovers, function (id) {
_this.onClickFlyoverToggle({target: $('.flyover-toggle', id)[0]});
});
}
};
Flyover.prototype.onClickFlyoverToggle = function(event) {
var $flyover = $(event.target).closest('.flyover');
$flyover.toggleClass('flyover-expanded');
var $container = $flyover.closest('.container');
if ($flyover.hasClass('flyover-expanded')) {
if ($flyover.offset().left - $container.offset().left > $container.innerWidth() / 2) {
$flyover.addClass('flyover-right');
}
if ($flyover.is('[data-flyover-suspends-auto-refresh]')) {
$container[0].dataset.suspendAutorefresh = '';
}
expandedFlyovers['#' + $flyover.attr('id')] = null;
} else {
$flyover.removeClass('flyover-right');
if ($flyover.is('[data-flyover-suspends-auto-refresh]')) {
delete $container[0].dataset.suspendAutorefresh;
}
delete expandedFlyovers['#' + $flyover.attr('id')];
}
};
Icinga.Behaviors = Icinga.Behaviors || {};
Icinga.Behaviors.Flyover = Flyover;
})(Icinga, jQuery);
|