316 lines
11 KiB
Text
316 lines
11 KiB
Text
<!DOCTYPE html><html lang="en"><head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
|
|
<meta name="description" content="iCn3D Structure Viewer">
|
|
<meta name="keywords" content="NCBI, Structure, JavaScript, iCn3D, 3D, Viewer, WebGL, three.js, sequence, chemical">
|
|
<meta name="robots" content="index,follow,noarchive">
|
|
<meta name="ncbi_app" content="structure">
|
|
<meta name="ncbi_pdid" content="icn3d">
|
|
<meta name="ncbi_page" content="full">
|
|
<meta name="ncbi_pinger_xml_http_request_override" content="false"/>
|
|
<meta name="ncbi_pinger_click_ping_selector" content="button, a, input[type=submit], span[data-pinger], div[data-pinger], label[data-pinger]"/>
|
|
<title>iCn3D: Web-based 3D Structure Viewer</title>
|
|
<script type="text/javascript">
|
|
window.ncbi_startTime = new Date();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="div0"></div>
|
|
|
|
<link rel="stylesheet" href="lib/jquery-ui-1.13.2.min.css">
|
|
<link rel="stylesheet" href="icn3d_3.40.4.css">
|
|
<script src="lib/jquery-3.5.0.min.js"></script>
|
|
<script src="lib/jquery-ui-1.13.2.min.js"></script>
|
|
<script src="lib/three_0.151.0.min.js"></script>
|
|
<script src="icn3d_3.40.4.min.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
|
|
$( document ).ready(async function() {
|
|
if (navigator.userAgent.indexOf("MSIE ") > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) { // If Internet Explorer
|
|
// iCn3D version 2.24.7 doesn't work with three_0.128.0.min.js
|
|
//$.getScript('icn3d_full_ui_2.24.7.min.js', function() {
|
|
// var version = 2;
|
|
// await launchIcn3d(version);
|
|
//});
|
|
|
|
var fixedUrl = document.URL.replace('full.html', 'full_2.24.7.html');
|
|
window.open(fixedUrl, '_self');
|
|
|
|
alert("IE does NOT work with the current iCn3D version 3. The old iCn3D version 2 is used instead.");
|
|
}
|
|
else {
|
|
//$.getScript('icn3d_3.40.4.min.js', function() {
|
|
var version = 3;
|
|
await launchIcn3d(version); //await
|
|
//});
|
|
}
|
|
|
|
async function launchIcn3d(version) {
|
|
var cfg = getConfig();
|
|
cfg.version = version;
|
|
|
|
if(cfg.bcifid !== undefined) {
|
|
await setupViewer('bcifid', cfg.bcifid, cfg);
|
|
}
|
|
else if(cfg.mmtfid !== undefined) {
|
|
await setupViewer('mmtfid', cfg.mmtfid, cfg);
|
|
}
|
|
else if(cfg.pdbid !== undefined) {
|
|
await setupViewer('pdbid', cfg.pdbid, cfg);
|
|
}
|
|
else if(cfg.afid !== undefined) {
|
|
await setupViewer('afid', cfg.afid, cfg);
|
|
}
|
|
else if(cfg.opmid !== undefined) {
|
|
await setupViewer('opmid', cfg.opmid, cfg);
|
|
}
|
|
else if(cfg.cid !== undefined) {
|
|
await setupViewer('cid', cfg.cid, cfg);
|
|
}
|
|
else if(cfg.mmcifid !== undefined) {
|
|
await setupViewer('mmcifid', cfg.mmcifid, cfg);
|
|
}
|
|
else if(cfg.mmdbid !== undefined) {
|
|
await setupViewer('mmdbid', cfg.mmdbid, cfg);
|
|
}
|
|
else if(cfg.gi !== undefined) {
|
|
await setupViewer('gi', cfg.gi, cfg);
|
|
}
|
|
else if(cfg.uniprotid !== undefined) {
|
|
await setupViewer('uniprotid', cfg.uniprotid, cfg);
|
|
}
|
|
else if(cfg.blast_rep_id !== undefined) {
|
|
if( (cfg.from === 'blast' || cfg.from === 'icn3d') && cfg.command == '') {
|
|
command = 'view+annotations;+set+annotation+cdd;+set+annotation+site;+set+view+detailed+view;+select+chain+'
|
|
+ cfg.blast_rep_id + ';+show+selection';
|
|
}
|
|
|
|
await setupViewer('blast_rep_id', cfg.blast_rep_id, cfg);
|
|
}
|
|
else if(cfg.urlname !== undefined) {
|
|
var urlname = decodeURIComponent(cfg.urlname);
|
|
|
|
await setupViewer('url', cfg.urltype + '|' + urlname, cfg);
|
|
}
|
|
// e.g., align=103701,1,4,68563,1,167 [mmdbid1,biounit,molecule,mmdbid2,biounit,molecule]
|
|
else if(cfg.align !== undefined) {
|
|
cfg.divid = 'div0';
|
|
//cfg.align = cfg.align;
|
|
//cfg.showalignseq = cfg.showalignseq;
|
|
|
|
// VAST+ uses biological units
|
|
cfg.bu = 1;
|
|
|
|
cfg.idname = 'align';
|
|
cfg.idvalue = cfg.align;
|
|
|
|
var icn3dui = new icn3d.iCn3DUI(cfg);
|
|
|
|
await icn3dui.show3DStructure();
|
|
}
|
|
else if(cfg.chainalign !== undefined || cfg.mmdbafid !== undefined) {
|
|
cfg.divid = 'div0';
|
|
|
|
if(cfg.chainalign !== undefined) {
|
|
cfg.idname = 'chainalign';
|
|
cfg.idvalue = cfg.chainalign;
|
|
}
|
|
else {
|
|
cfg.idname = 'mmdbafid';
|
|
cfg.idvalue = cfg.mmdbafid;
|
|
}
|
|
|
|
var icn3dui = new icn3d.iCn3DUI(cfg);
|
|
|
|
await icn3dui.show3DStructure();
|
|
}
|
|
else {
|
|
await setupViewer('', '', cfg);
|
|
}
|
|
}
|
|
|
|
async function setupViewer(idName, idValue, cfg) {
|
|
cfg.idname = idName;
|
|
cfg.idvalue = idValue;
|
|
|
|
var maxStructure = 5; // show max 5 structures
|
|
|
|
var idArray = idValue.toString().replace(/\s/g, '').split(',');
|
|
|
|
if(idArray.length > 1) {
|
|
resize = false;
|
|
|
|
if(cfg.width && cfg.width.indexOf('%') != -1) {
|
|
cfg.width = 400;
|
|
cfg.height = 400;
|
|
}
|
|
}
|
|
|
|
for(var i = 0, il = idArray.length; i < il && i < maxStructure; ++i) {
|
|
cfg.divid = 'div' + i;
|
|
|
|
if(idName !== '') cfg[idName] = idArray[i];
|
|
|
|
var icn3dui = new icn3d.iCn3DUI(cfg);
|
|
|
|
await icn3dui.show3DStructure();
|
|
//icn3dui.setOption('color', 'spectrum');
|
|
|
|
if(idName === '') $("#div" + i + "_wait").hide();
|
|
}
|
|
}
|
|
|
|
function getConfig() {
|
|
// separating the GET parameters from the current URL
|
|
// repalce "color #" with "color " in the url
|
|
var url = document.URL.replace(/\#/g, '');
|
|
|
|
var bNopara = false;
|
|
var ampPos = url.indexOf("?");
|
|
if(ampPos === -1) {
|
|
// alert("Please include '?pdbid=1GPK,2POR,...' in your url");
|
|
bNopara = true;
|
|
}
|
|
|
|
var params = url.split("?");
|
|
// transforming the GET parameters into a dictionary
|
|
var search = params[params.length - 1];
|
|
|
|
var cfg = {};
|
|
|
|
if(!bNopara) {
|
|
var decodeSearch = decodeURIComponent(search).replace(/\+/g, ' ');
|
|
search = search.replace(/\+/g, ' ');
|
|
|
|
// command could contains '&', for example when loading statefile 'load mmdb 1kq2 | parameters &atype=1'
|
|
var commandPos = decodeSearch.indexOf('&command=');
|
|
if(commandPos != -1) {
|
|
cfg.command = decodeSearch.substr(commandPos + 9); // ";" separated commands
|
|
decodeSearch = decodeSearch.substr(0, commandPos);
|
|
search = search.substr(0, commandPos);
|
|
|
|
var paraPos = decodeSearch.indexOf(' | parameters ');
|
|
|
|
if(paraPos != -1) { //When loading statefile (e.g., 'load mmdb 1kq2 | parameters &atype=1'), the commands ends with '}}'.
|
|
var tmpPos = cfg.command.indexOf('}}&');
|
|
if(tmpPos != -1) { // more parameters after the command
|
|
decodeSearch += cfg.command.substr(tmpPos + 2);
|
|
search += cfg.command.substr(tmpPos + 2);
|
|
cfg.command = cfg.command.substr(0, tmpPos + 2);
|
|
}
|
|
}
|
|
else {
|
|
var paraPos = cfg.command.indexOf(' | parameters ');
|
|
|
|
if(paraPos != -1) { // "&command=load mmdb 7DDD | parameters &mmdbid=7DDD; select..." the commands ends with '}}'.
|
|
var tmpPos = cfg.command.indexOf('}}&');
|
|
if(tmpPos != -1) { // more parameters after the command
|
|
decodeSearch += cfg.command.substr(tmpPos + 2);
|
|
search += cfg.command.substr(tmpPos + 2);
|
|
cfg.command = cfg.command.substr(0, tmpPos + 2);
|
|
}
|
|
}
|
|
else {
|
|
var tmpPos = cfg.command.indexOf('&');
|
|
if(tmpPos != -1) {
|
|
decodeSearch += cfg.command.substr(tmpPos);
|
|
search += cfg.command.substr(tmpPos);
|
|
cfg.command = cfg.command.substr(0, tmpPos);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
cfg.command = '';
|
|
}
|
|
|
|
// var hashes = decodeSearch.split('&');
|
|
var hashes = search.split('&');
|
|
var decodeHashes = decodeSearch.split('&');
|
|
for (var i = 0; i < hashes.length; i++) {
|
|
var hash = hashes[i].split('=');
|
|
if(hash[0].trim() == 'smiles') {
|
|
cfg[hash[0].trim()] = (hash[1] !== undefined) ? hash[1].trim() : undefined;
|
|
}
|
|
else {
|
|
var decodeHash = decodeHashes[i].split('=');
|
|
cfg[decodeHash[0].trim()] = (decodeHash[1] !== undefined) ? decodeHash[1].trim() : undefined;
|
|
}
|
|
}
|
|
|
|
// for mmdb structures, pass the parameters after the first "&" sign
|
|
cfg.inpara = "&" + url.substr(ampPos + 1);
|
|
}
|
|
|
|
// changed some parameter names
|
|
cfg.rid = cfg.RID;
|
|
|
|
cfg.urlname = cfg.url;
|
|
if(cfg.urlname && cfg.urlname.indexOf('%3A%2F%2F') === -1) { // decoded URL
|
|
// should encode it
|
|
cfg.urlname = encodeURIComponent(cfg.urlname);
|
|
}
|
|
cfg.urltype = (cfg.type === undefined) ? 'pdb' : cfg.type;
|
|
|
|
cfg.version = getValue(cfg.v);
|
|
|
|
if(cfg.version !== undefined && window.localStorage && localStorage.getItem('fixedversion')) {
|
|
var fixedUrl = url.replace('full.html', 'full_' + cfg.version + '.html');
|
|
window.open(fixedUrl, '_self');
|
|
|
|
localStorage.removeItem('fixedversion');
|
|
}
|
|
|
|
// standardize the input values
|
|
for(var i in cfg) {
|
|
if(i == 'bu') {
|
|
cfg[i] = getInt(cfg[i]);
|
|
}
|
|
else {
|
|
cfg[i] = getValue(cfg[i]);
|
|
}
|
|
}
|
|
|
|
// backward compatible with showseq
|
|
cfg.showanno = cfg.showanno || cfg.showseq;
|
|
|
|
cfg.shownote = 1; //cfg.shownote;
|
|
cfg.options = (cfg.options !== undefined) ? JSON.parse(cfg.options) : undefined;
|
|
|
|
// default to show biological unit
|
|
if(cfg.bu === undefined) cfg.bu = 1; //0;
|
|
if(cfg.buidx !== undefined) cfg.bu = cfg.buidx;
|
|
|
|
return cfg;
|
|
}
|
|
|
|
function getValue(input) {
|
|
if(input == 'true' || input == '1') {
|
|
input = true;
|
|
}
|
|
else if(input == 'false' || input == '0') {
|
|
input = false;
|
|
}
|
|
|
|
return input;
|
|
}
|
|
|
|
function getInt(input) {
|
|
if(input == 'true' || input == '1') {
|
|
input = 1;
|
|
}
|
|
else if(input == 'false' || input == '0') {
|
|
input = 0;
|
|
}
|
|
|
|
return input;
|
|
}
|
|
}); // document ready
|
|
</script>
|
|
|
|
<!-- log & Google Analytics -->
|
|
<script type="text/javascript" src="https://www.ncbi.nlm.nih.gov/core/pinger/pinger.js"></script>
|
|
</body></html>
|
|
|