Voxel Engine Starter
Prompt Colab
WYSIWYG
Code Editor
Prompt Guidance
Undo is best effort, not guaranteed
Send
me:
change the floor color to reddish
LLM:
floor is made out of multiple pngs, change all of them?
me:
yes, go ahead
LLM:
changed. don't like?
undo
. rewind is not always possible
WYSIWYG Editor
Code Editor
<script type="x-shader/x-vertex" id="vertexShader"> uniform float amplitude; varying vec3 vViewPosition; varying vec3 vNormal; vec3 rotateVectorByQuaternion( vec3 v, vec4 q ) { vec3 dest = vec3( 0.0 ); float x = v.x, y = v.y, z = v.z; float qx = q.x, qy = q.y, qz = q.z, qw = q.w; // calculate quaternion * vector float ix = qw * x + qy * z - qz * y, iy = qw * y + qz * x - qx * z, iz = qw * z + qx * y - qy * x, iw = -qx * x - qy * y - qz * z; // calculate result * inverse quaternion dest.x = ix * qw + iw * -qx + iy * -qz - iz * -qy; dest.y = iy * qw + iw * -qy + iz * -qx - ix * -qz; dest.z = iz * qw + iw * -qz + ix * -qy - iy * -qx; return dest; } vec4 axisAngleToQuaternion( vec3 axis, float angle ) { vec4 dest = vec4( 0.0 ); float halfAngle = angle / 2.0, s = sin( halfAngle ); dest.x = axis.x * s; dest.y = axis.y * s; dest.z = axis.z * s; dest.w = cos( halfAngle ); return dest; } void main() { vec4 rotation = vec4( 0.0, 1.0, 0.0, amplitude * length( color ) * 0.001 ); vec4 qRotation = axisAngleToQuaternion( rotation.xyz, rotation.w ); vec3 newPosition = rotateVectorByQuaternion( position - color, qRotation ) + color; vNormal = normalMatrix * rotateVectorByQuaternion( normal, qRotation ); vec4 mvPosition = modelViewMatrix * vec4( newPosition, 1.0 ); vViewPosition = -mvPosition.xyz; gl_Position = projectionMatrix * mvPosition; } </script> <script type="x-shader/x-fragment" id="fragmentShader"> varying vec3 vViewPosition; varying vec3 vNormal; void main() { vec3 normal = normalize( vNormal ); // directional light const vec3 lightCol1 = vec3( 0.5, 0.8, 1.0 ); const vec3 lightDir1 = vec3( 0.0, -1.0, 0.0 ); const float intensity1 = 0.5; vec4 lDirection1 = viewMatrix * vec4( lightDir1, 0.0 ); vec3 lightVec1 = normalize( lDirection1.xyz ); // point light const vec3 lightPos2 = vec3( 0.0, 0.0, 0.0 ); const vec3 lightCol2 = vec3( 1.0, 1.0, 1.0 ); const float maxDistance2 = 2000.0; const float intensity2 = 1.5; vec4 lPosition = viewMatrix * vec4( lightPos2, 1.0 ); vec3 lVector = lPosition.xyz + vViewPosition.xyz; vec3 lightVec2 = normalize( lVector ); float lDistance2 = 1.0 - min( ( length( lVector ) / maxDistance2 ), 1.0 ); // point light const vec3 lightPos3 = vec3( 0.0, -1000.0, 1000.0 ); const vec3 lightCol3 = vec3( 1.0, 0.1, 0.0 ); const float maxDistance3 = 3000.0; const float intensity3 = 1.0; vec4 lPosition3 = viewMatrix * vec4( lightPos3, 1.0 ); vec3 lVector3 = lPosition3.xyz + vViewPosition.xyz; vec3 lightVec3 = normalize( lVector3 ); float lDistance3 = 1.0 - min( ( length( lVector3 ) / maxDistance3 ), 1.0 ); // float diffuse1 = intensity1 * max( dot( normal, lightVec1 ), 0.0 ); float diffuse2 = intensity2 * max( dot( normal, lightVec2 ), 0.0 ) * lDistance2; float diffuse3 = intensity2 * max( dot( normal, lightVec3 ), 0.0 ) * lDistance3; gl_FragColor = vec4( diffuse1 * lightCol1 + diffuse2 * lightCol2 + diffuse3 * lightCol3, 1.0 ); } </script> <script src="libs/three.min.js"></script> <script src="libs/Stats.js"></script> <script src="libs/jquery-1.11.1.min.js"></script> <script src="libs/OrbitControls.js"></script> <script src="libs/THREEx.WindowResize.js"></script> <script src="libs/THREEx.KeyboardState.js"></script> <style> html, body { cusor: none; background-color: #000000; color: #ffffff; font-family:Monospace; font-size:13px; text-align:center; font-weight: bold; background-color: #000000; margin: 0 auto; overflow: hidden; height: 100%; width: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } </style> <!-- Piwik --> <script type="text/javascript"> var _paq = _paq || []; _paq.push(["setDomains", ["*.qake.se"]]); _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="//analytics.qake.se/"; _paq.push(['setTrackerUrl', u+'piwik.php']); _paq.push(['setSiteId', '2']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s); })(); </script> <noscript><p><img src="//analytics.qake.se/piwik.php?idsite=2" style="border:0;" alt="" /></p></noscript> <!-- End Piwik Code --> </head> <body> <div style="position: absolute; z-index: 110;" id="blockstats"></div> <div style="position: absolute; z-index: 110; margin-top: 30px;" id="editor"></div> <div style="position: absolute; z-index: 110; margin-top: 70px;" id="editor2"> <button onclick="ToggleWireFrame();">Wireframe on/off</button> <button onclick="Rebuild();">Rebuild All</button> <button onclick="LockPointer();">Lock Mouse</button> </div> <a href="https://github.com/lallassu/Qake"><img style="position: absolute; top: 0; right: 0; border: 0;z-index:110;" src="https://camo.githubusercontent.com/652c5b9acfaddf3a9c326fa6bde407b87f7be0f4/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png"></a> <div style="position: absolute; z-index: 110; margin-top: 90px;" id="phys"> </div> <div style="position: relative; z-index: 1; " id="container"></div> <div style="position: absolute; z-index: 100;" id="stats"></div> <script src="game.min.js"></script> </body> <script> var game; $(document).ready( function() { game = new Game(); game.Init(); //$('body').css('cursor', 'none'); }); function LockPointer() { var e = document.body; //var e = document.getElementById('container'); e.requestPointerLock = e.requestPointerLock || e.mozRequestPointerLock || e.webkitRequestPointerLock; e.requestPointerLock(); } function ToggleWireFrame() { if(game.world.wireframe == true) { game.world.RebuildMaterial(false); } else { game.world.RebuildMaterial(true); } game.world.RebuildDirtyChunks(true); } function Rebuild() { game.world.RebuildDirtyChunks(0); } function HoverColor(color, index) { $('#color').css('color', "rgb("+color+")"); $('#color').html("█("+index+")"); $('#color2').text(index); } </script>
Run
Link:
/s/p0vwslsc