tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-31 01:34:09 +02:00
Code Issues Packages Projects Releases Wiki Activity

JS hotfix

Browse Source
This commit is contained in:
Alexander Klimov 2014-03-06 13:01:52 +01:00
parent a633aecc99
commit a3ce5f2e52
1 changed files with 271 additions and 249 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

174
public/js/icinga/events.js
View File

@ -1,4 +1,11 @@
(function(Icinga) { /**
* Icinga.Events
*
* Event handlers
*/
(function (Icinga, $) {
'use strict';
Icinga.Events = function (icinga) { Icinga.Events = function (icinga) {
this.icinga = icinga; this.icinga = icinga;
@ -9,21 +16,23 @@
/** /**
* Icinga will call our initialize() function once it's ready * Icinga will call our initialize() function once it's ready
*/ */
initialize: function() initialize: function () {
{
this.applyGlobalDefaults(); this.applyGlobalDefaults();
this.applyHandlers($('#layout'));
this.icinga.ui.prepareContainers(); this.icinga.ui.prepareContainers();
}, },
// TODO: What's this? // TODO: What's this?
applyHandlers: function(el) applyHandlers: function (el) {
{
var icinga = this.icinga; var icinga = this.icinga;
$('.dashboard > div', el).each(function(idx, el) { $('.dashboard > div', el).each(function(idx, el) {
var url = $(el).attr('data-icinga-url'); var url = $(el).attr('data-icinga-url');
if (typeof url === 'undefined') return; if (typeof url === 'undefined') return;
icinga.loader.loadUrl(url, $(el)).autorefresh = true; icinga.loader.loadUrl(url, $(el)).autorefresh = true;
}); });
// Set first links href in a action table tr as row href: // Set first links href in a action table tr as row href:
$('table.action tr', el).each(function(idx, el) { $('table.action tr', el).each(function(idx, el) {
var $a = $('a[href]', el).first(); var $a = $('a[href]', el).first();
@ -31,8 +40,9 @@
$(el).attr('href', $a.attr('href')); $(el).attr('href', $a.attr('href'));
} }
}); });
$('.icinga-module', el).each(function(idx, mod) { $('.icinga-module', el).each(function(idx, mod) {
$mod = $(mod); var $mod = $(mod);
var moduleName = $mod.data('icinga-module'); var moduleName = $mod.data('icinga-module');
if (icinga.hasModule(moduleName)) { if (icinga.hasModule(moduleName)) {
var module = icinga.module(moduleName); var module = icinga.module(moduleName);
@ -40,21 +50,22 @@
} }
}); });
$('input.autofocus', el).focus();
$('.inlinepie', el).sparkline('html', { $('.inlinepie', el).sparkline('html', {
type: 'pie', type: 'pie',
sliceColors: ['#44bb77', '#ffaa44', '#ff5566', '#dcd'], sliceColors: ['#44bb77', '#ffaa44', '#ff5566', '#dcd'],
width: '2em', width: '2em',
height: '2em', height: '2em',
}); });
}, },
/** /**
* Global default event handlers * Global default event handlers
*/ */
applyGlobalDefaults: function() applyGlobalDefaults: function () {
{
// We catch resize events // We catch resize events
$(window).on('resize', { self: this }, this.onWindowResize); $(window).on('resize', { self: this.icinga.ui }, this.icinga.ui.onWindowResize);
// Destroy Icinga, clean up and interrupt pending requests on unload // Destroy Icinga, clean up and interrupt pending requests on unload
$( window ).on('unload', { self: this }, this.onUnload); $( window ).on('unload', { self: this }, this.onUnload);
@ -75,7 +86,10 @@
// We support an 'autosubmit' class on dropdown form elements // We support an 'autosubmit' class on dropdown form elements
$(document).on('change', 'form select.autosubmit', { self: this }, this.submitForm); $(document).on('change', 'form select.autosubmit', { self: this }, this.submitForm);
$(window).on('popstate', { self: this }, this.historyChanged); $(document).on('keyup', '#menu input.search', {self: this}, this.submitForm);
$(document).on('mouseenter', '.historycolorgrid td', this.historycolorgridHover);
$(document).on('mouseleave', '.historycolorgrid td', this.historycolorgidUnhover);
// TBD: a global autocompletion handler // TBD: a global autocompletion handler
// $(document).on('keyup', 'form.auto input', this.formChangeDelayed); // $(document).on('keyup', 'form.auto input', this.formChangeDelayed);
@ -83,50 +97,32 @@
// $(document).on('change', 'form.auto select', this.submitForm); // $(document).on('change', 'form.auto select', this.submitForm);
}, },
onUnload: function(event) onUnload: function (event) {
{
var icinga = event.data.self.icinga; var icinga = event.data.self.icinga;
icinga.logger.info('Unloading Icinga'); icinga.logger.info('Unloading Icinga');
icinga.destroy(); icinga.destroy();
}, },
historyChanged: function(event)
{
var icinga = event.data.self.icinga;
if (event.originalEvent.state === null) {
icinga.logger.debug('No more history steps available');
} else {
icinga.logger.debug(event.originalEvent.state);
}
icinga.loader.loadUrl(
document.location.pathname + document.location.search,
$('#col1')
).historyTriggered = true;
},
/**
* Our window got resized, let's fix our UI
*/
onWindowResize: function(event)
{
var icinga = event.data.self.icinga;
icinga.ui.fixControls();
},
/** /**
* A scroll event happened in one of our containers * A scroll event happened in one of our containers
*/ */
onContainerScroll: function(event) onContainerScroll: function (event) {
{ // Ugly. And PLEASE, not so often
// Yet ugly. And PLEASE, not so often
icinga.ui.fixControls(); icinga.ui.fixControls();
}, },
historycolorgridHover: function () {
$(this).addClass('hover');
},
historycolorgidUnhover: function() {
$(this).removeClass('hover');
},
/** /**
* *
*/ */
submitForm: function (event) submitForm: function (event) {
{
var icinga = event.data.self.icinga; var icinga = event.data.self.icinga;
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
@ -142,38 +138,66 @@
icinga.logger.debug('Submitting form: ' + method + ' ' + url); icinga.logger.debug('Submitting form: ' + method + ' ' + url);
// We should move this to a generic target-finder: // We should move this to a generic target-finder:
var $target = $form.closest('.container'); var $target = null;
if ($target.length == 0) { if ($form.closest('[data-base-target]').length) {
$target = $('#body'); $target = $(
'#' + $form.closest('[data-base-target]').data('baseTarget')
);
} else if ($form.closest('.container').length) {
$target = $form.closest('.container');
} else {
icinga.logger.error('No form target found, stopping here');
return false;
} }
icinga.loader.loadUrl(url, $target, data, method); icinga.loader.loadUrl(url, $target, data, method);
// TODO: Do we really need to return false with stop/preventDefault? // TODO: Do we really need to return false with stop/preventDefault?
return false; return false;
}, },
layout1col: function () {
if (! $('#layout').hasClass('twocols')) { return; }
var $col2 = $('#col2');
icinga.logger.debug('Switching to single col');
$('#layout').removeClass('twocols');
$col2.removeAttr('data-icinga-url');
$col2.removeAttr('data-icinga-refresh');
$col2.removeData('icingaUrl');
$col2.removeData('icingaRefresh');
this.icinga.loader.stopPendingRequestsFor($col2);
$col2.html('');
this.icinga.ui.fixControls();
},
layout2col: function () {
if ($('#layout').hasClass('twocols')) { return; }
icinga.logger.debug('Switching to double col');
$('#layout').addClass('twocols');
this.icinga.ui.fixControls();
},
/** /**
* Someone clicked a link or tr[href] * Someone clicked a link or tr[href]
*/ */
linkClicked: function(event) linkClicked: function (event) {
{
var icinga = event.data.self.icinga; var icinga = event.data.self.icinga;
var $a = $(this); var $a = $(this);
var href = $a.attr('href'); var href = $a.attr('href');
var $li;
var targetId;
if ($a.attr('target') === '_blank') { if ($a.attr('target') === '_blank') {
return true; return true;
} }
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
// If link is hash tag...
if (href === '#') { if (href === '#') {
if ($a.closest('#menu')) { if ($a.closest('#menu')) {
var $li = $a.closest('li'); $li = $a.closest('li');
$li.siblings('li.active').removeClass('active'); $('#menu .active').removeClass('active');
$li.addClass('active'); $li.addClass('active');
} }
return; return;
@ -183,19 +207,20 @@
if ($container.length) { if ($container.length) {
$target = $container; $target = $container;
} }
// If link is hash tag...
if ($a.closest('table.action').length) { if ($a.closest('table.action').length) {
$target = $('#col2'); $target = $('#col2');
$('#layout').addClass('twocols'); icinga.events.layout2col();
icinga.ui.fixControls();
} }
if ($a.closest('[data-base-target]').length) { if ($a.closest('[data-base-target]').length) {
$target = $('#' + $a.closest('[data-base-target]').data('baseTarget')); targetId = $a.closest('[data-base-target]').data('baseTarget');
$('#layout').addClass('twocols'); $target = $('#' + targetId);
icinga.ui.fixControls(); if (targetId === 'col2') {
icinga.events.layout2col();
}
} }
if ($a.closest('.tree').length) { if ($a.closest('.tree').length) {
var $li = $a.closest('li'); $li = $a.closest('li');
if ($li.find('li').length) { if ($li.find('li').length) {
if ($li.hasClass('collapsed')) { if ($li.hasClass('collapsed')) {
$li.removeClass('collapsed'); $li.removeClass('collapsed');
@ -206,46 +231,41 @@
return false; return false;
} else { } else {
$target = $('#col2'); $target = $('#col2');
$('#layout').addClass('twocols'); icinga.events.layout2col();
icinga.ui.fixControls();
} }
} }
icinga.loader.loadUrl(href, $target); icinga.loader.loadUrl(href, $target);
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
if ($a.closest('#menu').length) { if ($a.closest('#menu').length) {
$('#layout').removeClass('twocols'); icinga.events.layout1col();
$('#col2').html('<ul class="tabs"></ul>');
icinga.ui.fixControls();
return false; return false;
} }
if ($a.closest('table').length) {
if ($a.closest('table.action').length) {
if ($('#layout').hasClass('twocols')) { if ($('#layout').hasClass('twocols')) {
if ($target.attr('id') === 'col2') return; if ($target.attr('id') === 'col2') {
icinga.logger.debug('Switching to single col'); return;
$('#layout').removeClass('twocols'); }
icinga.ui.fixControls(); icinga.events.layout1col();
} else { } else {
icinga.logger.debug('Switching to double col'); icinga.events.layout2col();
$('#layout').addClass('twocols');
icinga.ui.fixControls();
} }
return false; return false;
} }
}, },
/* /*
hrefIsHashtag: function(href) hrefIsHashtag: function(href) {
{
// WARNING: IE gives full URL :( // WARNING: IE gives full URL :(
// Also it doesn't support negativ indexes in substr // Also it doesn't support negativ indexes in substr
return href.substr(href.length - 1, 1) == '#'; return href.substr(href.length - 1, 1) == '#';
}, },
*/ */
unbindGlobalHandlers: function() unbindGlobalHandlers: function () {
{
$(window).off('popstate', this.historyChanged);
$(window).off('resize', this.onWindowResize); $(window).off('resize', this.onWindowResize);
$(window).off('unload', this.onUnload); $(window).off('unload', this.onUnload);
$(window).off('beforeunload', this.onUnload); $(window).off('beforeunload', this.onUnload);
@ -254,6 +274,8 @@
$(document).off('click', 'tr[href]', this.linkClicked); $(document).off('click', 'tr[href]', this.linkClicked);
$(document).off('submit', 'form', this.submitForm); $(document).off('submit', 'form', this.submitForm);
$(document).off('change', 'form select.autosubmit', this.submitForm); $(document).off('change', 'form select.autosubmit', this.submitForm);
$(document).off('mouseenter', '.historycolorgrid td', this.historycolorgridHover);
$(document).off('mouseenter', '.historycolorgrid td', this.historycolorgidUnhover);
}, },
destroy: function() { destroy: function() {
@ -263,4 +285,4 @@
} }
}; };
}(Icinga)); }(Icinga, jQuery));