upstream/icingaweb2-module-graphite
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2-module-graphite.git synced 2026-05-28 04:34:57 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

public/js: first rough JS implementation

Browse source
This commit is contained in:
Thomas Gelf 2016-02-16 14:45:37 +01:00
parent b44ae3a162
commit 2b29640d5b
2 changed files with 106 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
application/views/scripts/show/overview.phtml
View file

@ -20,7 +20,7 @@
<?php if (is_array($this->images)): ?>
<?= $this->render('show/legend.phtml') ?>
<?php foreach ($this->images as $title => $url): ?>
<img src="<?= $url ?>" alt="" width="<?= $this->width ?>" height="<?= $this->height ?>" />
<img src="<?= $url ?>" class="graphiteImg" alt="" width="<?= $this->width ?>" height="<?= $this->height ?>" />
<?php endforeach ?>
<?php else: ?>
<?= $this->translate('Please make your selection') ?>

105
public/js/module.js Normal file
View file

@ -0,0 +1,105 @@
(function(Icinga) {
var Graphite = function(module) {
/**
* YES, we need Icinga
*/
this.module = module;
this.imgClones = {
'col1': [],
'col2': []
};
this.lastImgId = 0;
this.initialize();
this.timer;
this.module.icinga.logger.debug('Graphite module loaded');
};
Graphite.prototype = {
initialize: function()
{
this.module.on('rendered', this.onRenderedContainer);
this.registerTimer();
this.module.icinga.logger.debug('Graphite module initialized');
},
registerTimer: function () {
this.timer = this.module.icinga.timer.register(
this.timerTriggered,
this,
8000
);
return this;
},
timerTriggered: function () {
/// console.log('Graphite timer fired');
var self = this;
$.each(this.imgClones, this.reloadContainerImgs.bind(self));
},
reloadContainerImgs(idx, imgs)
{
$.each(imgs, this.reloadImg);
},
reloadImg: function(idx, img)
{
// console.log('Schedule reload for ', img);
var realId = img.attr('id').replace(/_clone$/, '');
$('#' + realId).attr('src', img.attr('src'));
img.attr(
'src',
img.attr('src').replace(
/\&r=\d+/,
'&r=' + (new Date()).getTime()
)
);
},
onRenderedContainer: function(event) {
var $container = $(event.currentTarget);
var self = this;
var cId = $container.attr('id');
self.imgClones[cId] = [];
$('#' + cId + ' img.graphiteImg').each(function(idx, img) {
var $img = $(img);
if (! $img.attr('id')) {
self.lastImgId++;
$(img).attr('id', 'graphiteImg' + self.lastImgId);
}
self.imgClones[cId].push(
$(
$img.clone()
.addClass('graphiteClone')
.attr('id', $img.attr('id') + '_clone')
.load(self.imageLoaded)
// .data('
.attr(
'src',
$img.attr('src') + '&r=' + (new Date()).getTime()
)
)
);
});
},
imageLoaded: function (event) {
// console.log('LOADED', event);
}
};
Icinga.availableModules.graphite = Graphite;
}(Icinga));