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:
parent
0d110082c1
commit
f475496815
213
xCAT-UI/css/jstree.css
Normal file
213
xCAT-UI/css/jstree.css
Normal 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 */
|
@ -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;
|
||||
}
|
||||
|
@ -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
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
BIN
xCAT-UI/images/jstree.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 7.5 KiB |
3510
xCAT-UI/js/jquery/jquery.jstree.js
Normal file
3510
xCAT-UI/js/jquery/jquery.jstree.js
Normal file
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -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) {
|
||||
|
@ -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
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -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");
|
||||
|
||||
|
@ -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>
|
||||
|
Loading…
Reference in New Issue
Block a user