ui.js indentation
This commit is contained in:
parent
415193f9de
commit
7e2d6cd5c2
|
@ -21,332 +21,332 @@
|
|||
|
||||
Icinga.UI.prototype = {
|
||||
|
||||
initialize: function () {
|
||||
$('html').removeClass('no-js').addClass('js');
|
||||
this.icinga.timer.register(this.refreshTimeSince, this, 1000);
|
||||
this.triggerWindowResize();
|
||||
this.fadeNotificationsAway();
|
||||
},
|
||||
initialize: function () {
|
||||
$('html').removeClass('no-js').addClass('js');
|
||||
this.icinga.timer.register(this.refreshTimeSince, this, 1000);
|
||||
this.triggerWindowResize();
|
||||
this.fadeNotificationsAway();
|
||||
},
|
||||
|
||||
fadeNotificationsAway: function()
|
||||
{
|
||||
var icinga = this.icinga;
|
||||
$('#notifications li')
|
||||
.not('.fading-out')
|
||||
.not('.persist')
|
||||
.addClass('fading-out')
|
||||
.delay(7000)
|
||||
.fadeOut('slow',
|
||||
function() {
|
||||
icinga.ui.fixControls();
|
||||
this.remove();
|
||||
});
|
||||
fadeNotificationsAway: function()
|
||||
{
|
||||
var icinga = this.icinga;
|
||||
$('#notifications li')
|
||||
.not('.fading-out')
|
||||
.not('.persist')
|
||||
.addClass('fading-out')
|
||||
.delay(7000)
|
||||
.fadeOut('slow',
|
||||
function() {
|
||||
icinga.ui.fixControls();
|
||||
this.remove();
|
||||
});
|
||||
|
||||
},
|
||||
},
|
||||
|
||||
enableDebug: function () {
|
||||
this.debug = true;
|
||||
this.debugTimer = this.icinga.timer.register(
|
||||
this.refreshDebug,
|
||||
this,
|
||||
1000
|
||||
);
|
||||
this.fixDebugVisibility();
|
||||
enableDebug: function () {
|
||||
this.debug = true;
|
||||
this.debugTimer = this.icinga.timer.register(
|
||||
this.refreshDebug,
|
||||
this,
|
||||
1000
|
||||
);
|
||||
this.fixDebugVisibility();
|
||||
|
||||
return this;
|
||||
},
|
||||
return this;
|
||||
},
|
||||
|
||||
fixDebugVisibility: function () {
|
||||
if (this.debug) {
|
||||
$('#responsive-debug').css({display: 'block'});
|
||||
} else {
|
||||
$('#responsive-debug').css({display: 'none'});
|
||||
}
|
||||
return this;
|
||||
},
|
||||
fixDebugVisibility: function () {
|
||||
if (this.debug) {
|
||||
$('#responsive-debug').css({display: 'block'});
|
||||
} else {
|
||||
$('#responsive-debug').css({display: 'none'});
|
||||
}
|
||||
return this;
|
||||
},
|
||||
|
||||
disableDebug: function () {
|
||||
if (this.debug === false) { return; }
|
||||
disableDebug: function () {
|
||||
if (this.debug === false) { return; }
|
||||
|
||||
this.debug = false;
|
||||
this.icinga.timer.unregister(this.debugTimer);
|
||||
this.debugTimer = null;
|
||||
this.fixDebugVisibility();
|
||||
return this;
|
||||
},
|
||||
this.debug = false;
|
||||
this.icinga.timer.unregister(this.debugTimer);
|
||||
this.debugTimer = null;
|
||||
this.fixDebugVisibility();
|
||||
return this;
|
||||
},
|
||||
|
||||
flipContent: function () {
|
||||
var col1 = $('#col1 > div').detach();
|
||||
var col2 = $('#col2 > div').detach();
|
||||
$('#col2').html('');
|
||||
$('#col1').html('');
|
||||
flipContent: function () {
|
||||
var col1 = $('#col1 > div').detach();
|
||||
var col2 = $('#col2 > div').detach();
|
||||
$('#col2').html('');
|
||||
$('#col1').html('');
|
||||
|
||||
col1.appendTo('#col2');
|
||||
col2.appendTo('#col1');
|
||||
this.fixControls();
|
||||
},
|
||||
col1.appendTo('#col2');
|
||||
col2.appendTo('#col1');
|
||||
this.fixControls();
|
||||
},
|
||||
|
||||
triggerWindowResize: function () {
|
||||
this.onWindowResize({data: {self: this}});
|
||||
},
|
||||
triggerWindowResize: function () {
|
||||
this.onWindowResize({data: {self: this}});
|
||||
},
|
||||
|
||||
/**
|
||||
* Our window got resized, let's fix our UI
|
||||
*/
|
||||
onWindowResize: function (event) {
|
||||
var self = event.data.self;
|
||||
self.fixControls();
|
||||
/**
|
||||
* Our window got resized, let's fix our UI
|
||||
*/
|
||||
onWindowResize: function (event) {
|
||||
var self = event.data.self;
|
||||
self.fixControls();
|
||||
|
||||
if (self.layoutHasBeenChanged()) {
|
||||
self.icinga.logger.info(
|
||||
'Layout change detected, switching to',
|
||||
self.currentLayout
|
||||
);
|
||||
}
|
||||
self.refreshDebug();
|
||||
},
|
||||
if (self.layoutHasBeenChanged()) {
|
||||
self.icinga.logger.info(
|
||||
'Layout change detected, switching to',
|
||||
self.currentLayout
|
||||
);
|
||||
}
|
||||
self.refreshDebug();
|
||||
},
|
||||
|
||||
layoutHasBeenChanged: function () {
|
||||
layoutHasBeenChanged: function () {
|
||||
|
||||
var layout = $('html').css('fontFamily').replace(/['",]/g, '');
|
||||
var matched;
|
||||
var layout = $('html').css('fontFamily').replace(/['",]/g, '');
|
||||
var matched;
|
||||
|
||||
if (null !== (matched = layout.match(/^([a-z]+)-layout$/))) {
|
||||
if (matched[1] === this.currentLayout &&
|
||||
$('#layout').hasClass(layout)
|
||||
) {
|
||||
return false;
|
||||
} else {
|
||||
$('#layout').removeClass(this.currentLayout + '-layout').addClass(layout);
|
||||
this.currentLayout = matched[1];
|
||||
if (this.currentLayout === 'poor' || this.currentLayout === 'minimal') {
|
||||
this.icinga.events.layout1col();
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
if (null !== (matched = layout.match(/^([a-z]+)-layout$/))) {
|
||||
if (matched[1] === this.currentLayout &&
|
||||
$('#layout').hasClass(layout)
|
||||
) {
|
||||
return false;
|
||||
} else {
|
||||
$('#layout').removeClass(this.currentLayout + '-layout').addClass(layout);
|
||||
this.currentLayout = matched[1];
|
||||
if (this.currentLayout === 'poor' || this.currentLayout === 'minimal') {
|
||||
this.icinga.events.layout1col();
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
this.icinga.logger.error(
|
||||
'Someone messed up our responsiveness hacks, html font-family is',
|
||||
layout
|
||||
);
|
||||
this.icinga.logger.error(
|
||||
'Someone messed up our responsiveness hacks, html font-family is',
|
||||
layout
|
||||
);
|
||||
|
||||
return false;
|
||||
},
|
||||
return false;
|
||||
},
|
||||
|
||||
getAvailableColumnSpace: function () {
|
||||
return $('#main').width() / this.getDefaultFontSize();
|
||||
},
|
||||
getAvailableColumnSpace: function () {
|
||||
return $('#main').width() / this.getDefaultFontSize();
|
||||
},
|
||||
|
||||
setColumnCount: function (count) {
|
||||
if (count === 3) {
|
||||
$('#main > .container').css({
|
||||
width: '33.33333%'
|
||||
});
|
||||
} else if (count === 2) {
|
||||
$('#main > .container').css({
|
||||
width: '50%'
|
||||
});
|
||||
} else {
|
||||
$('#main > .container').css({
|
||||
width: '100%'
|
||||
});
|
||||
}
|
||||
},
|
||||
setColumnCount: function (count) {
|
||||
if (count === 3) {
|
||||
$('#main > .container').css({
|
||||
width: '33.33333%'
|
||||
});
|
||||
} else if (count === 2) {
|
||||
$('#main > .container').css({
|
||||
width: '50%'
|
||||
});
|
||||
} else {
|
||||
$('#main > .container').css({
|
||||
width: '100%'
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
setTitle: function (title) {
|
||||
document.title = title;
|
||||
return this;
|
||||
},
|
||||
setTitle: function (title) {
|
||||
document.title = title;
|
||||
return this;
|
||||
},
|
||||
|
||||
getColumnCount: function () {
|
||||
return $('#main > .container').length;
|
||||
},
|
||||
getColumnCount: function () {
|
||||
return $('#main > .container').length;
|
||||
},
|
||||
|
||||
prepareContainers: function () {
|
||||
var icinga = this.icinga;
|
||||
$('.container').each(function(idx, el) {
|
||||
icinga.events.applyHandlers($(el));
|
||||
icinga.ui.initializeControls($(el));
|
||||
});
|
||||
/*
|
||||
$('#icinga-main').attr(
|
||||
'icingaurl',
|
||||
window.location.pathname + window.location.search
|
||||
);
|
||||
*/
|
||||
},
|
||||
prepareContainers: function () {
|
||||
var icinga = this.icinga;
|
||||
$('.container').each(function(idx, el) {
|
||||
icinga.events.applyHandlers($(el));
|
||||
icinga.ui.initializeControls($(el));
|
||||
});
|
||||
/*
|
||||
$('#icinga-main').attr(
|
||||
'icingaurl',
|
||||
window.location.pathname + window.location.search
|
||||
);
|
||||
*/
|
||||
},
|
||||
|
||||
refreshDebug: function () {
|
||||
refreshDebug: function () {
|
||||
|
||||
var size = this.getDefaultFontSize().toString();
|
||||
var winWidth = $( window ).width();
|
||||
var winHeight = $( window ).height();
|
||||
var loading = '';
|
||||
var size = this.getDefaultFontSize().toString();
|
||||
var winWidth = $( window ).width();
|
||||
var winHeight = $( window ).height();
|
||||
var loading = '';
|
||||
|
||||
$.each(this.icinga.loader.requests, function (el, req) {
|
||||
if (loading === '') {
|
||||
loading = '<br />Loading:<br />';
|
||||
}
|
||||
loading += el + ' => ' + req.url;
|
||||
});
|
||||
$.each(this.icinga.loader.requests, function (el, req) {
|
||||
if (loading === '') {
|
||||
loading = '<br />Loading:<br />';
|
||||
}
|
||||
loading += el + ' => ' + req.url;
|
||||
});
|
||||
|
||||
$('#responsive-debug').html(
|
||||
' Time: ' +
|
||||
this.icinga.utils.formatHHiiss(new Date()) +
|
||||
'<br /> 1em: ' +
|
||||
size +
|
||||
'px<br /> Win: ' +
|
||||
winWidth +
|
||||
'x'+
|
||||
winHeight +
|
||||
'px<br />' +
|
||||
' Layout: ' +
|
||||
this.currentLayout +
|
||||
loading
|
||||
);
|
||||
},
|
||||
$('#responsive-debug').html(
|
||||
' Time: ' +
|
||||
this.icinga.utils.formatHHiiss(new Date()) +
|
||||
'<br /> 1em: ' +
|
||||
size +
|
||||
'px<br /> Win: ' +
|
||||
winWidth +
|
||||
'x'+
|
||||
winHeight +
|
||||
'px<br />' +
|
||||
' Layout: ' +
|
||||
this.currentLayout +
|
||||
loading
|
||||
);
|
||||
},
|
||||
|
||||
refreshTimeSince: function () {
|
||||
refreshTimeSince: function () {
|
||||
|
||||
$('.timesince').each(function (idx, el) {
|
||||
var m = el.innerHTML.match(/^(-?\d+)m\s(-?\d+)s/);
|
||||
if (m !== null) {
|
||||
var nm = parseInt(m[1]);
|
||||
var ns = parseInt(m[2]);
|
||||
if (ns < 59) {
|
||||
ns++;
|
||||
} else {
|
||||
ns = 0;
|
||||
nm++;
|
||||
}
|
||||
$(el).html(nm + 'm ' + ns + 's');
|
||||
}
|
||||
});
|
||||
$('.timesince').each(function (idx, el) {
|
||||
var m = el.innerHTML.match(/^(-?\d+)m\s(-?\d+)s/);
|
||||
if (m !== null) {
|
||||
var nm = parseInt(m[1]);
|
||||
var ns = parseInt(m[2]);
|
||||
if (ns < 59) {
|
||||
ns++;
|
||||
} else {
|
||||
ns = 0;
|
||||
nm++;
|
||||
}
|
||||
$(el).html(nm + 'm ' + ns + 's');
|
||||
}
|
||||
});
|
||||
|
||||
$('.timeunless').each(function (idx, el) {
|
||||
var m = el.innerHTML.match(/^(-?\d+)m\s(-?\d+)s/);
|
||||
if (m !== null) {
|
||||
var nm = parseInt(m[1]);
|
||||
var ns = parseInt(m[2]);
|
||||
if (nm >= 0) {
|
||||
if (ns > 0) {
|
||||
ns--;
|
||||
} else {
|
||||
ns = 59;
|
||||
nm--;
|
||||
}
|
||||
} else {
|
||||
if (ns < 59) {
|
||||
ns++;
|
||||
} else {
|
||||
ns = 0;
|
||||
nm--;
|
||||
}
|
||||
}
|
||||
$(el).html(nm + 'm ' + ns + 's');
|
||||
}
|
||||
});
|
||||
},
|
||||
$('.timeunless').each(function (idx, el) {
|
||||
var m = el.innerHTML.match(/^(-?\d+)m\s(-?\d+)s/);
|
||||
if (m !== null) {
|
||||
var nm = parseInt(m[1]);
|
||||
var ns = parseInt(m[2]);
|
||||
if (nm >= 0) {
|
||||
if (ns > 0) {
|
||||
ns--;
|
||||
} else {
|
||||
ns = 59;
|
||||
nm--;
|
||||
}
|
||||
} else {
|
||||
if (ns < 59) {
|
||||
ns++;
|
||||
} else {
|
||||
ns = 0;
|
||||
nm--;
|
||||
}
|
||||
}
|
||||
$(el).html(nm + 'm ' + ns + 's');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
createFontSizeCalculator: function () {
|
||||
var $el = $('<div id="fontsize-calc"> </div>');
|
||||
$('#layout').append($el);
|
||||
return $el;
|
||||
},
|
||||
createFontSizeCalculator: function () {
|
||||
var $el = $('<div id="fontsize-calc"> </div>');
|
||||
$('#layout').append($el);
|
||||
return $el;
|
||||
},
|
||||
|
||||
getDefaultFontSize: function () {
|
||||
var $calc = $('#fontsize-calc');
|
||||
if (! $calc.length) {
|
||||
$calc = this.createFontSizeCalculator();
|
||||
}
|
||||
return $calc.width() / 1000;
|
||||
},
|
||||
getDefaultFontSize: function () {
|
||||
var $calc = $('#fontsize-calc');
|
||||
if (! $calc.length) {
|
||||
$calc = this.createFontSizeCalculator();
|
||||
}
|
||||
return $calc.width() / 1000;
|
||||
},
|
||||
|
||||
initializeControls: function (parent) {
|
||||
initializeControls: function (parent) {
|
||||
|
||||
var self = this;
|
||||
var self = this;
|
||||
|
||||
$('.controls', parent).each(function (idx, el) {
|
||||
var $el = $(el);
|
||||
$('.controls', parent).each(function (idx, el) {
|
||||
var $el = $(el);
|
||||
|
||||
if (! $el.next('.fake-controls').length) {
|
||||
if (! $el.next('.fake-controls').length) {
|
||||
|
||||
var newdiv = $('<div class="fake-controls"></div>');
|
||||
newdiv.css({
|
||||
height: $el.css('height')
|
||||
});
|
||||
$el.after(newdiv);
|
||||
}
|
||||
});
|
||||
var newdiv = $('<div class="fake-controls"></div>');
|
||||
newdiv.css({
|
||||
height: $el.css('height')
|
||||
});
|
||||
$el.after(newdiv);
|
||||
}
|
||||
});
|
||||
|
||||
this.fixControls(parent);
|
||||
},
|
||||
this.fixControls(parent);
|
||||
},
|
||||
|
||||
fixControls: function ($parent) {
|
||||
fixControls: function ($parent) {
|
||||
|
||||
var self = this;
|
||||
var self = this;
|
||||
|
||||
if ('undefined' === typeof $parent) {
|
||||
if ('undefined' === typeof $parent) {
|
||||
|
||||
$('#header').css({height: 'auto'});
|
||||
$('#main').css({top: $('#header').css('height')});
|
||||
$('#sidebar').css({top: $('#header').height() + 'px'});
|
||||
$('#header').css({height: $('#header').height() + 'px'});
|
||||
$('#inner-layout').css({top: $('#header').css('height')});
|
||||
$('.container').each(function (idx, container) {
|
||||
self.fixControls($(container));
|
||||
});
|
||||
$('#header').css({height: 'auto'});
|
||||
$('#main').css({top: $('#header').css('height')});
|
||||
$('#sidebar').css({top: $('#header').height() + 'px'});
|
||||
$('#header').css({height: $('#header').height() + 'px'});
|
||||
$('#inner-layout').css({top: $('#header').css('height')});
|
||||
$('.container').each(function (idx, container) {
|
||||
self.fixControls($(container));
|
||||
});
|
||||
|
||||
return;
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
self.icinga.logger.debug('Fixing controls for ', $parent);
|
||||
self.icinga.logger.debug('Fixing controls for ', $parent);
|
||||
|
||||
$('.controls', $parent).each(function (idx, el) {
|
||||
var $el = $(el);
|
||||
var $fake = $el.next('.fake-controls');
|
||||
var y = $parent.scrollTop();
|
||||
$('.controls', $parent).each(function (idx, el) {
|
||||
var $el = $(el);
|
||||
var $fake = $el.next('.fake-controls');
|
||||
var y = $parent.scrollTop();
|
||||
|
||||
$el.css({
|
||||
position : 'fixed',
|
||||
top : $parent.offset().top,
|
||||
width : $fake.css('width')
|
||||
});
|
||||
$el.css({
|
||||
position : 'fixed',
|
||||
top : $parent.offset().top,
|
||||
width : $fake.css('width')
|
||||
});
|
||||
|
||||
$fake.css({
|
||||
height : $el.css('height'),
|
||||
display : 'block'
|
||||
});
|
||||
});
|
||||
},
|
||||
$fake.css({
|
||||
height : $el.css('height'),
|
||||
display : 'block'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
toggleFullscreen: function () {
|
||||
$('#layout').toggleClass('fullscreen-layout');
|
||||
this.fixControls();
|
||||
},
|
||||
toggleFullscreen: function () {
|
||||
$('#layout').toggleClass('fullscreen-layout');
|
||||
this.fixControls();
|
||||
},
|
||||
|
||||
getWindowId: function () {
|
||||
var res = window.name.match(/^Icinga_([a-zA-Z0-9])$/);
|
||||
if (res) {
|
||||
return res[1];
|
||||
}
|
||||
return null;
|
||||
},
|
||||
getWindowId: function () {
|
||||
var res = window.name.match(/^Icinga_([a-zA-Z0-9])$/);
|
||||
if (res) {
|
||||
return res[1];
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
hasWindowId: function () {
|
||||
var res = window.name.match(/^Icinga_([a-zA-Z0-9])$/);
|
||||
return typeof res === 'object';
|
||||
},
|
||||
hasWindowId: function () {
|
||||
var res = window.name.match(/^Icinga_([a-zA-Z0-9])$/);
|
||||
return typeof res === 'object';
|
||||
},
|
||||
|
||||
setWindowId: function (id) {
|
||||
window.name = 'Icinga_' + id;
|
||||
},
|
||||
setWindowId: function (id) {
|
||||
window.name = 'Icinga_' + id;
|
||||
},
|
||||
|
||||
destroy: function () {
|
||||
// This is gonna be hard, clean up the mess
|
||||
this.icinga = null;
|
||||
}
|
||||
destroy: function () {
|
||||
// This is gonna be hard, clean up the mess
|
||||
this.icinga = null;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue