IT IS THE FUTURE. THE DISTANT FUTURE.
I have no idea what I'm doing here. This was a sketch that I made years and years ago, but I thought I would use it as a text for bl.ocks.org because it looks dope af to me right now.
Last active
December 21, 2016 10:53
-
-
Save AdmiralPotato/5424180 to your computer and use it in GitHub Desktop.
IT IS THE FUTURE. THE DISTANT FUTURE.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <title>ROBOT ARM</title> | |
| </head> | |
| <body> | |
| <script src="https://admiralpotato.github.io/js/npos3d/build/npos3d.js"></script> | |
| <script> | |
| var n = NPos3d; | |
| var scene = new n.Scene(); | |
| var segmentDisplay = new n.Ob3D({ | |
| shape: { | |
| points: [ | |
| [-200,-100,0], | |
| [-200,100,0], | |
| [-100,-100,0], | |
| [-100,100,0], | |
| [0,-100,0], | |
| [0,100,0], | |
| [100,-100,0], | |
| [100,100,0], | |
| [200,-100,0], | |
| [200,100,0], | |
| ], | |
| lines: [ | |
| [0,1], | |
| [2,3], | |
| [4,5], | |
| [6,7], | |
| [8,9], | |
| ] | |
| } | |
| }); | |
| var myOb = new n.Ob3D(); | |
| var upperArm = new n.VText({ | |
| textAlign: 'left', | |
| string: 'upperArm', | |
| rot: [0,0,deg * -90], | |
| pos: [0,200,0] | |
| }); | |
| var foreArm = new n.VText({ | |
| textAlign: 'left', | |
| string: 'foreArm', | |
| rot: [0,0,deg * 90], | |
| pos: [208,0,0] | |
| }); | |
| var wrist = new n.VText({ | |
| string: 'wrist', | |
| rot: [0,0,deg * 90], | |
| pos: [192,0,0] | |
| }); | |
| var index = new n.VText({ | |
| textAlign: 'left', | |
| string: 'index', | |
| rot: [0,0,deg * -90], | |
| pos: [-64,-8,0] | |
| }); | |
| var thumb = new n.VText({ | |
| textAlign: 'left', | |
| string: 'thumb', | |
| rot: [0,0,deg * -90], | |
| pos: [64,-8,0] | |
| }); | |
| scene.add(segmentDisplay); | |
| scene.add(myOb); | |
| scene.add(upperArm); | |
| upperArm.add(foreArm); | |
| foreArm.add(wrist); | |
| wrist.add(index); | |
| wrist.add(thumb); | |
| var keyList = []; | |
| keyList[32] = 'space'; | |
| keyList[38] = 'up'; | |
| keyList[40] = 'down'; | |
| keyList[37] = 'left'; | |
| keyList[39] = 'right'; | |
| keyList[49] = 'one'; | |
| keyList[50] = 'two'; | |
| keyList[51] = 'three'; | |
| keyList[52] = 'four'; | |
| keyList[87] = 'w'; | |
| keyList[83] = 's'; | |
| keyList[65] = 'a'; | |
| keyList[68] = 'd'; | |
| keyList[70] = 'f'; | |
| var kb = {}; | |
| var setKey = function (e){ | |
| //console.log(e.keyCode); | |
| if(e.type == 'keyup'){val = false;} | |
| else{val = true;} | |
| if(keyList[e.keyCode]){ | |
| kb[keyList[e.keyCode]] = val; | |
| } | |
| } | |
| window.addEventListener('keydown', setKey, false); | |
| window.addEventListener('keyup', setKey, false); | |
| var deg90 = deg * 90; | |
| var lastX = 0; | |
| var lastY = 0; | |
| var sceneControl = { | |
| update: function() { | |
| var x = scene.mpos.x - lastX, | |
| y = scene.mpos.y - lastY; | |
| lastX = scene.mpos.x; | |
| lastY = scene.mpos.y; | |
| myOb.pos[0] = x; | |
| myOb.pos[1] = y; | |
| if(kb.a){ | |
| upperArm.rot[1] += deg * 0.5 * y; | |
| } | |
| else if(kb.s){ | |
| foreArm.rot[2] += deg * 0.5 * y; | |
| } | |
| else if(kb.d){ | |
| wrist.rot[0] += deg * 0.5 * y; | |
| } | |
| else if(kb.f){ | |
| index.rot[2] += deg * 0.5 * y; | |
| thumb.rot[2] += -deg * 0.5 * y; | |
| } | |
| myOb.pos[0] = scene.mpos.x; | |
| myOb.pos[1] = scene.mpos.y; | |
| myOb.color = 'hsl(' + Math.round(myOb.rot[1] / deg) + ', 100%, 50%)'; | |
| } | |
| }; | |
| scene.add(sceneControl); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment