Initial structure

jacob-votava · Apr 8, 2018 · e2952a3 · e2952a3
1 parent e7a5e09
commit e2952a3
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,19 @@
+ <!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8">
+<title>CG Builder</title>
+<script src="https://cdn.rawgit.com/arose/ngl/v2.0.0-dev.31/dist/ngl.js"></script>
+<script src="scripts/main.js"></script>
+<link rel="stylesheet" href="styles/main.css" /> 
+</head>
+
+<body>
+<div id="structview">
+	<div id="viewport"></div>
+</div>
+<div id="beadlist">
+</div>
+</body>
+
+</html> 
diff --git a/scripts/main.js b/scripts/main.js
@@ -0,0 +1,20 @@
+function main() {
+    // Create NGL Stage object
+    var stage = new NGL.Stage( "viewport" );
+
+    // Handle window resizing
+    window.addEventListener( "resize", function( event ){
+        stage.handleResize();
+    }, false );
+
+
+    var beads = [];
+
+    // Load PDB entry 1CRN
+    stage.loadFile( "rcsb://1crn", { defaultRepresentation: true } );
+    stage.signals.clicked.add(function (pickingProxy) {
+        beads.push(pickingProxy.atom); console.log(beads.length)
+    });
+}
+
+window.onload = main;
diff --git a/styles/main.css b/styles/main.css
@@ -0,0 +1,14 @@
+* { margin: 0; padding: 0; }
+html, body {
+	width: 100%;
+	height: 100%;
+	overflow: hidden;
+}
+#structview {
+    height: 100%;
+    width: 50%;
+}
+#viewport {
+	height: 100%;
+	width: 100%;
+}