Open AI Codex fun

01. Infinite acceleration loop.js

/* Make screen a canvas */
var canvas = document.createElement('canvas');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
document.body.appendChild(canvas);

/* remove scroll bars */
document.body.style.overflow = 'hidden';

/* add a circle to the canvas */
var ctx = canvas.getContext('2d');
var circle = {
  x: canvas.width / 2,
  y: canvas.height / 2,
  radius: 50,
  velocity: 1,
  draw: function() {
    ctx.beginPath();
    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
    ctx.fill();
  }
};
circle.draw();
/* make circle controllable with left and right arrows */
document.addEventListener('keydown', function(e) {
  if (e.keyCode == 37) {
    circle.x -= circle.velocity;
  } else if (e.keyCode == 39) {
    circle.x += circle.velocity;
  }
  circle.draw();
});

/* make circle accelerate to the bottom of the canvas due to gravity */
var gravity = 0.1;
var gravityAcceleration = 0;
var gravityVelocity = 0;
var gravityAccelerationIncrement = 0.01;
var gravityVelocityIncrement = 0.1;
var gravityAccelerationIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAccelerationIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.01;
var gravityVelocityIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrementIncrement = 0.1;
var gravityAcceleration

02. Another infinite loop.js

/* draw a rotating cube */
var cube = document.createElement('div');
cube.style.width = '100px';
cube.style.height = '100px';
cube.style.backgroundColor = 'red';
cube.style.position = 'absolute';
cube.style.transform = 'rotateY(0deg)';
document.body.appendChild(cube);
var cube2 = document.createElement('div');
cube2.style.width = '100px';
cube2.style.height = '100px';
cube2.style.backgroundColor = 'green';
cube2.style.position = 'absolute';
cube2.style.transform = 'rotateY(90deg)';
document.body.appendChild(cube2);
var cube3 = document.createElement('div');
cube3.style.width = '100px';
cube3.style.height = '100px';
cube3.style.backgroundColor = 'blue';
cube3.style.position = 'absolute';
cube3.style.transform = 'rotateY(180deg)';
document.body.appendChild(cube3);
var cube4 = document.createElement('div');
cube4.style.width = '100px';
cube4.style.height = '100px';
cube4.style.backgroundColor = 'yellow';
cube4.style.position = 'absolute';
cube4.style.transform = 'rotateY(270deg)';
document.body.appendChild(cube4);
var cube5 = document.createElement('div');
cube5.style.width = '100px';
cube5.style.height = '100px';
cube5.style.backgroundColor = 'purple';
cube5.style.position = 'absolute';
cube5.style.transform = 'rotateY(360deg)';
document.body.appendChild(cube5);
var cube6 = document.createElement('div');
cube6.style.width = '100px';
cube6.style.height = '100px';
cube6.style.backgroundColor = 'orange';
cube6.style.position = 'absolute';
cube6.style.transform = 'rotateY(450deg)';
document.body.appendChild(cube6);
var cube7 = document.createElement('div');
cube7.style.width = '100px';
cube7.style.height = '100px';
cube7.style.backgroundColor = 'brown';
cube7.style.position = 'absolute';
cube7.style.transform = 'rotateY(540deg)';
document.body.appendChild(cube7);
var cube8 = document.createElement('div');
cube8.style.width = '100px';
cube8.style.height = '100px';
cube8.style.backgroundColor = 'gray';
cube8.style.position = 'absolute';
cube8.style.transform = 'rotateY(630deg)';
document.body.appendChild(cube8);
var cube9 = document.createElement('div');
cube9.style.width = '100px';
cube9.style.height = '100px';
cube9.style.backgroundColor = 'black';
cube9.style.position = 'absolute';
cube9.style.transform = 'rotateY(720deg)';
document.body.appendChild(cube9);
var cube10 = document.createElement('div');
cube10.style.width = '100px';
cube10.style.height = '100px';
cube10.style.backgroundColor = 'white';
cube10.style.position = 'absolute';
cube10.style.transform = 'rotateY(810deg)';
document.body.appendChild(cube10);
var cube11 = document.createElement('div');
cube11.style.width = '100px';
cube11.style.height = '100px';
cube11.style.backgroundColor = 'pink';
cube11.style.position = 'absolute';
cube11.style.transform = 'rotateY(900deg)';
document.body.appendChild(cube11);
var cube12 = document.createElement('div');
cube12.style.width = '100px';
cube12.style.height = '100px';

03. 3d cube.js

/* load threejs */
var script = document.createElement('script');
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.min.js';
document.body.appendChild(script);

/* draw a cube */
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );
camera.position.z = 5;

/* render scene */
function render() {
  requestAnimationFrame( render );
  cube.rotation.x += 0.01;
  cube.rotation.y += 0.01;
  renderer.render( scene, camera );
}
render();

04. addEverything.js

/* ask for name using input element */
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.setAttribute('placeholder', 'Enter your name');
document.body.appendChild(input);

/* don't print name twice */
document.body.appendChild (document.createElement('div'))
input.addEventListener('change', function() {
  var name = input.value;
  var hello = document.createElement('div');
  hello.innerHTML = 'Hello ' + name;
  document.body.removeChild(document.body.lastChild);
  document.body.appendChild(hello);
});

/* fuck off */
var fuckOff = document.createElement('div');
fuckOff.innerHTML = 'Fuck off';
document.body.appendChild(fuckOff);
fuckOff.addEventListener('click', function() {
  document.body.removeChild(document.body.lastChild);
});
/* add one */
var addOne = document.createElement('div');
addOne.innerHTML = 'Add one';
document.body.appendChild(addOne);
addOne.addEventListener('click', function() {
  var number = document.createElement('div');
  number.innerHTML = '1';
  document.body.removeChild(document.body.lastChild);
  document.body.appendChild(number);
});

/* delete everything */
var deleteEverything = document.createElement('div');
deleteEverything.innerHTML = 'Delete everything';
document.body.appendChild(deleteEverything);
deleteEverything.addEventListener('click', function() {
  while (document.body.firstChild) {
    document.body.removeChild(document.body.firstChild);
  }
});

/* add everything */
var addEverything = document.createElement('div');
addEverything.innerHTML = 'Add everything';
document.body.appendChild(addEverything);
addEverything.addEventListener('click', function() {
  var helloWorld = document.createElement('div');
  helloWorld.innerHTML = 'Hello World';
  document.body.appendChild(helloWorld);
  var input = document.createElement('input');
  input.setAttribute('type', 'text');
  input.setAttribute('placeholder', 'Enter your name');
  document.body.appendChild(input);
  document.body.appendChild (document.createElement('div'))
  input.addEventListener('change', function() {
    var name = input.value;
    var hello = document.createElement('div');
    hello.innerHTML = 'Hello ' + name;
    document.body.removeChild(document.body.lastChild);
    document.body.appendChild(hello);
  });
  var fuckOff = document.createElement('div');
  fuckOff.innerHTML = 'Fuck off';
  document.body.appendChild(fuckOff);
  fuckOff.addEventListener('click', function() {
    document.body.removeChild(document.body.lastChild);
  });
  var addOne = document.createElement('div');
  addOne.innerHTML = 'Add one';
  document.body.appendChild(addOne);
  addOne.addEventListener('click', function() {
    var number = document.createElement('div');
    number.innerHTML = '1';
    document.body.removeChild(document.body.lastChild);
    document.body.appendChild(number);
  });
  var deleteEverything = document.createElement('div');
  deleteEverything.innerHTML = 'Delete everything';
  document.body.appendChild(deleteEverything);
  deleteEverything.addEventListener('click', function() {
    while (document.body.firstChild) {
      document.body.removeChild(document.body.firstChild);
    }
  });
});