From 5f56cd6d3cf5ded1c1ace349730bc7ba3b3ab41b Mon Sep 17 00:00:00 2001 From: mxi1 Date: Thu, 26 Nov 2009 07:31:17 +0000 Subject: [PATCH] using the dataTables plugin to represent the tables in xCAT git-svn-id: https://svn.code.sf.net/p/xcat/code/xcat-core/trunk@4672 8638fb3e-16cb-4fca-ae20-7b5d299a9bcd --- xCAT-UI/css/main.css | 48 ------ xCAT-UI/css/monitor.css | 46 ++++++ xCAT-UI/js/loading.js | 3 +- xCAT-UI/js/monitor.js | 71 ++++++++ xCAT-UI/js/xcat.js | 68 -------- xCAT-UI/lib/display.php | 2 + xCAT-UI/lib/monitor_display.php | 236 ++++++++++++++------------- xCAT-UI/monitor/options.php | 52 +++--- xCAT-UI/monitor/rmc_event_define.php | 5 +- 9 files changed, 278 insertions(+), 253 deletions(-) diff --git a/xCAT-UI/css/main.css b/xCAT-UI/css/main.css index 2b77bde3d..148a162c1 100644 --- a/xCAT-UI/css/main.css +++ b/xCAT-UI/css/main.css @@ -385,54 +385,6 @@ padding:10px 2px; display: block; } -#condresp { - width: 770px; - margin: 10px; - padding: 10px; - float: left; - display: block; - border-bottom: 1px dotted #555; -} - -#assocaition { - margin: 10px; - padding: 10px; - float:left; - display: block; - width: 720px; - border-bottom: 1px dotted #555; -} -#avail_cond { - width: 275px; - margin: 5px; - padding: 10px; - float: left; - background-color: #ffee33; -} - -#avail_cond tbody { - height: 640px; - overflow-y: scroll; - overflow-x: hide; -} - -#condition .ui-selecting {background: #FECA40;} -#condition .ui-selected { background: #F39814; color: white; } -#condition {list-style-type: none; margin: 0; padding: 0;} - -#avail_resp { - width: 425px; - margin: 5px; - padding: 10px; - float: left; - background-color: #eeffee; -} - -#avail_resp tbody { - height: 640px; - overflow-y: scroll; - overflow-x: hide; -} #monsetting_tips { width: 920px; diff --git a/xCAT-UI/css/monitor.css b/xCAT-UI/css/monitor.css index 3b01e044c..c3c126368 100644 --- a/xCAT-UI/css/monitor.css +++ b/xCAT-UI/css/monitor.css @@ -126,3 +126,49 @@ fieldset { outline: 1px dotted #ccc; } +#condresp { + width: 71%; + margin: 5px; + padding: 5px; + float: left; + display: block; + border: 1px solid orange; +} + +#assocaition { + margin: 5px; + padding: 5px; + float:left; + display: block; + border: 1px solid lime; +} + +#avail_cond { + width: 33%; + margin: 5px; + padding: 5px; + float: left; + background-color: #ffee33; +} + +#avail_cond tbody { + overflow-y: scroll; + overflow-x: hide; +} + +#condition .ui-selecting {background: #FECA40;} +#condition .ui-selected { background: #F39814; color: white; } +#condition {list-style-type: none; margin: 0; padding: 0;} + +#avail_resp { + width: 60%; + margin: 5px; + padding: 5px; + float: left; + background-color: #eeffee; +} + +#avail_resp tbody { + overflow-y: scroll; + overflow-x: hide; +} \ No newline at end of file diff --git a/xCAT-UI/js/loading.js b/xCAT-UI/js/loading.js index 28e44837c..e3d44de25 100644 --- a/xCAT-UI/js/loading.js +++ b/xCAT-UI/js/loading.js @@ -99,7 +99,8 @@ var xStart = function(){ myBar.addScript("jsTree/jquery.cookie.js"); myBar.addScript("jsTree/css.js"); myBar.addScript("jquery.form.js"); - myBar.addScript("jquery.jeditable.mini.js"); + myBar.addScript("jquery.jeditable.mini.js"); + myBar.addScript("jquery.dataTables.min.js"); myBar.addScript("hoverIntent.js"); myBar.addScript("superfish.js"); myBar.addScript("jquery.tablesorter.js"); diff --git a/xCAT-UI/js/monitor.js b/xCAT-UI/js/monitor.js index 3e2fc9937..6eb19af12 100644 --- a/xCAT-UI/js/monitor.js +++ b/xCAT-UI/js/monitor.js @@ -114,6 +114,30 @@ function monPluginSetStat() ); } +/*setMonsettingTab is used to initialize the configuration of monsetting in the monlist */ +function setMonsettingTab() +{ + makeEditable('monsetting','.editme', '.Ximg', '.Xlink'); + $("#reset").click(function() { + alert('You sure you want to discard changes?'); + $("#settings").tabs("load",1); //reload the "config" tabs + $("#settings .ui-tabs-panel #accordion").accordion('activate',1);//activate the "monsetting" accordion + }); + $("#monsettingaddrow").click(function() { + var line = $(".mContent #tabTable tbody tr").length + 1; + var newrow = formRow(line, 6, line%2); + $(".mContent #tabTable tbody").append($(newrow)); + makeEditable('monsetting', '.editme2', '.Ximg2', '.Xlink2'); + }); + $("#saveit").click(function() { + var plugin=$('.pluginstat.ui-state-active').attr('id'); + $.get("monitor/options.php",{name:plugin, opt:"savetab"},function(data){ + $("#settings").tabs("load",1); //reload the "config" tabs + $("#settings .ui-tabs-panel #accordion").accordion('activate',1);//activate the "monsetting" accordion + }); + }); +} + function nodemonSetStat() { //enable/disable buttons for setting of the Node monitoring status @@ -130,5 +154,52 @@ function appmonSetStat() //TODO } +//create the associations for the condition & response +//which is be used in the PHP function displayCondResp() in rmc_event_define.php +function mkCondResp() +{ + //get the name of the selected condition + //then, get the response in "checked" status + //then, run the command "mkcondresp" + var cond_val = $(':input[name=conditions][checked]').val(); + if(cond_val) { + //get the response in "checked" status + var resps_obj = $(':input[name=responses][checked]'); + if(resps_obj) { + $.each(resps_obj,function(i,n) { + //i is the index + //n is the content + //TODO:add one new php file to handle "mkcondresp" command + $.get("monitor/makecondresp.php", {cond: cond_val, resp: n.value}, function(data) { + $("#devstatus").html(data); + }); + }); + $("#association").load("monitor/updateCondRespTable.php"); + } + } +} + +//clearEventDisplay() +//is used to clear the selection in the page for configuring the condtion&response association +function clearEventDisplay() +{ + $(':input[name=conditions][checked]').attr('checked', false); + $(':input[name=responses][checked]').attr('checked', false); +} + +//control_RMCAssoc() +//is used to update the association table in rmc_event_define.php +function control_RMCAssoc(cond, node, resp, action) +{ + //TODO:for define_rmc_event + //control the RMC Association: startcondresp & stopcondresp; + $.get("monitor/updateCondResp.php", + {c: cond, n: node, r: resp, a: action}, + function(data) { + $("#association").html(data); + } + ); +} + // for the progress bar myBar.loaded('monitor.js'); \ No newline at end of file diff --git a/xCAT-UI/js/xcat.js b/xCAT-UI/js/xcat.js index 652720e30..4873043c0 100644 --- a/xCAT-UI/js/xcat.js +++ b/xCAT-UI/js/xcat.js @@ -400,48 +400,6 @@ function goto_next() } } -function mkCondResp() -{ - //get the name of the selected condition - //then, get the response in "checked" status - //then, run the command "mkcondresp" - var cond_val = $('input[@name=conditions][@checked]').val(); - if(cond_val) { - //get the response in "checked" status - var resps_obj = $('input[@name=responses][@checked]'); - if(resps_obj) { - $.each(resps_obj,function(i,n) { - //i is the index - //n is the content - //TODO:add one new php file to handle "mkcondresp" command - $.get("monitor/makecondresp.php", {cond: cond_val, resp: n.value}, function(data) { - $("#devstatus").html(data); - }); - }); - $("#association").load("monitor/updateCondRespTable.php"); - } - } -} - -function control_RMCAssoc(cond, node, resp, action) -{ - //TODO:for define_rmc_event - //control the RMC Association: startcondresp & stopcondresp; - $.get("monitor/updateCondResp.php", - {c: cond, n: node, r: resp, a: action}, - function(data) { - $("#association").html(data); - } - ); -} - -function clearEventDisplay() -{ - $('input[@name=conditions][@checked]').attr('checked', false); - $('input[@name=responses][@checked]').attr('checked', false); -} - - function showRMCAttrib() { var class_val = $('input[@name=classGrp][@checked]').val(); @@ -452,32 +410,6 @@ function showRMCAttrib() } } -//TODO: when mouse hover the list of monitor plugins, the .ListLine_hover style will -//be applied on the , -function hoverOnMonlist() -{ - $(".tabTable tr").hover( - function() { - $(this).addClass("ListLine_hover"); - }, - function() { - $(this).removeClass("ListLine_hover"); - } - ); -} - -function monsetupAction(plugin, action_val) -{ - //plugin = the name of plugin - //action = "start" or "stop" - $.get("monitor/setup.php", {name: plugin, action: action_val}, function(data) { - $.get("monitor/updateMonList.php", {}, function(data) { - $("#monlist_table").html(data); - }); - - }); -} - function show_monshow_data(type,range) { //type = "text" or "graph" diff --git a/xCAT-UI/lib/display.php b/xCAT-UI/lib/display.php index d5676bebd..295529114 100644 --- a/xCAT-UI/lib/display.php +++ b/xCAT-UI/lib/display.php @@ -16,6 +16,8 @@ echo << + + diff --git a/xCAT-UI/lib/monitor_display.php b/xCAT-UI/lib/monitor_display.php index 289441ead..a383aa304 100644 --- a/xCAT-UI/lib/monitor_display.php +++ b/xCAT-UI/lib/monitor_display.php @@ -1,48 +1,4 @@ code related with monitor interface is put here. - */ - -#displayMonitorLists() will generate all the monitoring plug-ins, -#the user can select the plug-ins he wants to operate on, -#and press the "Next" button; - function displayMonitorLists() { - #The command "monls -a" is used to get the monitoring plug-ins list - $xml = docmd("monls"," ", array('-a')); - if(getXmlErrors($xml,$errors)) { - echo "

",implode(' ', $errors), "

"; - exit; - } - #then, parse the xml data - $ooe = 0; - $line = 0; - foreach($xml->children() as $response) foreach($response->children() as $data) { - list($name, $stat, $nodemonstatus) = preg_split("/\s+/", $data); - $ooe = $ooe%2; - echo ""; - echo "$name"; - echo "$stat"; - if(isset($nodemonstatus)) { echo "Enabled";}else {echo "Disabled";} - echo ""; - insertButtons(array('label'=>'Configure', 'id'=>'configure', 'onclick'=>'')); - echo ""; - echo ""; - $name_str = '"'.$name.'"'; - if($stat == "monitored") { - $act_str = '"stop"'; - insertButtons(array('label'=>'Stop', 'id'=>'stop', 'onclick'=>"monsetupAction($name_str, $act_str)")); - }else { - $act_str = addslashes('"start"'); - insertButtons(array('label' => 'Start', 'id'=>'start', 'onclick' => "monsetupAction($name_str, $act_str)")); - } - echo ""; - echo " "; - $ooe++; - $line++; - //echo "$name$stat$name"; - } - return 0; - } function displayTips($tips) { @@ -110,29 +66,49 @@ function displayStatus() function displayOSITree() { //display the node range tree, but only with the nodes with OSI type - //this follows the function displayNrTree(); - //it doesn't work on firefox!!! -echo <<"; +echo << -$(init_ositree()); + $(function() { + nrtree = new tree_component(); // -Tree begin + nrtree.init($("#nrtree-input"),{ + rules: { multiple: "Ctrl" }, + ui: { animation: 250 }, + callback : { onchange : printtree }, + data : { + type : "json", + async : "true", + url: "noderangesource.php" + } + }); //Tree finish + }); -
-EOS3; +TOS3; + echo ""; } function displayAssociation() { - echo '
'; + //TODO: the return message of "webrun lscondresp" is changed + //and, also, DataTables is used to draw the tabls + echo '
'; echo <<Available Condition/Response Associations - + +
- - - - - - + + @@ -145,35 +121,46 @@ TOS5; //get all the condition&response associations for RMC foreach ($xml->children() as $response) foreach($response->children() as $data) { //get the data from xcatd - $association = explode("=", $data); - - $ooe = 0; - $line = 0; - foreach($association as $elem) { - $ooe = $ooe%2; - //the format should be - //"NodeReachability"\t"EmailRootOffShift"\t"hv8plus01.ppd.pok.ibm.com"\t"Active" - $record = explode("\"", $elem); - $cond = $record[1]; - $resp = $record[3]; - $node = $record[5]; - $state = $record[7]; - echo ""; - echo ""; - echo ""; - echo ""; - echo ""; - echo ""; - echo ""; - $ooe++; - $line++; - } + $record = split('"',$data); + echo ""; +echo <<$record[1] + + + +TOS6; + //TODO: insert the button here + echo ""; + echo ""; +// $association = explode("=", $data); +// +// $ooe = 0; +// $line = 0; +// foreach($association as $elem) { +// $ooe = $ooe%2; +// //the format should be +// //"NodeReachability"\t"EmailRootOffShift"\t"hv8plus01.ppd.pok.ibm.com"\t"Active" +// $record = explode("\"", $elem); +// $cond = $record[1]; +// $resp = $record[3]; +// $node = $record[5]; +// $state = $record[7]; +// echo ""; +// echo ""; +// echo ""; +// echo ""; +// echo ""; +// echo ""; +// echo ""; +// $ooe++; +// $line++; +// } } echo "
ConditionResponseNodeStateAction
Condition + Response + Node + State + Action
$cond$resp$node$state"; - if($state == "Active") { - insertButtons(array('label'=>'DeActivate', 'id'=>'deactivate', 'onclick'=>"control_RMCAssoc(\"$cond\", \"$node\", \"$resp\", \"stop\")")); - }else if($state == "Not active"){ - insertButtons(array('label'=>'Activate', 'id'=>'activate', 'onclick'=>"control_RMCAssoc(\"$cond\", \"$node\", \"$resp\", \"start\")")); - } - echo "
$record[3]$record[5]$record[7]Button
$cond$resp$node$state"; +// if($state == "Active") { +// insertButtons(array('label'=>'DeActivate', 'id'=>'deactivate', 'onclick'=>"control_RMCAssoc(\"$cond\", \"$node\", \"$resp\", \"stop\")")); +// }else if($state == "Not active"){ +// insertButtons(array('label'=>'Activate', 'id'=>'activate', 'onclick'=>"control_RMCAssoc(\"$cond\", \"$node\", \"$resp\", \"start\")")); +// } +// echo "
"; return 0; @@ -181,35 +168,49 @@ TOS5; function displayCond() { - //the user selects one node/noderange from the #ositree div + //display all the avaiable conditions to a element echo << Available Conditions -
+
- - + COND; $xml = docmd("webrun", '', array("lscondition")); foreach($xml->children() as $response) foreach($response->children() as $data) { - //get the data from xcatd - $conditions = explode("=", $data); - } - $ooe = 0; - $line = 0; - foreach($conditions as $elem) { - $ooe = $ooe%2; - echo ""; - echo ""; - echo ""; - echo ""; - $ooe++; - $line++; + /* + * the data format like this + * "HFI_not_configured" "ca4lpar02" "Not monitored" + * "Drawer_not_configured" "ca4lpar02" "Not monitored" + * "AnyNodeFileSystemSpaceUsed_H" "ca4lpar02" "Not monitored" + */ + $tmp = split('"', $data); + //$tmp[1] = condition name + //$tmp[3] = nodename + //$tmp[5] = status +echo << + + + +TOS99; } +// $ooe = 0; +// $line = 0; +// foreach($conditions as $elem) { +// $ooe = $ooe%2; +// echo ""; +// echo ""; +// echo ""; +// echo ""; +// $ooe++; +// $line++; +// } echo "
Conditions + Conditions
$elem
$tmp[1]
$elem
"; return 0; @@ -233,17 +234,23 @@ RESP; $ooe=0; $line=0; foreach($xml->children() as $response) foreach($response->children() as $data) { - $responses = explode("=", $data); - } - foreach($responses as $elem) { - $ooe = $ooe%2; - echo ""; - echo ""; - echo "$elem"; + $record = split('"', $data); + echo ""; +echo << + $record[1] +TOS7; echo ""; - $ooe++; - $line++; } +// foreach($responses as $elem) { +// $ooe = $ooe%2; +// echo ""; +// echo ""; +// echo "$elem"; +// echo ""; +// $ooe++; +// $line++; +// } echo ''; return 0; } @@ -257,7 +264,6 @@ function displayCondResp() insertButtons(array('label'=>'Add', id=>'addAssociation', 'onclick'=>'mkCondResp()')); insertButtons(array('label'=>'Cancel', id=>'cancel_op', 'onclick'=>'clearEventDisplay()')); echo ''; - displayStatus(); } function displayRMCRsrc() diff --git a/xCAT-UI/monitor/options.php b/xCAT-UI/monitor/options.php index 6b928b47b..73d134a30 100644 --- a/xCAT-UI/monitor/options.php +++ b/xCAT-UI/monitor/options.php @@ -92,6 +92,37 @@ echo <<"; + if($name == "rmcmon") {//special cases for RMCMON + echo "

RMC Event Monitor Setting

"; + echo "
"; + echo << +

RMC Event configuration is independent from the monstart/monstop command

+

To make your change effect, you don't need to restart RMC plugin

+
+TOS11; + showRMCAssocTab(); + echo "

click the REDIRECT button to go to the configure web page

"; + echo ""; + echo ""; + echo "

The Available RMC Resources and their attributes

"; + echo << +

For your convenience, all the available RMC Resources and their attributes will list here

+ + +TOS15; + } + echo ""; +} + +/* showRMCAssocTab() + * is used to display all the current associations of RMC conditions&responses + */ +function showRMCAssocTab() +{ + echo "
"; + echo "
"; } @@ -247,25 +278,7 @@ function showMonsettingTab() echo << $(function() { - makeEditable('monsetting','.editme', '.Ximg', '.Xlink'); - $("#reset").click(function() { - alert('You sure you want to discard changes?'); - $("#settings").tabs("load",1); //reload the "config" tabs - $("#settings .ui-tabs-panel #accordion").accordion('activate',1);//activate the "monsetting" accordion - }); - $("#monsettingaddrow").click(function() { - var line = $(".mContent #tabTable tbody tr").length + 1; - var newrow = formRow(line, 6, line%2); - $(".mContent #tabTable tbody").append($(newrow)); - makeEditable('monsetting', '.editme2', '.Ximg2', '.Xlink2'); - }); - $("#saveit").click(function() { - var plugin=$('.pluginstat.ui-state-active').attr('id'); - $.get("monitor/options.php",{name:plugin, opt:"savetab"},function(data){ - $("#settings").tabs("load",1); //reload the "config" tabs - $("#settings .ui-tabs-panel #accordion").accordion('activate',1);//activate the "monsetting" accordion - }); - }); + setMonsettingTab(); }); TOS22; @@ -314,6 +327,7 @@ TOS00; $ooe = 1 - $ooe; } echo "\n"; + echo ""; $_SESSION["editable-$tab"] = & $editable; # save the array so we can access it in the next call of this file or change.php echo "

"; echo ""; diff --git a/xCAT-UI/monitor/rmc_event_define.php b/xCAT-UI/monitor/rmc_event_define.php index d682932d3..c3bc32225 100644 --- a/xCAT-UI/monitor/rmc_event_define.php +++ b/xCAT-UI/monitor/rmc_event_define.php @@ -19,8 +19,9 @@ displayTips(array( "Use \"mkcondition\" and \"mkresponse\" to create new conditions and new responses", "Select the condition, and response to create condition/response association" )); +echo "

"; + //TODO:one "text input" widget should be put here, to allow the user to input noderange displayOSITree(); - displayCondResp(); - +echo "
"; ?>