Updated jsTree version. Auto-expanded group list onload.

git-svn-id: https://svn.code.sf.net/p/xcat/code/xcat-core/trunk@8046 8638fb3e-16cb-4fca-ae20-7b5d299a9bcd
This commit is contained in:
phamt 2010-11-04 19:30:39 +00:00
parent 0d110082c1
commit f475496815
11 changed files with 3776 additions and 2221 deletions

213
xCAT-UI/css/jstree.css Normal file
View File

@ -0,0 +1,213 @@
/*
* jsTree default theme 1.0
* Supported features: dots/no-dots, icons/no-icons, focused, loading
* Supported plugins: ui (hovered, clicked), checkbox, contextmenu, search
*/
.jstree-default li,.jstree-default ins {
background-image: url("../images/jstree.png");
background-repeat: no-repeat;
background-color: transparent;
}
.jstree-default li {
background-position: -90px 0;
background-repeat: repeat-y;
}
.jstree-default li.jstree-last {
background: transparent;
}
.jstree-default .jstree-open>ins {
background-position: -72px 0;
}
.jstree-default .jstree-closed>ins {
background-position: -54px 0;
}
.jstree-default .jstree-leaf>ins {
background-position: -36px 0;
}
.jstree-default .jstree-hovered {
background: #e7f4f9;
border: 1px solid #d8f0fa;
padding: 0 2px 0 1px;
}
.jstree-default .jstree-clicked {
background: #C0E2FF;
border : 1px solid #79B7E7;
padding: 0 2px 0 1px;
}
.jstree-default a .jstree-icon {
background-position: -56px -19px;
}
.jstree-default a.jstree-loading .jstree-icon {
background: url("../images/throbber.gif") center center no-repeat !important;
}
.jstree-default .jstree-no-dots li,.jstree-default .jstree-no-dots .jstree-leaf>ins
{
background: transparent;
}
.jstree-default .jstree-no-dots .jstree-open>ins {
background-position: -18px 0;
}
.jstree-default .jstree-no-dots .jstree-closed>ins {
background-position: 0 0;
}
.jstree-default .jstree-no-icons a .jstree-icon {
display: none;
}
.jstree-default .jstree-search {
font-style: italic;
}
.jstree-default .jstree-no-icons .jstree-checkbox {
display: inline-block;
}
.jstree-default .jstree-no-checkboxes .jstree-checkbox {
display: none !important;
}
.jstree-default .jstree-checked>a>.jstree-checkbox {
background-position: -38px -19px;
}
.jstree-default .jstree-unchecked>a>.jstree-checkbox {
background-position: -2px -19px;
}
.jstree-default .jstree-undetermined>a>.jstree-checkbox {
background-position: -20px -19px;
}
.jstree-default .jstree-checked>a>.jstree-checkbox:hover {
background-position: -38px -37px;
}
.jstree-default .jstree-unchecked>a>.jstree-checkbox:hover {
background-position: -2px -37px;
}
.jstree-default .jstree-undetermined>a>.jstree-checkbox:hover {
background-position: -20px -37px;
}
#vakata-dragged.jstree-default ins {
background: transparent !important;
}
#vakata-dragged.jstree-default .jstree-ok {
background: url("../images/jstree.png") -2px -53px no-repeat !important;
}
#vakata-dragged.jstree-default .jstree-invalid {
background: url("../images/jstree.png") -18px -53px no-repeat !important;
}
#jstree-marker.jstree-default {
background: url("../images/jstree.png") -41px -57px no-repeat !important;
}
.jstree-default a.jstree-search {
color: aqua;
}
#vakata-contextmenu.jstree-default-context,#vakata-contextmenu.jstree-default-context li ul
{
background: #f0f0f0;
border: 1px solid #979797;
-moz-box-shadow: 1px 1px 2px #999;
-webkit-box-shadow: 1px 1px 2px #999;
box-shadow: 1px 1px 2px #999;
}
#vakata-contextmenu.jstree-default-context li {
}
#vakata-contextmenu.jstree-default-context a {
color: black;
}
#vakata-contextmenu.jstree-default-context a:hover,#vakata-contextmenu.jstree-default-context .vakata-hover>a
{
padding: 0 5px;
background: #e8eff7;
border: 1px solid #aecff7;
color: black;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
#vakata-contextmenu.jstree-default-context li.jstree-contextmenu-disabled a,#vakata-contextmenu.jstree-default-context li.jstree-contextmenu-disabled a:hover
{
color: silver;
background: transparent;
border: 0;
padding: 1px 4px;
}
#vakata-contextmenu.jstree-default-context li.vakata-separator {
background: white;
border-top: 1px solid #e0e0e0;
margin: 0;
}
#vakata-contextmenu.jstree-default-context li ul {
margin-left: -4px;
}
/* IE6 BEGIN */
.jstree-default li,.jstree-default ins,#vakata-dragged.jstree-default .jstree-invalid,#vakata-dragged.jstree-default .jstree-ok,#jstree-marker.jstree-default
{
_background-image: url("../images/jstree.gif");
}
.jstree-default .jstree-open ins {
_background-position: -72px 0;
}
.jstree-default .jstree-closed ins {
_background-position: -54px 0;
}
.jstree-default .jstree-leaf ins {
_background-position: -36px 0;
}
.jstree-default a ins.jstree-icon {
_background-position: -56px -19px;
}
#vakata-contextmenu.jstree-default-context ins {
_display: none;
}
#vakata-contextmenu.jstree-default-context li {
_zoom: 1;
}
.jstree-default .jstree-undetermined a .jstree-checkbox {
_background-position: -20px -19px;
}
.jstree-default .jstree-checked a .jstree-checkbox {
_background-position: -38px -19px;
}
.jstree-default .jstree-unchecked a .jstree-checkbox {
_background-position: -2px -19px;
}
/* IE6 END */

View File

@ -146,7 +146,7 @@ body {
font: 12px verdana, arial, helvetica, sans-serif;
color: #0000FF;
display: inline-table;
padding: 5px 15px 15px 5px;
padding: 5px 15px 5px 15px; /* Top right bottom left */
text-decoration: none;
cursor: pointer;
}

View File

@ -1,115 +0,0 @@
/*** LOCKED ***/
.tree-default .locked li a {
color: gray;
}
/*** DOTS ***/
.tree-default ul {
background-position: 6px 1px;
background-repeat: repeat-y;
background-image:
url(data:image/gif;base64,R0lGODlhAgACAIAAAB4dGf///yH5BAEAAAEALAAAAAACAAIAAAICRF4AOw==)
;
_background-image: url("../images/dot_for_ie.gif"); *
background-image: url("../images/dot_for_ie.gif");
}
.tree-default li {
background-position: -64px -16px;
background-repeat: no-repeat;
background-image: url("../images/icons.png");
}
/*** NO DOTS ***/
.tree-default .no_dots,.tree-default .no_dots ul {
background: transparent;
}
.tree-default .no_dots li.leaf {
background-image: none;
background-color: transparent;
}
/*** OPEN or CLOSED ***/
.tree-default li.open {
background: url("../images/icons.png") -32px -48px no-repeat;
}
.tree-default li.closed,#jstree-dragged.tree-default li li.open {
background: url("../images/icons.png") -48px -32px no-repeat;
}
#jstree-marker {
background-image: url("../images/icons.png");
}
/*** DEFAULT, HOVER, CLICKED, LOADING STATES ***/
.tree-default li a,.tree-default li span {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.tree-default li a:hover,.tree-default li a.hover,.tree-default li span
{
background: #EFF5FB;
border: 1px solid #d8f0fa;
padding: 0px 3px 0px 3px;
}
.tree-default li a.clicked,.tree-default li a.clicked:hover,.tree-default li span.clicked
{
background: #A9D0F5;
border: 1px solid #99defd;
padding: 0px 3px 0px 3px;
}
/*** ICONS ***/
.tree-default ins {
background-image: url("../images/icons.png");
background-position: 0 0;
background-repeat: no-repeat;
}
.tree-default ul li a.loading ins {
background-image: url("../images/throbber.gif") !important;
background-position: 0 0 !important;
} /* UL is added to make selector stronger */
.tree-default li a ins.forbidden {
background-position: -16px -16px;
}
.tree-default .locked li a ins {
background-position: 0 -48px;
}
.tree-default li span ins {
background-position: -16px 0;
}
#jstree-dragged.tree-default ins {
background: url("../images/icons.png") -16px -32px no-repeat;
}
#jstree-dragged.tree-default ins.forbidden {
background: url("../images/icons.png") -16px -16px no-repeat;
}
/*** CONTEXT MENU ***/
.tree-default-context a ins {
background-image: url("../images/icons.png");
background-repeat: no-repeat;
background-position: -64px -64px;
}
.tree-default-context a ins.create {
background-position: 0 -16px;
}
.tree-default-context a ins.rename {
background-position: -16px 0px;
}
.tree-default-context a ins.remove {
background-position: 0 -32px;
}

BIN
xCAT-UI/images/jstree.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
xCAT-UI/images/jstree.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -140,7 +140,7 @@ function loadGroups(data) {
// Create a list of groups
var ul = $('<ul></ul>');
var item = $('<li><h3>Groups</h3></li>');
var item = $('<li id="root"><h3>Groups</h3></li>');
ul.append(item);
var subUL = $('<ul></ul>');
item.append(subUL);
@ -148,49 +148,54 @@ function loadGroups(data) {
// Create a link for each group
for ( var i = groups.length; i--;) {
var subItem = $('<li></li>');
var link = $('<a>' + groups[i] + '</a>');
var link = $('<a id="' + groups[i] + '">' + groups[i] + '</a>');
// Open node table onclick
link.bind('click', function(event) {
var thisGroup = $(this).attr('id');
if (thisGroup) {
// Clear nodes division
$('#nodes').children().remove();
// Create loader
var loader = $('<center></center>').append(createLoader());
// Create a tab for this group
var tab = new Tab();
setNodesTab(tab);
tab.init();
$('#nodes').append(tab.object());
tab.add('nodesTab', 'Nodes', loader, false);
// Get nodes within selected group
$.ajax( {
url : 'lib/cmd.php',
dataType : 'json',
data : {
cmd : 'lsdef',
tgt : '',
args : thisGroup,
msg : thisGroup
},
success : loadNodes
});
} // End of if (thisGroup)
});
subItem.append(link);
subUL.append(subItem);
}
// Turn groups list into a tree
$('#groups').append(ul);
$('#groups').tree( {
callback : {
// Open group onclick
onselect : function(node, tree) {
var thisGroup = tree.get_text(node);
if (thisGroup) {
// Clear nodes division
$('#nodes').children().remove();
// Create loader
var loader = $('<center></center>').append(createLoader());
// Create a tab for this group
var tab = new Tab();
setNodesTab(tab);
tab.init();
$('#nodes').append(tab.object());
tab.add('nodesTab', 'Nodes', loader, false);
// Get nodes within selected group
$.ajax( {
url : 'lib/cmd.php',
dataType : 'json',
data : {
cmd : 'lsdef',
tgt : '',
args : thisGroup,
msg : thisGroup
},
success : loadNodes
});
} // End of if (thisGroup)
} // End of onselect
} // End of callback
});
$('#groups').jstree( {
core : { "initially_open" : [ "root" ] },
themes : {
"theme" : "default",
"dots" : false, // No dots
"icons" : false // No icons
}
});
// Create link to add nodes
var addNodeLink = $('<a title="Add a node or a node range to xCAT">Add node</a>');
addNodeLink.bind('click', function(event) {

View File

@ -156,7 +156,13 @@ function createTree(bpa, fsp, area){
tree_area.append('<ul><li><a href="#">BPA</a>' + bpaList + '</li><li><a href="#">FSP</a>' + cecList + '</li></ul>');
area.append(tree_area);
tree_area.tree({});
tree_area.jstree({
themes : {
"theme" : "default",
"dots" : false, // No dots
"icons" : false // No icons
}
});
}
/**

View File

@ -423,7 +423,7 @@ function initPage() {
includeJs("js/jquery/jquery.cookie.js");
includeJs("js/jquery/superfish.js");
includeJs("js/jquery/hoverIntent.js");
includeJs("js/jquery/jquery.tree.js");
includeJs("js/jquery/jquery.jstree.js");
includeJs("js/jquery/jquery.flot.js");
includeJs("js/jquery/tooltip.min.js");

View File

@ -16,7 +16,7 @@ function loadPage(){
<link href="css/jquery-ui-1.8.custom.css" rel=stylesheet type="text/css">
<link href="css/jquery.dataTables.css" rel=stylesheet type="text/css">
<link href="css/superfish.css" rel=stylesheet type="text/css">
<link href="css/tree.css" rel=stylesheet type="text/css">
<link href="css/jstree.css" rel=stylesheet type="text/css">
<link href="css/style.css" rel=stylesheet type="text/css">
<script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery-ui-1.8.custom.min.js"></script>