b694541552528887abb34b563336a17e0628e197 kate Thu Nov 17 15:00:40 2016 -0800 Response to QA. 1. Align GO button. 2. Abandon bolding of tissue labels to preserve alignment with leader lines. 3. Draw leader line on top when highlighted. refs #17369 diff --git src/hg/js/hgGtexTrackSettings.js src/hg/js/hgGtexTrackSettings.js index 4faadef..6317c6f 100644 --- src/hg/js/hgGtexTrackSettings.js +++ src/hg/js/hgGtexTrackSettings.js @@ -22,30 +22,31 @@ // Implementation note: jQuery is used below where effective. Some SVG manipulation // (e.g. add/remove/toggle classes) don't work from jQuery, so code for that is raw javascript var gtexTrackSettings = (function() { // Globals var _svgDoc; // SVG has its own DOM var _svgRoot; // Highlighted tissue is drawn last so it is on top var _topTissueId = 'topTissue'; var _topTissueName = null; var _topTissue; // element var _topAura; // element + var _topLine; // element var TEXT_HI = '_Text_Hi'; var LEAD_HI = '_Lead_Hi'; var AURA_HI = '_Aura_Hi'; var PIC_HI = '_Pic_Hi'; var PIC_LO = '_Pic_Lo'; var COLOR_BLACK = 'black'; var COLOR_SELECTED = COLOR_BLACK; var COLOR_BLUE = 'blue'; var COLOR_HIGHLIGHT = COLOR_BLUE; var COLOR_GRAY = '#737373'; var COLOR_UNSELECTED = COLOR_GRAY; var COLOR_PINK = '#F69296'; var COLOR_LEADER = COLOR_PINK; @@ -214,43 +215,49 @@ } if (lineEl !== null) { // cell types lack leader lines lineEl.style.stroke = COLOR_HIGHLIGHT; } var topAura = auraEl.cloneNode(true); topAura.id = 'topAura'; _topAura = _svgRoot.appendChild(topAura); $(_topAura).show(); var topTissue = picEl.cloneNode(true); topTissue.addEventListener('mouseleave', onMapLeaveTissue); topTissue.id = _topTissueId; _topTissueName = tis; _topTissue = _svgRoot.appendChild(topTissue); $(_topTissue).show(); + + var topLine = lineEl.cloneNode(true); + topLine.id = 'topLine'; + _topLine = _svgRoot.appendChild(topLine); + $(_topLine).show(); } else { var color = textEl.classList.contains(CLASS_TISSUE_SELECTED) ? COLOR_SELECTED : COLOR_UNSELECTED; textEl.style.fill = color; for (i = 0; i < textLineCount; i++) { textEl.children[i].style.fill = color; } if (lineEl !== null) { // cell types lack leader lines lineEl.style.stroke = COLOR_LEADER; // pink } _svgRoot.removeChild(_topTissue); _topTissueName = null; _svgRoot.removeChild(_topAura); + _svgRoot.removeChild(_topLine); } } // Event handlers function onClickSetAll() { // Set all on body map and tissue list tissues.forEach(setTissue); } function onClickClearAll() { // Clear all on body map and tissue list tissues.forEach(clearTissue); }