icn3d 3.23.5 → 3.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/css/icn3d.css +8 -3
  2. package/icn3d.js +464 -158
  3. package/icn3d.min.js +4 -2
  4. package/icn3d.module.js +464 -158
  5. package/package.json +1 -1
package/icn3d.js CHANGED
@@ -5685,7 +5685,7 @@ class ClickMenu {
5685
5685
  if(!bOneset) $("#" + me.pre + id2).resizable();
5686
5686
  }
5687
5687
 
5688
- applyShownMenus() { let me = this.icn3dui; me.icn3d;
5688
+ applyShownMenus(bNoSave) { let me = this.icn3dui; me.icn3d;
5689
5689
  let idArray = [];
5690
5690
  for(let id in me.htmlCls.allMenus) {
5691
5691
  if(me.htmlCls.shownMenus.hasOwnProperty(id)) {
@@ -5705,7 +5705,7 @@ class ClickMenu {
5705
5705
  }
5706
5706
 
5707
5707
  // save to localStorage
5708
- if(localStorage) localStorage.setItem('hiddenmenus', JSON.stringify(idArray));
5708
+ if(localStorage && !bNoSave) localStorage.setItem('hiddenmenus', JSON.stringify(idArray));
5709
5709
  }
5710
5710
 
5711
5711
  getHiddenMenusFromCache() { let me = this.icn3dui; me.icn3d;
@@ -6956,7 +6956,7 @@ class ClickMenu {
6956
6956
 
6957
6957
  let legendHtml = thisClass.setLegendHtml();
6958
6958
  //$("#" + me.pre + "legend").html(legendHtml).show();
6959
- $("#" + me.pre + "dl_legend").html(legendHtml);
6959
+ $("#" + me.pre + "dl_legend_html").html(legendHtml);
6960
6960
  me.htmlCls.dialogCls.openDlg('dl_legend', 'Color range');
6961
6961
 
6962
6962
  ic.addTrackCls.setCustomFile('color', ic.startColor, ic.midColor, ic.endColor);
@@ -7045,6 +7045,12 @@ class ClickMenu {
7045
7045
  thisClass.setLogCmd('color ig strand', true);
7046
7046
  });
7047
7047
 
7048
+ me.myEventCls.onIds("#" + me.pre + "mn4_clrIgproto", "click", function(e) { let ic = me.icn3d; //e.preventDefault();
7049
+ //ic.legendClick = 6;
7050
+ ic.setOptionCls.setOption('color', 'ig protodomain');
7051
+ thisClass.setLogCmd('color ig protodomain', true);
7052
+ });
7053
+
7048
7054
 
7049
7055
  me.myEventCls.onIds("#" + me.pre + "mn4_clrArea", "click", function(e) { me.icn3d; //e.preventDefault();
7050
7056
  me.htmlCls.dialogCls.openDlg('dl_colorbyarea', "Color based on residue's solvent accessibility");
@@ -7302,11 +7308,27 @@ class ClickMenu {
7302
7308
  me.myEventCls.onIds("#" + me.pre + "mn6_igrefYes", "click", async function(e) { let ic = me.icn3d; //e.preventDefault();
7303
7309
  thisClass.setLogCmd('ig refnum on', true);
7304
7310
  await ic.refnumCls.showIgRefNum();
7311
+
7312
+ if(ic.bShowRefnum) {
7313
+ ic.opts.color = 'ig strand';
7314
+ ic.setColorCls.setColorByOptions(ic.opts, ic.atoms);
7315
+
7316
+ ic.selectionCls.selectAll_base();
7317
+ ic.hlUpdateCls.updateHlAll();
7318
+ ic.drawCls.draw();
7319
+ }
7305
7320
  });
7306
7321
 
7307
7322
  me.myEventCls.onIds("#" + me.pre + "mn6_igrefNo", "click", async function(e) { let ic = me.icn3d; //e.preventDefault();
7308
7323
  thisClass.setLogCmd('ig refnum off', true);
7309
7324
  await ic.refnumCls.hideIgRefNum();
7325
+
7326
+ ic.opts.color = 'chain';
7327
+ ic.setColorCls.setColorByOptions(ic.opts, ic.atoms);
7328
+
7329
+ ic.selectionCls.selectAll_base();
7330
+ ic.hlUpdateCls.updateHlAll();
7331
+ ic.drawCls.draw();
7310
7332
  });
7311
7333
 
7312
7334
 
@@ -9361,7 +9383,9 @@ class SetMenu {
9361
9383
  html += this.getRadio('mn4_clr', 'mn4_clrConfidence', 'AlphaFold<br><span style="padding-left:1.5em;">Confidence</span>', undefined, 1, 1);
9362
9384
  //}
9363
9385
 
9364
- html += this.getRadio('mn4_clr', 'mn4_clrIgstrand', 'Ig Strand', undefined, undefined, 2);
9386
+ //!!!
9387
+ //!!!html += this.getRadio('mn4_clr', 'mn4_clrIgstrand', 'Ig Strand', undefined, undefined, 2);
9388
+ //!!!html += this.getRadio('mn4_clr', 'mn4_clrIgproto', 'Ig Protodomain', undefined, undefined, 2);
9365
9389
  }
9366
9390
  else {
9367
9391
  //if(!me.cfg.hidelicense) html += this.getRadio('mn4_clr', 'mn1_delphi2', 'DelPhi<br><span style="padding-left:1.5em;">Potential ' + me.htmlCls.licenseStr + '</span>');
@@ -9442,14 +9466,15 @@ class SetMenu {
9442
9466
 
9443
9467
  html += this.getLink('mn6_contactmap', 'Contact Map', undefined, 1);
9444
9468
 
9445
- if(!me.cfg.notebook) {
9469
+ //if(!me.cfg.notebook) {
9446
9470
  html += this.getLink('mn1_mutation', 'Mutation ' + me.htmlCls.wifiStr, 1, 1);
9447
- }
9471
+ //}
9448
9472
 
9449
9473
  //html += this.getMenuSep();
9450
9474
  }
9451
9475
 
9452
- if(!me.cfg.notebook && !me.cfg.hidelicense) {
9476
+ //if(!me.cfg.notebook && !me.cfg.hidelicense) {
9477
+ if(!me.cfg.hidelicense) {
9453
9478
  html += this.getMenuText('mn1_delphiwrap', 'DelPhi Potential', undefined, 1, 1);
9454
9479
 
9455
9480
  html += "<ul>";
@@ -9580,12 +9605,13 @@ class SetMenu {
9580
9605
  html += this.getMenuText('mn6_igrefwrap', 'Ref. Number', undefined, undefined, 1);
9581
9606
 
9582
9607
  html += "<ul>";
9583
-
9608
+ //!!!
9609
+ /*
9584
9610
  html += this.getLink('mn6_igrefYes', 'Show Ig Ref. Number', undefined, 2);
9585
9611
  html += this.getLink('mn6_igrefNo', 'Hide Ig Ref. Number', undefined, 2);
9586
9612
 
9587
9613
  html += this.getMenuSep();
9588
-
9614
+ */
9589
9615
  html += this.getLink('mn6_customref', 'Custom Ref. Number', undefined, 2);
9590
9616
  html += "</ul>";
9591
9617
  html += "</li>";
@@ -10262,6 +10288,7 @@ class Dialog {
10262
10288
 
10263
10289
  if(id === me.pre + 'dl_selectannotations' || id === me.pre + 'dl_graph' || id === me.pre + 'dl_linegraph' || id === me.pre + 'dl_scatterplot' || id === me.pre + 'dl_contactmap' || id === me.pre + 'dl_alignerrormap' || id === me.pre + 'dl_interactionsorted' || id === me.pre + 'dl_alignment') {
10264
10290
  $( "#" + id ).show();
10291
+ $( "#" + id + "_nb").show();
10265
10292
 
10266
10293
  height =(me.htmlCls.HEIGHT) * 0.5;
10267
10294
 
@@ -10306,7 +10333,10 @@ class Dialog {
10306
10333
  });
10307
10334
  }
10308
10335
  else {
10309
- if(ic.bRender) $( "#" + id ).show();
10336
+ if(ic.bRender) {
10337
+ $( "#" + id ).show();
10338
+ $( "#" + id + "_nb").show();
10339
+ }
10310
10340
 
10311
10341
  height = 'auto';
10312
10342
  width = 'auto';
@@ -10356,6 +10386,18 @@ class SetDialog {
10356
10386
  return html;
10357
10387
  }
10358
10388
 
10389
+ addNotebookTitle(id, title, bAddExtraDiv) { let me = this.icn3dui; me.icn3d;
10390
+ //return '<div id="' + me.pre + id + '_nb" style="display:none; background-color:#1c94c4; width:100%"><span style="color:white; font-weight:bold">' + title + '</span>&nbsp;&nbsp;&nbsp;<span onclick="$(\'#' + me.pre + id + '\').hide(); return false;" class="icn3d-nbclose" title="Close">x</span></div>';
10391
+
10392
+ let html = '<div id="' + me.pre + id + '_nb" style="display:none; background-color:#5C9CCC; width:100%"><span style="color:white; font-weight:bold">' + title + '</span>&nbsp;&nbsp;&nbsp;<div onclick="$(\'#' + me.pre + id + '\').hide(); return false;" class="icn3d-nbclose ui-icon ui-icon-close" title="Close"></div></div>';
10393
+
10394
+ if(bAddExtraDiv) {
10395
+ html += '<div id="' + me.pre + id + '_html"></div>';
10396
+ }
10397
+
10398
+ return html;
10399
+ }
10400
+
10359
10401
  //Set the html for all popup dialogs.
10360
10402
  setDialogs() { let me = this.icn3dui, ic = me.icn3d;
10361
10403
  if(me.bNode) return '';
@@ -10370,12 +10412,15 @@ class SetDialog {
10370
10412
 
10371
10413
  let divClass =(me.cfg.notebook) ? '' : 'icn3d-hidden';
10372
10414
  let dialogClass =(me.cfg.notebook) ? 'icn3d-hidden' : '';
10373
- html += me.htmlCls.divStr + "alldialogs' class='" + divClass + " icn3d-dialog'>";
10415
+ //html += me.htmlCls.divStr + "alldialogs' class='" + divClass + " icn3d-dialog' style='margin-top:" + me.htmlCls.CMD_HEIGHT + "px'>";
10416
+ html += me.htmlCls.divStr + "alldialogs' class='" + divClass + " icn3d-dialog' style='margin-top:12px'>";
10374
10417
 
10375
10418
  html += me.htmlCls.divStr + "dl_2ddgm' class='" + dialogClass + " icn3d-dl_2ddgm' style='background-color:white'>";
10419
+ html += this.addNotebookTitle('dl_2ddgm', '2D Diagram', true);
10376
10420
  html += "</div>";
10377
10421
 
10378
10422
  html += me.htmlCls.divStr + "dl_2dctn' class='" + dialogClass + " icn3d-dl_2dctn' style='background-color:white'>";
10423
+ html += this.addNotebookTitle('dl_2dctn', '2D Cartoon');
10379
10424
 
10380
10425
  me.svgid_ct = me.pre + "icn3d_cartoon";
10381
10426
 
@@ -10403,14 +10448,17 @@ class SetDialog {
10403
10448
 
10404
10449
  // if(me.cfg.align !== undefined || me.cfg.chainalign !== undefined || ic.bRealign || ic.bSymd) {
10405
10450
  html += me.htmlCls.divStr + "dl_alignment' class='" + dialogClass + "' style='background-color:white;'>";
10451
+ html += this.addNotebookTitle('dl_alignment', 'Dynamically Calculated Symmetry using SymD');
10406
10452
  html += me.htmlCls.divStr + "symd_info'></div>";
10407
10453
  html += me.htmlCls.divStr + "alignseqguide_wrapper'><br>" + me.htmlCls.setHtmlCls.setAlignSequenceGuide() + "</div>";
10408
10454
  html += me.htmlCls.divStr + "dl_sequence2' class='icn3d-dl_sequence'>";
10455
+ html += this.addNotebookTitle('dl_sequence2', 'Select Residues in Aligned Sequences');
10409
10456
  html += "</div>";
10410
10457
  html += "</div>";
10411
10458
  // }
10412
10459
 
10413
10460
  html += me.htmlCls.divStr + "dl_definedsets' class='" + dialogClass + "'>";
10461
+ html += this.addNotebookTitle('dl_definedsets', 'Defined Sets');
10414
10462
  html += me.htmlCls.divStr + "dl_setsmenu'>";
10415
10463
  html += "<b>Defined Sets:</b> <br/>";
10416
10464
  html += "<select id='" + me.pre + "atomsCustom' multiple size='6' style='min-width:130px;'>";
@@ -10434,12 +10482,14 @@ class SetDialog {
10434
10482
  html += me.htmlCls.setHtmlCls.setAdvanced(2);
10435
10483
 
10436
10484
  html += me.htmlCls.divStr + "dl_vastplus' class='" + dialogClass + "' style='max-width:500px'>";
10485
+ html += this.addNotebookTitle('dl_vastplus', 'Please input PDB ID for VAST+');
10437
10486
  html += "Note: <b>VAST+</b> finds other macromolecular structures that have a similar biological unit. To do this, VAST+ takes into consideration the complete set of 3D domains that VAST identified within a query structure, throughout all of its component protein molecules, and finds other macromolecular structures that have a similar set of proteins/3D domains.<br><br>";
10438
10487
  html += "PDB ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "vastpluspdbid' value='6VXX' size=8><br>";
10439
10488
  html += me.htmlCls.buttonStr + "reload_vastplus'>VAST+</button>";
10440
10489
  html += "</div>";
10441
10490
 
10442
10491
  html += me.htmlCls.divStr + "dl_vast' class='" + dialogClass + "' style='max-width:500px'>";
10492
+ html += this.addNotebookTitle('dl_vast', 'Pleaes input chain or PDB file for VAST');
10443
10493
  html += 'Note: <b>VAST</b> identifies 3D domains (substructures) within each protein structure in the Molecular Modeling Database (MMDB), and then finds other protein structures that have one or more similar 3D domains, using purely geometric criteria. You have two ways to do a VAST search.<br><br>';
10444
10494
 
10445
10495
  html += '<b>Optione 1</b>, search with your selection (all residues are selected by default) in the loaded structures:<br>';
@@ -10468,6 +10518,7 @@ class SetDialog {
10468
10518
  html += "</div>";
10469
10519
 
10470
10520
  html += me.htmlCls.divStr + "dl_foldseek' class='" + dialogClass + "' style='max-width:500px'>";
10521
+ html += this.addNotebookTitle('dl_foldseek', 'Submit your selection to Foldseek');
10471
10522
  html += '1. <input type="submit" id="' + me.pre + 'fssubmit" name="fssubmit" value="Submit"></input> your selection (all residues are selected by default) in the loaded structures to <a href="https://search.foldseek.com/search" target="_blank">Foldseek</a> web server.<br><br>';
10472
10523
  html += '2 (Optional). Once you see the structure neighbors, you can view the alignment in iCn3D by inputing a list of PDB chain IDs or AlphaFold UniProt IDs below. <br><br>The PDB chain IDs are the same as the record names such as "1HHO_A". The UniProt ID is the text between "AF-" and "-F1". For example, the UniProt ID for the record name "AF-P69905-F1-model_v4" is "P69905".<br><br>';
10473
10524
 
@@ -10476,16 +10527,19 @@ class SetDialog {
10476
10527
  html += "</div>";
10477
10528
 
10478
10529
  html += me.htmlCls.divStr + "dl_mmtfid' class='" + dialogClass + "'>";
10530
+ html += this.addNotebookTitle('dl_mmtfid', 'Please input an MMTF ID');
10479
10531
  html += "MMTF ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "mmtfid' value='1TUP' size=8> ";
10480
10532
  html += me.htmlCls.buttonStr + "reload_mmtf'>Load</button>";
10481
10533
  html += "</div>";
10482
10534
 
10483
10535
  html += me.htmlCls.divStr + "dl_pdbid' class='" + dialogClass + "'>";
10536
+ html += this.addNotebookTitle('dl_pdbid', 'Please input a PDB ID');
10484
10537
  html += "PDB ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "pdbid' value='1TUP' size=8> ";
10485
10538
  html += me.htmlCls.buttonStr + "reload_pdb'>Load</button>";
10486
10539
  html += "</div>";
10487
10540
 
10488
10541
  html += me.htmlCls.divStr + "dl_afid' class='" + dialogClass + "'>";
10542
+ html += this.addNotebookTitle('dl_afid', 'Please input an AlphaFold UniProt ID');
10489
10543
  html += "Note: AlphaFold produces a per-residue confidence score (pLDDT) between 0 and 100:<br>";
10490
10544
  html += me.htmlCls.clickMenuCls.setAlphaFoldLegend() + "<br>";
10491
10545
 
@@ -10498,27 +10552,32 @@ class SetDialog {
10498
10552
  html += "</div>";
10499
10553
 
10500
10554
  html += me.htmlCls.divStr + "dl_refseqid' class='" + dialogClass + "'>";
10555
+ html += this.addNotebookTitle('dl_refseqid', 'Please input an NCBI protein accession');
10501
10556
  html += "NCBI Protein Accession: " + me.htmlCls.inputTextStr + "id='" + me.pre + "refseqid' value='NP_001743.1' size=8> ";
10502
10557
  html += me.htmlCls.buttonStr + "reload_refseq'>Load</button>";
10503
10558
  html += "</div>";
10504
10559
 
10505
10560
  html += me.htmlCls.divStr + "dl_opmid' class='" + dialogClass + "'>";
10561
+ html += this.addNotebookTitle('dl_opmid', 'Please input an OPM PDB ID');
10506
10562
  html += "<a href='https://opm.phar.umich.edu' target='_blank'>Orientations of Proteins in Membranes(OPM)</a> PDB ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "opmid' value='6JXR' size=8> ";
10507
10563
  html += me.htmlCls.buttonStr + "reload_opm'>Load</button>";
10508
10564
  html += "</div>";
10509
10565
 
10510
10566
  html += me.htmlCls.divStr + "dl_pdbfile' class='" + dialogClass + "'>";
10567
+ html += this.addNotebookTitle('dl_pdbfile', 'Please input a PDB file');
10511
10568
  html += "Note: Several PDB files could be concatenated into a single PDB file. Use the line \"ENDMDL\" to separate PDB files.<br><br>";
10512
10569
  html += "PDB File: " + me.htmlCls.inputFileStr + " id='" + me.pre + "pdbfile' size=8> ";
10513
10570
  html += me.htmlCls.buttonStr + "reload_pdbfile'>Load</button>";
10514
10571
  html += "</div>";
10515
10572
 
10516
10573
  html += me.htmlCls.divStr + "dl_pdbfile_app' class='" + dialogClass + "'>";
10574
+ html += this.addNotebookTitle('dl_pdbfile_app', 'Please append PDB files');
10517
10575
  html += "Multiple PDB Files: <input type='file' multiple id='" + me.pre + "pdbfile_app' size=8> ";
10518
10576
  html += me.htmlCls.buttonStr + "reload_pdbfile_app'>Append</button>";
10519
10577
  html += "</div>";
10520
10578
 
10521
10579
  html += me.htmlCls.divStr + "dl_rescolorfile' class='" + dialogClass + "'>";
10580
+ html += this.addNotebookTitle('dl_rescolorfile', 'Please input a residue color file');
10522
10581
  html += '<div style="width:450px;">The custom JSON file on residue colors has the following format for proteins("ALA" and "ARG") and nucleotides("G" and "A"):<br>';
10523
10582
  html += '{"ALA":"#C8C8C8", "ARG":"#145AFF", ..., "G":"#008000", "A":"#6080FF", ...}</div><br>';
10524
10583
  html += "Residue Color File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "rescolorfile' size=8> ";
@@ -10526,6 +10585,7 @@ class SetDialog {
10526
10585
  html += "</div>";
10527
10586
 
10528
10587
  html += me.htmlCls.divStr + "dl_customcolor' class='" + dialogClass + "'>";
10588
+ html += this.addNotebookTitle('dl_customcolor', 'Please input a custom color file');
10529
10589
  html += " <input type='hidden' id='" + me.pre + "customcolor_chainid' value=''>";
10530
10590
  html += '<div style="width:450px;">The custom file for the structure has two columns separated by space or tab: ';
10531
10591
  html += 'residue number, and score in the range of 0-100. If you click "Apply Custom Color" button, ';
@@ -10553,6 +10613,7 @@ class SetDialog {
10553
10613
  html += "</div>";
10554
10614
 
10555
10615
  html += me.htmlCls.divStr + "dl_customref' class='" + dialogClass + "'>";
10616
+ html += this.addNotebookTitle('dl_customref', 'Please input a reference number file');
10556
10617
  html += '<div style="width:550px;">You can define your own reference numbers in a custom file using Excel, and then export it as a CSV file. An example file is shown below with cells separated by commas.<br>';
10557
10618
  html += '<pre>refnum,11,12,,21,22,,10C,11C,20C<br>';
10558
10619
  html += '1TUP_A,100,101,,,132,,,,<br>';
@@ -10566,17 +10627,20 @@ class SetDialog {
10566
10627
  html += "</div>";
10567
10628
 
10568
10629
  html += me.htmlCls.divStr + "dl_align' class='" + dialogClass + "'>";
10630
+ html += this.addNotebookTitle('dl_align', 'Please select residues in aligned sequences');
10569
10631
  html += "Enter the PDB IDs or MMDB IDs of the structures: <br/><br/>ID1: " + me.htmlCls.inputTextStr + "id='" + me.pre + "alignid1' value='2DN3' size=8>" + me.htmlCls.space3 + me.htmlCls.space3 + "ID2: " + me.htmlCls.inputTextStr + "id='" + me.pre + "alignid2' value='4N7N' size=8><br/><br/>";
10570
10632
  html += "<b>VAST+ based on VAST</b>: " + me.htmlCls.buttonStr + "reload_align_ori'>All Matching Molecules Superposed</button>" + me.htmlCls.space3 + me.htmlCls.buttonStr + "reload_align_refined'>Invariant Substructure Superposed</button><br><br>";
10571
10633
  html += "<b>VAST+ based on TM-align</b>: " + me.htmlCls.buttonStr + "reload_align_tmalign'>All Matching Molecules Superposed</button><br><br>";
10572
10634
  html += "</div>";
10573
10635
 
10574
10636
  html += me.htmlCls.divStr + "dl_alignaf' class='" + dialogClass + "'>";
10637
+ html += this.addNotebookTitle('dl_alignaf', 'Align AlphaFold structures');
10575
10638
  html += "Enter two <a href='https://alphafold.ebi.ac.uk/' target='_blank'>AlphaFold Uniprot</a> IDs: <br/><br/>ID1: " + me.htmlCls.inputTextStr + "id='" + me.pre + "alignafid1' value='P41327' size=8>" + me.htmlCls.space3 + me.htmlCls.space3 + "ID2: " + me.htmlCls.inputTextStr + "id='" + me.pre + "alignafid2' value='P41331' size=8><br/><br/>";
10576
10639
  html += me.htmlCls.buttonStr + "reload_alignaf_tmalign'>Align with TM-align</button>" + me.htmlCls.buttonStr + "reload_alignaf' style='margin-left:30px'>Align with VAST</button>";
10577
10640
  html += "</div>";
10578
10641
 
10579
10642
  html += me.htmlCls.divStr + "dl_chainalign' class='" + dialogClass + "'>";
10643
+ html += this.addNotebookTitle('dl_chainalign', 'Align chains');
10580
10644
  html += "<div style='width:550px'>";
10581
10645
  html += "All chains will be aligned to the first chain in the comma-separated chain IDs. Each chain ID has the form of PDBID_chain (e.g., 1HHO_A, case sensitive) or UniprotID (e.g., P69905 for AlphaFold structures).<br/><br/>";
10582
10646
  html += "<b>Chain IDs</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "chainalignids' value='P69905,P01942,1HHO_A' size=50><br/><br/>";
@@ -10586,6 +10650,7 @@ class SetDialog {
10586
10650
  html += "</div></div>";
10587
10651
 
10588
10652
  html += me.htmlCls.divStr + "dl_chainalign2' class='" + dialogClass + "'>";
10653
+ html += this.addNotebookTitle('dl_chainalign2', 'Align chains');
10589
10654
  html += "<div style='width:550px'>";
10590
10655
  html += "All chains will be aligned to the first chain in the comma-separated chain IDs. Each chain ID has the form of PDBID_chain (e.g., 1HHO_A, case sensitive) or UniprotID (e.g., P69905 for AlphaFold structures).<br/><br/>";
10591
10656
  html += "<b>Chain IDs</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "chainalignids2' value='P69905,P01942,1HHO_A' size=50><br/><br/>";
@@ -10597,11 +10662,13 @@ class SetDialog {
10597
10662
  html += "</div></div>";
10598
10663
 
10599
10664
  html += me.htmlCls.divStr + "dl_chainalign3' class='" + dialogClass + "'>";
10665
+ html += this.addNotebookTitle('dl_chainalign3', 'Align chains');
10600
10666
  html += "<div style='width:550px'>";
10601
10667
  html += this.getHtmlAlignResidueByResidue('chainalignids3', 'predefinedres', 'reload_chainalign_asym3');
10602
10668
  html += "</div></div>";
10603
10669
 
10604
10670
  html += me.htmlCls.divStr + "dl_realignresbyres' class='" + dialogClass + "'>";
10671
+ html += this.addNotebookTitle('dl_realignresbyres', 'Realign residue by residue');
10605
10672
  html += "<div style='width:550px'>";
10606
10673
  html += "<b>Option 1</b>: " + me.htmlCls.buttonStr + "realignSelection'><b>Realign Current Selection Residue by Residue</b></button><br/><br/>";
10607
10674
  html += "<b>Option 2</b>: <br>";
@@ -10609,6 +10676,7 @@ class SetDialog {
10609
10676
  html += "</div></div>";
10610
10677
 
10611
10678
  html += me.htmlCls.divStr + "dl_mutation' class='" + dialogClass + "'>";
10679
+ html += this.addNotebookTitle('dl_mutation', 'Mutation analysis');
10612
10680
  html += "<div style='width:500px'>";
10613
10681
  html += 'Please specify the mutations with a comma separated mutation list. Each mutation can be specified as "[<b>uppercase</b> PDB ID or AlphaFold UniProt ID]_[Chain Name]_[Residue Number]_[One Letter Mutant Residue]". E.g., the mutation of N501Y in the E chain of PDB 6M0J can be specified as "6M0J_E_501_Y". For AlphaFold structures, the "Chain ID" is "A".<br/>If you load a custom structure without PDB or UniProt ID, you can open "Seq. & Annotations" window and find the chain ID such as "stru_A". The part before the underscore is the structure ID, which can be used to specify the mutation such as "stru_A_...". Remember to choose "Show Mutation in: Current Page".<br/><br/>';
10614
10682
  html += "<div style='display:inline-block; width:110px'>Mutations: </div>" + me.htmlCls.inputTextStr + "id='" + me.pre + "mutationids' value='6M0J_E_484_K,6M0J_E_501_Y,6M0J_E_417_N' size=50><br/><br/>";
@@ -10627,25 +10695,30 @@ class SetDialog {
10627
10695
  html += "<br/><br/></div></div>";
10628
10696
 
10629
10697
  html += me.htmlCls.divStr + "dl_mol2file' class='" + dialogClass + "'>";
10698
+ html += this.addNotebookTitle('dl_mol2file', 'Please input a Mol2 file');
10630
10699
  html += "Mol2 File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "mol2file' size=8> ";
10631
10700
  html += me.htmlCls.buttonStr + "reload_mol2file'>Load</button>";
10632
10701
  html += "</div>";
10633
10702
  html += me.htmlCls.divStr + "dl_sdffile' class='" + dialogClass + "'>";
10703
+ html += this.addNotebookTitle('dl_sdffile', 'Please input an SDF file');
10634
10704
  html += "SDF File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "sdffile' size=8> ";
10635
10705
  html += me.htmlCls.buttonStr + "reload_sdffile'>Load</button>";
10636
10706
  html += "</div>";
10637
10707
  html += me.htmlCls.divStr + "dl_xyzfile' class='" + dialogClass + "'>";
10708
+ html += this.addNotebookTitle('dl_xyzfile', 'Please input an XYZ file');
10638
10709
  html += "XYZ File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "xyzfile' size=8> ";
10639
10710
  html += me.htmlCls.buttonStr + "reload_xyzfile'>Load</button>";
10640
10711
  html += "</div>";
10641
10712
 
10642
10713
  html += me.htmlCls.divStr + "dl_afmapfile' class='" + dialogClass + "'>";
10714
+ html += this.addNotebookTitle('dl_afmapfile', 'Please input an AlphaFold PAE file');
10643
10715
  html += "AlphaFold PAE File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "afmapfile' size=8> <br><br>";
10644
10716
  html += me.htmlCls.buttonStr + "reload_afmapfile'>Load Half PAE Map</button>"
10645
10717
  + me.htmlCls.buttonStr + "reload_afmapfilefull' style='margin-left:30px'>Load Full PAE Map (slow)</button>";
10646
10718
  html += "</div>";
10647
10719
 
10648
10720
  html += me.htmlCls.divStr + "dl_urlfile' class='" + dialogClass + "'>";
10721
+ html += this.addNotebookTitle('dl_urlfile', 'Please input a file via URL');
10649
10722
  html += "File type: ";
10650
10723
  html += "<select id='" + me.pre + "filetype'>";
10651
10724
  html += me.htmlCls.optionStr + "'pdb' selected>PDB</option>";
@@ -10661,16 +10734,19 @@ class SetDialog {
10661
10734
  html += "</div>";
10662
10735
 
10663
10736
  html += me.htmlCls.divStr + "dl_mmciffile' class='" + dialogClass + "'>";
10737
+ html += this.addNotebookTitle('dl_mmciffile', 'Please input an mmCIF file');
10664
10738
  html += "mmCIF File: " + me.htmlCls.inputFileStr + "id='" + me.pre + "mmciffile' value='1TUP' size=8> ";
10665
10739
  html += me.htmlCls.buttonStr + "reload_mmciffile'>Load</button>";
10666
10740
  html += "</div>";
10667
10741
 
10668
10742
  html += me.htmlCls.divStr + "dl_mmcifid' class='" + dialogClass + "'>";
10743
+ html += this.addNotebookTitle('dl_mmcifid', 'Please input an mmCIF ID');
10669
10744
  html += "mmCIF ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "mmcifid' value='1TUP' size=8> ";
10670
10745
  html += me.htmlCls.buttonStr + "reload_mmcif'>Load</button>";
10671
10746
  html += "</div>";
10672
10747
 
10673
10748
  html += me.htmlCls.divStr + "dl_mmdbid' class='" + dialogClass + "' style='max-width:500px'>";
10749
+ html += this.addNotebookTitle('dl_mmdbid', 'Please input an MMDB ID');
10674
10750
  html += "MMDB or PDB ID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "mmdbid' value='1TUP' size=8> <br><br>";
10675
10751
  html += me.htmlCls.buttonStr + "reload_mmdb_asym'>Load Asymmetric Unit (All Chains)</button>" + me.htmlCls.buttonStr + "reload_mmdb' style='margin-left:30px'>Load Biological Unit</button><br/><br/><br>";
10676
10752
  html += '<b>Note</b>: The "<b>biological unit</b>" is the <b>biochemically active form of a biomolecule</b>, <div style="width:20px; margin:6px 0 0 20px; display:inline-block;"><span id="'
@@ -10683,6 +10759,7 @@ class SetDialog {
10683
10759
  html += "</div>";
10684
10760
 
10685
10761
  html += me.htmlCls.divStr + "dl_mmdbafid' class='" + dialogClass + "' style='max-width:600px'>";
10762
+ html += this.addNotebookTitle('dl_mmdbafid', 'Please input a list of PDB/AlphaFold IDs');
10686
10763
  html += "List of PDB, MMDB, or AlphaFold UniProt structures: " + me.htmlCls.inputTextStr + "id='" + me.pre + "mmdbafid' placeholder='e.g., 1HHO,4N7N,P69905,P01942' size=30> <br><br>";
10687
10764
  html += "<div style='display:inline-block; width:20px'></div>" + me.htmlCls.buttonStr + "reload_mmdbaf' style='width:150px'>Load Biological Unit</button>" + me.htmlCls.buttonStr + "reload_mmdbaf_asym' style='margin-left:30px; width:250px'>Load Asymmetric Unit (All Chains)</button>" + "<br/><br/>";
10688
10765
  html += "<div style='display:inline-block; width:20px'>or</div>" + me.htmlCls.buttonStr + "reload_mmdbaf_append' style='width:150px'>Append Biological Unit</button>" + me.htmlCls.buttonStr + "reload_mmdbaf_asym_append' style='margin-left:30px; width:250px'>Append Asymmetric Unit (All Chains)</button>" + "<br/><br/>";
@@ -10697,6 +10774,7 @@ class SetDialog {
10697
10774
  html += "</div>";
10698
10775
 
10699
10776
  html += me.htmlCls.divStr + "dl_blast_rep_id' style='max-width:600px;' class='" + dialogClass + "'>";
10777
+ html += this.addNotebookTitle('dl_blast_rep_id', 'Align sequence to structure');
10700
10778
  html += "Enter a Sequence ID (or FASTA sequence) and the aligned protein accession, which can be found using the <a href='https://blast.ncbi.nlm.nih.gov/Blast.cgi?PROGRAM=blastp&PAGE_TYPE=BlastSearch' target='_blank'>BLAST</a> search with the Sequence ID or FASTA sequence as input. If the protein accession is not a PDB chain, the corresponding AlphaFold UniProt structure is used.<br><br> ";
10701
10779
  html += "<b>Sequence ID</b>(NCBI protein accession of a sequence): " + me.htmlCls.inputTextStr + "id='" + me.pre + "query_id' value='NP_001108451.1' size=8><br> ";
10702
10780
  html += "or FASTA sequence: <br><textarea id='" + me.pre + "query_fasta' rows='5' style='width: 100%; height: " +(me.htmlCls.LOG_HEIGHT) + "px; padding: 0px; border: 0px;'></textarea><br><br>";
@@ -10708,32 +10786,38 @@ class SetDialog {
10708
10786
  html += "</div>";
10709
10787
 
10710
10788
  html += me.htmlCls.divStr + "dl_yournote' class='" + dialogClass + "'>";
10789
+ html += this.addNotebookTitle('dl_yournote', 'Your Note');
10711
10790
  html += "Your note will be saved in the HTML file when you click \"File > Save File > iCn3D PNG Image\".<br><br>";
10712
10791
  html += "<textarea id='" + me.pre + "yournote' rows='5' style='width: 100%; height: " +(me.htmlCls.LOG_HEIGHT) + "px; padding: 0px; border: 0px;' placeholder='Enter your note here'></textarea><br>";
10713
10792
  html += me.htmlCls.buttonStr + "applyyournote'>Save</button>";
10714
10793
  html += "</div>";
10715
10794
 
10716
10795
  html += me.htmlCls.divStr + "dl_gi' class='" + dialogClass + "'>";
10796
+ html += this.addNotebookTitle('dl_gi', 'Please input an NCBI gi');
10717
10797
  html += "Protein gi: " + me.htmlCls.inputTextStr + "id='" + me.pre + "gi' value='1310960' size=8> ";
10718
10798
  html += me.htmlCls.buttonStr + "reload_gi'>Load</button>";
10719
10799
  html += "</div>";
10720
10800
 
10721
10801
  html += me.htmlCls.divStr + "dl_cid' class='" + dialogClass + "'>";
10802
+ html += this.addNotebookTitle('dl_cid', 'Please input a PubChem CID');
10722
10803
  html += "PubChem CID: " + me.htmlCls.inputTextStr + "id='" + me.pre + "cid' value='2244' size=8> ";
10723
10804
  html += me.htmlCls.buttonStr + "reload_cid'>Load</button>";
10724
10805
  html += "</div>";
10725
10806
 
10726
10807
  html += me.htmlCls.divStr + "dl_pngimage' class='" + dialogClass + "'>";
10808
+ html += this.addNotebookTitle('dl_pngimage', 'Please input an iCn3D PNG Image file');
10727
10809
  html += "iCn3D PNG image: " + me.htmlCls.inputFileStr + "id='" + me.pre + "pngimage'><br/>";
10728
10810
  html += me.htmlCls.buttonStr + "reload_pngimage' style='margin-top: 6px;'>Load</button>";
10729
10811
  html += "</div>";
10730
10812
 
10731
10813
  html += me.htmlCls.divStr + "dl_state' class='" + dialogClass + "'>";
10814
+ html += this.addNotebookTitle('dl_state', 'Please input a state file');
10732
10815
  html += "State file: " + me.htmlCls.inputFileStr + "id='" + me.pre + "state'><br/>";
10733
10816
  html += me.htmlCls.buttonStr + "reload_state' style='margin-top: 6px;'>Load</button>";
10734
10817
  html += "</div>";
10735
10818
 
10736
10819
  html += me.htmlCls.divStr + "dl_fixedversion' style='max-width:500px' class='" + dialogClass + "'>";
10820
+ html += this.addNotebookTitle('dl_fixedversion', 'Use fixed version of iCn3D');
10737
10821
  html += "Since January 6, 2021, you can show the original view with the archived version of iCn3D by pasting your URL below and click \"Show Originial View\". Note the version in the parameter \"v\" was used to replace \"full.html\" with \"full_[v].html\" in the URL.<br><br>";
10738
10822
  html += "Share Link URL: " + me.htmlCls.inputTextStr + "id='" + me.pre + "sharelinkurl' size=60><br>";
10739
10823
  html += me.htmlCls.buttonStr + "reload_fixedversion'>Show Original View</button><br><br>";
@@ -10741,16 +10825,19 @@ class SetDialog {
10741
10825
 
10742
10826
 
10743
10827
  html += me.htmlCls.divStr + "dl_selection' class='" + dialogClass + "'>";
10828
+ html += this.addNotebookTitle('dl_selection', 'Load a selection file');
10744
10829
  html += "Selection file: " + me.htmlCls.inputFileStr + "id='" + me.pre + "selectionfile'><br/>";
10745
10830
  html += me.htmlCls.buttonStr + "reload_selectionfile' style='margin-top: 6px;'>Load</button>";
10746
10831
  html += "</div>";
10747
10832
 
10748
10833
  html += me.htmlCls.divStr + "dl_menuloadpref' class='" + dialogClass + "'>";
10834
+ html += this.addNotebookTitle('dl_menuloadpref', 'Load a preference file');
10749
10835
  html += "Preference file: " + me.htmlCls.inputFileStr + "id='" + me.pre + "menupreffile'><br/>";
10750
10836
  html += me.htmlCls.buttonStr + "reload_menupreffile' style='margin-top: 6px;'>Load</button>";
10751
10837
  html += "</div>";
10752
10838
 
10753
10839
  html += me.htmlCls.divStr + "dl_dsn6' class='" + dialogClass + "'>";
10840
+ html += this.addNotebookTitle('dl_dsn6', 'Load a DSN6 file');
10754
10841
  html += "<b>Note</b>: Always load a PDB file before loading DSN6 files. <br/><br/><br/>";
10755
10842
 
10756
10843
  html += "<span style='white-space:nowrap;font-weight:bold;'>2fofc contour at: <select id='" + me.pre + "dsn6sigma2fofc'>";
@@ -10773,6 +10860,7 @@ class SetDialog {
10773
10860
  html += "</div>";
10774
10861
 
10775
10862
  html += me.htmlCls.divStr + "dl_dsn6url' class='" + dialogClass + "'>";
10863
+ html += this.addNotebookTitle('dl_dsn6url', 'Load a selection file via a URL');
10776
10864
  html += "<b>Note</b>: Always load a PDB file before loading DSN6 files. <br/><br/><br/>";
10777
10865
 
10778
10866
  html += "<span style='white-space:nowrap;font-weight:bold;'>2fofc contour at: <select id='" + me.pre + "dsn6sigmaurl2fofc'>";
@@ -10794,6 +10882,7 @@ class SetDialog {
10794
10882
  html += "</div>";
10795
10883
 
10796
10884
  html += me.htmlCls.divStr + "dl_clr' class='" + dialogClass + "'>";
10885
+ html += this.addNotebookTitle('dl_clr', 'Pick a color');
10797
10886
  html += "Click in the input box to use the color picker:<br><br> ";
10798
10887
  html += "Custom Color: " + me.htmlCls.inputTextStr + "id='" + me.pre + "colorcustom' value='FF0000' size=8> ";
10799
10888
  html += me.htmlCls.buttonStr + "applycustomcolor'>Apply</button>";
@@ -10805,6 +10894,7 @@ class SetDialog {
10805
10894
  html += me.htmlCls.setHtmlCls.getPotentialHtml('url', dialogClass);
10806
10895
 
10807
10896
  html += me.htmlCls.divStr + "dl_symmetry' class='" + dialogClass + "'><br>";
10897
+ html += this.addNotebookTitle('dl_symmetry', 'Symmetry');
10808
10898
  html += me.htmlCls.divNowrapStr + "Symmetry: <select id='" + me.pre + "selectSymmetry'>";
10809
10899
  html += "</select>" + me.htmlCls.space3;
10810
10900
  html += me.htmlCls.buttonStr + "applysymmetry'>Apply</button>" + me.htmlCls.space3;
@@ -10812,10 +10902,12 @@ class SetDialog {
10812
10902
  html += "</div>";
10813
10903
 
10814
10904
  html += me.htmlCls.divStr + "dl_symd' style='max-width:400px' class='" + dialogClass + "'><br>";
10905
+ html += this.addNotebookTitle('dl_symd', 'Dynamically symmetry calculation using SymD');
10815
10906
 
10816
10907
  html += "</div>";
10817
10908
 
10818
10909
  html += me.htmlCls.divStr + "dl_contact' class='" + dialogClass + "'>";
10910
+ html += this.addNotebookTitle('dl_contact', 'Contact Map');
10819
10911
  html += "<span style='white-space:nowrap;font-weight:bold;'>Distance: <select id='" + me.pre + "contactdist'>";
10820
10912
  html += me.htmlCls.setHtmlCls.getOptionHtml(['4', '5', '6', '7', '8', '9', '10'], 4);
10821
10913
  html += "</select></span>";
@@ -10828,6 +10920,7 @@ class SetDialog {
10828
10920
  html += "</div>";
10829
10921
 
10830
10922
  html += me.htmlCls.divStr + "dl_hbonds' class='" + dialogClass + "'>";
10923
+ html += this.addNotebookTitle('dl_hbonds', 'Interaction Analysis');
10831
10924
  html += "1. Choose interaction types and their thresholds:<br>";
10832
10925
  html += "<div class='icn3d-box'><table border=0 width=450><tr>";
10833
10926
  html += "<td style='white-space:nowrap'>" + me.htmlCls.inputCheckStr + "id='" + me.pre + "analysis_hbond' checked>Hydrogen Bonds <span style='background-color:#" + me.htmlCls.hbondColor + "'>" + me.htmlCls.space3 + "</span></td>";
@@ -10926,6 +11019,7 @@ class SetDialog {
10926
11019
  html += "</div>";
10927
11020
 
10928
11021
  html += me.htmlCls.divStr + "dl_realign' class='" + dialogClass + "'>";
11022
+ html += this.addNotebookTitle('dl_realign', 'Realign by sequence');
10929
11023
 
10930
11024
  html += me.htmlCls.divNowrapStr + "1. Select sets below <br>or use your current selection:</div><br>";
10931
11025
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomRealign' multiple size='5' style='min-width:130px;'>";
@@ -10935,6 +11029,7 @@ class SetDialog {
10935
11029
  html += "</div>";
10936
11030
 
10937
11031
  html += me.htmlCls.divStr + "dl_realignbystruct' class='" + dialogClass + "' style='max-width:500px'>";
11032
+ html += this.addNotebookTitle('dl_realignbystruct', 'Realign by structure');
10938
11033
 
10939
11034
  //html += "<div><b>1</b>. There are two options to align chains. Option \"a\" is to select a list of chains below, and align all chains to the first chain. Option \"b\" is to select sets below or use your current selection, and align all chains pairwise.</div><br>";
10940
11035
  html += "<div><b>1</b>. Select sets below or use your current selection.</div><br>";
@@ -10950,6 +11045,7 @@ class SetDialog {
10950
11045
  html += "</div>";
10951
11046
 
10952
11047
  html += me.htmlCls.divStr + "dl_realigntwostru' class='" + dialogClass + "'>";
11048
+ html += this.addNotebookTitle('dl_realigntwostru', 'Realign two structure complexes');
10953
11049
 
10954
11050
  html += me.htmlCls.divNowrapStr + "1. Select sets below or use your current selection:</div><br>";
10955
11051
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomRealignByStruct2' multiple size='5' style='min-width:130px;'>";
@@ -10962,6 +11058,7 @@ class SetDialog {
10962
11058
 
10963
11059
 
10964
11060
  html += me.htmlCls.divStr + "dl_colorspectrumacrosssets' class='" + dialogClass + "'>";
11061
+ html += this.addNotebookTitle('dl_colorspectrumacrosssets', 'Set color spectrum across sets');
10965
11062
 
10966
11063
  html += me.htmlCls.divNowrapStr + "1. Select sets below:</div><br>";
10967
11064
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomColorSpectrumAcross' multiple size='5' style='min-width:130px;'>";
@@ -10972,7 +11069,7 @@ class SetDialog {
10972
11069
 
10973
11070
 
10974
11071
  html += me.htmlCls.divStr + "dl_colorspectrumbysets' class='" + dialogClass + "'>";
10975
-
11072
+ html += this.addNotebookTitle('dl_colorspectrumbysets', 'Set color spectrum for residues in sets');
10976
11073
  html += me.htmlCls.divNowrapStr + "1. Select sets below:</div><br>";
10977
11074
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomColorSpectrum' multiple size='5' style='min-width:130px;'>";
10978
11075
  html += "</select></div>";
@@ -10982,7 +11079,7 @@ class SetDialog {
10982
11079
 
10983
11080
 
10984
11081
  html += me.htmlCls.divStr + "dl_colorrainbowacrosssets' class='" + dialogClass + "'>";
10985
-
11082
+ html += this.addNotebookTitle('dl_colorrainbowacrosssets', 'Set color rainbow across sets');
10986
11083
  html += me.htmlCls.divNowrapStr + "1. Select sets below:</div><br>";
10987
11084
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomColorRainbowAcross' multiple size='5' style='min-width:130px;'>";
10988
11085
  html += "</select></div>";
@@ -10992,7 +11089,7 @@ class SetDialog {
10992
11089
 
10993
11090
 
10994
11091
  html += me.htmlCls.divStr + "dl_colorrainbowbysets' class='" + dialogClass + "'>";
10995
-
11092
+ html += this.addNotebookTitle('dl_colorrainbowbysets', 'Set color rainbow for residues in sets');
10996
11093
  html += me.htmlCls.divNowrapStr + "1. Select sets below:</div><br>";
10997
11094
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomColorRainbow' multiple size='5' style='min-width:130px;'>";
10998
11095
  html += "</select></div>";
@@ -11002,12 +11099,15 @@ class SetDialog {
11002
11099
 
11003
11100
 
11004
11101
  html += me.htmlCls.divStr + "dl_allinteraction' style='background-color:white' class='" + dialogClass + "'>";
11102
+ html += this.addNotebookTitle('dl_allinteraction', 'All interactions', true);
11005
11103
  html += "</div>";
11006
11104
 
11007
11105
  html += me.htmlCls.divStr + "dl_interactionsorted' style='background-color:white' class='" + dialogClass + "'>";
11106
+ html += this.addNotebookTitle('dl_interactionsorted', 'Sorted interactions', true);
11008
11107
  html += "</div>";
11009
11108
 
11010
11109
  html += me.htmlCls.divStr + "dl_linegraph' style='background-color:white' class='" + dialogClass + "'>";
11110
+ html += this.addNotebookTitle('dl_linegraph', '2D Interaction Network');
11011
11111
 
11012
11112
  html += me.htmlCls.divNowrapStr + '<div style="width:20px; margin-top:6px; display:inline-block;"><span id="'
11013
11113
  + me.pre + 'dl_linegraphcolor_expand" class="ui-icon ui-icon-plus icn3d-expand icn3d-link" style="display:none; width:15px;" title="Expand"></span><span id="'
@@ -11038,6 +11138,7 @@ class SetDialog {
11038
11138
  html += "</div>";
11039
11139
 
11040
11140
  html += me.htmlCls.divStr + "dl_scatterplot' style='background-color:white' class='" + dialogClass + "'>";
11141
+ html += this.addNotebookTitle('dl_scatterplot', '2D Interaction Map');
11041
11142
 
11042
11143
  html += me.htmlCls.divNowrapStr + "Hold Ctrl key to select multiple nodes." + me.htmlCls.space3;
11043
11144
 
@@ -11064,6 +11165,7 @@ class SetDialog {
11064
11165
  html += "</div>";
11065
11166
 
11066
11167
  html += me.htmlCls.divStr + "dl_contactmap' style='background-color:white' class='" + dialogClass + "'>";
11168
+ html += this.addNotebookTitle('dl_contactmap', 'Contact Map');
11067
11169
 
11068
11170
  html += me.htmlCls.divNowrapStr + "Hold Ctrl key to select multiple nodes." + me.htmlCls.space3 + "</div>";
11069
11171
 
@@ -11082,6 +11184,7 @@ class SetDialog {
11082
11184
  html += "</div>";
11083
11185
 
11084
11186
  html += me.htmlCls.divStr + "dl_alignerrormap' style='background-color:white' class='" + dialogClass + "'>";
11187
+ html += this.addNotebookTitle('dl_alignerrormap', 'PAE Map');
11085
11188
 
11086
11189
  html += me.htmlCls.divNowrapStr + "Hold Ctrl key to select multiple nodes." + me.htmlCls.space3 + "</div>";
11087
11190
 
@@ -11109,6 +11212,7 @@ class SetDialog {
11109
11212
  html += "</div>";
11110
11213
 
11111
11214
  html += me.htmlCls.divStr + "dl_elecmap2fofc' class='" + dialogClass + "'>";
11215
+ html += this.addNotebookTitle('dl_elecmap2fofc', 'Electron Density 2F0-Fc Map');
11112
11216
  html += "<span style='white-space:nowrap;font-weight:bold;'>Contour at: <select id='" + me.pre + "sigma2fofc'>";
11113
11217
 
11114
11218
  html += me.htmlCls.setHtmlCls.getOptionHtml(optArray1, 3);
@@ -11117,6 +11221,7 @@ class SetDialog {
11117
11221
  html += "</div>";
11118
11222
 
11119
11223
  html += me.htmlCls.divStr + "dl_elecmapfofc' class='" + dialogClass + "'>";
11224
+ html += this.addNotebookTitle('dl_elecmapfofc', 'Electron Density F0-Fc Map');
11120
11225
  html += "<span style='white-space:nowrap;font-weight:bold;'>Contour at: <select id='" + me.pre + "sigmafofc'>";
11121
11226
 
11122
11227
  html += me.htmlCls.setHtmlCls.getOptionHtml(optArray1, 5);
@@ -11125,6 +11230,7 @@ class SetDialog {
11125
11230
  html += "</div>";
11126
11231
 
11127
11232
  html += me.htmlCls.divStr + "dl_emmap' class='" + dialogClass + "'>";
11233
+ html += this.addNotebookTitle('dl_emmap', 'EM Density Map');
11128
11234
  html += "<span style='white-space:nowrap;font-weight:bold;'>Contour at: <select id='" + me.pre + "empercentage'>";
11129
11235
 
11130
11236
  html += me.htmlCls.setHtmlCls.getOptionHtml(['0', '10', '20', '30', '40', '50', '60', '70', '80', '90', '100'], 3);
@@ -11133,6 +11239,7 @@ class SetDialog {
11133
11239
  html += "</div>";
11134
11240
 
11135
11241
  html += me.htmlCls.divStr + "dl_aroundsphere' class='" + dialogClass + "'>";
11242
+ html += this.addNotebookTitle('dl_aroundsphere', 'Select a sphere around a set of residues');
11136
11243
  html += me.htmlCls.divNowrapStr + "1. Select the first set:</div>";
11137
11244
  html += "<div style='text-indent:1.1em'><select id='" + me.pre + "atomsCustomSphere2' multiple size='3' style='min-width:130px;'>";
11138
11245
  html += "</select></div><br>";
@@ -11147,6 +11254,7 @@ class SetDialog {
11147
11254
  html += "</div>";
11148
11255
 
11149
11256
  html += me.htmlCls.divStr + "dl_adjustmem' class='" + dialogClass + "'>";
11257
+ html += this.addNotebookTitle('dl_adjustmem', 'Adjust membranes');
11150
11258
  html += "<b>Note</b>: The membranes are parallel to the X-Y plane. The center of the membranes is at Z = 0. <br/><br/>";
11151
11259
  html += me.htmlCls.divNowrapStr + "1. Extracellular membrane Z-axis position: " + me.htmlCls.inputTextStr + "id='" + me.pre + "extra_mem_z' value='' size='3'> &#197;</div><br/>";
11152
11260
  html += me.htmlCls.divNowrapStr + "2. intracellular membrane Z-axis position: " + me.htmlCls.inputTextStr + "id='" + me.pre + "intra_mem_z' value='' size='3'> &#197;</div><br/>";
@@ -11154,6 +11262,7 @@ class SetDialog {
11154
11262
  html += "</div>";
11155
11263
 
11156
11264
  html += me.htmlCls.divStr + "dl_selectplane' class='" + dialogClass + "'>";
11265
+ html += this.addNotebookTitle('dl_selectplane', 'Select a plane');
11157
11266
  html += "<b>Note</b>: The membranes are parallel to the X-Y plane. The center of the membranes is at Z = 0. <br/><br/>";
11158
11267
  html += me.htmlCls.divNowrapStr + "1. Z-axis position of the first X-Y plane: " + me.htmlCls.inputTextStr + "id='" + me.pre + "selectplane_z1' value='15' size='3'> &#197;</div><br/>";
11159
11268
  html += me.htmlCls.divNowrapStr + "2. Z-axis position of the second X-Y plane: " + me.htmlCls.inputTextStr + "id='" + me.pre + "selectplane_z2' value='-15' size='3'> &#197;</div><br/>";
@@ -11161,6 +11270,7 @@ class SetDialog {
11161
11270
  html += "</div>";
11162
11271
 
11163
11272
  html += me.htmlCls.divStr + "dl_addlabel' class='" + dialogClass + "'>";
11273
+ html += this.addNotebookTitle('dl_addlabel', 'Add labels between two atoms');
11164
11274
  html += "1. Text: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labeltext' value='Text' size=4><br/>";
11165
11275
  html += "2. Size: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labelsize' value='18' size=4 maxlength=2><br/>";
11166
11276
  html += "3. Color: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labelcolor' value='" + defaultColor + "' size=4><br/>";
@@ -11175,6 +11285,7 @@ class SetDialog {
11175
11285
  html += "</div>";
11176
11286
 
11177
11287
  html += me.htmlCls.divStr + "dl_addlabelselection' class='" + dialogClass + "'>";
11288
+ html += this.addNotebookTitle('dl_addlabelselection', 'Add labels for your selection');
11178
11289
  html += "1. Text: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labeltext2' value='Text' size=4><br/>";
11179
11290
  html += "2. Size: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labelsize2' value='18' size=4 maxlength=2><br/>";
11180
11291
  html += "3. Color: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labelcolor2' value='" + defaultColor + "' size=4><br/>";
@@ -11183,11 +11294,13 @@ class SetDialog {
11183
11294
  html += "</div>";
11184
11295
 
11185
11296
  html += me.htmlCls.divStr + "dl_labelColor' class='" + dialogClass + "'>";
11297
+ html += this.addNotebookTitle('dl_labelColor', 'Change label color');
11186
11298
  html += "Color for all labels: " + me.htmlCls.inputTextStr + "id='" + me.pre + "labelcolorall' value='" + defaultColor + "' size=4><br/><br/>";
11187
11299
  html += me.htmlCls.spanNowrapStr + me.htmlCls.buttonStr + "applylabelcolor'>Display</button></span>";
11188
11300
  html += "</div>";
11189
11301
 
11190
11302
  html += me.htmlCls.divStr + "dl_distance' class='" + dialogClass + "'>";
11303
+ html += this.addNotebookTitle('dl_distance', 'Measure distance');
11191
11304
  if(me.utilsCls.isMobile()) {
11192
11305
  html += me.htmlCls.spanNowrapStr + "1. Touch TWO atoms</span><br/>";
11193
11306
  }
@@ -11199,6 +11312,7 @@ class SetDialog {
11199
11312
  html += "</div>";
11200
11313
 
11201
11314
  html += me.htmlCls.divStr + "dl_stabilizer' class='" + dialogClass + "'>";
11315
+ html += this.addNotebookTitle('dl_stabilizer', 'Add a stabilizer');
11202
11316
  if(me.utilsCls.isMobile()) {
11203
11317
  html += me.htmlCls.spanNowrapStr + "1. Touch TWO atoms</span><br/>";
11204
11318
  }
@@ -11210,6 +11324,7 @@ class SetDialog {
11210
11324
  html += "</div>";
11211
11325
 
11212
11326
  html += me.htmlCls.divStr + "dl_disttwosets' class='" + dialogClass + "'>";
11327
+ html += this.addNotebookTitle('dl_disttwosets', 'Measure the distance between two sets');
11213
11328
  html += me.htmlCls.spanNowrapStr + "1. Select two sets</span><br/>";
11214
11329
  html += "<table border=0 width=400 cellspacing=10><tr><td>";
11215
11330
 
@@ -11231,6 +11346,7 @@ class SetDialog {
11231
11346
 
11232
11347
 
11233
11348
  html += me.htmlCls.divStr + "dl_linebtwsets' class='" + dialogClass + "'>";
11349
+ html += this.addNotebookTitle('dl_linebtwsets', 'Add a line between two sets');
11234
11350
  html += me.htmlCls.spanNowrapStr + "1. Select two sets</span><br/>";
11235
11351
  html += "<table border=0 width=400 cellspacing=10><tr><td>";
11236
11352
 
@@ -11264,6 +11380,7 @@ class SetDialog {
11264
11380
 
11265
11381
 
11266
11382
  html += me.htmlCls.divStr + "dl_cartoonshape' class='" + dialogClass + "'>";
11383
+ html += this.addNotebookTitle('dl_cartoonshape', 'Cartoon Shape');
11267
11384
  html += me.htmlCls.spanNowrapStr + "1. Select a set:</span><br/>";
11268
11385
  html += "<div style='text-indent:1.1em'><select style='max-width:200px' id='" + me.pre + "cartoonshape' multiple size='5' style='min-width:130px;'>";
11269
11386
  html += "</select></div><br>";
@@ -11286,6 +11403,7 @@ class SetDialog {
11286
11403
 
11287
11404
 
11288
11405
  html += me.htmlCls.divStr + "dl_distmanysets' class='" + dialogClass + "'>";
11406
+ html += this.addNotebookTitle('dl_distmanysets', 'Measure distances among many sets');
11289
11407
  html += me.htmlCls.spanNowrapStr + "1. Select sets for pairwise distances</span><br/>";
11290
11408
  html += "<table border=0 width=400 cellspacing=10><tr><td>";
11291
11409
 
@@ -11305,6 +11423,7 @@ class SetDialog {
11305
11423
  html += "</div>";
11306
11424
 
11307
11425
  html += me.htmlCls.divStr + "dl_stabilizer_rm' class='" + dialogClass + "'>";
11426
+ html += this.addNotebookTitle('dl_stabilizer_rm', 'Remove a stabilizer');
11308
11427
  if(me.utilsCls.isMobile()) {
11309
11428
  html += me.htmlCls.spanNowrapStr + "1. Touch TWO atoms</span><br/>";
11310
11429
  }
@@ -11315,14 +11434,17 @@ class SetDialog {
11315
11434
  html += "</div>";
11316
11435
 
11317
11436
  html += me.htmlCls.divStr + "dl_thickness' class='" + dialogClass + "'>";
11437
+ html += this.addNotebookTitle('dl_thickness', 'Set thickness');
11318
11438
  html += me.htmlCls.setHtmlCls.setThicknessHtml('3dprint');
11319
11439
  html += "</div>";
11320
11440
 
11321
11441
  html += me.htmlCls.divStr + "dl_thickness2' class='" + dialogClass + "'>";
11442
+ html += this.addNotebookTitle('dl_thickness2', 'Set thickness');
11322
11443
  html += me.htmlCls.setHtmlCls.setThicknessHtml('style');
11323
11444
  html += "</div>";
11324
11445
 
11325
11446
  html += me.htmlCls.divStr + "dl_menupref' class='" + dialogClass + "'>";
11447
+ html += this.addNotebookTitle('dl_menupref', 'Preferences for menus');
11326
11448
  html += "<b>Note</b>: The following parameters will be saved in cache. You just need to set them once. <br><br>";
11327
11449
 
11328
11450
  html += me.htmlCls.spanNowrapStr + "" + me.htmlCls.buttonStr + "apply_menupref'>Apply</button></span>";
@@ -11338,6 +11460,7 @@ class SetDialog {
11338
11460
  html += "</div>";
11339
11461
 
11340
11462
  html += me.htmlCls.divStr + "dl_addtrack' class='" + dialogClass + "'>";
11463
+ html += this.addNotebookTitle('dl_addtrack', 'Add a track');
11341
11464
  html += " <input type='hidden' id='" + me.pre + "track_chainid' value=''>";
11342
11465
 
11343
11466
  html += me.htmlCls.divStr + "dl_addtrack_tabs' style='border:0px;'>";
@@ -11393,6 +11516,7 @@ class SetDialog {
11393
11516
  html += "</div>";
11394
11517
 
11395
11518
  html += me.htmlCls.divStr + "dl_saveselection' class='" + dialogClass + "'>";
11519
+ html += this.addNotebookTitle('dl_saveselection', 'Save Selection');
11396
11520
  let index =(ic && ic.defNames2Atoms) ? Object.keys(ic.defNames2Atoms).length : 1;
11397
11521
  let suffix = '';
11398
11522
  html += "Name: " + me.htmlCls.inputTextStr + "id='" + me.pre + "seq_command_name" + suffix + "' value='seq_" + index + "' size='5'> <br>";
@@ -11402,6 +11526,7 @@ class SetDialog {
11402
11526
 
11403
11527
 
11404
11528
  html += me.htmlCls.divStr + "dl_copyurl' style='width:520px;' class='" + dialogClass + "'>";
11529
+ html += this.addNotebookTitle('dl_copyurl', 'Share Link');
11405
11530
  html += "Please copy one of the URLs below. They show the same result.<br>(To add a title to share link, click \"Windows > Your Note\" and click \"File > Share Link\" again.)<br><br>";
11406
11531
  html += "Original URL with commands: <br><textarea id='" + me.pre + "ori_url' rows='4' style='width:100%'></textarea><br><br>";
11407
11532
  html += "Lifelong Short URL:(To replace this URL, send a pull request to update share.html at <a href='https://github.com/ncbi/icn3d' target='_blank'>iCn3D GitHub</a>)<br>" + me.htmlCls.inputTextStr + "id='" + me.pre + "short_url' value='' style='width:100%'><br><br>";
@@ -11409,6 +11534,7 @@ class SetDialog {
11409
11534
  html += "</div>";
11410
11535
 
11411
11536
  html += me.htmlCls.divStr + "dl_selectannotations' class='" + dialogClass + " icn3d-annotation' style='background-color:white;'>";
11537
+ html += this.addNotebookTitle('dl_selectannotations', 'Sequences & Annotations');
11412
11538
 
11413
11539
  html += me.htmlCls.divStr + "dl_annotations_tabs'>";
11414
11540
 
@@ -11437,6 +11563,7 @@ class SetDialog {
11437
11563
  html += "</div>";
11438
11564
 
11439
11565
  html += me.htmlCls.divStr + "dl_graph' style='background-color:white;' class='" + dialogClass + "'>";
11566
+ html += this.addNotebookTitle('dl_graph', 'Interactions');
11440
11567
  me.svgid = me.pre + 'icn3d_viz';
11441
11568
  html += '<style>';
11442
11569
  html += '#' + me.svgid + ' svg { border: 1px solid; font: 13px sans-serif; text-anchor: end; }';
@@ -11491,6 +11618,7 @@ class SetDialog {
11491
11618
  html += "</div>";
11492
11619
 
11493
11620
  html += me.htmlCls.divStr + "dl_area' class='" + dialogClass + "'>";
11621
+ html += this.addNotebookTitle('dl_area', 'Surface Area');
11494
11622
  html += "Solvent Accessible Surface Area(SASA) calculated using the <a href='https://journals.plos.org/plosone/article?id=10.1371/journal.pone.0008140' target='_blank'>EDTSurf algorithm</a>: <br>";
11495
11623
  html += '(0-20% out is considered "in". 50-100% out is considered "out".)<br><br>';
11496
11624
  html += "<b>Toal</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "areavalue' value='' size='10'> &#8491;<sup>2</sup><br><br>";
@@ -11498,19 +11626,23 @@ class SetDialog {
11498
11626
  html += "</div>";
11499
11627
 
11500
11628
  html += me.htmlCls.divStr + "dl_colorbyarea' class='" + dialogClass + "'>";
11629
+ html += this.addNotebookTitle('dl_colorbyarea', 'Color by surface area');
11501
11630
  html += "<div style='width:500px'>Color each residue based on the percentage of solvent accessilbe surface area. The color ranges from blue, to white, to red for a percentage of 0, 35(variable), and 100, respectively.</div><br>";
11502
11631
  html += "<b>Middle Percentage(White)</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "midpercent' value='35' size='10'>% <br><br>";
11503
11632
  html += "<button style='white-space:nowrap;' id='" + me.pre + "applycolorbyarea'>Color</button><br/><br/>";
11504
11633
  html += "</div>";
11505
11634
 
11506
11635
  html += me.htmlCls.divStr + "dl_rmsd' class='" + dialogClass + "' style='max-width:300px'>";
11636
+ html += this.addNotebookTitle('dl_rmsd', 'RMSD', true);
11507
11637
 
11508
11638
  html += "</div>";
11509
11639
 
11510
11640
  html += me.htmlCls.divStr + "dl_buriedarea' class='" + dialogClass + "'>";
11641
+ html += this.addNotebookTitle('dl_buriedarea', 'Buried surface area', true);
11511
11642
  html += "</div>";
11512
11643
 
11513
11644
  html += me.htmlCls.divStr + "dl_propbypercentout' class='" + dialogClass + "'>";
11645
+ html += this.addNotebookTitle('dl_propbypercentout', 'Select residues basen on solvent accessilbe surface area');
11514
11646
  html += "<div style='width:400px'>Select residue based on the percentage of solvent accessilbe surface area. The values are in the range of 0-100.</div><br>";
11515
11647
  html += "<b>Min Percentage</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "minpercentout' value='0' size='10'>% <br>";
11516
11648
  html += "<b>Max Percentage</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "maxpercentout' value='100' size='10'>% <br>";
@@ -11518,6 +11650,7 @@ class SetDialog {
11518
11650
  html += "</div>";
11519
11651
 
11520
11652
  html += me.htmlCls.divStr + "dl_propbybfactor' class='" + dialogClass + "'>";
11653
+ html += this.addNotebookTitle('dl_propbybfactor', 'Select residues basen on B-factor');
11521
11654
  html += "<div style='width:400px'>Select residue based on B-factor. The values are in the range of 0-100.</div><br>";
11522
11655
  html += "<b>Min B-factor</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "minbfactor' value='0' size='10'>% <br>";
11523
11656
  html += "<b>Max B-factor</b>: " + me.htmlCls.inputTextStr + "id='" + me.pre + "maxbfactor' value='100' size='10'>% <br>";
@@ -11525,9 +11658,11 @@ class SetDialog {
11525
11658
  html += "</div>";
11526
11659
 
11527
11660
  html += me.htmlCls.divStr + "dl_legend' class='" + dialogClass + "' style='max-width:500px; background-color:white'>";
11661
+ html += this.addNotebookTitle('dl_legend', 'Legend', true);
11528
11662
  html += "</div>";
11529
11663
 
11530
11664
  html += me.htmlCls.divStr + "dl_disttable' class='" + dialogClass + "'>";
11665
+ html += this.addNotebookTitle('dl_disttable', 'Distance Table', true);
11531
11666
  html += "</div>";
11532
11667
 
11533
11668
  html += "</div>";
@@ -14843,6 +14978,8 @@ class SetHtml {
14843
14978
  }
14844
14979
 
14845
14980
  html += me.htmlCls.divStr + "dl_" + name1 + "' class='" + dialogClass + "'>";
14981
+ html += me.htmlCls.setDialogCls.addNotebookTitle("dl_" + name1, 'DelPhi Potential');
14982
+
14846
14983
  html += me.htmlCls.divStr + "dl_" + name1 + "_tabs' style='border:0px;'>";
14847
14984
  html += "<ul>";
14848
14985
  html += "<li><a href='#" + me.pre + name1 + "tab1'>" + tab1 + "</a></li>";
@@ -15156,7 +15293,7 @@ class SetHtml {
15156
15293
  statefile = imageStr.substr(posState + matchedStrState.length, posStateEnd - posState- matchedStrState.length);
15157
15294
  //statefile = decodeURIComponent(statefile);
15158
15295
  statefile = decodeURIComponent(statefile + "\n" + commandStr);
15159
-
15296
+
15160
15297
  if(type === 'pdb') {
15161
15298
  await ic.pdbParserCls.loadPdbData(data);
15162
15299
 
@@ -22158,7 +22295,7 @@ class Scene {
22158
22295
  ic.cam.remove( ic.canvasUI.mesh );
22159
22296
  }
22160
22297
 
22161
- if (controllerInfo !== undefined){
22298
+ if (controller && controllerInfo !== undefined){
22162
22299
  // "trigger":{"button":0},
22163
22300
  // "squeeze":{"button":1},
22164
22301
  // "thumbstick":{"button":3,"xAxis":2,"yAxis":3}, "touchpad":{"button":2,"xAxis":0,"yAxis":1},
@@ -22240,8 +22377,11 @@ class Scene {
22240
22377
  ic.cam.remove( ic.canvasUI.mesh );
22241
22378
  } },
22242
22379
  sphere: { type: "button", position:{ top: margin + (btnHeight + margin), left: margin + 4*(btnWidth + margin) }, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22243
- ic.setOptionCls.setStyle("proteins", "sphere");
22244
- ic.setOptionCls.setStyle("nucleotides", "sphere");
22380
+ // ic.setOptionCls.setStyle("proteins", "sphere");
22381
+ // ic.setOptionCls.setStyle("nucleotides", "sphere");
22382
+ ic.opts['surface'] = 'molecular surface';
22383
+ ic.applyMapCls.applySurfaceOptions();
22384
+
22245
22385
  ic.cam.remove( ic.canvasUI.mesh );
22246
22386
  } },
22247
22387
 
@@ -22307,14 +22447,17 @@ class Scene {
22307
22447
  //ic.canvasUILog.updateElement( "info", "ERROR: " + err );
22308
22448
  }
22309
22449
  } },
22310
- // delphi: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 2*(btnWidth + margin)}, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22311
- // ic.debugStr = '###ic.hAtoms: ' + Object.keys(ic.hAtoms).length + ' ic.dAtoms: ' + Object.keys(ic.dAtoms).length;
22312
- // let gsize = 65, salt = 0.15, contour = 2, bSurface = true;
22313
- // ic.delphiCls.CalcPhi(gsize, salt, contour, bSurface);
22314
- // ic.canvasUILog.updateElement( "info", "debug: " + ic.debugStr );
22315
- // ic.cam.remove( ic.canvasUI.mesh );
22316
- // } },
22317
- removeLabel: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 2*(btnWidth + margin) }, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22450
+ delphi: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 2*(btnWidth + margin)}, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: async function() {
22451
+ let gsize = 65, salt = 0.15, contour = 2, bSurface = true;
22452
+ ic.phisurftype = 22; // molecular surface
22453
+ ic.phisurfop = 1.0; // opacity
22454
+ ic.phisurfwf = 'no'; // wireframe
22455
+ await ic.delphiCls.CalcPhi(gsize, salt, contour, bSurface);
22456
+
22457
+ //ic.canvasUILog.updateElement( "info", "debug: " + ic.debugStr );
22458
+ ic.cam.remove( ic.canvasUI.mesh );
22459
+ } },
22460
+ removeLabel: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 3*(btnWidth + margin) }, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22318
22461
  for(let name in ic.labels) {
22319
22462
  //if(name === 'residue' || name === 'custom') {
22320
22463
  ic.labels[name] = [];
@@ -22324,7 +22467,7 @@ class Scene {
22324
22467
  ic.drawCls.draw();
22325
22468
  ic.cam.remove( ic.canvasUI.mesh );
22326
22469
  } },
22327
- reset: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 3*(btnWidth + margin) }, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22470
+ reset: { type: "button", position:{ top: margin + 4*(btnHeight + margin), left: margin + 4*(btnWidth + margin) }, width: btnWidth, height: btnHeight, fontColor: fontColor, fontSize: fontSize, backgroundColor: bkgdColor, hover: hoverColor, onSelect: function() {
22328
22471
  ic.selectionCls.resetAll();
22329
22472
 
22330
22473
  ic.cam.remove( ic.canvasUI.mesh );
@@ -22344,7 +22487,8 @@ class Scene {
22344
22487
  ribbon: "Ribbon",
22345
22488
  schematic: "Schem.",
22346
22489
  stick: "Stick",
22347
- sphere: "Sphere",
22490
+ //sphere: "Sphere",
22491
+ sphere: "Surface",
22348
22492
 
22349
22493
  color: "Color",
22350
22494
  rainbow: "Rainbow",
@@ -22364,7 +22508,7 @@ class Scene {
22364
22508
 
22365
22509
  analysis: "Analysis",
22366
22510
  interaction: "Interact",
22367
- //delphi: "DelPhi",
22511
+ delphi: "DelPhi",
22368
22512
  removeLabel: "No Label",
22369
22513
  reset: "Reset"
22370
22514
  };
@@ -22415,6 +22559,8 @@ class Scene {
22415
22559
 
22416
22560
  for(let i=0; i<=1; i++){
22417
22561
  const controller = ic.renderer.xr.getController( i );
22562
+ if(!controller) continue;
22563
+
22418
22564
  ic.dolly.add( controller );
22419
22565
 
22420
22566
  controller.add( line.clone() );
@@ -25724,6 +25870,8 @@ class TextSprite {
25724
25870
  sprite.scale.set(expandWidthFactor * factor, factor, 1.0);
25725
25871
  }
25726
25872
 
25873
+ sprite.renderOrder = 1; // larger than the default 0
25874
+
25727
25875
  return sprite;
25728
25876
  }
25729
25877
 
@@ -28513,11 +28661,12 @@ class Surface {
28513
28661
  cfg.isovalue = ic.mapData.contourPhi;
28514
28662
  cfg.type = 'phi';
28515
28663
  cfg.loadPhiFrom = ic.loadPhiFrom;
28516
-
28664
+
28517
28665
  ps = this.SetupMap(cfg);
28518
28666
  }
28519
28667
  else {
28520
28668
  //1: van der waals surface, 2: molecular surface, 3: solvent accessible surface
28669
+
28521
28670
 
28522
28671
  //exclude water
28523
28672
  let atomsToShow = me.hashUtilsCls.exclHash(atoms, ic.water);
@@ -28551,7 +28700,7 @@ class Surface {
28551
28700
 
28552
28701
  ps = this.SetupSurface(cfg);
28553
28702
  }
28554
-
28703
+
28555
28704
  if(ic.bCalcArea) {
28556
28705
  ic.areavalue = ps.area.toFixed(2);
28557
28706
  let serial2area = ps.serial2area;
@@ -28630,7 +28779,7 @@ class Surface {
28630
28779
  //geo = new THREE.Geometry();
28631
28780
  geo = new THREE.BufferGeometry();
28632
28781
  let verticeArray = [], colorArray = [], indexArray = [], color;
28633
-
28782
+
28634
28783
  //var geoVertices = verts.map(function (v) {
28635
28784
  let offset = 0;
28636
28785
  for(let i = 0, il = verts.length; i < il; ++i, offset += 3) {
@@ -28705,9 +28854,8 @@ class Surface {
28705
28854
  //geo.normalsNeedUpdate = true;
28706
28855
 
28707
28856
  geo.computeVertexNormals();
28708
-
28857
+
28709
28858
  geo.type = 'Surface'; // to be recognized in vrml.js for 3D printing
28710
-
28711
28859
  // use the regular way to show transparency for type == 15 (surface with potential)
28712
28860
  // if(ic.transparentRenderOrder && (type == 1 || type == 2 || type == 3)) { // WebGL has some ordering problem when dealing with transparency
28713
28861
  if(ic.transparentRenderOrder) { // WebGL has some ordering problem when dealing with transparency
@@ -28895,7 +29043,7 @@ class Surface {
28895
29043
  mesh.renderOrder = -2; // default: 0, picking: -1
28896
29044
 
28897
29045
  ic.mdl.add(mesh);
28898
-
29046
+
28899
29047
  if(type == 11 || type == 12) {
28900
29048
  ic.prevMaps.push(mesh);
28901
29049
  }
@@ -28978,7 +29126,7 @@ class Surface {
28978
29126
 
28979
29127
  SetupMap(data) { let ic = this.icn3d; ic.icn3dui;
28980
29128
  let ps = new ElectronMap(ic);
28981
-
29129
+
28982
29130
  ps.initparm(data.header, data.data, data.matrix, data.isovalue, data.center, data.maxdist,
28983
29131
  data.pmin, data.pmax, data.water, data.type, data.rmsd_supr, data.loadPhiFrom, data.icn3d);
28984
29132
 
@@ -28987,7 +29135,7 @@ class Surface {
28987
29135
  if(!data.header.bSurface) ps.buildboundary();
28988
29136
 
28989
29137
  if(!data.header.bSurface) ps.marchingcube();
28990
-
29138
+
28991
29139
  ps.vpBits = null; // uint8 array of bitmasks
28992
29140
  //ps.vpDistance = null; // floatarray of _squared_ distances
28993
29141
  ps.vpAtomID = null; // intarray
@@ -31852,6 +32000,8 @@ class Alternate {
31852
32000
 
31853
32001
  ic.dAtoms = {};
31854
32002
 
32003
+ let bMutation = moleculeArray.length == 2 && moleculeArray[1].replace(moleculeArray[0], '') == '2';
32004
+
31855
32005
  for(let i = 0, il = moleculeArray.length; i < il; ++i) {
31856
32006
  let structure = moleculeArray[i];
31857
32007
  //if(i > ic.ALTERNATE_STRUCTURE || (ic.ALTERNATE_STRUCTURE === il - 1 && i === 0) ) {
@@ -31884,7 +32034,17 @@ class Alternate {
31884
32034
 
31885
32035
  if(ic.ALTERNATE_STRUCTURE < 0) ic.ALTERNATE_STRUCTURE += il;
31886
32036
 
31887
- $("#" + ic.pre + "title").html(structure);
32037
+ let label = '';
32038
+ if(bMutation) {
32039
+ if(i == 0) {
32040
+ label = "Wild Type ";
32041
+ }
32042
+ else if(i == 1) {
32043
+ label = "Mutant ";
32044
+ }
32045
+ }
32046
+
32047
+ $("#" + ic.pre + "title").html(label + structure);
31888
32048
 
31889
32049
  break;
31890
32050
  }
@@ -32002,7 +32162,7 @@ class Alternate {
32002
32162
  //if(window.dialog) window.dialog.dialog( "close" );
32003
32163
 
32004
32164
  let html = me.utilsCls.getMemDesc();
32005
- $("#" + ic.pre + "dl_rmsd").html(html);
32165
+ $("#" + ic.pre + "dl_rmsd_html").html(html);
32006
32166
  if(!me.cfg.bSidebyside) me.htmlCls.dialogCls.openDlg('dl_rmsd', 'Membranes');
32007
32167
  }
32008
32168
  }
@@ -32173,6 +32333,8 @@ class Alternate {
32173
32333
 
32174
32334
  for(let i = 0, il = ic.controllers.length; i < il; ++i) {
32175
32335
  let controller = ic.controllers[i];
32336
+ if(!controller) continue;
32337
+
32176
32338
  dt = (i % 2 == 0) ? dt : -dt; // dt * y;
32177
32339
  thisClass.handleController( controller, dt, controller.userData.selectPressed, controller.userData.squeezePressed, result.xArray, result.yArray );
32178
32340
  //thisClass.handleController( controller, dt, pressed );
@@ -32181,13 +32343,13 @@ class Alternate {
32181
32343
 
32182
32344
  if ( ic.renderer.xr.isPresenting){
32183
32345
  if(ic.canvasUI) ic.canvasUI.update();
32184
- //if(ic.canvasUILog) ic.canvasUILog.update();
32346
+ if(ic.canvasUILog) ic.canvasUILog.update();
32185
32347
  }
32186
32348
  }
32187
32349
  else if(ic.bAr) {
32188
32350
  if ( ic.renderer.xr.isPresenting ){
32189
32351
  ic.gestures.update();
32190
- //if(ic.canvasUILog) ic.canvasUILog.update();
32352
+ if(ic.canvasUILog) ic.canvasUILog.update();
32191
32353
  }
32192
32354
  }
32193
32355
 
@@ -34383,20 +34545,61 @@ class SetColor {
34383
34545
 
34384
34546
  case 'ig strand':
34385
34547
  if(ic.bShowRefnum) {
34386
- for(let resid in ic.resid2refnum) {
34387
- let refnumLabel = ic.resid2refnum[resid];
34388
- let color;
34389
- if(!refnumLabel) {
34390
- color = me.parasCls.thr(me.htmlCls.GREYB);
34548
+ let color;
34549
+ for(let resid in ic.residues) {
34550
+ if(!ic.resid2refnum[resid]) {
34551
+ color = me.parasCls.thr('#FFFFFF');
34391
34552
  }
34392
34553
  else {
34393
- let refnumStr = refnumLabel.replace(/'/g, '').replace(/\*/g, '').replace(/\^/g, '').substr(1); // C', C''
34394
- let currStrand = refnumLabel.replace(new RegExp(refnumStr,'g'), '');
34395
- color = ic.showSeqCls.getRefnumColor(currStrand);
34554
+ let refnumLabel = ic.resid2refnum[resid];
34555
+
34556
+ if(!refnumLabel) {
34557
+ color = me.parasCls.thr(me.htmlCls.GREYB);
34558
+ }
34559
+ else {
34560
+ let refnumStr = refnumLabel.replace(/'/g, '').replace(/\*/g, '').replace(/\^/g, '').substr(1); // C', C''
34561
+ let currStrand = refnumLabel.replace(new RegExp(refnumStr,'g'), '');
34562
+ color = ic.showSeqCls.getRefnumColor(currStrand);
34396
34563
 
34397
- if(ic.residIgLoop.hasOwnProperty(resid)) {
34564
+ if(ic.residIgLoop.hasOwnProperty(resid)) {
34565
+ color = me.parasCls.thr(me.htmlCls.GREYB);
34566
+ }
34567
+ }
34568
+ }
34569
+
34570
+ for (let i in ic.residues[resid]) {
34571
+ let atom = ic.atoms[i];
34572
+ atom.color = me.parasCls.thr(color);
34573
+
34574
+ ic.atomPrevColors[i] = atom.color;
34575
+ }
34576
+ }
34577
+ }
34578
+
34579
+ break;
34580
+
34581
+ case 'ig protodomain':
34582
+ if(ic.bShowRefnum) {
34583
+ let color;
34584
+ for(let resid in ic.residues) {
34585
+ if(!ic.resid2refnum[resid]) {
34586
+ color = me.parasCls.thr('#FFFFFF');
34587
+ }
34588
+ else {
34589
+ let refnumLabel = ic.resid2refnum[resid];
34590
+
34591
+ if(!refnumLabel) {
34398
34592
  color = me.parasCls.thr(me.htmlCls.GREYB);
34399
34593
  }
34594
+ else {
34595
+ let refnumStr = refnumLabel.replace(/'/g, '').replace(/\*/g, '').replace(/\^/g, '').substr(1); // C', C''
34596
+ let currStrand = refnumLabel.replace(new RegExp(refnumStr,'g'), '');
34597
+ color = ic.showSeqCls.getProtodomainColor(currStrand);
34598
+
34599
+ if(ic.residIgLoop.hasOwnProperty(resid)) {
34600
+ color = me.parasCls.thr(me.htmlCls.GREYB);
34601
+ }
34602
+ }
34400
34603
  }
34401
34604
 
34402
34605
  for (let i in ic.residues[resid]) {
@@ -35074,6 +35277,9 @@ class SetOption {
35074
35277
  else if(colorType == 'ig strand') {
35075
35278
  colorLabel = 'Ig Strand';
35076
35279
  }
35280
+ else if(colorType == 'ig protodomain') {
35281
+ colorLabel = 'Ig Protodomain';
35282
+ }
35077
35283
 
35078
35284
  let html = "Color by <b>" + colorLabel + "</b><br><br>";
35079
35285
 
@@ -35097,6 +35303,9 @@ class SetOption {
35097
35303
  else if (colorType == 'ig strand'){
35098
35304
  html += this.getColorLegendForIgstrand(ic.hAtoms);
35099
35305
  }
35306
+ else if (colorType == 'ig protodomain'){
35307
+ html += this.getColorLegendForIgproto(ic.hAtoms);
35308
+ }
35100
35309
  //else if (ic.legendClick == 4){
35101
35310
  else if (colorType == 'normalized hydrophobic' || colorType == 'hydrophobic') {
35102
35311
  let bOriResn = true;
@@ -35168,7 +35377,7 @@ class SetOption {
35168
35377
  bClose = true;
35169
35378
  }
35170
35379
 
35171
- $("#" + me.pre + "dl_legend").html(html);
35380
+ $("#" + me.pre + "dl_legend_html").html(html);
35172
35381
  me.htmlCls.dialogCls.openDlg('dl_legend', 'Color Legend');
35173
35382
 
35174
35383
  if(bClose) {
@@ -35328,19 +35537,49 @@ class SetOption {
35328
35537
  "A^ Strand": "FF00FF",
35329
35538
  "A Strand": "663399",
35330
35539
  "A* Strand": "FFC0CB",
35331
- "A Strand": "9370db",
35540
+ "A' Strand": "663399", //"9370db",
35332
35541
  "B Strand": "ba55d3",
35333
35542
  "C Strand": "0000FF",
35334
35543
  "C' Strand": "6495ED",
35335
35544
  "C'' Strand": "006400",
35336
35545
  "D Strand": "00FF00",
35337
- "E Strand": "FFFF00",
35546
+ "E Strand": "FFFF00", //"F0E68C",
35338
35547
  "F Strand": "FFA500",
35339
35548
  "G Strand": "FF0000",
35340
35549
  "G* Strand": "8B0000",
35341
35550
  "Loop": "CCCCCC"
35342
35551
  };
35343
-
35552
+
35553
+ html += "<div>";
35554
+ for (let name in name2color) {
35555
+ let color = name2color[name];
35556
+ html += "<span>";
35557
+ html += "<div style='width: 10px; height: 10px; background-color:#" + color + "; border: 0px;display:inline-block;' ></div> ";
35558
+ html += name;
35559
+ html += "</span><br>";
35560
+ }
35561
+
35562
+ html += "</div>";
35563
+
35564
+ return html;
35565
+ }
35566
+
35567
+ getColorLegendForIgproto(atomHash) { let ic = this.icn3d; ic.icn3dui;
35568
+ let html = '';
35569
+
35570
+ const name2color = {
35571
+ "A Strand": "0000FF",
35572
+ "B Strand": "006400",
35573
+ "C Strand": "FFFF00", //"F0E68C",
35574
+ "C' Strand": "FFA500",
35575
+ "C'' Strand": "FF0000",
35576
+ "D Strand": "0000FF",
35577
+ "E Strand": "006400",
35578
+ "F Strand": "FFFF00", //"F0E68C",
35579
+ "G Strand": "FFA500",
35580
+ "Loop": "CCCCCC"
35581
+ };
35582
+
35344
35583
  html += "<div>";
35345
35584
  for (let name in name2color) {
35346
35585
  let color = name2color[name];
@@ -37556,6 +37795,7 @@ class Domain3d {
37556
37795
  this.icn3d = icn3d;
37557
37796
 
37558
37797
  //this.dcut = 8; // threshold for C-alpha interactions
37798
+
37559
37799
  // It seemed the threshold 7 angstrom works better
37560
37800
  this.dcut = 7; // threshold for C-alpha interactions
37561
37801
 
@@ -37591,6 +37831,9 @@ class Domain3d {
37591
37831
  this.c_delta = 3; // cut set parameter
37592
37832
  this.nc_fact = 0.0; // size factor for internal contacts
37593
37833
 
37834
+ // added by Jiyao
37835
+ this.min_contacts = 10; // minimum number of contacts to be considered as neighbors
37836
+
37594
37837
  //let this.elements[2*this.MAX_SSE]; // sets of this.elements to be split
37595
37838
  this.elements = [];
37596
37839
  this.elements.length = 2*this.MAX_SSE;
@@ -38139,6 +38382,7 @@ class Domain3d {
38139
38382
  //https://www.geeksforgeeks.org/number-groups-formed-graph-friends/
38140
38383
  countUtil(ss1, sheetNeighbor, existing_groups) {
38141
38384
  this.visited[ss1] = true;
38385
+
38142
38386
  if(!this.groupnum2sheet[existing_groups]) this.groupnum2sheet[existing_groups] = [];
38143
38387
  this.groupnum2sheet[existing_groups].push(parseInt(ss1));
38144
38388
 
@@ -38182,6 +38426,7 @@ class Domain3d {
38182
38426
  let chnid = residueArray[0].substr(0, residueArray[0].lastIndexOf('_'));
38183
38427
 
38184
38428
  let substructItem = {};
38429
+ let pos2resi = {};
38185
38430
  for(let i = 0; i < residueArray.length; ++i) {
38186
38431
  let resid = residueArray[i];
38187
38432
 
@@ -38219,22 +38464,26 @@ class Domain3d {
38219
38464
  x0.push(atom.coord.x);
38220
38465
  y0.push(atom.coord.y);
38221
38466
  z0.push(atom.coord.z);
38222
- resiArray.push(resi);
38467
+ //resiArray.push(resi);
38468
+ resiArray.push(i+1);
38469
+ pos2resi[i+1] = resi;
38223
38470
 
38224
38471
  if(atom.ssend) {
38225
- substructItem.To = parseInt(resi);
38472
+ //substructItem.To = parseInt(resi);
38473
+ substructItem.To = i + 1;
38226
38474
  substructItem.x2 = atom.coord.x;
38227
38475
  substructItem.y2 = atom.coord.y;
38228
38476
  substructItem.z2 = atom.coord.z;
38229
38477
 
38230
38478
  substructItem.Sheet = (atom.ss == 'sheet') ? true : false;
38231
38479
  substruct.push(substructItem);
38232
- substructItem = {};
38480
+ substructItem = {};
38233
38481
  }
38234
38482
 
38235
38483
  // a residue could be both start and end. check ssend first, then check ssbegin
38236
38484
  if(atom.ssbegin) {
38237
- substructItem.From = parseInt(resi);
38485
+ //substructItem.From = parseInt(resi);
38486
+ substructItem.From = i + 1;
38238
38487
  substructItem.x1 = atom.coord.x;
38239
38488
  substructItem.y1 = atom.coord.y;
38240
38489
  substructItem.z1 = atom.coord.z;
@@ -38254,7 +38503,8 @@ class Domain3d {
38254
38503
  }
38255
38504
 
38256
38505
  let seqLen = residueArray.length; // + resiOffset;
38257
- let lastResi = resiArray[seqLen - 1];
38506
+ //let lastResi = resiArray[seqLen - 1];
38507
+ let lastResi = seqLen;
38258
38508
 
38259
38509
  // get a list of Calpha-Calpha contacts
38260
38510
  ///list< pair< pair< int, let >, let > >
@@ -38333,7 +38583,8 @@ class Domain3d {
38333
38583
  let ss2 = parseInt(ssPair[1]);
38334
38584
 
38335
38585
  // both are sheets
38336
- if(substruct[ss1 - 1].Sheet && substruct[ss2 - 1].Sheet) {
38586
+ // min number of contacts: this.min_contacts
38587
+ if(substruct[ss1 - 1].Sheet && substruct[ss2 - 1].Sheet && ctable[pair] >= this.min_contacts ) {
38337
38588
  if(!sheetNeighbor[ss1]) sheetNeighbor[ss1] = {};
38338
38589
  if(!sheetNeighbor[ss2]) sheetNeighbor[ss2] = {};
38339
38590
 
@@ -38356,13 +38607,13 @@ class Domain3d {
38356
38607
  // If not in any group.
38357
38608
  if (this.visited[ss1] == false) {
38358
38609
  existing_groups++;
38359
-
38610
+
38360
38611
  this.countUtil(ss1, sheetNeighbor, existing_groups);
38361
38612
  }
38362
38613
  }
38363
38614
 
38364
38615
  // get sheet2sheetnum
38365
- // each neighboring sheet willbe represented by the sheet with the smallest sse
38616
+ // each neighboring sheet will be represented by the sheet with the smallest sse
38366
38617
  for(let groupnum in this.groupnum2sheet) {
38367
38618
  let ssArray = this.groupnum2sheet[groupnum].sort();
38368
38619
  for(let i = 0, il = ssArray.length; i < il; ++i) {
@@ -38465,7 +38716,7 @@ class Domain3d {
38465
38716
  this.parts[2*i] = this.parts[2*i + 1] = 0;
38466
38717
  ratios[i] = 0.0;
38467
38718
  }
38468
-
38719
+
38469
38720
  n_saved = this.new_split_chain(nsse, sratio, minSize, minSSE, maxCsz, avgCts, cDelta, ncFact, this.parts, n_saved, ratios);
38470
38721
 
38471
38722
  // save domain data
@@ -38506,14 +38757,14 @@ class Domain3d {
38506
38757
  //resflags.clear();
38507
38758
 
38508
38759
  //let resflags = [];
38509
- let resflags = {};
38760
+ let resflags = {}; // keys are 1-based positions
38510
38761
 
38511
38762
  // a domain must have at least 3 SSEs...
38512
38763
  if (prts.length <= 2) continue;
38513
38764
 
38514
38765
  for (let i = 0; i < seqLen; i++) {
38515
38766
  //resflags.push(0);
38516
- resflags[resiArray[i]] = 0;
38767
+ resflags[i + 1] = 0;
38517
38768
  }
38518
38769
 
38519
38770
  for (let i = 0; i < prts.length; i++) {
@@ -38529,17 +38780,14 @@ class Domain3d {
38529
38780
  let To = sserec.To;
38530
38781
 
38531
38782
  for (let j = From; j <= To; j++) {
38532
- //resflags[j - 1] = 1;
38533
38783
  resflags[j] = 1;
38534
38784
  }
38535
38785
 
38536
38786
  if ((k == 0) && (From > 1)) {
38537
38787
  // residues with negative residue numbers will not be included
38538
38788
  for (let j = 1; j < From; j++) {
38539
- //resflags[j - 1] = 1;
38540
38789
  // include at most 10 residues
38541
38790
  if(From - j <= 10) {
38542
- //resflags[j - 1] = 1;
38543
38791
  resflags[j] = 1;
38544
38792
  }
38545
38793
  }
@@ -38549,10 +38797,8 @@ class Domain3d {
38549
38797
  if ((k == substruct.length - 1) && (To < parseInt(lastResi))) {
38550
38798
  //for (let j = To + 1; j <= seqLen; j++) {
38551
38799
  for (let j = To + 1; j <= parseInt(lastResi); j++) {
38552
- //resflags[j - 1] = 1;
38553
38800
  // include at most 10 residues
38554
38801
  if(j - To <= 10) {
38555
- //resflags[j - 1] = 1;
38556
38802
  resflags[j] = 1;
38557
38803
  }
38558
38804
  }
@@ -38568,7 +38814,6 @@ class Domain3d {
38568
38814
 
38569
38815
  if (ll > 0) {
38570
38816
  for (let j = From - ll; j <= From - 1; j++) {
38571
- //resflags[j - 1] = 1;
38572
38817
  resflags[j] = 1;
38573
38818
  }
38574
38819
  }
@@ -38587,7 +38832,6 @@ class Domain3d {
38587
38832
 
38588
38833
  if (ll > 0) {
38589
38834
  for (let j = To + 1; j <= To + ll; j++) {
38590
- //resflags[j - 1] = 1;
38591
38835
  resflags[j] = 1;
38592
38836
  }
38593
38837
  }
@@ -38599,16 +38843,15 @@ class Domain3d {
38599
38843
  let startseg;
38600
38844
  //vector<int> segments;
38601
38845
  //segments.clear();
38602
- let segments = [];
38846
+ let segments = []; //use position instead of residue number
38603
38847
 
38604
38848
  for (let i = 0; i < seqLen; i++) {
38605
38849
  //let rf = resflags[i];
38606
- let rf = resflags[resiArray[i]];
38850
+ let rf = resflags[i + 1];
38607
38851
 
38608
38852
  if (!inseg && (rf == 1)) {
38609
38853
  // new segment starts here
38610
- //startseg = i + 1;
38611
- startseg = resiArray[i];
38854
+ startseg = i + 1;
38612
38855
  inseg = true;
38613
38856
  continue;
38614
38857
  }
@@ -38616,8 +38859,7 @@ class Domain3d {
38616
38859
  if (inseg && (rf == 0)) {
38617
38860
  // segment ends
38618
38861
  segments.push(startseg);
38619
- //segments.push(i);
38620
- segments.push(resiArray[i]);
38862
+ segments.push(i);
38621
38863
  inseg = false;
38622
38864
  }
38623
38865
  }
@@ -38625,7 +38867,6 @@ class Domain3d {
38625
38867
  // check for the last segment
38626
38868
  if (inseg) {
38627
38869
  segments.push(startseg);
38628
- //segments.push(seqLen);
38629
38870
  segments.push(lastResi);
38630
38871
  }
38631
38872
 
@@ -38646,8 +38887,8 @@ class Domain3d {
38646
38887
  }
38647
38888
  }
38648
38889
  }
38649
-
38650
- return {subdomains: subdomains, substruct: substruct};
38890
+
38891
+ return {subdomains: subdomains, substruct: substruct, pos2resi:pos2resi };
38651
38892
  } // end c2b_NewSplitChain
38652
38893
 
38653
38894
  getDomainJsonForAlign(atoms) { let ic = this.icn3d, me = ic.icn3dui;
@@ -38655,6 +38896,7 @@ class Domain3d {
38655
38896
 
38656
38897
  let subdomains = result.subdomains;
38657
38898
  let substruct = result.substruct;
38899
+ let pos2resi = result.pos2resi;
38658
38900
 
38659
38901
  let residueHash = ic.firstAtomObjCls.getResiduesFromAtoms(atoms);
38660
38902
  let residueArray = Object.keys(residueHash);
@@ -38682,8 +38924,8 @@ class Domain3d {
38682
38924
  //ss: sstype ss_start ss_end x1 y1 z1 x2 y2 z2
38683
38925
  //sstype: 1 (helix), 2 (sheet)
38684
38926
  let sstype = (substruct[k].Sheet) ? 2 : 1;
38685
- let from = substruct[k].From;
38686
- let to = substruct[k].To;
38927
+ let from = pos2resi[substruct[k].From];
38928
+ let to = pos2resi[substruct[k].To];
38687
38929
 
38688
38930
  let residFrom = chnid + "_" + from;
38689
38931
  let atomFrom = ic.firstAtomObjCls.getFirstCalphaAtomObj(ic.residues[residFrom]);
@@ -39700,7 +39942,7 @@ class AddTrack {
39700
39942
  let legendHtml = me.htmlCls.clickMenuCls.setLegendHtml();
39701
39943
 
39702
39944
  //$("#" + me.pre + "legend").html(legendHtml);
39703
- $("#" + me.pre + "dl_legend").html(legendHtml);
39945
+ $("#" + me.pre + "dl_legend_html").html(legendHtml);
39704
39946
  me.htmlCls.dialogCls.openDlg('dl_legend', 'Color range');
39705
39947
  }
39706
39948
  else if(type == 'tube') {
@@ -41479,6 +41721,8 @@ class ShowSeq {
41479
41721
  let html = '', html3 = '';
41480
41722
 
41481
41723
  let chainList = '';
41724
+ if(!ic.chainid2index[chnid]) return {html: html, html3: html3};
41725
+
41482
41726
  for(let i = 0, il = ic.chainid2index[chnid].length; i < il; ++i) {
41483
41727
  chainList += ic.refpdbArray[ic.chainid2index[chnid][i]] + " ";
41484
41728
  }
@@ -41754,7 +41998,7 @@ class ShowSeq {
41754
41998
  }
41755
41999
  else {
41756
42000
  let refnum = parseInt(refnumStr).toString();
41757
- let color = this.getRefnumColor(currStrand);
42001
+ let color = this.getRefnumColor(currStrand, true);
41758
42002
  let colorStr = 'style="color:' + color + '"';
41759
42003
 
41760
42004
  let lastTwo = parseInt(refnum.substr(refnum.length - 2, 2));
@@ -41925,7 +42169,7 @@ class ShowSeq {
41925
42169
 
41926
42170
  getRefnumHtml(residueid, refnumStr, refnumStr_ori, refnumLabel, currStrand, bLoop, bHidelabel) { let ic = this.icn3d, me = ic.icn3dui;
41927
42171
  let refnum = parseInt(refnumStr).toString();
41928
- let color = this.getRefnumColor(currStrand);
42172
+ let color = this.getRefnumColor(currStrand, true);
41929
42173
  let colorStr = (!bLoop) ? 'style="color:' + color + '; text-decoration: underline overline;"' : 'style="color:' + color + '"';
41930
42174
 
41931
42175
  let lastTwo = parseInt(refnum.substr(refnum.length - 2, 2));
@@ -41951,45 +42195,66 @@ class ShowSeq {
41951
42195
  return html;
41952
42196
  }
41953
42197
 
41954
- getRefnumColor(currStrand) { let ic = this.icn3d, me = ic.icn3dui;
41955
- if(currStrand == "A^") { //magenta // deep sky blue
41956
- return '#FF00FF'; //'#9900ff'; //'#00BFFF';
42198
+ getRefnumColor(currStrand, bText) { let ic = this.icn3d, me = ic.icn3dui;
42199
+ if(currStrand == "A^") {
42200
+ return '#FF00FF';
41957
42201
  }
41958
- else if(currStrand == "A") { //rebecca purple // blue
41959
- return '#663399'; //'#9900ff'; //'#0000FF';
42202
+ else if(currStrand == "A") {
42203
+ return '#663399';
41960
42204
  }
41961
- else if(currStrand == "A*") { //pink // sky blue
41962
- return '#FFC0CB'; //'#9900ff'; //'#87CEEB';
42205
+ else if(currStrand == "A*") {
42206
+ return '#FFC0CB';
41963
42207
  }
41964
- else if(currStrand == "A'") { //medium purple // steel blue
41965
- return '#9370db'; //'#9900ff'; //'#4682B4';
42208
+ else if(currStrand == "A'") {
42209
+ return '#663399';
41966
42210
  }
41967
- else if(currStrand == "B") { //medium orchid // cyan
41968
- return '#ba55d3'; //'#0000FF'; //'#4a86e8'; //'#00FFFF';
42211
+ else if(currStrand == "B") {
42212
+ return '#ba55d3';
41969
42213
  }
41970
- else if(currStrand == "C") { //blue // green
41971
- return '#0000FF'; //'#76d6ff'; //'#00FF00';
42214
+ else if(currStrand == "C") {
42215
+ return '#0000FF';
41972
42216
  }
41973
- else if(currStrand == "C'") { //corn blue // yellow
41974
- return '#6495ED'; //'#006400'; //'#00b050'; //'#FFFF00';
42217
+ else if(currStrand == "C'") {
42218
+ return '#6495ED';
41975
42219
  }
41976
- else if(currStrand == "C''") { //dark green // orange
41977
- return '#006400'; //'#00ff00'; //'#FFA500';
42220
+ else if(currStrand == "C''") {
42221
+ return '#006400';
41978
42222
  }
41979
- else if(currStrand == "D") { //green // brown
41980
- return '#00FF00'; //'#fffb00'; //'#A52A2A';
42223
+ else if(currStrand == "D") {
42224
+ return '#00FF00';
41981
42225
  }
41982
- else if(currStrand == "E") { //yellow // pink
41983
- return '#F0E68C'; //'#ff9900'; //'#ffd966'; //'#FFC0CB';
42226
+ else if(currStrand == "E") {
42227
+ return (bText) ? "#F7DC6F" : "#FFFF00";
41984
42228
  }
41985
- else if(currStrand == "F") { //orange // magenta
41986
- return '#FFA500'; //'#FF00FF'; //'#ff9900'; //'#FF00FF';
42229
+ else if(currStrand == "F") {
42230
+ return '#FFA500';
41987
42231
  }
41988
- else if(currStrand == "G") { //red // red
41989
- return '#FF0000'; //'#ff2600'; //'#FF0000';
42232
+ else if(currStrand == "G") {
42233
+ return '#FF0000';
41990
42234
  }
41991
- else if(currStrand == "G*") { //dark red // salmon
41992
- return '#8B0000'; //'#ff2600'; //'#FA8072';
42235
+ else if(currStrand == "G*") {
42236
+ return '#8B0000';
42237
+ }
42238
+ else {
42239
+ return me.htmlCls.GREYB;
42240
+ }
42241
+ }
42242
+
42243
+ getProtodomainColor(currStrand) { let ic = this.icn3d, me = ic.icn3dui;
42244
+ if((currStrand && currStrand.substr(0,1) == "A") || currStrand == "D") {
42245
+ return '#0000FF';
42246
+ }
42247
+ else if(currStrand == "B" || currStrand == "E") {
42248
+ return '#006400';
42249
+ }
42250
+ else if(currStrand == "C" || currStrand == "F") {
42251
+ return "#FFFF00"; //'#F0E68C';
42252
+ }
42253
+ else if(currStrand == "C'" || (currStrand && currStrand.substr(0, 1) == "G")) {
42254
+ return '#FFA500';
42255
+ }
42256
+ else if(currStrand == "C''") { //linker
42257
+ return '#FF0000';
41993
42258
  }
41994
42259
  else {
41995
42260
  return me.htmlCls.GREYB;
@@ -42567,7 +42832,7 @@ class HlUpdate {
42567
42832
  html2ddgm += ic.diagram2dCls.draw2Ddgm(ic.interactionData, ic.inputid, undefined, true);
42568
42833
  html2ddgm += ic.diagram2dCls.set2DdgmNote();
42569
42834
 
42570
- $("#" + ic.pre + "dl_2ddgm").html(html2ddgm);
42835
+ $("#" + ic.pre + "dl_2ddgm_html").html(html2ddgm);
42571
42836
  }
42572
42837
  else if(ic.mmdbidArray &&(me.cfg.align !== undefined || me.cfg.chainalign !== undefined || ic.bRealign)) {
42573
42838
  html2ddgm += ic.diagram2dCls.draw2Ddgm(ic.interactionData1, ic.mmdbidArray[0].toUpperCase(), 0, true);
@@ -42579,7 +42844,7 @@ class HlUpdate {
42579
42844
  }
42580
42845
  html2ddgm += ic.diagram2dCls.set2DdgmNote(true);
42581
42846
 
42582
- $("#" + ic.pre + "dl_2ddgm").html(html2ddgm);
42847
+ $("#" + ic.pre + "dl_2ddgm_html").html(html2ddgm);
42583
42848
  }
42584
42849
  }
42585
42850
 
@@ -43058,7 +43323,7 @@ class LineGraph {
43058
43323
  // Node for common interaction: {id : "Q24.A.2AJF|Q24", r : "1_1_2AJF_A_24", s: "a", ...}
43059
43324
  let nodeArray1SplitCommon = [], nodeArray2SplitCommon = [], linkArraySplitCommon = [], nameHashSplitCommon = [];
43060
43325
  let nodeArray1SplitDiff = [], nodeArray2SplitDiff = [], linkArraySplitDiff = [], nameHashSplitDiff = [];
43061
- let linkedNodeCnt = {};
43326
+ let linkedNodeCnt = {}, linkedNodeInterDiff = {};
43062
43327
 
43063
43328
  for(let i = 0, il = structureArray.length; i < il; ++i) {
43064
43329
  nodeArray1Split[i] = [];
@@ -43078,7 +43343,7 @@ class LineGraph {
43078
43343
 
43079
43344
  struc2index[structureArray[i]] = i;
43080
43345
  }
43081
-
43346
+
43082
43347
  for(let i = 0, il = linkArray.length; i < il; ++i) {
43083
43348
  let link = linkArray[i];
43084
43349
  let nodeA = name2node[link.source];
@@ -43114,9 +43379,11 @@ class LineGraph {
43114
43379
 
43115
43380
  if(!linkedNodeCnt.hasOwnProperty(mappingid)) {
43116
43381
  linkedNodeCnt[mappingid] = 1;
43382
+ linkedNodeInterDiff[mappingid] = link.n;
43117
43383
  }
43118
- else {
43119
- ++linkedNodeCnt[mappingid];
43384
+ else {
43385
+ ++linkedNodeCnt[mappingid];
43386
+ linkedNodeInterDiff[mappingid] -= link.n; // show difference
43120
43387
  }
43121
43388
  }
43122
43389
  }
@@ -43167,7 +43434,7 @@ class LineGraph {
43167
43434
  linkDiff.source += separatorDiff + ic.chainsMapping[chainid1][resid1];
43168
43435
  linkDiff.target += separatorDiff + ic.chainsMapping[chainid2][resid2];
43169
43436
 
43170
- if(linkedNodeCnt[mappingid] == structureArray.length) {
43437
+ if(linkedNodeCnt[mappingid] == structureArray.length && linkedNodeInterDiff[mappingid] == 0) {
43171
43438
  linkArraySplitCommon[index].push(linkCommon);
43172
43439
  }
43173
43440
  else {
@@ -43465,9 +43732,9 @@ class LineGraph {
43465
43732
  if(pos1 === undefined || pos2 === undefined) continue;
43466
43733
  let linestrokewidth;
43467
43734
  if(link.v == me.htmlCls.contactValue) {
43468
- linestrokewidth = 1;
43735
+ linestrokewidth = (link.n == 1) ? 1 : 3;
43469
43736
  } else {
43470
- linestrokewidth = 2;
43737
+ linestrokewidth = (link.n == 1) ? 2 : 4;
43471
43738
  }
43472
43739
  let strokecolor;
43473
43740
  if(link.v == me.htmlCls.hbondValue) {
@@ -43484,8 +43751,9 @@ class LineGraph {
43484
43751
  strokecolor = "#" + me.htmlCls.contactColor;
43485
43752
  }
43486
43753
  html += "<g class='icn3d-interaction' resid1='" + resid1 + "' resid2='" + resid2 + "' >";
43487
- html += "<title>Interaction of residue " + node1.id + " with residue " + node2.id + "</title>";
43488
- html += "<line x1='" + pos1.x + "' y1='" + pos1.y + "' x2='" + pos2.x + "' y2='" + pos2.y + "' stroke='" + strokecolor + "' stroke-width='" + linestrokewidth + "' /></g>";
43754
+ let interactStr = (link.n == 1) ? 'Interaction' : link.n + ' interactions';
43755
+ if(link.n > 1) html += "<title>" + interactStr + " of residue " + node1.id + " with residue " + node2.id + "</title>";
43756
+ html += "<line x1='" + pos1.x + "' y1='" + pos1.y + "' x2='" + pos2.x + "' y2='" + pos2.y + "' stroke='" + strokecolor + "' stroke-width='" + linestrokewidth + "'/></g>";
43489
43757
  }
43490
43758
  // show nodes later
43491
43759
  html += nodeHtml;
@@ -43578,9 +43846,9 @@ class LineGraph {
43578
43846
 
43579
43847
  let linestrokewidth;
43580
43848
  if(link.v == me.htmlCls.contactValue) {
43581
- linestrokewidth = 1;
43849
+ linestrokewidth = (link.n == 1) ? 1 : 3;
43582
43850
  } else {
43583
- linestrokewidth = 2;
43851
+ linestrokewidth = (link.n == 1) ? 2 : 4;
43584
43852
  }
43585
43853
 
43586
43854
  if(bAfMap && ic.hex2skip[link.c]) ;
@@ -43595,7 +43863,8 @@ class LineGraph {
43595
43863
  }
43596
43864
  else {
43597
43865
  html += "<g class='icn3d-interaction' resid1='" + resid1 + "' resid2='" + resid2 + "' >";
43598
- html += "<title>Interaction of residue " + node1.id + " with residue " + node2.id + "</title>";
43866
+ let interactStr = (link.n == 1) ? 'Interaction' : link.n + ' interactions';
43867
+ if(link.n > 1) html += "<title>" + interactStr + " of residue " + node1.id + " with residue " + node2.id + "</title>";
43599
43868
  if(bContactMap) {
43600
43869
  html += "<rect x='" +(pos2.x - halfSize).toString() + "' y='" +(pos1.y - halfSize).toString() + "' width='" + rectSize + "' height='" + rectSize + "' fill='" + strokecolor + "' stroke-width='" + linestrokewidth + "' stroke='" + strokecolor + "' />";
43601
43870
  }
@@ -43956,7 +44225,10 @@ class GetGraph {
43956
44225
  ic.hBondCls.calculateChemicalHbonds(me.hashUtilsCls.intHash2Atoms(ic.dAtoms, complement, ic.atoms), me.hashUtilsCls.intHash2Atoms(ic.dAtoms, firstSetAtoms, ic.atoms), parseFloat(threshold), bSaltbridge, 'graph', true );
43957
44226
  resid2ResidhashHbond = me.hashUtilsCls.cloneHash(ic.resid2Residhash);
43958
44227
  }
43959
- let hbondStr = this.getGraphLinks(resid2ResidhashHbond, resid2ResidhashHbond, me.htmlCls.hbondInsideColor, labelType, me.htmlCls.hbondValuehbondInsideValue);
44228
+
44229
+ //let hbondStr = this.getGraphLinks(resid2ResidhashHbond, resid2ResidhashHbond, me.htmlCls.hbondInsideColor, labelType, me.htmlCls.hbondValuehbondInsideValue);
44230
+ let hbondStr = this.getGraphLinks(resid2ResidhashHbond, resid2ResidhashHbond, me.htmlCls.hbondInsideColor, labelType, me.htmlCls.hbondInsideValue);
44231
+
43960
44232
  return hbondStr;
43961
44233
  }
43962
44234
  getIonicLinksForSet(atoms, labelType) { let ic = this.icn3d, me = ic.icn3dui;
@@ -44056,9 +44328,10 @@ class GetGraph {
44056
44328
  getGraphLinks(hash1, hash2, color, labelType, value, bCartoon2d) {var ic = this.icn3d, me = ic.icn3dui;
44057
44329
  let hbondStr = '';
44058
44330
  value =(value === undefined) ? 1 : value;
44059
- let prevLinkStr = '';
44060
- let sourceTargetHash = {};
44331
+ //let prevLinkStr = '';
44332
+ //let sourceTargetHash = {};
44061
44333
 
44334
+ let linkstr2cnt = {};
44062
44335
  for(let resid1 in hash1) {
44063
44336
  //ASN $1KQ2.A:6@ND2
44064
44337
  //or ASN $1KQ2.A:6
@@ -44089,7 +44362,7 @@ class GetGraph {
44089
44362
  resName1 = ic.resi2resirange[resName1];
44090
44363
  resName2 = ic.resi2resirange[resName2];
44091
44364
  }
44092
-
44365
+ /*
44093
44366
  if(!sourceTargetHash.hasOwnProperty(resName1 + '_' + resName2) && resName1 !== undefined && resName2 !== undefined ) {
44094
44367
  let linkStr = ', {"source": "' + resName1 + '", "target": "' + resName2 + '", "v": ' + value + ', "c": "' + color + '"}';
44095
44368
  if(linkStr != prevLinkStr) hbondStr += linkStr;
@@ -44098,8 +44371,27 @@ class GetGraph {
44098
44371
  sourceTargetHash[resName1 + '_' + resName2] = 1;
44099
44372
  sourceTargetHash[resName2 + '_' + resName1] = 1;
44100
44373
  }
44374
+ */
44375
+
44376
+ if(resName1 !== undefined && resName2 !== undefined ) {
44377
+ let linkStr = '"source": "' + resName1 + '", "target": "' + resName2 + '", "v": ' + value + ', "c": "' + color + '"';
44378
+
44379
+ //prevLinkStr = linkStr;
44380
+
44381
+ if(!linkstr2cnt.hasOwnProperty(linkStr)) {
44382
+ linkstr2cnt[linkStr] = 1;
44383
+ }
44384
+ else {
44385
+ ++linkstr2cnt[linkStr];
44386
+ }
44387
+ }
44101
44388
  }
44102
44389
  }
44390
+
44391
+ for(let linkStr in linkstr2cnt) {
44392
+ hbondStr += ', {' + linkStr + ', "n": ' + linkstr2cnt[linkStr] + '}';
44393
+ }
44394
+
44103
44395
  return hbondStr;
44104
44396
  }
44105
44397
  convertLabel2Resid(residLabel) {var ic = this.icn3d; ic.icn3dui;
@@ -44535,12 +44827,14 @@ class ViewInterPairs {
44535
44827
  let bondCnt;
44536
44828
 
44537
44829
  // reset
44538
- ic.hbondpnts = [];
44539
- ic.saltbridgepnts = [];
44540
- ic.contactpnts = [];
44541
- ic.halogenpnts = [];
44542
- ic.picationpnts = [];
44543
- ic.pistackingpnts = [];
44830
+ if(!bHbondCalc) {
44831
+ ic.hbondpnts = [];
44832
+ ic.saltbridgepnts = [];
44833
+ ic.contactpnts = [];
44834
+ ic.halogenpnts = [];
44835
+ ic.picationpnts = [];
44836
+ ic.pistackingpnts = [];
44837
+ }
44544
44838
 
44545
44839
  // type: view, save, forcegraph
44546
44840
  ic.bRender = false;
@@ -44812,11 +45106,11 @@ class ViewInterPairs {
44812
45106
  html += result.html;
44813
45107
  bondCnt = result.bondCnt;
44814
45108
 
44815
- $("#" + ic.pre + "dl_interactionsorted").html(html);
45109
+ $("#" + ic.pre + "dl_interactionsorted_html").html(html);
44816
45110
  me.htmlCls.dialogCls.openDlg('dl_interactionsorted', 'Show sorted interactions');
44817
45111
  }
44818
45112
  else if(type == 'view') {
44819
- $("#" + ic.pre + "dl_allinteraction").html(html);
45113
+ $("#" + ic.pre + "dl_allinteraction_html").html(html);
44820
45114
  me.htmlCls.dialogCls.openDlg('dl_allinteraction', 'Show interactions');
44821
45115
  }
44822
45116
  else if(type == 'linegraph') {
@@ -47144,7 +47438,7 @@ class ChainalignParser {
47144
47438
  me.htmlCls.clickMenuCls.setLogCmd(logStr, false);
47145
47439
  let html = "<br><b>Alignment RMSD</b>: " + rmsd.toPrecision(4) + " &#8491;<br>";
47146
47440
  if(me.cfg.aligntool == 'tmalign') html += "<b>TM-score</b>: " + align[0].score.toPrecision(4) + "<br><br>";
47147
- $("#" + ic.pre + "dl_rmsd").html(html);
47441
+ $("#" + ic.pre + "dl_rmsd_html").html(html);
47148
47442
  if(!me.cfg.bSidebyside) me.htmlCls.dialogCls.openDlg('dl_rmsd', 'RMSD of alignment');
47149
47443
 
47150
47444
  bAligned = true;
@@ -47702,7 +47996,7 @@ class MmcifParser {
47702
47996
  }
47703
47997
 
47704
47998
  async downloadMmcifSymmetry(mmcifid, type) { let ic = this.icn3d, me = ic.icn3dui;
47705
- // https://files.rcsb.org/header/ i snot accessible in Node.js
47999
+ // https://files.rcsb.org/header/ is not accessible in Node.js
47706
48000
  let url = (me.bNode) ? "https://files.rcsb.org/view/" + mmcifid + ".cif" : "https://files.rcsb.org/header/" + mmcifid + ".cif";
47707
48001
 
47708
48002
  //ic.bCid = undefined;
@@ -49001,7 +49295,8 @@ class PdbParser {
49001
49295
  }
49002
49296
  else {
49003
49297
  url = "https://files.rcsb.org/view/" + pdbid + ".pdb";
49004
- ic.ParserUtilsCls.setYourNote(pdbid.toUpperCase() + '(PDB) in iCn3D');
49298
+ pdbid = pdbid.toUpperCase();
49299
+ ic.ParserUtilsCls.setYourNote(pdbid + '(PDB) in iCn3D');
49005
49300
  }
49006
49301
 
49007
49302
  //ic.bCid = undefined;
@@ -51409,7 +51704,7 @@ class ParserUtils {
51409
51704
  //if(window.dialog) window.dialog.dialog( "close" );
51410
51705
  html += me.utilsCls.getMemDesc();
51411
51706
  }
51412
- $("#" + ic.pre + "dl_rmsd").html(html);
51707
+ $("#" + ic.pre + "dl_rmsd_html").html(html);
51413
51708
  if(!me.cfg.bSidebyside) me.htmlCls.dialogCls.openDlg('dl_rmsd', 'Realignment RMSD');
51414
51709
  }
51415
51710
 
@@ -51590,7 +51885,7 @@ class ParserUtils {
51590
51885
  ic.diagram2dCls.draw2Ddgm(ic.interactionData2, mmdbid2, 1);
51591
51886
 
51592
51887
  ic.html2ddgm += "<br>" + ic.diagram2dCls.set2DdgmNote(true);
51593
- $("#" + ic.pre + "dl_2ddgm").html(ic.html2ddgm);
51888
+ $("#" + ic.pre + "dl_2ddgm_html").html(ic.html2ddgm);
51594
51889
 
51595
51890
  ic.b2DShown = true;
51596
51891
 
@@ -51643,7 +51938,7 @@ class ParserUtils {
51643
51938
  ic.html2ddgm += "<br>" + ic.diagram2dCls.set2DdgmNote(true);
51644
51939
 
51645
51940
  ic.b2DShown = true;
51646
- $("#" + ic.pre + "dl_2ddgm").html(ic.html2ddgm);
51941
+ $("#" + ic.pre + "dl_2ddgm_html").html(ic.html2ddgm);
51647
51942
  if(me.cfg.show2d) me.htmlCls.dialogCls.openDlg('dl_2ddgm', 'Interactions');
51648
51943
 
51649
51944
  /// if(ic.deferredViewinteraction !== undefined) ic.deferredViewinteraction.resolve();
@@ -51661,7 +51956,7 @@ class ParserUtils {
51661
51956
  ic.diagram2dCls.draw2Ddgm(ic.interactionData, mmdbid);
51662
51957
 
51663
51958
  ic.html2ddgm += "<br>" + ic.diagram2dCls.set2DdgmNote();
51664
- $("#" + ic.pre + "dl_2ddgm").html(ic.html2ddgm);
51959
+ $("#" + ic.pre + "dl_2ddgm_html").html(ic.html2ddgm);
51665
51960
  }
51666
51961
 
51667
51962
  ic.b2DShown = true;
@@ -51764,7 +52059,7 @@ class ParserUtils {
51764
52059
  let rmsd = ic.rmsd_supr.rmsd;
51765
52060
 
51766
52061
  me.htmlCls.clickMenuCls.setLogCmd("RMSD of alignment to OPM: " + rmsd.toPrecision(4), false);
51767
- //$("#" + ic.pre + "dl_rmsd").html("<br><b>RMSD of alignment to OPM</b>: " + rmsd.toPrecision(4) + " &#8491;<br><br>");
52062
+ //$("#" + ic.pre + "dl_rmsd_html").html("<br><b>RMSD of alignment to OPM</b>: " + rmsd.toPrecision(4) + " &#8491;<br><br>");
51768
52063
  //if(!me.cfg.bSidebyside) me.htmlCls.dialogCls.openDlg('dl_rmsd', 'RMSD of alignment to OPM');
51769
52064
 
51770
52065
  let dxymaxsq = 0;
@@ -51970,6 +52265,16 @@ class ParserUtils {
51970
52265
 
51971
52266
  // set defined sets before loadScript
51972
52267
  if(ic.bInitial) {
52268
+ if(me.cfg.mobilemenu) {
52269
+ me.htmlCls.shownMenus = me.hashUtilsCls.cloneHash(me.htmlCls.simpleMenus);
52270
+ let bNoSave = true;
52271
+ me.htmlCls.clickMenuCls.applyShownMenus(bNoSave);
52272
+ }
52273
+ // else {
52274
+ // me.htmlCls.shownMenus = me.hashUtilsCls.cloneHash(me.htmlCls.allMenus);
52275
+ // me.htmlCls.clickMenuCls.applyShownMenus();
52276
+ // }
52277
+
51973
52278
  if(me.cfg.showsets) {
51974
52279
  ic.definedSetsCls.showSets();
51975
52280
  }
@@ -54310,6 +54615,7 @@ class LoadPDB {
54310
54615
  //let chainMissingResidueArray = {}
54311
54616
 
54312
54617
  let id = (pdbid) ? pdbid : ic.defaultPdbId;
54618
+
54313
54619
  let structure = id;
54314
54620
 
54315
54621
  let prevMissingChain = '';
@@ -55409,7 +55715,7 @@ class Vastplus {
55409
55715
  bAligned = true;
55410
55716
 
55411
55717
  me.htmlCls.clickMenuCls.setLogCmd("realignment RMSD: " + rmsd.toPrecision(4), false);
55412
- $("#" + ic.pre + "dl_rmsd").html("<br><b>Realignment RMSD</b>: " + rmsd.toPrecision(4) + " &#8491;<br><br>");
55718
+ $("#" + ic.pre + "dl_rmsd_html").html("<br><b>Realignment RMSD</b>: " + rmsd.toPrecision(4) + " &#8491;<br><br>");
55413
55719
  if(!me.cfg.bSidebyside) me.htmlCls.dialogCls.openDlg('dl_rmsd', 'Realignment RMSD');
55414
55720
 
55415
55721
  // apply matrix for each atom
@@ -57355,7 +57661,7 @@ class ApplyCommand {
57355
57661
 
57356
57662
  let legendHtml = me.htmlCls.clickMenuCls.setLegendHtml();
57357
57663
  //$("#" + me.pre + "legend").html(legendHtml).show();
57358
- $("#" + me.pre + "dl_legend").html(legendHtml);
57664
+ $("#" + me.pre + "dl_legend_html").html(legendHtml);
57359
57665
  me.htmlCls.dialogCls.openDlg('dl_legend', 'Color Range');
57360
57666
  }
57361
57667
  }
@@ -60871,7 +61177,7 @@ class Delphi {
60871
61177
  let phidata = await this.CalcPhiPrms(gsize, salt, contour, bSurface, data);
60872
61178
 
60873
61179
  this.loadPhiData(phidata, contour, bSurface);
60874
-
61180
+
60875
61181
  ic.bAjaxPhi = true;
60876
61182
 
60877
61183
  if(bSurface) {
@@ -61635,8 +61941,8 @@ class Dssp {
61635
61941
 
61636
61942
  // align each 3D domain with reference structure
61637
61943
  let result = ic.domain3dCls.c2b_NewSplitChain(ic.chains[chainid]);
61638
- let subdomains = result.subdomains;
61639
-
61944
+ let subdomains = result.subdomains;
61945
+
61640
61946
  let domainAtomsArray = [];
61641
61947
  if(subdomains.length <= 1) {
61642
61948
  domainAtomsArray.push(ic.chains[chainid]);
@@ -61666,9 +61972,9 @@ class Dssp {
61666
61972
  }
61667
61973
 
61668
61974
  for(let k = 0, kl = domainAtomsArray.length; k < kl; ++k) {
61669
-
61670
61975
  let pdb_target = ic.saveFileCls.getAtomPDB(domainAtomsArray[k], undefined, undefined, undefined, undefined, struct);
61671
61976
  let domainid = chainid + '-' + k;
61977
+
61672
61978
  for(let index = 0, indexl = dataArray.length; index < indexl; ++index) {
61673
61979
  let struct2 = ic.defaultPdbId + index;
61674
61980
  let pdb_query = dataArray[index].value; //[0];
@@ -61889,7 +62195,7 @@ if(!me.bNode) {
61889
62195
  else if(refnum >= 1200 && refnum < 1300) return "A'" + oriRefnum;
61890
62196
  else if(refnum >= 1300 && refnum < 1400) return "A*" + oriRefnum;
61891
62197
  else if(refnum >= 1400 && refnum < 2000) {
61892
- if(prevStrand.substr(0, 1) == 'A') {
62198
+ if(prevStrand && prevStrand.substr(0, 1) == 'A') {
61893
62199
  return prevStrand + oriRefnum;
61894
62200
  }
61895
62201
  else {
@@ -63258,7 +63564,7 @@ class Analysis {
63258
63564
  //html += '<b>Buried Surface for both Sets</b>: ' + buriedArea + ' &#8491;<sup>2</sup><br>';
63259
63565
  html += '<b>Buried Surface for Set 1</b>: ' + buriedArea2 + ' &#8491;<sup>2</sup><br>';
63260
63566
  html += '<b>Buried Surface for Set 2</b>: ' + buriedArea1 + ' &#8491;<sup>2</sup><br><br>';
63261
- $("#" + ic.pre + "dl_buriedarea").html(html);
63567
+ $("#" + ic.pre + "dl_buriedarea_html").html(html);
63262
63568
  me.htmlCls.dialogCls.openDlg('dl_buriedarea', 'Buried solvent accessible surface area in the interface');
63263
63569
  me.htmlCls.clickMenuCls.setLogCmd('buried surface ' + buriedArea, false);
63264
63570
  }
@@ -63364,7 +63670,7 @@ class Analysis {
63364
63670
 
63365
63671
  tableHtml += '</table><br><br>';
63366
63672
 
63367
- $("#" + me.pre + "dl_disttable").html(tableHtml);
63673
+ $("#" + me.pre + "dl_disttable_html").html(tableHtml);
63368
63674
  }
63369
63675
  }
63370
63676
 
@@ -63921,7 +64227,7 @@ class Diagram2d {
63921
64227
 
63922
64228
  ic.html2ddgm += html;
63923
64229
 
63924
- $("#" + ic.pre + "dl_2ddgm").html(ic.html2ddgm);
64230
+ $("#" + ic.pre + "dl_2ddgm_html").html(ic.html2ddgm);
63925
64231
 
63926
64232
  return html;
63927
64233
  }
@@ -69806,7 +70112,7 @@ class iCn3DUI {
69806
70112
  //even when multiple iCn3D viewers are shown together.
69807
70113
  this.pre = this.cfg.divid + "_";
69808
70114
 
69809
- this.REVISION = '3.23.2';
70115
+ this.REVISION = '3.24.0';
69810
70116
 
69811
70117
  // In nodejs, iCn3D defines "window = {navigator: {}}"
69812
70118
  this.bNode = (Object.keys(window).length < 2) ? true : false;