𝓒𝓪𝓹𝓙𝓢 A live code editor for capturing video

0

Program Name



Resolution x Format

Capture Time (s) Framerate 30 60

Aspect Preserve Aspect Ratio

Background Color Advanced Settings

Custom Image
Mode On Change Loop Protection Theme Code Size: 0 lines 0 characters 0 bytes


Show Help Show Watch Window
CapJS shortcuts...

Alt+Up: Toggle Play/Pause
Alt+Down: Restart/Rebuild
Ctrl+F: Search
Ctrl+G: Find Next
Shift+Ctrl+F: Replace
Alt+G: Jump to Line
Ctrl+Space: Autocomplete
Drag+Drop: Load program in text box

Global functions and variables...

u(t) is called 60 times per second
t: Elapsed time in seconds
S: Shorthand for Math.sin
C: Shorthand for Math.cos
T: Shorthand for Math.tan
R: Function that generates rgba-strings
c: 1920x1080 canvas
x: 2D or webgl context for that canvas
renderer: three.js renderer if enabled
PI: Math.PI
image: custom image if loaded
DrawImage: Helper function to draw images

// three.js example

if (!t)
{
scene = new THREE.Scene()
camera = new THREE.PerspectiveCamera(75,16/9)
scene.add(new THREE.DirectionalLight())
scene.add(new THREE.AmbientLight(0x222222))
geometry = new THREE.BoxGeometry(1,1,1)
material = new THREE.MeshLambertMaterial()
cube = new THREE.Mesh(geometry,material)
scene.add(cube)
}
cube.position.z = -2
cube.rotation.set(0,t,t*2);
renderer.render(scene,camera)


// shadertoy example

void mainImage(out vec4 c, in vec2 p)
{
vec2 uv = p/iResolution.xy;
c = vec4(.5+.5*cos(iTime+uv.xyx+vec3(0,2,4)),1);
c *= texture(iChannel0,uv); // custom image
c += iMouse/iResolution.xyxy; // mouse input
}


CapJS © Frank Force 2019 ~ Using CCapture.js, three.js, and CodeMirror ~ Inspired By Dwitter ~ ☮♥☻␌