web
/
TmMolStar


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
							<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <link rel="icon" href="./favicon.ico" type="image/x-icon">
        <title>Mol* Viewer</title>
        <style>
            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }
            html, body {
                width: 100%;
                height: 100%;
                overflow: hidden;
            }
            hr {
                margin: 10px;
            }
            h1, h2, h3, h4, h5 {
                margin-top: 5px;
                margin-bottom: 3px;
            }
            button {
                padding: 2px;
            }
            #app {
                position: absolute;
                left: 100px;
                top: 100px;
                width: 800px;
                height: 600px;
            }
        </style>
        <link rel="stylesheet" type="text/css" href="molstar.css" />
    </head>
    <body>
        <div id="app"></div>
        <script type="text/javascript" src="./molstar.js"></script>
        <script type="text/javascript">
            function getParam(name, regex) {
                var r = new RegExp(name + '=' + '(' + regex + ')[&]?', 'i');
                return decodeURIComponent(((window.location.search || '').match(r) || [])[1] || '');
            }

            var debugMode = getParam('debug-mode', '[^&]+').trim() === '1';
            if (debugMode) molstar.setDebugMode(debugMode, debugMode);

            var disableAntialiasing = getParam('disable-antialiasing', '[^&]+').trim() === '1';
            var pixelScale = parseFloat(getParam('pixel-scale', '[^&]+').trim() || '1');
            var disableWboit = getParam('disable-wboit', '[^&]+').trim() === '1';
            var hideControls = getParam('hide-controls', '[^&]+').trim() === '1';
            var pdbProvider = getParam('pdb-provider', '[^&]+').trim().toLowerCase();
            var emdbProvider = getParam('emdb-provider', '[^&]+').trim().toLowerCase();
            var viewer = new molstar.Viewer('app', {
                disableAntialiasing: disableAntialiasing,
                pixelScale: pixelScale,
                enableWboit: !disableWboit,
                layoutShowControls: !hideControls,
                viewportShowExpand: false,
                pdbProvider: pdbProvider || 'pdbe',
                emdbProvider: emdbProvider || 'pdbe',
            });

            var snapshotId = getParam('snapshot-id', '[^&]+').trim();
            if (snapshotId) viewer.setRemoteSnapshot(snapshotId);

            var snapshotUrl = getParam('snapshot-url', '[^&]+').trim();
            var snapshotUrlType = getParam('snapshot-url-type', '[^&]+').toLowerCase().trim() || 'molj';
            if (snapshotUrl && snapshotUrlType) viewer.loadSnapshotFromUrl(snapshotUrl, snapshotUrlType);

            var structureUrl = getParam('structure-url', '[^&]+').trim();
            var structureUrlFormat = getParam('structure-url-format', '[a-z]+').toLowerCase().trim();
            var structureUrlIsBinary = getParam('structure-url-is-binary', '[^&]+').trim() === '1';
            if (structureUrl) viewer.loadStructureFromUrl(structureUrl, structureUrlFormat, structureUrlIsBinary);

            var pdb = getParam('pdb', '[^&]+').trim();
            if (pdb) viewer.loadPdb(pdb);

            var pdbDev = getParam('pdb-dev', '[^&]+').trim();
            if (pdbDev) viewer.loadPdbDev(pdbDev);

            var emdb = getParam('emdb', '[^&]+').trim();
            if (emdb) viewer.loadEmdb(emdb);
        </script>
    </body>
</html>