From: nicolasconnault Date: Sat, 25 Apr 2009 06:55:16 +0000 (+0000) Subject: MDL-18963 Applying Matt's patch to fix the YUI tooltips in the grader report. Merged... X-Git-Url: http://git.mjollnir.org/gw?a=commitdiff_plain;h=5f44fd3e06a08a2815529c24e8dbfa7c18653537;p=moodle.git MDL-18963 Applying Matt's patch to fix the YUI tooltips in the grader report. Merged from MOODLE_19_STABLE --- diff --git a/grade/report/grader/index.php b/grade/report/grader/index.php index e828f5aeb2..019239b59e 100644 --- a/grade/report/grader/index.php +++ b/grade/report/grader/index.php @@ -139,7 +139,8 @@ $report->load_final_grades(); /// Print header $reportname = get_string('modulename', 'gradereport_grader'); -print_grade_page_head($COURSE->id, 'report', 'grader', $reportname, false, null, $buttons, array($CFG->wwwroot . '/lib/yui/container/assets/skins/sam/container.css')); +// Matt - removed stylesheet +print_grade_page_head($COURSE->id, 'report', 'grader', $reportname, false, null, $buttons); echo $report->group_selector; echo '
'; @@ -191,6 +192,7 @@ if (!empty($studentsperpage) && $studentsperpage >= 20) { print_paging_bar($numusers, $report->page, $studentsperpage, $report->pbarurl); } +echo '
tooltip panel
'; // Print AJAX code if ($report->get_pref('enableajax')) { require_once 'ajax.php'; @@ -202,16 +204,124 @@ if ($report->get_pref('enableajax')) { YAHOO.namespace("graderreport"); -YAHOO.graderreport.init = function() { - // Get all with class grade - var cells = YAHOO.util.Dom.getElementsByClassName('grade', 'td'); - YAHOO.graderreport.tooltips = new Array(cells.length); +function init() { + // attach event listener to the table for mouseover and mouseout + var table = document.getElementById('user-grades'); + YAHOO.util.Event.on(table, 'mouseover', YAHOO.graderreport.mouseoverHandler); + YAHOO.util.Event.on(table, 'mouseout', YAHOO.graderreport.mouseoutHandler); - for (var i = 0; i < cells.length; i++) { - YAHOO.graderreport.tooltips[i] = new YAHOO.widget.Tooltip("tt"+i, { context: cells[i], autodismissdelay: 10000000 }); + // Make single panel that can be dynamically re-rendered wit the right data. + YAHOO.graderreport.panelEl = new YAHOO.widget.Panel("tooltipPanel", { + + draggable: false, + visible: false, + close: false, + preventcontextoverlap: true + + }); + + YAHOO.graderreport.panelEl.render(table); + + document.body.className += ' yui-skin-sam'; + +} + +YAHOO.graderreport.mouseoverHandler = function (e) { + + var tempNode = ''; + var searchString = ''; + var tooltipNode = ''; + + // get the element that we just moved the mouse over + var elTarget = YAHOO.util.Event.getTarget(e); + + + // if it was part of the yui panel, we don't want to redraw yet + searchString = /fullname|itemname|feedback/; + if (elTarget.className.search(searchString) > -1) { + return false; + } + + // move up until we are in the actual cell, not any other child div or span + while (elTarget.id != 'user-grades') { + if(elTarget.nodeName.toUpperCase() == "TD") { + break; + } else { + elTarget = elTarget.parentNode; + } } -}; -YAHOO.util.Event.onDOMReady(YAHOO.graderreport.init); + + // only make a tooltip for cells with grades + if (elTarget.className.search('grade cell') > -1) { + + // each time we go over a new cell, we need to put it's tooltip into a div to stop it from + // popping up on top of the panel. Still looking for a way to set the header differently + if (elTarget.childNodes.length == 1) { + + tempNode = document.createElement("div"); + tempNode.className = "tooltipDiv"; + tempNode.innerHTML = elTarget.title; + elTarget.appendChild(tempNode); + elTarget.title = null; + } + + tooltipNode = elTarget.childNodes[1]; + + YAHOO.graderreport.panelEl.setBody(tooltipNode.innerHTML); + YAHOO.graderreport.panelEl.render(elTarget); + YAHOO.graderreport.panelEl.show() + } +} + +// only hide the overlay if the mouse has not moved over it +YAHOO.graderreport.mouseoutHandler = function (e) { + + var classVar = ''; + var newTargetClass = ''; + var elTarget = YAHOO.util.Event.getTarget(e); + var newTarget = YAHOO.util.Event.getRelatedTarget(e); + + // deals with an error if the mouseout event is over the lower scrollbar + try { + classVar = newTarget.className; + } catch (err) { + YAHOO.graderreport.panelEl.hide() + return false; + } + + // if we are over any part of the panel, do not hide + // do this by walking up the DOM till we reach table level, looking for panel tag + while ((typeof(newTarget.id)) == 'undefined' || (newTarget.id != 'user-grades')) { + + try { + newTargetClass = newTarget.className; + } catch (err) { + // we've gone over the scrollbar + YAHOO.graderreport.panelEl.hide() + return false; + } + + if (newTargetClass.search('yui-panel') > -1) { + // we're in the panel so don't hide it + return false; + } + + if (newTarget.nodeName.toUpperCase() == "HTML") { + // we missed the user-grades table altogether by moving down off screen to read a long one + YAHOO.graderreport.panelEl.hide() + break; + } + + newTarget = newTarget.parentNode; + } + + // no panel so far and we went up to the + YAHOO.graderreport.panelEl.hide() + +} + + +YAHOO.util.Event.onDOMReady(init); dirroot.'/lib/yui/container/assets/skins/sam/container.css') ?> +.yui-skin-sam .yui-panel .hd{padding:0 10px;font-size:93%;line-height:2;*line-height:1.9;font-weight:bold;color:#000;background:url(wwwroot."/lib/yui" ?>/assets/skins/sam/sprite.png) repeat-x 0 -200px;} +.yui-skin-sam .container-close{border-color: #45c;position:absolute;top:5px;right:6px;width:25px;height:15px;background:url(wwwroot."/lib/yui" ?>/assets/skins/sam/sprite.png) no-repeat 0 -300px;cursor:pointer;} +.yui-skin-sam .yui-simple-dialog .bd .yui-icon{background:url(wwwroot."/lib/yui" ?>/assets/skins/sam/sprite.png) no-repeat 0 0;width:16px;height:16px;margin-right:10px;float:left;} + +.grade-report-grader .yui-overlay a.container-close { + margin-top: -3px; +} + +#hiddentooltiproot, .tooltipDiv { + display: none; +} + +