icn3d 3.38.2 → 3.39.1

package/icn3d.module.js

@@ -15153,7 +15153,7 @@ class SetDialog {
         html += me.htmlCls.divStr + "dl_collectionsMenu'>";
         html += '<b>Collection File</b>: <div style="width:20px; margin-top:6px; display:inline-block;"><span id="' + me.pre + 'dl_collection_file_expand" class="ui-icon ui-icon-plus icn3d-expand icn3d-link" style="display:none; width:15px;" title="Expand"></span><span id="' + me.pre + 'dl_collection_file_shrink" class="ui-icon ui-icon-minus icn3d-shrink icn3d-link" style="width:15px;" title="Shrink"></span></div><br>';
         html += me.htmlCls.divStr + "dl_collection_file' style=''>";
-        html += "You can load a collection of structures via a file. Here is <a href='https://github.com/ncbi/icn3d/blob/master/example/collection.json' target='_blank'>one example file</a><br><br>";
+        html += "You can load a collection of structures via a file. Here are <a href='https://github.com/ncbi/icn3d/blob/master/example/collection/' target='_blank'>some example files</a><br><br>";
         html += "Collection file: " + me.htmlCls.inputFileStr + "id='" + me.pre + "collectionfile'><br/>";
         html += me.htmlCls.buttonStr + "reload_collectionfile' style='margin-top: 6px;'>Load</button>";
         html += "</div>";
@@ -15161,7 +15161,26 @@ class SetDialog {
         html += '<br/><b>Structures</b>: <div style="width:20px; margin-top:6px; display:inline-block;"><span id="' + me.pre + 'dl_collection_structures_expand" class="ui-icon ui-icon-plus icn3d-expand icn3d-link" style="width:15px;" title="Expand"></span><span id="' + me.pre + 'dl_collection_structures_shrink" class="ui-icon ui-icon-minus icn3d-shrink icn3d-link" style="display:none; width:15px;" title="Shrink"></span></div><br>';
         html += me.htmlCls.divStr + "dl_collection_structures' style='display: none'>";
         html += "<select id='" + me.pre + "collections_menu'multiple size='6' style='min-width:300px;'></select>";
+        html += '<br/>';
+        html += me.htmlCls.buttonStr + "opendl_export_collections'>Export</button>";
         html += "</div>";
+        html += '<br/>'; 
+        html += "</div>";
+
+        html += me.htmlCls.divStr + "dl_export_collections' class='" + dialogClass + "'>";
+        html += this.addNotebookTitle('dl_export_collections', 'Export Collections');
+        html += "<label for='dl_collectionTitle'>Collection Title: </label>";
+        html += "<input type='text' id='dl_collectionTitle' name='collectionTitle' placeholder='Enter collection title' />";
+        html += '<br/>';
+        html += "<label for='dl_collectionDescription'>Collection Description: </label>";
+        html += "<input type='text' id='dl_collectionDescription' name='collectionDescription' placeholder='Enter collection description' />";
+        html += '<br/>';
+        html += "<input type='radio' id='dl_collectionExportSelected' name='exportOption' value='selected' />";
+        html += "<label for='dl_collectionExportSelected'>Selected</label>";
+        html += "<input type='radio' id='dl_collectionExportAll' name='exportOption' value='all' />";
+        html += "<label for='dl_collectionExportAll'>All</label>";
+        html += '<br/>';
+        html += me.htmlCls.buttonStr + "export_collections'>Export</button>";
         html += "</div>";
 
         html += me.htmlCls.divStr + "dl_menuloadpref' class='" + dialogClass + "'>";
@@ -16492,8 +16511,8 @@ class Events {
 
     saveHtml(id) { let me = this.icn3dui, ic = me.icn3d;
         let html = '';
-        html += '<link rel="stylesheet" href="https:///structure.ncbi.nlm.nih.gov/icn3d/lib/jquery-ui-1.13.2.min.css">\n';
-        html += '<link rel="stylesheet" href="https:///structure.ncbi.nlm.nih.gov/icn3d/icn3d_full_ui.css">\n';
+        html += '<link rel="stylesheet" href="https://www.ncbi.nlm.nih.gov/Structure/icn3d/lib/jquery-ui-1.13.2.min.css">\n';
+        html += '<link rel="stylesheet" href="https://www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d_full_ui.css">\n';
         html += $("#" + id).html();
         let idArray = id.split('_');
         let idStr =(idArray.length > 2) ? idArray[2] : id;
@@ -17582,7 +17601,6 @@ class Events {
 
             urlTarget = '_blank';
 
-            console.log("smiles: " + $("#" + me.pre + "smiles").val() + " encode: " + encodeURIComponent($("#" + me.pre + "smiles").val()));
             window.open(hostUrl + '?smiles=' + encodeURIComponent($("#" + me.pre + "smiles").val()), urlTarget);
         });
 
@@ -17665,28 +17683,232 @@ class Events {
                 $(".ui-dialog-content").dialog("close");
             } else {
                 ic.resizeCanvasCls.closeDialogs();
-            }
+                }
+            ic.bInputfile = false;
+            ic.pdbCollection = [];
+            ic.allData = {};
+            ic.allData['all'] = {
+                'atoms': {},
+                'proteins': {},
+                'nucleotides': {},
+                'chemicals': {},
+                'ions': {},
+                'water': {},
+                'structures': {}, // getSSExpandedAtoms
+                'ssbondpnts': {},
+                'residues': {}, // getSSExpandedAtoms
+                'chains': {},
+                'chainsSeq': {}, //Sequences and Annotation
+                'defNames2Atoms': {},
+                'defNames2Residues': {}
+            };
+            ic.allData['prev'] = {};
+            ic.selectCollectionsCls.reset();
+
+            ic.dAtoms = me.hashUtilsCls.cloneHash(ic.atoms);
+            ic.hAtoms = me.hashUtilsCls.cloneHash(ic.atoms);
             me.htmlCls.setHtmlCls.fileSupport();
+
+            let fileName = file.name;
+            let fileExtension = fileName.split('.').pop().toLowerCase();
+
+            $("#" + ic.pre + "collections_menu").empty();
+            $("#" + ic.pre + "collections_menu").off("change");
+
+            function parseJsonCollection(data) {
+                let dataStr = JSON.parse(data);
+                return dataStr["structures"].map(({ id, title, description, commands }) => {
+                    if (id && id.includes('.pdb')) {
+                        id = id.split('.pdb')[0];
+                    }
+                    return [id, title, description, commands, false];
+                });
+            }
+
+            function parsePdbCollection(data, description = '', commands = []) {         
+                let dataStr = data;
+                let lines = dataStr.split('\n');
+              
+                let sections = [];
+                let currentSection = [];
+              
+                lines.forEach(line => {
+                  if (line.startsWith('HEADER')) {
+                    currentSection = [];
+                    sections.push(currentSection);
+                  }
+                  currentSection.push(line);
+                });
+              
+                let ids = [];
+                let titles = [];
+              
+                sections.forEach((section) => {
+                    let headerLine = section[0];
+                    headerLine = headerLine.replace(/[\n\r]/g, '').trim();
+                    let header = headerLine.split(' ').filter(Boolean);
+                    let lastElement = header[header.length - 1];
+                    ids.push(lastElement);
+                    titles.push(section[1].startsWith('TITLE') ? section[1].split('TITLE').pop().trim() : lastElement);
+                });
+              
+                if (sections.length > 0) {
+                    ic.pdbCollection.push(...sections);
+                }
+
+                return ids.map((id, index, description, commands) => [id, titles[index], description, commands, true]);
+            }
+
+            let collection = [];
+
+            if (fileExtension === 'json' || fileExtension === 'pdb') {
                 let reader = new FileReader();
-                
                 reader.onload = async function (e) {
-                let dataStr = JSON.parse(e.target.result);
-                let collection = [dataStr["structures"].map(({ id }) => id), dataStr["structures"].map(({ title }) => title)];
-                let collectionHtml = ic.selectCollectionsCls.setAtomMenu(collection[0], collection[1]);
+                    if (fileExtension === 'json') {
+                        collection = parseJsonCollection(e.target.result);
+                    } else if (fileExtension === 'pdb') {
+                        ic.bInputfile = true;
+                        collection = parsePdbCollection(e.target.result);
+                    }
 
-                $("#" + ic.pre + "collections_menu").html(collectionHtml);
-                ic.selectCollectionsCls.clickStructure();
-    
-                $("#" + ic.pre + "collections_menu").trigger("change");
-    
-                me.htmlCls.clickMenuCls.setLogCmd(
-                "load collection file " +
-                    $("#" + me.pre + "collectionfile").val(),
-                false
-                );
-                
-            };
-            reader.readAsText(file);
+                    let collectionHtml = await ic.selectCollectionsCls.setAtomMenu(collection);
+
+                    $("#" + ic.pre + "collections_menu").html(collectionHtml);
+                    await ic.selectCollectionsCls.clickStructure(collection);
+                    $("#" + ic.pre + "collections_menu").trigger("change");     
+
+                    me.htmlCls.clickMenuCls.setLogCmd(
+                        "load collection file " +
+                        $("#" + me.pre + "collectionfile").val(),
+                        false
+                    );
+                };
+
+                reader.readAsText(file);
+            } else if (fileExtension === 'zip' || fileExtension === 'gz') {
+                ic.bInputfile = true;
+                let reader2 = new FileReader();
+                reader2.onload = async function (e) {
+                    if (fileExtension === 'zip') {
+                        let url = './script/jszip.js';
+                        await me.getAjaxPromise(url, 'script');
+
+                        let jszip = new JSZip();
+                        try {
+                            let data = await jszip.loadAsync(e.target.result);
+
+                            let hasJson = false;
+                            let hasPdb = false;
+                            let hasGz = false;
+                            let jsonFiles = [];
+                            let pdbFiles = [];
+                            let gzFiles = [];
+
+                            for (let fileName in data.files) {
+                                let file = data.files[fileName];
+                                if (!file.dir) {
+                                    if (fileName.endsWith('.json')) {
+                                        hasJson = true;
+                                        jsonFiles.push(file);
+                                    } else if (fileName.endsWith('.pdb')) {
+                                        hasPdb = true;
+                                        pdbFiles.push(file);
+                                    } else if (fileName.endsWith('.gz')) {
+                                        hasGz = true;
+                                        gzFiles.push(file);
+                                    }
+                                }
+                            }
+
+                            if (hasJson && hasPdb) {
+                                let jsonCollection = [];
+                                for (const file of jsonFiles) {
+                                    let fileData = await file.async('text');
+                                    parseJsonCollection(fileData).forEach(element => {
+                                        jsonCollection.push(element);
+                                    });
+                                }
+
+                                // For each JSON object, check if a corresponding PDB file exists
+                                for (const [id, title, description, commands, _] of jsonCollection) {
+                                    let matchingPdbFile = pdbFiles.find(file => file.name.toLowerCase().includes(id.toLowerCase()));
+                                    if (matchingPdbFile) {
+                                        let pdbFileData = await matchingPdbFile.async('text');
+                                        parsePdbCollection(pdbFileData, description, commands).forEach(element => {
+                                            collection.push(element);
+                                        });
+                                    }
+                                }
+
+                            } else if (hasJson) {
+                                // Do something if only JSON files are present
+                                jsonFiles.forEach(async file => {
+                                    let fileData = await file.async('text');
+                                    parseJsonCollection(fileData).forEach(element => {
+                                        collection.push(element);
+                                    });
+                                });
+                            } else if (hasPdb) {
+                                // Do something if only PDB files are present
+                                pdbFiles.forEach(async file => {
+                                    let fileData = await file.async('text');
+                                    parsePdbCollection(fileData).forEach(element => {
+                                        collection.push(element);
+                                    });
+                                });
+                            } else if (hasGz) {
+                                let url = './script/pako.js';
+                                await me.getAjaxPromise(url, 'script');
+                                try {
+                                    for (const file of gzFiles) {
+                                        let compressed = await file.async('uint8array');
+                                        let decompressed = pako.inflate(compressed, { to: 'string' });
+                                        parsePdbCollection(decompressed).forEach(element => {
+                                            collection.push(element);
+                                        });
+                                    }
+                                } catch (error) {
+                                    console.error('Error loading GZ file', error);
+                                }
+                            }
+                        } catch (error) {
+                            console.error('Error loading ZIP file', error);
+                        }
+                    } else if (fileExtension === 'gz') {
+                        let url = './script/pako.js';
+                        await me.getAjaxPromise(url, 'script');
+                        
+                        try {
+                            const compressed = new Uint8Array(e.target.result);
+                            const decompressed = pako.inflate(compressed, { to: 'string' });
+                            collection = parsePdbCollection(decompressed);
+                        } catch (error) {
+                            console.error('Error loading GZ file', error);
+                        }
+                    }
+
+                    let collectionHtml = await ic.selectCollectionsCls.setAtomMenu(collection);
+
+                    $("#" + ic.pre + "collections_menu").html(collectionHtml);
+                    await ic.selectCollectionsCls.clickStructure(collection);
+
+                    $("#" + ic.pre + "collections_menu").trigger("change");
+
+                    me.htmlCls.clickMenuCls.setLogCmd(
+                        "load collection file " +
+                        $("#" + me.pre + "collectionfile").val(),
+                        false
+                    );
+                };
+
+                reader2.onerror = function(error) {
+                    console.error('Error reading file', error);
+                };
+
+                reader2.readAsArrayBuffer(file);
+            } else {
+                throw new Error('Invalid file type');
+            }
             
             if (Object.keys(me.utilsCls.getStructures(ic.dAtoms))){
                 $("#" + me.pre + "dl_collection_file").hide();
@@ -17709,6 +17931,90 @@ class Events {
             }
         });
 
+        me.myEventCls.onIds("#" + me.pre + "opendl_export_collections", "click", function (e) {
+            me.htmlCls.dialogCls.openDlg("dl_export_collections", "Export Collections");
+        });
+
+        me.myEventCls.onIds("#" + me.pre + "export_collections", "click", function (e) {
+            let ic = me.icn3d;
+
+            const selectElement = document.getElementById(me.pre + 'collections_menu');
+    
+            // Array to store parsed results
+            const structures = [];
+
+            const dl_collectionExportSelected = document.getElementById('dl_collectionExportSelected');
+            const dl_collectionExportAll = document.getElementById('dl_collectionExportAll');
+
+            if (dl_collectionExportSelected.checked) {
+
+                // Iterate over each <option> element
+                Array.from(selectElement.options)
+                    .filter(option => option.selected)
+                    .forEach(option => {
+                        const name = option.value;
+                        const title = option.textContent.trim();
+                        const description = option.getAttribute('data-description');
+
+                        // Push the extracted data into the array
+                        structures.push({
+                            id: name,
+                            title: title,
+                            description: description || '',
+                            commands: (ic.allData[name] && ic.allData[name].commands) ? ic.allData[name].commands : []
+                        });
+                    });
+            } else if (dl_collectionExportAll.checked) {
+                // Iterate over each <option> element
+                Array.from(selectElement.options)
+                    .forEach(option => {
+                        const name = option.value;
+                        const title = option.textContent.trim();
+                        const description = option.getAttribute('data-description');
+
+                        // Push the extracted data into the array
+                        structures.push({
+                            name: name,
+                            title: title,
+                            description: description || '',
+                            commands: (ic.allData[name] && ic.allData[name].commands) ? ic.allData[name].commands : []
+                        });
+                    });
+            }
+
+            
+            const now = new Date();
+            const month = now.getMonth() + 1; // Months are zero-based
+            const day = now.getDate();
+            const year = now.getFullYear();
+            const formattedDate = `${month}_${day}_${year}`;
+
+            const collection = {
+                collectionTitle: document.getElementById('dl_collectionTitle').value,
+                collectionDescription: document.getElementById('dl_collectionDescription').value,
+                structures: structures
+            };
+
+            const filename = `${collection.collectionTitle.replace(/\s+/g, '_')}_${formattedDate}.json`;
+
+            const jsonString = JSON.stringify(collection, null, 2);
+    
+            // Create a Blob with the JSON data
+            const blob = new Blob([jsonString], { type: 'application/json' });
+            const url = URL.createObjectURL(blob);
+            
+            // Create a temporary link element to trigger download
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = filename;
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            
+            // Revoke the object URL after download
+            URL.revokeObjectURL(url);
+        });
+
         me.myEventCls.onIds("#" + me.pre + "reload_dsn6file2fofc", "click", function(e) { let ic = me.icn3d;
            e.preventDefault();
            //if(!me.cfg.notebook) dialog.dialog( "close" );
@@ -20548,7 +20854,7 @@ class Html {
     this.force = 4;
     this.simulation = undefined;
 
-    //this.baseUrl = "https://structure.ncbi.nlm.nih.gov/";
+    //this.baseUrl = "https://www.ncbi.nlm.nih.gov/Structure/";
     this.baseUrl = (window && window.location && window.location.hostname == 'structure.ncbi.nlm.nih.gov') 
         ? "https://structure.ncbi.nlm.nih.gov/Structure/" : "https://www.ncbi.nlm.nih.gov/Structure/";
 
@@ -45589,8 +45895,9 @@ class Domain3d {
 
 			// if(fromPos >= start && toPos <= end) {
 				if(ssCnt > 0) jsonStr += ', ';
-				jsonStr += '[' + sstype + ',' + fromPos + ',' + toPos + ',' + substruct[k].x1.toFixed(2) + ',' + substruct[k].y1.toFixed(2) + ',' 
-					+ substruct[k].z1.toFixed(2) + ',' + substruct[k].x2.toFixed(2) + ',' + substruct[k].y2.toFixed(2) + ',' + substruct[k].z2.toFixed(2) + ']';
+				jsonStr += '[' + sstype + ',' + fromPos + ',' + toPos + ',' + substruct[k].x1.toFixed(2) + ',' + substruct[k].y1.toFixed(2) + ',';
+				// jsonStr += '[' + sstype + ',' + residFrom.split('_')[2] + ',' + residTo.split('_')[2] + ',' + substruct[k].x1.toFixed(2) + ',' + substruct[k].y1.toFixed(2) + ',';
+				jsonStr += substruct[k].z1.toFixed(2) + ',' + substruct[k].x2.toFixed(2) + ',' + substruct[k].y2.toFixed(2) + ',' + substruct[k].z2.toFixed(2) + ']';
 				++ssCnt;
 			// }
 		}				
@@ -45606,6 +45913,7 @@ class Domain3d {
 		for(let j = startAll; j <= endAll; ++j) {
 			let ncbiResid = chnid + '_' + j;
 			let resid = ic.ncbi2resid[ncbiResid];
+			resid.split('_')[2];
 
 			let pos = j;
 
@@ -45613,6 +45921,7 @@ class Domain3d {
 
 			if(!residueHash.hasOwnProperty(resid)) {
 				jsonStr += '[' + pos + ',' + 0 + ',' + fakeCoord + ',' + fakeCoord + ',' + fakeCoord + ']';
+				// jsonStr += '[' + resi + ',' + 0 + ',' + fakeCoord + ',' + fakeCoord + ',' + fakeCoord + ']';
 			}
 			else {
 				let atom = ic.firstAtomObjCls.getFirstCalphaAtomObj(ic.residues[resid]);
@@ -45621,6 +45930,7 @@ class Domain3d {
 				let restype = (me.parasCls.resn2restype[atom.resn]) ? me.parasCls.resn2restype[atom.resn] : 0;
 				
 				jsonStr += '[' + pos + ',' + restype + ',' + atom.coord.x.toFixed(2) + ',' + atom.coord.y.toFixed(2) + ',' + atom.coord.z.toFixed(2) + ']';
+				// jsonStr += '[' + resi + ',' + restype + ',' + atom.coord.x.toFixed(2) + ',' + atom.coord.y.toFixed(2) + ',' + atom.coord.z.toFixed(2) + ']';
 			}
 
 			++domainCnt;		
@@ -52642,7 +52952,10 @@ class ViewInterPairs {
             cntHbond += result.cnt;
             svgHtmlNode += result.svgHtmlNode;
             svgHtmlLine += result.svgHtmlLine;
-            if(result.cnt > 0) residname2List += residname2 + ":hbond_" + result.cnt + " ";
+            // if(result.cnt > 0) residname2List += residname2 + ":hbond_" + result.cnt + " ";
+            // add hydrogen bond between main or side chains. result.mainside has value such as main,side,side,side  
+            // for two hydrogens between main and side, and side and side chains
+            if(result.cnt > 0) residname2List += residname2 + ":hbond_" + result.cnt + ":type_" + result.mainside + " ";
 
             labels2dist = ic.resids2inter[resids]['ionic'];
             result = this.getInteractionPairDetails(labels2dist, type, 'ionic', index2xy, xlen, ylen, xcenter, ycenter);
@@ -52650,7 +52963,7 @@ class ViewInterPairs {
             cntIonic += result.cnt;
             svgHtmlNode += result.svgHtmlNode;
             svgHtmlLine += result.svgHtmlLine;
-            if(result.cnt > 0) residname2List += residname2 + ":ionic_" + result.cnt + " ";
+            if(result.cnt > 0) residname2List += residname2 + ":ionic_" + result.cnt + ":type_" + result.mainside + " ";
 
             labels2dist = ic.resids2inter[resids]['halogen'];
             result = this.getInteractionPairDetails(labels2dist, type, 'halogen', index2xy, xlen, ylen, xcenter, ycenter);
@@ -52658,7 +52971,7 @@ class ViewInterPairs {
             cntHalegen += result.cnt;
             svgHtmlNode += result.svgHtmlNode;
             svgHtmlLine += result.svgHtmlLine;
-            if(result.cnt > 0) residname2List += residname2 + ":halogen_" + result.cnt + " ";
+            if(result.cnt > 0) residname2List += residname2 + ":halogen_" + result.cnt + ":type_" + result.mainside + " ";
 
             labels2dist = ic.resids2inter[resids]['pi-cation'];
             result = this.getInteractionPairDetails(labels2dist, type, 'pi-cation', index2xy, xlen, ylen, xcenter, ycenter);
@@ -52666,7 +52979,7 @@ class ViewInterPairs {
             cntPication += result.cnt;
             svgHtmlNode += result.svgHtmlNode;
             svgHtmlLine += result.svgHtmlLine;
-            if(result.cnt > 0) residname2List += residname2 + ":pi-cation_" + result.cnt + " ";
+            if(result.cnt > 0) residname2List += residname2 + ":pi-cation_" + result.cnt + ":type_" + result.mainside + " ";
 
             labels2dist = ic.resids2inter[resids]['pi-stacking'];
             result = this.getInteractionPairDetails(labels2dist, type, 'pi-stacking', index2xy, xlen, ylen, xcenter, ycenter);
@@ -52674,7 +52987,7 @@ class ViewInterPairs {
             cntPistacking += result.cnt;
             svgHtmlNode += result.svgHtmlNode;
             svgHtmlLine += result.svgHtmlLine;
-            if(result.cnt > 0) residname2List += residname2 + ":pi-stacking_" + result.cnt + " ";
+            if(result.cnt > 0) residname2List += residname2 + ":pi-stacking_" + result.cnt + ":type_" + result.mainside + " ";
 
             // put contact as the last one since contact will use the same node as other interactions in ligand-protein interactoin
             labels2dist = ic.resids2inter[resids]['contact'];
@@ -52728,7 +53041,7 @@ class ViewInterPairs {
         return tmpText;
     }
     getInteractionPairDetails(labels2dist, type, interactionType, index2xy, xlen, ylen, xcenter, ycenter) { let ic = this.icn3d; ic.icn3dui;
-        let svgHtmlNode = '', svgHtmlLine = '', tmpText = '', cnt = 0;
+        let svgHtmlNode = '', svgHtmlLine = '', tmpText = '', cnt = 0, mainside= '';
         let colorText1 = ' <span style="background-color:#';
         let colorText2 = '">&nbsp;&nbsp;&nbsp;</span>';
         if(labels2dist !== undefined) {
@@ -52745,6 +53058,12 @@ class ViewInterPairs {
                 let resid1 = resid1Ori.substr(0, pos1);
                 let resid2 = resid2Ori.substr(0, pos2);
 
+                let atomName1 = resid1.substr(resid1.indexOf('@') + 1);
+                resid2.substr(resid2.indexOf('@') + 1);
+                let atomType1 = (atomName1 === "N" || atomName1 === "C" || atomName1 === "O" || atomName1 === "CA") ? 'main' : 'side';
+                if(mainside) mainside += ';';
+                mainside += atomType1 + ',' + atomType1;
+
                 let resid1Real = ic.getGraphCls.convertLabel2Resid(resid1);
                 let atom1 = ic.firstAtomObjCls.getFirstAtomObj(ic.residues[resid1Real]);
                 let color1 = (atom1.color) ? atom1.color.getHexString() : '';
@@ -52766,7 +53085,7 @@ class ViewInterPairs {
                 }
             }
         }
-        return {html: tmpText, cnt: cnt, svgHtmlNode: svgHtmlNode, svgHtmlLine: svgHtmlLine}
+        return {html: tmpText, cnt: cnt, svgHtmlNode: svgHtmlNode, svgHtmlLine: svgHtmlLine, mainside: mainside}
     }
 
     getContactPairDetails(labels2dist, type, interactionType, index2xy, xlen, ylen, xcenter, ycenter) { let ic = this.icn3d; ic.icn3dui;
@@ -54274,7 +54593,7 @@ class ChainalignParser {
                 let urlalign = me.htmlCls.baseUrl + "vastdyn/vastdyn.cgi";
                 let urltmalign = me.htmlCls.baseUrl + "tmalign/tmalign.cgi";
 
-                let resRangeArray = (me.cfg.resrange) ? me.cfg.resrange.split(',') : [];
+                let resRangeArray = (me.cfg.resrange) ? decodeURIComponent(me.cfg.resrange).split(' | ') : [];
 
                 for(let index in ic.afChainIndexHash) {
                     let idArray = ic.afChainIndexHash[index].split('_');
@@ -54299,9 +54618,10 @@ class ChainalignParser {
                 let urlalign = me.htmlCls.baseUrl + "vastdyn/vastdyn.cgi";
                 let urltmalign = me.htmlCls.baseUrl + "tmalign/tmalign.cgi";
 
-                let resRangeArray = (me.cfg.resrange) ? me.cfg.resrange.split(',') : [];
+                let resRangeArray = (me.cfg.resrange) ? decodeURIComponent(me.cfg.resrange).split(' | ') : [];
 
                 // dynamically align pairs in all chainids
+                // the resrange from VASTSrv or VAST search uses NCBI residue numbers!!!
                 let atomSet_t = (me.cfg.resrange) ? ic.realignParserCls.getSeqCoorResid([resRangeArray[0]], chainidArray[0], true).hAtoms : ic.chains[chainidArray[0]];
                 for(let index = 1, indexl = chainidArray.length; index < indexl; ++index) {
                     let atomSet_q = (me.cfg.resrange) ? ic.realignParserCls.getSeqCoorResid([resRangeArray[index]], chainidArray[index], true).hAtoms : ic.chains[chainidArray[index]];
@@ -54476,7 +54796,8 @@ class ChainalignParser {
         if(!bFoundAlignment) {
             // sometimes VAST align works for the reversed pair
             if(!bReverse) {
-                ic.realignParserCls.realignOnStructAlign(true);
+                let bVastsearch = true;
+                ic.realignParserCls.realignOnStructAlign(true, bVastsearch);
                 return;
             }
             else {
@@ -55232,7 +55553,8 @@ class ChainalignParser {
                 // await ic.realignParserCls.realignChainOnSeqAlign(undefined, ic.chainidArray, bRealign, bPredefined);
 
                 ic.hAtoms = ic.definedSetsCls.getAtomsFromNameArray(ic.chainidArray);
-                await ic.realignParserCls.realignOnStructAlign();
+                let bVastsearch = true;
+                await ic.realignParserCls.realignOnStructAlign(undefined, bVastsearch);
 
                 // reset annotations
                 $("#" + ic.pre + "dl_annotations").html("");
@@ -59468,76 +59790,114 @@ class RealignParser {
         await this.realignChainOnSeqAlign(undefined, chainidArray, bRealign);
     }
 
-    async realignOnStructAlign(bReverse) { let ic = this.icn3d, me = ic.icn3dui;
+    async realignOnStructAlign(bReverse, bVastsearch) { let ic = this.icn3d, me = ic.icn3dui;
         // each 3D domain should have at least 3 secondary structures
         let minSseCnt = (me.cfg.aligntool != 'tmalign') ? 3 : 0;
 
-        let struct2domain = {};
-        for(let struct in ic.structures) {
-            struct2domain[struct] = {};
-            let chainidArray = ic.structures[struct];
-            for(let i = 0, il = chainidArray.length; i < il; ++i) {
-                let chainid = chainidArray[i];
-                let atoms = me.hashUtilsCls.intHash(ic.hAtoms, ic.chains[chainid]);               
-                let sseCnt = 0;
-                for(let serial in atoms) {
-                    if(ic.atoms[serial].ssbegin) ++sseCnt;
-                    if(sseCnt > minSseCnt) {
-                        struct2domain[struct][chainid] = atoms;
-                        break;
-                    }
-                }
-            }
-        }
+        /*
+let resRangeArray = (me.cfg.resrange) ? decodeURIComponent(me.cfg.resrange).split(' | ') : [];
 
+                let atomSet_t = (me.cfg.resrange) ? ic.realignParserCls.getSeqCoorResid([resRangeArray[0]], ic.chainidArray[0], true).hAtoms : ic.chains[chainidArray[0]];
+                for(let index = 1, indexl = chainidArray.length; index < indexl; ++index) {
+                    let atomSet_q = (me.cfg.resrange) ? ic.realignParserCls.getSeqCoorResid([resRangeArray[index]], ic.chainidArray[index], true).hAtoms : ic.chains[chainidArray[index]];
+                // end of new version to be done for VASTsrv ==============
+*/
         let ajaxArray = [], chainidPairArray = [];
         let urlalign = me.htmlCls.baseUrl + "vastdyn/vastdyn.cgi";
         let urltmalign = me.htmlCls.baseUrl + "tmalign/tmalign.cgi";
 
-        //let cnt = 0;
-        let structArray = Object.keys(struct2domain);
-        if(bReverse) structArray = structArray.reverse();
+        let struct2domain = {};
+        if(bVastsearch && me.cfg.resrange) {
+            let resRangeArray = decodeURIComponent(me.cfg.resrange).split(' | ');
 
-        for(let s = 0, sl = structArray.length; s < sl; ++s) {
-            let struct1 = structArray[s];
+            let atomSet_t = ic.realignParserCls.getSeqCoorResid([resRangeArray[0]], ic.chainidArray[0], true).hAtoms;
+            for(let index = 1, indexl = ic.chainidArray.length; index < indexl; ++index) {
+                let atomSet_q = ic.realignParserCls.getSeqCoorResid([resRangeArray[index]], ic.chainidArray[index], true).hAtoms;
 
-            let chainidArray1 = Object.keys(struct2domain[struct1]);
-            if(chainidArray1.length == 0) continue;
+                let alignAjax;
+                if(me.cfg.aligntool != 'tmalign') {
+                    let jsonStr_q = ic.domain3dCls.getDomainJsonForAlign(atomSet_q);
+                    let jsonStr_t = ic.domain3dCls.getDomainJsonForAlign(atomSet_t);
+                        
+                    let dataObj = {'domains1': jsonStr_q, 'domains2': jsonStr_t};
+                    alignAjax = me.getAjaxPostPromise(urlalign, dataObj);
+                }
+                else {
+                    let pdb_query = ic.saveFileCls.getAtomPDB(atomSet_q);
+                    let pdb_target= ic.saveFileCls.getAtomPDB(atomSet_t);
 
-            for(let i = 0, il = chainidArray1.length; i < il; ++i) {
-                let chainid1 = chainidArray1[i];
-                let jsonStr_t = ic.domain3dCls.getDomainJsonForAlign(struct2domain[struct1][chainid1]);
+                    let dataObj = {'pdb_query': pdb_query, 'pdb_target': pdb_target};
+                    alignAjax = me.getAjaxPostPromise(urltmalign, dataObj);                
+                }
 
-                for(let t = s+1, tl = structArray.length; t < tl; ++t) {
-                    let struct2 = structArray[t];
+                ajaxArray.push(alignAjax);
+                
+                chainidPairArray.push(ic.chainidArray[0] + ',' + ic.chainidArray[index]); 
+            }
+        }
+        else {
+            for(let struct in ic.structures) {
+                struct2domain[struct] = {};
+                let chainidArray = ic.structures[struct];
+                for(let i = 0, il = chainidArray.length; i < il; ++i) {
+                    let chainid = chainidArray[i];
+                    let atoms = me.hashUtilsCls.intHash(ic.hAtoms, ic.chains[chainid]);               
+                    let sseCnt = 0;
+                    for(let serial in atoms) {
+                        if(ic.atoms[serial].ssbegin) ++sseCnt;
+                        if(sseCnt > minSseCnt) {
+                            struct2domain[struct][chainid] = atoms;
+                            break;
+                        }
+                    }
+                }
+            }
 
-                    let chainidArray2 = Object.keys(struct2domain[struct2]);
-                    if(chainidArray2.length == 0) continue;
+            //let cnt = 0;
+            let structArray = Object.keys(struct2domain);
+            if(bReverse) structArray = structArray.reverse();
 
-                    for(let j = 0, jl = chainidArray2.length; j < jl; ++j) {
-                        let chainid2 = chainidArray2[j];
+            for(let s = 0, sl = structArray.length; s < sl; ++s) {
+                let struct1 = structArray[s];
 
-                        let alignAjax;
-                        if(me.cfg.aligntool != 'tmalign') {
-                            let jsonStr_q = ic.domain3dCls.getDomainJsonForAlign(struct2domain[struct2][chainid2]);
-           
-                            let dataObj = {'domains1': jsonStr_q, 'domains2': jsonStr_t};
-                            alignAjax = me.getAjaxPostPromise(urlalign, dataObj);
-                        }
-                        else {
-                            let pdb_target = ic.saveFileCls.getAtomPDB(struct2domain[struct1][chainid1], undefined, undefined, undefined, undefined, struct1);
-                            let pdb_query = ic.saveFileCls.getAtomPDB(struct2domain[struct2][chainid2], undefined, undefined, undefined, undefined, struct2);
-  
-                            // let pdb_target = ic.saveFileCls.getAtomPDB(ic.chains[chainid1], undefined, undefined, undefined, undefined, struct1);
-                            // let pdb_query = ic.saveFileCls.getAtomPDB(ic.chains[chainid2], undefined, undefined, undefined, undefined, struct2);
+                let chainidArray1 = Object.keys(struct2domain[struct1]);
+                if(chainidArray1.length == 0) continue;
+
+                for(let i = 0, il = chainidArray1.length; i < il; ++i) {
+                    let chainid1 = chainidArray1[i];
+                    let jsonStr_t = ic.domain3dCls.getDomainJsonForAlign(struct2domain[struct1][chainid1]);
+
+                    for(let t = s+1, tl = structArray.length; t < tl; ++t) {
+                        let struct2 = structArray[t];
+
+                        let chainidArray2 = Object.keys(struct2domain[struct2]);
+                        if(chainidArray2.length == 0) continue;
+
+                        for(let j = 0, jl = chainidArray2.length; j < jl; ++j) {
+                            let chainid2 = chainidArray2[j];
+
+                            let alignAjax;
+                            if(me.cfg.aligntool != 'tmalign') {
+                                let jsonStr_q = ic.domain3dCls.getDomainJsonForAlign(struct2domain[struct2][chainid2]);
+            
+                                let dataObj = {'domains1': jsonStr_q, 'domains2': jsonStr_t};
+                                alignAjax = me.getAjaxPostPromise(urlalign, dataObj);
+                            }
+                            else {
+                                let pdb_target = ic.saveFileCls.getAtomPDB(struct2domain[struct1][chainid1], undefined, undefined, undefined, undefined, struct1);
+                                let pdb_query = ic.saveFileCls.getAtomPDB(struct2domain[struct2][chainid2], undefined, undefined, undefined, undefined, struct2);
     
-                            let dataObj = {'pdb_query': pdb_query, 'pdb_target': pdb_target};
-                            alignAjax = me.getAjaxPostPromise(urltmalign, dataObj);                    
-                        }
+                                // let pdb_target = ic.saveFileCls.getAtomPDB(ic.chains[chainid1], undefined, undefined, undefined, undefined, struct1);
+                                // let pdb_query = ic.saveFileCls.getAtomPDB(ic.chains[chainid2], undefined, undefined, undefined, undefined, struct2);
+        
+                                let dataObj = {'pdb_query': pdb_query, 'pdb_target': pdb_target};
+                                alignAjax = me.getAjaxPostPromise(urltmalign, dataObj);                    
+                            }
 
-                        ajaxArray.push(alignAjax);
-                        chainidPairArray.push(chainid1 + ',' + chainid2); 
-                        //++cnt;
+                            ajaxArray.push(alignAjax);
+                            chainidPairArray.push(chainid1 + ',' + chainid2); 
+                            //++cnt;
+                        }
                     }
                 }
             }
@@ -59653,7 +60013,7 @@ class RealignParser {
         let predefinedResArray, predefinedResPair;
 
         if(bPredefined) {
-            predefinedResArray = me.cfg.resdef.trim().replace(/\+/gi, ' ').split(': ');
+            predefinedResArray = decodeURIComponent(me.cfg.resdef).trim().replace(/\+/gi, ' ').split(': ');
             
             if(predefinedResArray.length != chainidArray.length - 1) {
                alert("Please make sure the number of chains and the lines of predefined residues are the same...");
@@ -59842,7 +60202,7 @@ class RealignParser {
         }
     }
 
-    getSeqCoorResid(resiArray, chainid, bNCBI) { let ic = this.icn3d, me = ic.icn3dui;
+    getSeqCoorResid(resiArray, chainid, bNCBIResi) { let ic = this.icn3d, me = ic.icn3dui;
         let seq = '', coorArray = [], residArray = [];
         let hAtoms = {};
 
@@ -59850,16 +60210,17 @@ class RealignParser {
             if(resiArray[j].indexOf('-') != -1) {
                 let startEnd = resiArray[j].split('-');
                 for(let k = parseInt(startEnd[0]); k <= parseInt(startEnd[1]); ++k) {
-                    let seqIndex = (bNCBI) ? k : ic.setSeqAlignCls.getPosFromResi(chainid, k);
+                    let seqIndex = (bNCBIResi) ? k : ic.setSeqAlignCls.getPosFromResi(chainid, k);
 
                     // don't align solvent or chemicals
                     if(!ic.chainsSeq[chainid] || !ic.chainsSeq[chainid][seqIndex] || me.parasCls.b62ResArray.indexOf(ic.chainsSeq[chainid][seqIndex].name.toUpperCase()) == -1) continue;
 
                     seq += ic.chainsSeq[chainid][seqIndex].name.toUpperCase();
 
-                    coorArray = coorArray.concat(this.getResCoorArray(chainid + '_' + k));
+                    let resid = (bNCBIResi) ? ic.ncbi2resid[chainid + '_' + k] : chainid + '_' + k;
+                    coorArray = coorArray.concat(this.getResCoorArray(resid));
 
-                    residArray.push(chainid + '_' + k);
+                    residArray.push(resid);
                 }            
             }
             else if(resiArray[j] == 0) { // 0 means the whole chain
@@ -59869,18 +60230,19 @@ class RealignParser {
             else { // one residue
                 let k = resiArray[j];
 
-                let seqIndex = (bNCBI) ? k : ic.setSeqAlignCls.getPosFromResi(chainid, k);
+                let seqIndex = (bNCBIResi) ? k : ic.setSeqAlignCls.getPosFromResi(chainid, k);
 
                 if(!ic.chainsSeq[chainid][seqIndex]) continue;
 
-                let resCoorArray = this.getResCoorArray(chainid + '_' + k);
+                let resid = (bNCBIResi) ? ic.ncbi2resid[chainid + '_' + k] : chainid + '_' + k;
+                let resCoorArray = this.getResCoorArray(resid);
                 //if(resCoorArray.length == 1 && resCoorArray[0] === undefined) continue;
 
                 seq += ic.chainsSeq[chainid][seqIndex].name.toUpperCase();
 
                 coorArray = coorArray.concat(resCoorArray);
 
-                residArray.push(chainid + '_' + k);
+                residArray.push(resid);
             }
         }
 
@@ -64129,6 +64491,9 @@ class LoadPDB {
 
                 ///id = line.substr(62, 4).trim();
                 id = line.substr(62).trim();
+                // remove "_" in the id
+                id = id.replace(/_/g, '-');
+                
                 oriId = id;
 
                 if(id == '') {
@@ -64144,7 +64509,9 @@ class LoadPDB {
                 structure = this.getStructureId(id, moleculeNum, bMutation, bNMR);
 
                 ic.molTitle = '';
-                ic.molTitleHash = {};
+                if (ic.allData === undefined) {
+                    ic.molTitleHash = {};
+                }
 
                 bHeader = true; // read the first header if there are multiple
             } else if (record === 'TITLE ') {
@@ -65037,6 +65404,8 @@ class LoadCIF {
             
             if(block.getCategory("_entry")) {
                 id = block.getCategory("_entry").getColumn("id").getString(0);
+                // remove "_" in the id
+                id = id.replace(/_/g, '-');
 
                 if(id == '') {
                     if(bAppend) {
@@ -69168,15 +69537,15 @@ class SelectCollections {
   }
 
   //Set the menu of defined sets with an array of defined names "commandnameArray".
-  setAtomMenu(nameArray, titleArray) {
+  setAtomMenu(nameArray) {
     let ic = this.icn3d;
     ic.icn3dui;
     let html = "";
-    let commandnameArray = [nameArray[0]];
     //for(let i in ic.defNames2Atoms) {
     for (let i = 0, il = nameArray.length; i < il; ++i) {
-      let name = nameArray[i];
-      let title = titleArray[i];
+      let name = nameArray[i][0];
+      let title = nameArray[i][1];
+      let description = nameArray[i][2];
 
       let atomHash;
       if (
@@ -69199,16 +69568,11 @@ class SelectCollections {
         }
       }
 
-      if (commandnameArray.indexOf(name) != -1) {
-        html +=
-          "<option value='" +
-          name +
-          "' selected='selected'>" +
-          title +
-          "</option>";
-      } else {
-        html += "<option value='" + name + "'>" + title + "</option>";
-      }
+      if (i == 0) {
+        html += "<option value='" + nameArray[0][0] + "' selected='selected' data-description='" + description + "'>" + title + "</option>";
+    } else {
+        html += "<option value='" + name + "' data-description='" + description + "'>" + title + "</option>";
+    }
     }
 
     return html;
@@ -69249,49 +69613,33 @@ class SelectCollections {
       }
 
       return difference;
-    }
+  }
 
-  clickStructure() {
+  clickStructure(collection) {
     let ic = this.icn3d,
       me = ic.icn3dui;
     let thisClass = this;
 
-    if (ic.allData == undefined) {
-      ic.allData = {};
-      ic.allData['all'] = {
-        'atoms': {},
-        'proteins': {},
-        'nucleotides': {},
-        'chemicals': {},
-        'ions': {},
-        'water': {},
-        'structures': {},
-        'ssbondpnts': {},
-        'residues': {},
-        'chains': {},
-        'chainsSeq': {}, //Sequences and Annotation
-        'defNames2Atoms': {},
-        'defNames2Residues': {}
-      };
-      ic.allData['prev'] = {};
-    }
-
     //me.myEventCls.onIds("#" + ic.pre + "atomsCustom", "change", function(e) { let  ic = thisClass.icn3d;
-    $("#" + ic.pre + "collections_menu").change(async function (e) {
+    $("#" + ic.pre + "collections_menu").on("change", async function (e) {
       let ic = thisClass.icn3d;
 
       let nameArray = $(this).val();
       let nameStructure = $(this).find("option:selected").text();
+      let selectedIndices = Array.from(this.selectedOptions).map(option => option.index);
+      let selectedIndicesMap = nameArray.reduce((map, name, i) => {
+        map[name] = selectedIndices[i];
+        return map;
+      }, {});
 
       ic.nameArray = nameArray;
-      if (nameArray !== null) {
-        // let chainIdHash = {};
 
+      if (nameArray !== null) {
         let bNoDuplicate = true;
         thisClass.reset();
         for (const name of nameArray) {
           if (!(name in ic.allData)) {
-            ic.allData['prev'] = JSON.parse(JSON.stringify(ic.allData['all']));//me.hashUtilsCls.cloneHash(ic.allData['all']);
+            ic.allData['prev'] = JSON.parse(JSON.stringify(ic.allData['all']));
 
             ic.atoms = ic.allData['all']['atoms'];
             
@@ -69308,7 +69656,21 @@ class SelectCollections {
             ic.chainsSeq = ic.allData['all']['chainsSeq'];
             ic.defalls2Atoms = ic.allData['all']['defalls2Atoms'];
             ic.defalls2Residues = ic.allData['all']['defalls2Residues'];
-            await ic.chainalignParserCls.downloadMmdbAf(name, undefined, undefined, bNoDuplicate).then(() => {
+
+            async function loadStructure(pdb) {
+              await ic.resetConfig();
+              if (pdb) {
+                let bAppend = true;
+                if (Object.keys(ic.structures).length == 0) {
+                  bAppend = false;
+                }
+                await ic.pdbParserCls.loadPdbData(ic.pdbCollection[selectedIndicesMap[name]].join('\n'), undefined, undefined, bAppend);
+              } else {
+                await ic.chainalignParserCls.downloadMmdbAf(name, undefined, undefined, bNoDuplicate);
+              }
+            }
+            
+            await loadStructure(collection[selectedIndicesMap[name]][4]).then(() => {
               ic.allData['all'] = {
                 'atoms': ic.atoms,
                 'proteins': ic.proteins,
@@ -69316,9 +69678,9 @@ class SelectCollections {
                 'chemicals': ic.chemicals,
                 'ions': ic.ions,
                 'water': ic.water,
-                'structures': ic.structures,
+                'structures': ic.structures, // getSSExpandedAtoms
                 'ssbondpnts': ic.ssbondpnts,
-                'residues': ic.residues,
+                'residues': ic.residues, // getSSExpandedAtoms
                 'chains': ic.chains,
                 'chainsSeq': ic.chainsSeq, //Sequences and Annotation
                 'defNames2Atoms': ic.defNames2Atoms,
@@ -69326,26 +69688,27 @@ class SelectCollections {
               };
 
               ic.allData[name] = {
+                'title': ic.molTitle,
                 'atoms': thisClass.dictionaryDifference(ic.allData['prev']['atoms'], ic.atoms),
                 'proteins': thisClass.dictionaryDifference(ic.allData['prev']['proteins'], ic.proteins),
                 'nucleotides': thisClass.dictionaryDifference(ic.allData['prev']['nucleotides'], ic.nucleotides),
                 'chemicals': thisClass.dictionaryDifference(ic.allData['prev']['chemicals'], ic.chemicals),
                 'ions': thisClass.dictionaryDifference(ic.allData['prev']['ions'], ic.ions),
                 'water': thisClass.dictionaryDifference(ic.allData['prev']['water'], ic.water),
-                'structures': thisClass.dictionaryDifference(ic.allData['prev']['structures'], ic.structures),
+                'structures': thisClass.dictionaryDifference(ic.allData['prev']['structures'], ic.structures), // getSSExpandedAtoms
                 'ssbondpnts': thisClass.dictionaryDifference(ic.allData['prev']['ssbondpnts'], ic.ssbondpnts),
-                'residues': thisClass.dictionaryDifference(ic.allData['prev']['residues'], ic.residues),
+                'residues': thisClass.dictionaryDifference(ic.allData['prev']['residues'], ic.residues), // getSSExpandedAtoms
                 'chains': thisClass.dictionaryDifference(ic.allData['prev']['chains'], ic.chains),
                 'chainsSeq': thisClass.dictionaryDifference(ic.allData['prev']['chainsSeq'], ic.chainsSeq), //Sequences and Annotation
                 'defNames2Atoms': thisClass.dictionaryDifference(ic.allData['prev']['defNames2Atoms'], ic.defNames2Atoms),
                 'defNames2Residues': thisClass.dictionaryDifference(ic.allData['prev']['defNames2Residues'], ic.defNames2Residues)
               };
 
-              // ic.atoms = Object.assign(ic.atoms, ic.atomsTemp);
               thisClass.reset();
             });
           }
         }
+
         for (const name of nameArray) {
             ic.atoms = Object.assign(ic.atoms, ic.allData[name]['atoms']);
             
@@ -69364,10 +69727,26 @@ class SelectCollections {
             ic.defNames2Residues = Object.assign(ic.defNames2Residues, ic.allData[name]['defNames2Residues']);
             ic.dAtoms = me.hashUtilsCls.cloneHash(ic.atoms);
             ic.hAtoms = me.hashUtilsCls.cloneHash(ic.atoms);
-          }
+            
+          ic.molTitle = ic.allData[name]['title'];
           
+          if (collection[selectedIndicesMap[name]][3] !== undefined && collection[selectedIndicesMap[name]][3].length > 0) {
+            if (ic.allData[name]['commands'] == undefined) {
+              let commands = collection[selectedIndicesMap[name]][3];
+              ic.allData[name]['commands'] = commands;
+            }
+          }
+
+           if (ic.allData[name]['commands'] !== undefined) {   
+              for (const command of ic.allData[name]['commands']) {
+                me.htmlCls.clickMenuCls.setLogCmd(command, true);
+                await ic.applyCommandCls.applyCommand(command);
+              }
+            }
+            
+        }
+        
         ic.opts["color"] = (Object.keys(ic.structures).length == 1) ? "chain" : "structure";
-        // ic.setStyleCls.setAtomStyleByOptions();
         ic.setColorCls.setColorByOptions(ic.opts, ic.atoms);
 
         ic.transformCls.zoominSelection();
@@ -69381,14 +69760,12 @@ class SelectCollections {
           // show selected chains in annotation window
           ic.annotationCls.showAnnoSelectedChains();
         }
-
+        
         await ic.drawCls.draw();
         ic.saveFileCls.showTitle();
 
-        me.htmlCls.clickMenuCls.setLogCmd(
-          "select structure " + "[" + nameStructure + "]",
-          true
-        );
+        me.htmlCls.clickMenuCls.setLogCmd("select structure " + "[" + nameStructure + "]", false);
+        me.htmlCls.clickMenuCls.setLogCmd('load mmdbaf1 ' + nameArray, true);
       }
     });
 
@@ -70300,7 +70677,7 @@ class LoadScript {
         if(steps === 1
           || (ic.hAtoms && ic.atoms && Object.keys(ic.hAtoms).length === Object.keys(ic.atoms).length)
           || (ic.optsHistory[steps - 1] !== undefined && ic.optsHistory[steps - 1].hasOwnProperty('hlatomcount') && ic.optsHistory[steps - 1].hlatomcount === Object.keys(ic.atoms).length) ) {
-    // the following code caused problem for many links,e.g., https://structure.ncbi.nlm.nih.gov/icn3d/share.html?17g3r1JDvZ7ZL39e6
+    // the following code caused problem for many links,e.g., https://www.ncbi.nlm.nih.gov/Structure/icn3d/share.html?17g3r1JDvZ7ZL39e6
     //        if(steps === 1) {
                 // assign styles and color using the options at that stage
     //            ic.setStyleCls.setAtomStyleByOptions(ic.optsHistory[steps - 1]);
@@ -70322,7 +70699,7 @@ class LoadScript {
                     ic.pk = 3;
                 }
 
-    // the following code caused problem for many links,e.g., https://structure.ncbi.nlm.nih.gov/icn3d/share.html?17g3r1JDvZ7ZL39e6
+    // the following code caused problem for many links,e.g., https://www.ncbi.nlm.nih.gov/Structure/icn3d/share.html?17g3r1JDvZ7ZL39e6
     //            if(steps === 1) {
     //                ic.setColorCls.applyOriginalColor();
     //            }
@@ -71388,6 +71765,10 @@ class Selection {
     selectOneResid(idStr, bUnchecked) {var ic = this.icn3d; ic.icn3dui;
       //var idStr = idArray[i]; // TYR $1KQ2.B:56@OH, $1KQ2.B:40 ASP
       //change to: let idStr = idArray[i]; // TYR $1KQ2.B:56@OH, or ASP $1KQ2.B:40
+      //change to: let idStr = idArray[i]; // TYR $1KQ2.B:56@OH, or ASP $1KQ2.B:40, or $1KQ2.B:56@OH 130, or ASP $1KQ2.B:40 144
+      let idArray = idStr.split(' ');
+      idStr = idArray[1];
+
       let posStructure = idStr.indexOf('$');
       let posChain = idStr.indexOf('.');
       let posRes = idStr.indexOf(':');
@@ -72747,7 +73128,6 @@ class Dssp {
             if(ssHash !== undefined && JSON.stringify(ssHash).indexOf('Oops there was a problem') === -1) {
               for(let chainNum in ic.chainsSeq) {
                   let pos = chainNum.indexOf('_');
-
                   // one structure at a time
                   if(chainNum.substr(0, pos) != struArray[index]) continue;
 
@@ -79959,6 +80339,11 @@ class SaveFile {
 
                 $("#" + ic.pre + "title").html("PubChem CID <a id='" + ic.pre + "titlelink' href='" + url + "' style='color:" + titlelinkColor + "' target='_blank'>" + ic.inputid.toUpperCase() + "</a>: " + title);
             }
+            else if(me.cfg.smiles !== undefined) {
+                let text = decodeURIComponent(me.cfg.smiles);
+                if(text.length > 60) text = text.substr(0, 60) + "...";
+                $("#" + ic.pre + "title").html("SMILES: " + text);
+            }
             else if(me.cfg.align !== undefined) {
                 title = 'VAST+ alignment of ' + Object.keys(ic.structures);
 
@@ -80200,7 +80585,7 @@ class ShareLink {
                     let shortName = strArray[strArray.length - 1];
                     ic.saveFileCls.saveFile(inputid + '-' + shortName + '.png', 'png');
                     let text = '<div style="float:left; border: solid 1px #0000ff; padding: 5px; margin: 10px; text-align:center;">';
-                    text += '<a href="https://structure.ncbi.nlm.nih.gov/icn3d/share.html?' + shortName + '" target="_blank">';
+                    text += '<a href="https://www.ncbi.nlm.nih.gov/Structure/icn3d/share.html?' + shortName + '" target="_blank">';
                     text += '<img style="height:300px" src ="' + inputid + '-' + shortName + '.png"><br>\n';
                     text += '<!--Start of your comments==================-->\n';
                     let yournote =(ic.yournote) ? ': ' + ic.yournote.replace(/\n/g, "<br>").replace(/; /g, ", ") : '';
@@ -80219,9 +80604,9 @@ class ShareLink {
             //shorturl: https://icn3d.page.link/NvbAh1Vmiwc4bgX87
             let urlArray = shorturl.split('page.link/');
             //if(urlArray.length == 2) shorturl = me.htmlCls.baseUrl + 'icn3d/share.html?' + urlArray[1];
-            // When the baseURL is structure.ncbi.nlm.nih.gov, mmcifparser.cgi has a problem to past posted data in Mac/iphone
+            // When the baseURL is structure.ncbi.nlm.nih.gov, mmcifparser.cgi has a problem to pass posted data in Mac/iphone
             // So the base URL is still www.ncbi.nlm.nih.gov/Structure,just use short URL here
-            if(urlArray.length == 2) shorturl = 'https://structure.ncbi.nlm.nih.gov/icn3d/share.html?' + urlArray[1];
+            if(urlArray.length == 2) shorturl = 'https://www.ncbi.nlm.nih.gov/Structure/icn3d/share.html?' + urlArray[1];
 
             $("#" + ic.pre + "short_url").val(shorturl);
             $("#" + ic.pre + "short_url_title").val(shorturl + '&t=' + ic.yournote);
@@ -83378,7 +83763,7 @@ class iCn3DUI {
     //even when multiple iCn3D viewers are shown together.
     this.pre = this.cfg.divid + "_";
 
-    this.REVISION = '3.38.1';
+    this.REVISION = '3.39.0';
 
     // In nodejs, iCn3D defines "window = {navigator: {}}"
     this.bNode = (Object.keys(window).length < 2) ? true : false;
@@ -83553,6 +83938,9 @@ iCn3DUI.prototype.show3DStructure = async function(pdbStr) { let me = this;
 
         await ic.pdbParserCls.loadPdbData(pdbStr);
 
+        // // use NCBI residue numbers if using VAST
+        // me.icn3d.bUsePdbNum = 0;
+
         if(me.cfg.resdef !== undefined && me.cfg.chains !== undefined) {
             let structureArray = Object.keys(ic.structures);
             let chainArray = me.cfg.chains.split(' | ');
@@ -83828,7 +84216,7 @@ iCn3DUI.prototype.show3DStructure = async function(pdbStr) { let me = this;
 
         ic.bChainAlign = true;
         ic.inputid = me.cfg.chainalign;
-        let resrangeStr = (me.cfg.resrange) ? ' | resrange ' + me.cfg.resrange : '';
+        let resrangeStr = (me.cfg.resrange) ? ' | resrange ' + decodeURIComponent(me.cfg.resrange) : '';
         let resdef = (me.cfg.resdef) ? me.cfg.resdef : '';
         ic.loadCmd = 'load chainalignment ' + me.cfg.chainalign + ' | resnum ' + me.cfg.resnum + ' | resdef ' + resdef + ' | aligntool ' + me.cfg.aligntool + ' | parameters ' + me.cfg.inpara + resrangeStr;
         me.htmlCls.clickMenuCls.setLogCmd(ic.loadCmd, true);