5cc6c961e5
git-svn-id: https://svn.code.sf.net/p/xcat/code/xcat-core/branches/2.7@13356 8638fb3e-16cb-4fca-ae20-7b5d299a9bcd
1058 lines
30 KiB
JavaScript
1058 lines
30 KiB
JavaScript
/**
|
|
* Tab constructor
|
|
*
|
|
* @param tabId
|
|
* Tab ID
|
|
* @param tabName
|
|
* Tab name
|
|
* @return Nothing
|
|
*/
|
|
var Tab = function(tabId) {
|
|
this.tabId = tabId;
|
|
this.tabName = null;
|
|
this.tab = null;
|
|
};
|
|
|
|
/**
|
|
* Initialize the tab
|
|
*
|
|
* @param tabName Tab name to initialize
|
|
*/
|
|
Tab.prototype.init = function() {
|
|
// Create a division containing the tab
|
|
this.tab = $('<div class="tab" id="' + this.tabId + '"></div>');
|
|
var tabList = $('<ul></ul>');
|
|
var tabItem = $('<li><a href="#">Dummy tab item</a></li>');
|
|
tabList.append(tabItem);
|
|
this.tab.append(tabList);
|
|
|
|
// Create a template with close button
|
|
var tabs = this.tab.tabs();
|
|
|
|
tabs.bind('tabsselect', function(event, ui){
|
|
// Save the order tabs were selected
|
|
var order;
|
|
if ($.cookie('tabindex_history')) {
|
|
order = $.cookie('tabindex_history').split(',');
|
|
order[1] = order[0]; // Set index 1 to last selected tab
|
|
order[0] = ui.index; // Set index 0 to currently selected tab
|
|
} else {
|
|
// Create an array to track the tab selected
|
|
order = new Array;
|
|
order[0] = ui.index;
|
|
order[1] = ui.index;
|
|
}
|
|
|
|
$.cookie('tabindex_history', order);
|
|
|
|
// Find any datatable within the tab
|
|
var dTables = $(ui.panel).find('.dataTables_wrapper');
|
|
if(dTables.length) {
|
|
// Adjust column sizes for each datatable found
|
|
for (var i = 0; i < dTables.length; i++) {
|
|
var tableId = dTables.eq(i).attr('id').replace('_wrapper', '');
|
|
adjustColumnSize(tableId);
|
|
}
|
|
}
|
|
});
|
|
|
|
// Remove dummy tab
|
|
this.tab.tabs("remove", 0);
|
|
|
|
// Hide tab
|
|
this.tab.hide();
|
|
};
|
|
|
|
/**
|
|
* Return the tab object
|
|
*
|
|
* @return Object representing the tab
|
|
*/
|
|
Tab.prototype.object = function() {
|
|
return this.tab;
|
|
};
|
|
|
|
/**
|
|
* Add a new tab
|
|
*
|
|
* @param tabId Tab ID
|
|
* @param tabName Tab name
|
|
* @param tabCont Tab content
|
|
* @param closeable Is tab closeable
|
|
*/
|
|
Tab.prototype.add = function(tabId, tabName, tabCont, closeable) {
|
|
// Show tab
|
|
if (this.tab.css("display") == "none") {
|
|
this.tab.show();
|
|
}
|
|
|
|
var newTab = $('<div class="tab" id="' + tabId + '"></div>');
|
|
newTab.append(tabCont);
|
|
this.tab.append(newTab);
|
|
this.tab.tabs("add", "#" + tabId, tabName);
|
|
|
|
// Append close button
|
|
if (closeable) {
|
|
var header = this.tab.find('ul.ui-tabs-nav a[href="#' + tabId +'"]').parent();
|
|
header.append('<span class=\"tab-close ui-icon ui-icon-close\"></span>');
|
|
|
|
// Get this tab
|
|
var tabs = this.tab;
|
|
var tabLink = 'a[href="\#' + tabId + '"]';
|
|
var thisTab = $(tabLink, tabs).parent();
|
|
|
|
// Close tab when close button is clicked
|
|
thisTab.find('span.tab-close').bind('click', function(event) {
|
|
var tabIndex = ($('li', tabs).index(thisTab));
|
|
|
|
// Do not remove first tab
|
|
if (tabIndex != 0) {
|
|
// Go back to last tab if user is trying to close currently selected tab
|
|
if (tabs.tabs('option', 'selected') == tabIndex) {
|
|
// Get last selected tab from history
|
|
var order = $.cookie('tabindex_history').split(',');
|
|
if (order[1]) {
|
|
tabs.tabs('select', parseInt(order[1]));
|
|
} else {
|
|
tabs.tabs('select', 0);
|
|
}
|
|
}
|
|
|
|
tabs.tabs('remove', tabIndex);
|
|
}
|
|
});
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Select a tab
|
|
*
|
|
* @param id Tab ID to select
|
|
*/
|
|
Tab.prototype.select = function(id) {
|
|
this.tab.tabs("select", "#" + id);
|
|
};
|
|
|
|
/**
|
|
* Remove a tab
|
|
*
|
|
* @param id Tab ID to remove
|
|
*/
|
|
Tab.prototype.remove = function(id) {
|
|
var selectorStr = 'a[href="\#' + id + '"]';
|
|
var selectTab = $(selectorStr, this.tab).parent();
|
|
var index = ($('li', this.tab).index(selectTab));
|
|
this.tab.tabs("remove", index);
|
|
};
|
|
|
|
/**
|
|
* Table constructor
|
|
*
|
|
* @param tabId Tab ID
|
|
* @param tabName Tab name
|
|
*/
|
|
var Table = function(tableId) {
|
|
if ($('#' + tableId).length) {
|
|
this.tableId = tableId;
|
|
this.table = $('#' + tableId);
|
|
} else {
|
|
this.tableId = tableId;
|
|
this.table = null;
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Initialize the table
|
|
*
|
|
* @param Headers Array of table headers
|
|
*/
|
|
Table.prototype.init = function(headers) {
|
|
// Create a table
|
|
this.table = $('<table id="' + this.tableId + '"></table>');
|
|
var thead = $('<thead class="ui-widget-header"></thead>');
|
|
var headRow = $('<tr></tr>');
|
|
|
|
// Append headers
|
|
for ( var i in headers) {
|
|
headRow.append('<th>' + headers[i] + '</th>');
|
|
}
|
|
|
|
thead.append(headRow);
|
|
this.table.append(thead);
|
|
|
|
// Append table body
|
|
var tableBody = $('<tbody></tbody>');
|
|
this.table.append(tableBody);
|
|
};
|
|
|
|
/**
|
|
* Return the table object
|
|
*
|
|
* @return Object representing the table
|
|
*/
|
|
Table.prototype.object = function() {
|
|
return this.table;
|
|
};
|
|
|
|
/**
|
|
* Add a row to the table
|
|
*
|
|
* @param rowCont Array of table row contents
|
|
*/
|
|
Table.prototype.add = function(rowCont) {
|
|
// Create table row
|
|
var tableRow = $('<tr></tr>');
|
|
|
|
// Create a column for each content
|
|
var tableCol;
|
|
for ( var i in rowCont) {
|
|
tableCol = $('<td></td>');
|
|
tableCol.append(rowCont[i]);
|
|
tableRow.append(tableCol);
|
|
}
|
|
|
|
// Append table row to table
|
|
this.table.find('tbody').append(tableRow);
|
|
};
|
|
|
|
/**
|
|
* Add a footer to the table
|
|
*
|
|
* @param rowCont Array of table row contents
|
|
*/
|
|
Table.prototype.addFooter = function(rowCont) {
|
|
// Create table row
|
|
var tableFoot = $('<tfoot></tfoot>');
|
|
tableFoot.append(rowCont);
|
|
|
|
// Append table row to table
|
|
this.table.append(tableFoot);
|
|
};
|
|
|
|
/**
|
|
* Remove a row from the table
|
|
*/
|
|
Table.prototype.remove = function(id) {
|
|
// To be continued
|
|
};
|
|
|
|
/**
|
|
* Datatable class constructor
|
|
*
|
|
* @param tabId Tab ID
|
|
* @param tabName Tab name
|
|
*/
|
|
var DataTable = function(tableId) {
|
|
this.dataTableId = tableId;
|
|
this.dataTable = null;
|
|
};
|
|
|
|
/**
|
|
* Initialize the datatable
|
|
*
|
|
* @param Headers Array of table headers
|
|
*/
|
|
DataTable.prototype.init = function(headers) {
|
|
// Create a table
|
|
this.dataTable = $('<table class="datatable" id="' + this.dataTableId + '"></table>');
|
|
var thead = $('<thead class="ui-widget-header"></thead>');
|
|
var headRow = $('<tr></tr>');
|
|
|
|
// Append headers
|
|
for ( var i in headers) {
|
|
headRow.append('<th>' + headers[i] + '</th>');
|
|
}
|
|
|
|
thead.append(headRow);
|
|
this.dataTable.append(thead);
|
|
|
|
// Append table body
|
|
var tableBody = $('<tbody></tbody>');
|
|
this.dataTable.append(tableBody);
|
|
};
|
|
|
|
/**
|
|
* Return the datatable object
|
|
*
|
|
* @return Object representing the table
|
|
*/
|
|
DataTable.prototype.object = function() {
|
|
return this.dataTable;
|
|
};
|
|
|
|
/**
|
|
* Add a row to the datatable
|
|
*
|
|
* @param rowCont Array of table row contents
|
|
*/
|
|
DataTable.prototype.add = function(rowCont) {
|
|
// Create table row
|
|
var tableRow = $('<tr></tr>');
|
|
|
|
// Create a column for each content
|
|
var tableCol;
|
|
for ( var i in rowCont) {
|
|
tableCol = $('<td></td>');
|
|
tableCol.append(rowCont[i]);
|
|
tableRow.append(tableCol);
|
|
}
|
|
|
|
// Append table row to table
|
|
this.dataTable.find('tbody').append(tableRow);
|
|
};
|
|
|
|
/**
|
|
* Create status bar
|
|
*
|
|
* @param barId Status bar ID
|
|
*/
|
|
function createStatusBar(barId) {
|
|
var statusBar = $('<div class="ui-corner-all" id="' + barId + '"></div>').css({
|
|
'margin-bottom': '5px',
|
|
'min-height': '30px',
|
|
'background-color':'#7BBEDE',
|
|
'color': '#FFFFFF',
|
|
'max-height': '150px',
|
|
'overflow': 'auto'
|
|
});
|
|
|
|
// Create info icon
|
|
var icon = $('<span class="ui-icon ui-icon-circle-check"></span>').css({
|
|
'display': 'inline-block',
|
|
'margin': '10px 5px',
|
|
'vertical-align': 'top'
|
|
});
|
|
|
|
// Create message section
|
|
var msg = $('<div></div>').css({
|
|
'display': 'inline-block',
|
|
'margin': '10px 0px',
|
|
'width': '90%'
|
|
});
|
|
|
|
// Create hide button
|
|
var hide = $('<span class="ui-icon ui-icon-minus"></span>').css({
|
|
'display': 'inline-block',
|
|
'float': 'right',
|
|
'margin': '10px 5px',
|
|
'cursor': 'pointer'
|
|
}).click(function() {
|
|
// Remove info box on-click
|
|
$(this).parent().hide();
|
|
});
|
|
|
|
statusBar.append(icon);
|
|
statusBar.append(msg);
|
|
statusBar.append(hide);
|
|
return statusBar;
|
|
}
|
|
|
|
/**
|
|
* Create info bar
|
|
*
|
|
* @param msg Info message
|
|
* @return Info bar
|
|
*/
|
|
function createInfoBar(msg) {
|
|
var infoBar = $('<div class="ui-corner-all"></div>').css({
|
|
'margin': '5px 0px',
|
|
'background-color':'#7BBEDE',
|
|
'color': '#FFFFFF'
|
|
});
|
|
var icon = $('<span class="ui-icon ui-icon-info"></span>').css({
|
|
'display': 'inline-block',
|
|
'margin': '10px 5px'
|
|
});
|
|
var barMsg = $('<p>' + msg + '</p>').css({
|
|
'display': 'inline-block',
|
|
'width': '90%'
|
|
});
|
|
|
|
infoBar.append(icon);
|
|
infoBar.append(barMsg);
|
|
return infoBar;
|
|
}
|
|
|
|
/**
|
|
* Create warning bar
|
|
*
|
|
* @param msg Warning message
|
|
* @return Warning bar
|
|
*/
|
|
function createWarnBar(msg) {
|
|
var warnBar = $('<div class="ui-state-error ui-corner-all"></div>');
|
|
var icon = $('<span class="ui-icon ui-icon-alert"></span>').css({
|
|
'display': 'inline-block',
|
|
'margin': '10px 5px'
|
|
});
|
|
var barMsg = $('<p>' + msg + '</p>').css({
|
|
'display': 'inline-block',
|
|
'width': '90%'
|
|
});
|
|
|
|
warnBar.append(icon);
|
|
warnBar.append(barMsg);
|
|
return warnBar;
|
|
}
|
|
|
|
/**
|
|
* Create a loader
|
|
*
|
|
* @param loaderId Loader ID
|
|
*/
|
|
function createLoader(loaderId) {
|
|
var loader = $('<img id="' + loaderId + '" src="images/loader.gif"></img>');
|
|
return loader;
|
|
}
|
|
|
|
/**
|
|
* Create a button
|
|
*
|
|
* @param name Name of the button
|
|
*/
|
|
function createButton(name) {
|
|
var button = $('<button>' + name + '</button>').button();
|
|
return button;
|
|
}
|
|
|
|
/**
|
|
* Create a menu
|
|
*
|
|
* @param items An array of items to go into the menu
|
|
* @return A division containing the menu
|
|
*/
|
|
function createMenu(items) {
|
|
var menu = $('<ul class="sf-menu ui-state-default"></ul>');
|
|
|
|
// Loop through each item
|
|
for ( var i in items) {
|
|
// Append item to menu
|
|
var item = $('<li></li>');
|
|
|
|
// If it is a sub menu
|
|
if (items[i] instanceof Array) {
|
|
// 1st index = Sub menu title
|
|
item.append(items[i][0]);
|
|
// 2nd index = Sub menu
|
|
item.append(items[i][1]);
|
|
} else {
|
|
item.append(items[i]);
|
|
}
|
|
|
|
menu.append(item);
|
|
}
|
|
|
|
return menu;
|
|
}
|
|
|
|
/**
|
|
* Initialize the page
|
|
*/
|
|
function initPage() {
|
|
// Load theme
|
|
var theme = $.cookie('xcat_theme');
|
|
if (theme) {
|
|
switch (theme) {
|
|
case 'cupertino':
|
|
includeCss("css/themes/jquery-ui-cupertino.css");
|
|
break;
|
|
case 'dark_hive':
|
|
includeCss("css/themes/jquery-ui-dark_hive.css");
|
|
break;
|
|
case 'redmond':
|
|
includeCss("css/themes/jquery-ui-redmond.css");
|
|
break;
|
|
case 'start':
|
|
includeCss("css/themes/jquery-ui-start.css");
|
|
break;
|
|
case 'sunny':
|
|
includeCss("css/themes/jquery-ui-sunny.css");
|
|
break;
|
|
case 'ui_dark':
|
|
includeCss("css/themes/jquery-ui-ui_darkness.css");
|
|
break;
|
|
default:
|
|
includeCss("css/themes/jquery-ui-start.css");
|
|
}
|
|
} else {
|
|
includeCss("css/themes/jquery-ui-start.css");
|
|
}
|
|
|
|
// Load jQuery stylesheets
|
|
includeCss("css/jquery.dataTables.css");
|
|
includeCss("css/superfish.css");
|
|
includeCss("css/jstree.css");
|
|
includeCss("css/jquery.jqplot.css");
|
|
|
|
// Load custom stylesheet
|
|
includeCss("css/style.css");
|
|
|
|
// JQuery plugins
|
|
includeJs("js/jquery/jquery.dataTables.min.js");
|
|
includeJs("js/jquery/jquery.form.min.js");
|
|
includeJs("js/jquery/jquery.jeditable.min.js");
|
|
includeJs("js/jquery/jquery.contextmenu.min.js");
|
|
includeJs("js/jquery/superfish.min.js");
|
|
includeJs("js/jquery/hoverIntent.min.js");
|
|
includeJs("js/jquery/jquery.jstree.min.js");
|
|
includeJs("js/jquery/tooltip.min.js");
|
|
includeJs("js/jquery/jquery.serverBrowser.min.js");
|
|
includeJs("js/jquery/jquery.jqplot.min.js");
|
|
includeJs("js/jquery/jqplot.pieRenderer.min.js");
|
|
includeJs("js/jquery/jqplot.dateAxisRenderer.min.js");
|
|
|
|
// Page plugins
|
|
includeJs("js/configure/configure.js");
|
|
includeJs("js/monitor/monitor.js");
|
|
includeJs("js/nodes/nodes.js");
|
|
includeJs("js/provision/provision.js");
|
|
|
|
// Custom plugins
|
|
includeJs("js/custom/esx.js");
|
|
includeJs("js/custom/kvm.js");
|
|
includeJs("js/custom/blade.js");
|
|
includeJs("js/custom/ipmi.js");
|
|
includeJs("js/custom/zvm.js");
|
|
includeJs("js/custom/hmc.js");
|
|
includeJs("js/custom/customUtils.js");
|
|
|
|
// Enable settings link
|
|
$('#xcat_settings').click(function() {
|
|
openSettings();
|
|
});
|
|
|
|
// Set header to theme
|
|
var background = '', color = '';
|
|
var theme = $.cookie('xcat_theme');
|
|
if (theme) {
|
|
switch (theme) {
|
|
case 'cupertino':
|
|
background = '#3BAAE3';
|
|
color = 'white';
|
|
break;
|
|
case 'dark_hive':
|
|
background = '#0972A5';
|
|
break;
|
|
case 'redmond':
|
|
background = '#F5F8F9';
|
|
color = '#E17009';
|
|
break;
|
|
case 'start':
|
|
background = '#6EAC2C';
|
|
break;
|
|
case 'sunny':
|
|
background = 'white';
|
|
color = '#0074C7';
|
|
break;
|
|
case 'ui_dark':
|
|
background = '#F58400';
|
|
break;
|
|
default:
|
|
background = '#6EAC2C';
|
|
}
|
|
} else {
|
|
background = '#6EAC2C';
|
|
}
|
|
|
|
$('#header').addClass('ui-state-default');
|
|
$('#header').css('border', '0px');
|
|
|
|
// Set theme to user span
|
|
$('#login_user').css('color', color);
|
|
|
|
// Style for selected page
|
|
var style = {
|
|
'background-color': background,
|
|
'color': color
|
|
};
|
|
|
|
// Get the page being loaded
|
|
var url = window.location.pathname;
|
|
var page = url.replace('/xcat/', '');
|
|
var headers = $('#header ul li a');
|
|
|
|
// Show the page
|
|
$("#content").children().remove();
|
|
if (page == 'configure.php') {
|
|
includeJs("js/configure/update.js");
|
|
includeJs("js/configure/discover.js");
|
|
includeJs("js/configure/service.js");
|
|
headers.eq(1).css(style);
|
|
loadConfigPage();
|
|
} else if (page == 'provision.php') {
|
|
includeJs("js/provision/images.js");
|
|
headers.eq(2).css(style);
|
|
loadProvisionPage();
|
|
} else if (page == 'monitor.php') {
|
|
includeJs("js/monitor/xcatmon.js");
|
|
includeJs("js/monitor/rmcmon.js");
|
|
includeJs("js/monitor/gangliamon.js");
|
|
headers.eq(3).css(style);
|
|
loadMonitorPage();
|
|
} else if (page == 'help.php') {
|
|
includeJs("js/help/help.js");
|
|
headers.eq(4).css(style);
|
|
loadHelpPage();
|
|
} else {
|
|
// Load nodes page by default
|
|
includeJs("js/jquery/jquery.topzindex.min.js");
|
|
includeJs("js/nodes/nodeset.js");
|
|
includeJs("js/nodes/rnetboot.js");
|
|
includeJs("js/nodes/updatenode.js");
|
|
includeJs("js/nodes/physical.js");
|
|
includeJs("js/nodes/mtm.js");
|
|
headers.eq(0).css(style);
|
|
loadNodesPage();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Include javascript file in <head>
|
|
*
|
|
* @param file File to include
|
|
*/
|
|
function includeJs(file) {
|
|
var script = $("head script[src='" + file + "']");
|
|
|
|
// If <head> does not contain the javascript
|
|
if (!script.length) {
|
|
// Append the javascript to <head>
|
|
var script = $('<script></script>');
|
|
script.attr( {
|
|
type : 'text/javascript',
|
|
src : file
|
|
});
|
|
|
|
$('head').append(script);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Include CSS link in <head>
|
|
*
|
|
* @param file File to include
|
|
*/
|
|
function includeCss(file) {
|
|
var link = $("head link[href='" + file + "']");
|
|
|
|
// If <head> does not contain the link
|
|
if (!link.length) {
|
|
// Append the CSS link to <head>
|
|
var link = $('<link>');
|
|
link.attr( {
|
|
type : 'text/css',
|
|
rel : 'stylesheet',
|
|
href : file
|
|
});
|
|
|
|
$('head').append(link);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Write ajax response to a paragraph
|
|
*
|
|
* @param rsp Ajax response
|
|
* @param pattern Pattern to replace with a break
|
|
* @return Paragraph containing ajax response
|
|
*/
|
|
function writeRsp(rsp, pattern) {
|
|
// Create paragraph to hold ajax response
|
|
var prg = $('<pre></pre>');
|
|
|
|
for ( var i in rsp) {
|
|
if (rsp[i]) {
|
|
// Create regular expression for given pattern
|
|
// Replace pattern with break
|
|
if (pattern) {
|
|
rsp[i] = rsp[i].replace(new RegExp(pattern, 'g'), '<br/>');
|
|
prg.append(rsp[i]);
|
|
} else {
|
|
prg.append(rsp[i]);
|
|
prg.append('<br/>');
|
|
}
|
|
}
|
|
}
|
|
|
|
return prg;
|
|
}
|
|
|
|
/**
|
|
* Open a dialog and show given message
|
|
*
|
|
* @param type Type of dialog, i.e. warn or info
|
|
* @param msg Message to show
|
|
*/
|
|
function openDialog(type, msg) {
|
|
var msgDialog;
|
|
if (type == "warn") {
|
|
// Create warning message
|
|
msgDialog = $('<div class="ui-state-error ui-corner-all">'
|
|
+ '<p><span class="ui-icon ui-icon-alert"></span>' + msg + '</p>'
|
|
+ '</div>');
|
|
} else {
|
|
// Create info message
|
|
msgDialog = $('<div class="ui-state-highlight ui-corner-all">'
|
|
+ '<p><span class="ui-icon ui-icon-info"></span>' + msg + '</p>'
|
|
+'</div>');
|
|
}
|
|
|
|
// Open dialog
|
|
msgDialog.dialog({
|
|
modal: true,
|
|
close: function(){
|
|
$(this).remove();
|
|
},
|
|
width: 500,
|
|
buttons: {
|
|
"Ok": function(){
|
|
$(this).dialog("close");
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Create an iframe to hold the output of an xCAT command
|
|
*
|
|
* @param src The URL of the document to show in the iframe
|
|
* @return Info box containing the iframe
|
|
*/
|
|
function createIFrame(src) {
|
|
// Put an iframe inside an info box
|
|
var infoBar = $('<div class="ui-state-highlight ui-corner-all"></div>').css({
|
|
'margin-bottom': '5px'
|
|
});
|
|
|
|
// Create info and close icons
|
|
var icon = $('<span class="ui-icon ui-icon-info"></span>').css({
|
|
'display': 'inline-block',
|
|
'margin': '10px 5px'
|
|
});
|
|
var close = $('<span class="ui-icon ui-icon-close"></span>').css({
|
|
'display': 'inline-block',
|
|
'float': 'right',
|
|
'margin': '10px 5px'
|
|
}).click(function() {
|
|
// Remove info box on-click
|
|
$(this).parent().remove();
|
|
});
|
|
|
|
var iframe = $('<iframe></iframe>').attr('src', src).css({
|
|
'display': 'block',
|
|
'border': '0px',
|
|
'margin': '10px',
|
|
'width': '100%'
|
|
});
|
|
|
|
var loader = createLoader('iLoader').css({
|
|
'display': 'block',
|
|
'margin': '10px 0px'
|
|
});
|
|
|
|
infoBar.append(icon);
|
|
infoBar.append($('<div style="display: inline-block; width: 90%;"></div>').append(loader, iframe));
|
|
infoBar.append(close);
|
|
|
|
// Remove loader when done
|
|
iframe.load(function() {
|
|
loader.remove();
|
|
});
|
|
|
|
return infoBar;
|
|
}
|
|
|
|
|
|
/**
|
|
* Open dialog to set xCAT UI settings
|
|
*/
|
|
function openSettings() {
|
|
// Create form to add node range
|
|
var dialog = $('<div class="form"></div>');
|
|
var info = createInfoBar('Select from the following options');
|
|
dialog.append(info);
|
|
|
|
var style = {
|
|
'color': 'blue',
|
|
'cursor': 'pointer',
|
|
'padding': '5px'
|
|
};
|
|
|
|
var changeThemeOption = $('<div><center><a style="color: blue;">Change xCAT theme</a></center></div>').css(style);
|
|
dialog.append(changeThemeOption);
|
|
|
|
var changePasswordOption = $('<div><center><a style="color: blue;">Change password</a></center></div>').css(style);
|
|
dialog.append(changePasswordOption);
|
|
|
|
// Open form as a dialog
|
|
dialog.dialog({
|
|
modal: true,
|
|
close: function(){
|
|
$(this).remove();
|
|
},
|
|
title: 'Settings',
|
|
width: 400,
|
|
buttons: {
|
|
"Cancel": function(){
|
|
$(this).dialog("close");
|
|
}
|
|
}
|
|
});
|
|
|
|
// Bind to click event
|
|
changeThemeOption.click(function() {
|
|
dialog.dialog("close");
|
|
changeTheme();
|
|
});
|
|
|
|
changePasswordOption.click(function() {
|
|
dialog.dialog("close");
|
|
changePassword();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Open dialog to change xCAT theme
|
|
*/
|
|
function changeTheme() {
|
|
// Create form to add node range
|
|
var dialog = $('<div class="form"></div>');
|
|
var info = createInfoBar('Select the xCAT theme you desire');
|
|
dialog.append(info);
|
|
|
|
// Create select drop down for themes
|
|
var oList = $('<ol></ol>');
|
|
oList.append($('<li><input type="radio" name="theme" value="cupertino">Cupertino</li>'));
|
|
oList.append($('<li><input type="radio" name="theme" value="dark_hive">Dark Hive</li>'));
|
|
oList.append($('<li><input type="radio" name="theme" value="redmond">Redmond</li>'));
|
|
oList.append($('<li><input type="radio" name="theme" value="start">Start (default)</li>'));
|
|
oList.append($('<li><input type="radio" name="theme" value="sunny">Sunny</li>'));
|
|
oList.append($('<li><input type="radio" name="theme" value="ui_dark">UI Darkness</li>'));
|
|
dialog.append(oList);
|
|
|
|
if ($.cookie('xcat_theme')) {
|
|
// Select theme
|
|
oList.find('input[value="' + $.cookie('xcat_theme') + '"]').attr('checked', true);
|
|
} else {
|
|
oList.find('input[value="start"]').attr('checked', true);
|
|
}
|
|
|
|
// Open form as a dialog
|
|
dialog.dialog({
|
|
modal: true,
|
|
close: function(){
|
|
$(this).remove();
|
|
},
|
|
title: 'xCAT Theme',
|
|
width: 400,
|
|
buttons: {
|
|
"Ok": function(){
|
|
// Save selected theme
|
|
var theme = $(this).find('input[name="theme"]:checked').val();
|
|
$.cookie('xcat_theme', theme); // Do not expire cookie, keep it as long as possible
|
|
|
|
// Show instructions to apply theme
|
|
$(this).empty();
|
|
var info = createInfoBar('You will need to reload this page in order for changes to take effect');
|
|
$(this).append(info);
|
|
|
|
// Only show close button
|
|
$(this).dialog("option", "buttons", {
|
|
"Close" : function() {
|
|
$(this).dialog( "close" );
|
|
}
|
|
});
|
|
},
|
|
"Cancel": function(){
|
|
$(this).dialog( "close" );
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Open dialog to change user password
|
|
*/
|
|
function changePassword() {
|
|
// Create form to add node range
|
|
var dialog = $('<div id="changePassword" class="form"></div>');
|
|
var info = createInfoBar('Change your password');
|
|
dialog.append(info);
|
|
|
|
dialog.append('<div><label>New password:</label><input type="password" name="newPassword"/></div>');
|
|
dialog.append('<div><label>Confirm password:</label><input type="password" name="confirmPassword"/></div>');
|
|
|
|
// Open form as a dialog
|
|
dialog.dialog({
|
|
modal: true,
|
|
close: function(){
|
|
$(this).remove();
|
|
},
|
|
title: 'Change Password',
|
|
width: 400,
|
|
buttons: {
|
|
"Ok": function(){
|
|
// Remove any warning messages
|
|
$(this).find('.ui-state-error').remove();
|
|
|
|
var errorMessage = "";
|
|
|
|
// Check each input is provided
|
|
$('#changePassword input').each(function() {
|
|
if (!$(this).val()) {
|
|
errorMessage = "Please provide a value for each missing input!";
|
|
}
|
|
});
|
|
|
|
// Do not continue if error found
|
|
if (errorMessage) {
|
|
dialog.prepend(createWarnBar(errorMessage));
|
|
return;
|
|
}
|
|
|
|
// Check new and confirm passwords match
|
|
var user = $.cookie('xcat_username');
|
|
var newPassword = $('#changePassword input[name="newPassword"]').val();
|
|
var confirmPassword = $('#changePassword input[name="confirmPassword"]').val();
|
|
if (newPassword != confirmPassword) {
|
|
dialog.prepend(createWarnBar("Please confirm new password!"));
|
|
return;
|
|
}
|
|
|
|
// Change dialog buttons
|
|
$('#changePassword').dialog('option', 'buttons', {
|
|
'Close':function(){
|
|
$('#changePassword').dialog('close');
|
|
}
|
|
});
|
|
|
|
// Send request to change password
|
|
var url = window.location.pathname;
|
|
var page = url.replace('/xcat/', '');
|
|
var url = 'lib/cmd.php';
|
|
// Service portal does not have access to cmd.php
|
|
if (page == 'service.php')
|
|
url = 'lib/srv_cmd.php';
|
|
$.ajax( {
|
|
url : url,
|
|
dataType : 'json',
|
|
data : {
|
|
cmd : 'webrun',
|
|
tgt : '',
|
|
args : 'passwd;' + user + ';' + newPassword,
|
|
msg : ''
|
|
},
|
|
|
|
success : function (data) {
|
|
// Show response message
|
|
var rspMessage = "";
|
|
for (var i in data.rsp)
|
|
rspMessage += data.rsp[i] + "<br/>";
|
|
|
|
$('#changePassword').prepend(createInfoBar(rspMessage));
|
|
}
|
|
});
|
|
},
|
|
"Cancel": function(){
|
|
$(this).dialog( "close" );
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Adjust datatable column size
|
|
*
|
|
* @param tableId Table ID
|
|
*/
|
|
function adjustColumnSize(tableId) {
|
|
var cols = $('#' + tableId).find('tbody tr:eq(0) td');
|
|
// If the column size is zero, wait until table is initialized
|
|
if (cols.eq(1).outerWidth()) {
|
|
for (var i in cols) {
|
|
var headers = $('#' + tableId + '_wrapper .dataTables_scrollHead .datatable thead tr th').eq(i);
|
|
headers.css('width', cols.eq(i).outerWidth());
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Set menu theme
|
|
*
|
|
* @param menu Menu object
|
|
*/
|
|
function setMenu2Theme(menu) {
|
|
// On hover
|
|
var background = '', color = '';
|
|
var theme = $.cookie('xcat_theme');
|
|
if (theme) {
|
|
switch (theme) {
|
|
case 'cupertino':
|
|
background = '#3BAAE3';
|
|
color = 'white';
|
|
break;
|
|
case 'dark_hive':
|
|
background = '#0972A5';
|
|
break;
|
|
case 'redmond':
|
|
background = '#F5F8F9';
|
|
color = '#E17009';
|
|
break;
|
|
case 'start':
|
|
background = '#6EAC2C';
|
|
break;
|
|
case 'sunny':
|
|
background = 'white';
|
|
color = '#0074C7';
|
|
break;
|
|
case 'ui_dark':
|
|
background = '#F58400';
|
|
break;
|
|
default:
|
|
background = '#6EAC2C';
|
|
}
|
|
} else {
|
|
background = '#6EAC2C';
|
|
}
|
|
|
|
menu.css('background', background);
|
|
menu.find('a:eq(0)').css('color', color);
|
|
}
|
|
|
|
/**
|
|
* Set menu back to normal before applying theme
|
|
*
|
|
* @param menu Menu object
|
|
*/
|
|
function setMenu2Normal(menu) {
|
|
// Change back to normal
|
|
menu.css('background', '');
|
|
menu.find('a:eq(0)').css('color', '');
|
|
}
|
|
|
|
/**
|
|
* Get nodes that are checked in a given datatable
|
|
*
|
|
* @param datatableId The datatable ID
|
|
* @return Nodes that were checked
|
|
*/
|
|
function getNodesChecked(datatableId) {
|
|
var tgts = '';
|
|
|
|
// Get nodes that were checked
|
|
var nodes = $('#' + datatableId + ' input[type=checkbox]:checked');
|
|
for (var i in nodes) {
|
|
var tgtNode = nodes.eq(i).attr('name');
|
|
|
|
if (tgtNode){
|
|
tgts += tgtNode;
|
|
|
|
// Add a comma at the end
|
|
if (i < nodes.length - 1) {
|
|
tgts += ',';
|
|
}
|
|
}
|
|
}
|
|
|
|
return tgts;
|
|
} |