icn3d 3.49.4 → 3.49.6

package/icn3d.js

@@ -62164,7 +62164,7 @@ class SetDialog {
         html += "1. Select a nucleotide chain to show R2DT diagram:<br>";
         html += "<select style='max-width:200px' id='" + me.pre + "atomsCustomNucleotide' size='5' style='min-width:130px;'>";
         html += "</select><br>";
-        html += me.htmlCls.buttonStr + "applyr2dt'>Show R2DT Diagram</button><br>";
+        html += me.htmlCls.buttonStr + "applyr2dt'>Show R2DT Diagram</button> <br><br>(Hints: Click on Residues in 2D to highlight in 3D. <br>Ctrl + click to select multiple residues.)<br>";
         html += "</div>";
 
         html += me.htmlCls.divStr + "dl_2ddgm_igdgm' class='" + dialogClass + "'>";
@@ -120851,7 +120851,8 @@ class LoadScript {
           }
           else if(command.indexOf('diagram 2d nucleotide') == 0) {
             let paraArray = command.split(' | ');
-            let chainid = paraArray[1];
+            let pos = command.lastIndexOf(' ');
+            let chainid = (paraArray.length == 2) ? paraArray[1] : command.substr(pos + 1);
 
             ic.bRender = true;
             await ic.diagram2dCls.drawR2dt(chainid);
@@ -120859,7 +120860,8 @@ class LoadScript {
           }
           else if(command.indexOf('diagram 2d ig') == 0) {
             let paraArray = command.split(' | ');
-            let chainid = paraArray[1];
+            let pos = command.lastIndexOf(' ');
+            let chainid = (paraArray.length == 2) ? paraArray[1] : command.substr(pos + 1);
 
             ic.bRender = true;
             await ic.diagram2dCls.drawIgdgm(chainid);
@@ -128184,7 +128186,6 @@ class Diagram2d {
             let titleElem = clickedElement.querySelector('title');
 
             if(titleElem) {
-                titleElem.style.cursor = "pointer";
                 let title = titleElem.textContent; // e.g., 14 (position.label in template: 14.A)
                 let textArray = title.split(' ');
                 let position_resn = textArray[textArray.length - 1].split('.');
@@ -128203,7 +128204,7 @@ class Diagram2d {
                     let realResn = (resn == 'T') ? 'U' : resn;
 
                     if(resn != oneLetterRes && realResn != oneLetterRes) {
-                        var aaa = 1; //alert("The mouseover text in R2DT didn't match the residue number in 3D view...");
+                        var aaa = 1; //alert("The residue number in R2DT didn't match that in 3D view...");
                     }
                     else {
                         // highlight the selected residue
@@ -128222,17 +128223,11 @@ class Diagram2d {
                 let textElem = clickedElement.querySelector('text');
                 textElem.setAttribute("stroke", "#f8b84e");
                 textElem.setAttribute("stroke-width", "0.5px");
-            }
 
-            // set cursor for all nodes
-            if(!ic.bSetCursor) {
-                ic.bSetCursor = true;
-                let r2dt = document.querySelector('r2dt-web').shadowRoot;
-                let elemArray = r2dt.querySelectorAll('g:has(title)');
-                for(let i = 0, il = elemArray.length; i < il; ++i) {
-                    if(!elemArray[i].hasAttribute('id')) { // skip the main g element
-                        elemArray[i].style.cursor = "pointer";
-                    }
+                // add cursor
+                if(!ic.bAddedCursors) {
+                    ic.bAddedCursors = true;
+                    ic.diagram2dCls.makeResiduesClickable();
                 }
             }
         }); 
@@ -128461,7 +128456,20 @@ class Diagram2d {
         return html;
     }
 
+    makeResiduesClickable() { let ic = this.icn3d; ic.icn3dui;
+        let r2dt = document.querySelector('r2dt-web').shadowRoot;
+        let elemArray = r2dt.querySelectorAll('g:has(title)');
+        for(let i = 0, il = elemArray.length; i < il; ++i) {
+            if(!elemArray[i].hasAttribute('id')) { // skip the main g element
+                elemArray[i].style.cursor = "pointer";
+            }
+        }
+    }
+
     async drawR2dt(chainid) { let ic = this.icn3d, me = ic.icn3dui;
+        let thisClass = this;
+        ic.bAddedCursors = false;
+
         ic.r2dt_chainid = chainid;
 
         let url = me.htmlCls.baseUrl + "vastdyn/vastdyn.cgi?chainid2rnaid=" + chainid;
@@ -128470,12 +128478,16 @@ class Diagram2d {
 
         let html = '';
         if(data && data.rnaid) {
-            ic.bSetCursor = false;
-
             html += '<r2dt-web search=\'{"urs": "' + data.rnaid + '"}\' />';
             html += '<script type="text/javascript" src="https://rnacentral.github.io/r2dt-web/dist/r2dt-web.js"></script>';
             $("#" + me.pre + "2ddiagramDiv").html(html);
             me.htmlCls.dialogCls.openDlg('dl_2ddiagram', 'Show R2DT Diagram for chain ' + chainid);
+ 
+            // set cursor for all nodes
+            setTimeout(function(){
+                //ic.bAddedCursors = true;
+                thisClass.makeResiduesClickable();
+            }, 3000);
         }
         else {
             var aaa = 1; //alert("No R2DT diagram can be found for chain " + chainid);
@@ -128536,7 +128548,7 @@ class Diagram2d {
             if(refnumLabel) {
                 refnumStr = ic.refnumCls.rmStrandFromRefnumlabel(refnumLabel);
                 if(!refnum2resn[domainid]) refnum2resn[domainid] = {};
-                refnum2resn[domainid][refnumStr] = resn;
+                refnum2resn[domainid][refnumStr] = resn + resid.split('_')[2];
             }
         }
 
@@ -128549,6 +128561,8 @@ class Diagram2d {
 
         const mainWorkbook = new ExcelJS.Workbook();
 
+        let ig2width = {'IgC1': 17, 'IgC2': 18, 'IgI': 19, 'IgV': 19};
+
         for(let i = 0, il = igArray.length; i < il; ++i) {
             let domainid = igArray[i].domainid;
             let igType = igTypeArray[i];
@@ -128566,10 +128580,8 @@ class Diagram2d {
 
                 const newSheet = mainWorkbook.addWorksheet();
                 // Clone the model to transfer styles and data
-                newSheet.model = { 
-                    ...worksheet.model, 
-                    name: (i + 1) + ". " + igType
-                };
+                newSheet.model = worksheet.model;
+                newSheet.name = (i + 1) + ". " + igType;
 
                 // Iterate over all rows that have values
                 newSheet.eachRow({ includeEmpty: true }, (row, rowNumber) => {
@@ -128584,8 +128596,28 @@ class Diagram2d {
                                 cell.value = '';
                             }
                         }
+                        else if(cell.value == 'NUMBERING') {
+                            cell.value = '';
+                        }
                     });
                 });
+
+                // copy the original data
+                let colNum = ig2width[igType]; // some extra columns
+                for(let i = 1; i <= colNum; ++i) {
+                    const sourceCol = worksheet.getColumn(i);
+
+                    // Copy values and styles
+                    sourceCol.eachCell({ includeEmpty: true }, (cell, rowNumber) => {
+                        const targetCell = newSheet.getRow(rowNumber).getCell(colNum + 2 + i);
+                        
+                        targetCell.value = cell.value;
+                        targetCell.style = cell.style; // Copies font, borders, and fills
+                    });
+
+                    // reset width for each column
+                    newSheet.getColumn(colNum + 2 + i).width = worksheet.getColumn(i).width;
+                }
             }
         }