Page MenuHomec4science

MedCo_view_QryTool.js
No OneTemporary

File Metadata

Created
Mon, Oct 28, 21:23

MedCo_view_QryTool.js

i2b2.MedCo.view.QT = {}
i2b2.MedCo.view.QT.init = function (){
// initialize panels
var panels = document.getElementById("MedCo-QueryPanels")
// delete all current panels
while (panels.firstChild) {
panels.removeChild(panels.firstChild);
}
}
i2b2.MedCo.view.QT.appendPanel = function (panel) {
// doDrop: function which specifies what to do when a concepts have been dropped
// to this panel
// deleteFunc: function which specifies what to do when the delete panel button ("x")
// has been clicked
// <div class="MedCo-QueryPanel">
// <div class="MedCo-QueryPanelHeader">
// <div class="delete">
// <a href="JavaScript:i2b2.CRC.ctrlr.QT.panelControllers[0].doDelete();"><img src="js-i2b2/cells/CRC/assets/QryTool_b_clear.gif" alt="Clear" /></a>
// </div>
// <div class="groupId">
// Group 1
// </div>
// </div>
//
// <div class="MedCo-QueryPanelOptions">
// <div class="date">
// <!--<a id="A_9" href="JavaScript:i2b2.CRC.ctrlr.dateConstraint.showDates(0)" title="Select the date range for this group's criterion to have occured within...">Dates</a>-->
// </div>
// <div class="occur">
// <!--<a id="A_11" href="JavaScript:i2b2.CRC.ctrlr.QT.panelControllers[0].showOccurs()" title="Select the minimum number of times this group's criterion has occured...">Occurs &gt; <span id="SPAN_12">0</span>x</a>-->
// </div>
// <div class="exclude">
// <a href="JavaScript:i2b2.CRC.ctrlr.QT.panelControllers[0].doExclude()" title="Exclude records matching this group's criteria...">Exclude</a>
// </div>
// </div>
//
// <!-- Concepts are dropped here -->
// <div class="MedCo-QueryPanelConcepts">
// </div>
// </div>
var panels = document.getElementById("MedCo-QueryPanels")
// create the HTML of the panel and return the respective object
// create and append the three elements (header, options, concepts div)
var paneldiv = document.createElement("div");
paneldiv.className = 'MedCo-QueryPanel'
panels.appendChild(paneldiv)
// create and fill header
var header = document.createElement("div");
header.className = 'MedCo-QueryPanelHeader';
var temp = document.createElement("div");
temp.className = 'delete';
header.appendChild(temp)
var temp1 = document.createElement("a");
temp1.onclick = panel.delete;
temp.appendChild(temp1)
var temp2 = document.createElement("img")
temp2.src ="js-i2b2/cells/CRC/assets/QryTool_b_clear.gif"
temp2.alt = "Clear"
temp1.appendChild(temp2)
temp = document.createElement("div");
temp.className = 'groupId';
temp.innerText = 'Group ' + panel.group;
header.appendChild(temp)
// create and fill options
var options = document.createElement("div");
options.className ='MedCo-QueryPanelOptions';
temp = document.createElement("div");
temp.className = 'date';
options.appendChild(temp)
temp = document.createElement("div");
temp.className = 'occur';
options.appendChild(temp)
temp = document.createElement("div");
panel.exclude = false
temp.className = 'exclude';
temp.onclick = function () {
// underline the text in the botton
temp.style.textDecoration = temp.style.textDecoration=="underline"? "none":"underline"
// mark the panel as excluded
panel.exclude = !panel.exclude;
// update the concepts visualization
var conceptsDiv = conceptsView.getElementsByClassName("sdxDefaultCONCPT")
if (panel.exclude) {
// insert "NOT" in front of the concepts in the div
// <span title="This item is being excluded" class="itemExclude">&nbsp;NOT&nbsp;</span>
for (var i = 0; i < conceptsDiv.length; i++) {
conceptsDiv[i].insertBefore(notTemplate.cloneNode(true), conceptsDiv[i].firstChild);
}
}
else{
// remove the "NOT" in front of the concepts in the div
for (var i = 0; i < conceptsDiv.length; i++){
conceptsDiv[i].removeChild(conceptsDiv[i].getElementsByClassName("itemExclude")[0])
}
}
}
options.appendChild(temp)
temp1 = document.createElement("a")
temp1.title = "Exclude records matching this group's criteria..."
temp1.text = "Exclude"
temp.appendChild(temp1)
// create and add the div for the dropped concepts
var conceptsView = document.createElement("div");
conceptsView.className = 'MedCo-QueryPanelConcepts';
conceptsView.id = "MedCo-QueryPanel" + (id++)
i2b2.sdx.Master.AttachType(conceptsView.id, 'CONCPT', {dropTarget: true});
i2b2.sdx.Master.setHandlerCustom(conceptsView.id, 'CONCPT', 'DropHandler', function (sdxData) {panel.doDrop(sdxData);});
paneldiv.appendChild(header)
paneldiv.appendChild(options)
paneldiv.appendChild(conceptsView)
/* Instantiate a ContextMenu for this panel*/
YAHOO.util.Event.onContentReady(conceptsView.id, function () {
var conceptContextMenu = new YAHOO.widget.ContextMenu(
conceptsView.id+"ContextMenu",
{
trigger: conceptsView.childNodes,
itemdata: ["Delete"],
lazyload: true
}
);
// whenever the content of the panel changes, update the trigger property
$(conceptsView.id).on("DOMSubtreeModified",function(){
conceptContextMenu.cfg.setProperty("trigger", conceptsView.childNodes);
});
function onContextMenuClick(p_sType, p_aArgs) {
//p_aArgs[1]: MenuItem instance that was the target of the "click" event.
var oItem = p_aArgs[1], // The MenuItem that was clicked
oTarget = this.contextEventTarget,
oLI;
if (oItem) {
// todo: also verify the class (sdxDefaultCONCPT)?
oLI = oTarget.nodeName.toUpperCase() == "DIV" ?
oTarget : YAHOO.util.Dom.getAncestorByClassName(oTarget, "sdxDefaultCONCPT");
switch (oItem.index) {
case 0: // Delete
// remove the concept from the view
conceptsView.removeChild(oLI)
// TODO change the way concepts are stored in i2b2.MedCo.ctrlr.QT.panels so to easily delete them...
break;
// add here other cases if there are more menu items
}
}
}
// "render" event handler for the ewe context menu
function onContextMenuRender(p_sType, p_aArgs) {
// Add a "click" event handler to the ewe context menu
this.subscribe("click", onContextMenuClick);
}
conceptContextMenu.subscribe("render", onContextMenuRender);
// a bit rude bug fix... (hide menu when clicking on the panel)
conceptsView.onclick = function () {conceptContextMenu.hide.call(conceptContextMenu)}
})
panel.html = paneldiv
}
i2b2.MedCo.view.QT.appendConceptToPanel = function (panel, sdxData){
function createConceptDiv (concept, output) {
// create:
// "<div class=\"sdxDefaultCONCPT\"><img src=\"js-i2b2/cells/ONT/assets/sdx_ONT_CONCPT_leaf.gif\">" + concept + "<output>...</output> </div>";
var div = document.createElement("div");
div.setAttribute('class', 'sdxDefaultCONCPT');
if (panel.exclude) {
div.appendChild(notTemplate.cloneNode(true))
}
var oImg = document.createElement("img");
oImg.setAttribute('src', 'js-i2b2/cells/ONT/assets/sdx_ONT_CONCPT_leaf.gif');
div.appendChild(oImg)
if (output==true) {
div.appendChild(document.createTextNode(concept+" (")) // also print the number of retrieved mutations
var out = document.createElement("output");
out.appendChild(document.createTextNode("..."))
div.appendChild(out)
div.appendChild(document.createTextNode(")"))
}
else{
div.appendChild(document.createTextNode(concept))
}
return div
};
var conceptPanel = panel.html.getElementsByClassName("MedCo-QueryPanelConcepts")[0]
conceptPanel.appendChild(createConceptDiv(sdxData.sdxInfo.sdxDisplayName, false))
}
var notTemplate = document.createElement("span")
notTemplate.title = "This item is being excluded"
notTemplate.className = "itemExclude"
notTemplate.textContent = "NOT";

Event Timeline