Processing JS

##JavaScript Programs using Processing-JS Graphics Library

If you are new to Graphing Coordinates, you might want to have a quick look at this first one before you begin:

Display Mouse Coordinates Onscreen - http://www.khanacademy.org/cs/display-mouse-coordinates-onscreen/1137234732

If you are interested in doing Artwork First, check out Drawing & Graphics

If you are looking for a little more info about the Programming Language or how the Khan Forum and the Khan Web Based Programming editor work, check out the Getting Started page.

Getting Started

See Dot - http://www.khanacademy.org/cs/see-dot/1138110677

See Dot Move - http://www.khanacademy.org/cs/see-dot-move/1138067869

Animating Rectangle Position - http://www.khanacademy.org/cs/animating-rectangle-position/1174065955

Endless Screen Asteroids Style - http://www.khanacademy.org/cs/endless-screen-asteroids-style/1138290151

See Dot Rebound - http://www.khanacademy.org/cs/see-dot-rebound/1158091789

Bouncing Off the Walls - http://www.khanacademy.org/cs/bouncing-off-the-walls/1178085239

Move Point with Arrow Keys - http://www.khanacademy.org/cs/move-point-with-arrow-keys/1180512140

Text - http://www.khanacademy.org/cs/text/1171075684

Text Alignment Examples - http://www.khanacademy.org/cs/text-alignment-examples/1361569418

Leaving Trails - http://www.khanacademy.org/cs/leaving-trails/1248770599

See Sprite - http://www.khanacademy.org/cs/see-sprite/1169892008

Setup Image for Matrix Transformations - http://www.khanacademy.org/cs/setup-image-for-matrix-transformations/1169357785

Rotate Sprite - http://www.khanacademy.org/cs/rotate-sprite/1155845433

Rotate Images Idependently - http://www.khanacademy.org/cs/rotate-images-idependently/1171755841

Elements of Game Design

Basics of Collision Detection - http://www.khanacademy.org/cs/basics-of-collision-detection/1165877075

Collision Detection using Radius - http://www.khanacademy.org/cs/collision-detection-using-radius/1154016718

Multiple Sprites using Functions - http://www.khanacademy.org/cs/multiple-sprites-using-functions/1163473585

Movement using Polar Coordinates - http://www.khanacademy.org/cs/movement-using-polar-coordinates/1155845433

Side Scroller Neverending Background - http://www.khanacademy.org/cs/side-scroller-neverending-background/1168062609

State Machine ( Levels ) using Switch / Case - http://www.khanacademy.org/cs/state-machine-levels-using-switch-case/1147744306

New Switch / Case (Levels) Simpified - http://www.khanacademy.org/cs/switch-case-levels/1383281028

Game with Levels using Switch & Case - http://www.khanacademy.org/cs/game-with-levels-using-switch-case/1375144412

Multiple Key Presses - http://www.khanacademy.org/cs/multiple-key-presses/977647663

Freeze the Program - http://www.khanacademy.org/cs/freeze-the-program/1172256690

Collide with Things ( Gobble Game ) - http://www.khanacademy.org/cs/collide-with-things-gobble-game/1139575442

Fire Projectiles ( Spawning ) - http://www.khanacademy.org/cs/fire-projectiles-spawning/1150777796

Hitting Things With Projectiles ( Shooter ) - http://www.khanacademy.org/cs/hitting-things-with-projectiles-shooter/1151944770

Getting Hit - Catch Things / Dodge Enemies - http://www.khanacademy.org/cs/getting-hit-catch-things-dodge-enemies/1154138736

Programming Basics

Random Numbers - https://www.khanacademy.org/cs/random-numbers/1347127741

Booleans - https://www.khanacademy.org/cs/boolean/1346145495

Color Flip - http://www.khanacademy.org/cs/color-flip/1363081377

Function - http://www.khanacademy.org/cs/function/1321507906

Concatenate A String - http://www.khanacademy.org/cs/concatenate-a-string/1229716246

For Loop - https://www.khanacademy.org/cs/for-loop/1246965504

For Loop Hexaflexagon - http://www.khanacademy.org/cs/for-loop-hexaflexagon/1198591922

Nested For Loops - http://www.khanacademy.org/cs/nested-for-loops/1167971757

For Loop Exceptions - http://www.khanacademy.org/cs/for-loop-exceptions/1171692008

Ternary Operator - https://www.khanacademy.org/cs/ternary-operator/1172244360

Shuffle an Array of Cards - http://www.khanacademy.org/cs/shuffle-an-array-of-cards/1138121134

Remove Array Entry - http://www.khanacademy.org/cs/remove-array-entry/1171207506

Numerical Input - http://www.khanacademy.org/cs/numerical-input/1383302657

Gravity - https://www.khanacademy.org/cs/gravity/2427839769

HexaSnowflake - http://www.khanacademy.org/cs/hexasnowflake/1224653511

Fun with For Loops - http://www.khanacademy.org/cs/fun-with-for-loops/1199857832

Timing Events Using Frame Counter - http://www.khanacademy.org/cs/timing-events-using-frame-counter/1163321859

abs(num) - https://www.khanacademy.org/cs/absnum/877930637

Sin & Cos - https://www.khanacademy.org/cs/sin-cos/1244606687

Sin & Cos Draw Loop Animated - http://www.khanacademy.org/cs/sin-cos-draw-loop-animated/1244488777

Sin & Cos For Loop - http://www.khanacademy.org/cs/sin-cos-for-loop/1208526099

Orbital Paths Using Sin Cos - http://www.khanacademy.org/cs/orbital-paths-using-sin-cos/1163618484

text("words", x, y, width, height) - https://www.khanacademy.org/cs/textwords-x-y-width-height/1247623175

Managing Game Assets - http://www.khanacademy.org/cs/managing-game-assets/1181632330

Say Ya Want A Revolution? - http://www.khanacademy.org/cs/say-ya-want-a-revolution/1236166801

Tracking Multiple Key Presses - http://www.khanacademy.org/cs/tracking-multiple-keys-presses/1179324699

mouseIsPressed Delete Sprite - http://www.khanacademy.org/cs/mouseispressed-delete-sprite/1383752237

Mouse Over Delete Sprite - http://www.khanacademy.org/cs/mouseover-delete-sprite/1329885218

Ease In Ease Out - http://www.khanacademy.org/cs/ease-in-ease-out/1314857841

Timed Fade Effect - http://www.khanacademy.org/cs/timed-fade-effect/1222714571

Color = get(X,Y) - http://www.khanacademy.org/cs/color-getxy/1374414546

dist(1X, 1Y, 2X, 2Y) - http://www.khanacademy.org/cs/dist1x-1y-2x-2y/1244233705

map(value,low1,high1,low2,high2) - http://www.khanacademy.org/cs/mapvalue-low1-high1-low2-high2/1243519690

Revolve Text around Radius - http://www.khanacademy.org/cs/revolve-text-around-radius/1387929011

lerp(value1,value2,amt) - http://www.khanacademy.org/cs/lerpvalue1-value2-amt/1232796877

constrain - http://www.khanacademy.org/cs/constrain/1244241545

Frame Dropping (Time Based Programming) - http://www.khanacademy.org/cs/frame-dropping-time-based-programming/1249218854

Random Exception - http://www.khanacademy.org/cs/random-exception/1256187054

Alphabet - http://www.khanacademy.org/cs/alphabet/1250678875

Editable Input String - https://www.khanacademy.org/cs/editable-input-string/1909413899

String Casting Methods - https://www.khanacademy.org/cs/string-casting-methods/5637526834905088

Tools

Display Keycodes Mousclicks - http://www.khanacademy.org/cs/display-keycodes-mousclicks/1168197222

Line Drawing Tool - http://www.khanacademy.org/cs/line-drawing-tool/1168275802

Triangle Drawing Tool - http://www.khanacademy.org/cs/triangle-drawing-tool/1248607003

Quadrilateral Drawing Tool - http://www.khanacademy.org/cs/quadrilateral-drawing-tool/1248803121

Bezier Drawing Tool - https://www.khanacademy.org/cs/bezier-drawing-tool/1241423617

Drawing Template - http://www.khanacademy.org/cs/drawing-template/1221225412

Scrolling Text Canvas - http://www.khanacademy.org/cs/scrolling-text-canvas/1051685788

Useful Rotation Tool - http://www.khanacademy.org/cs/useful-rotation-tool/1198345700

Clickable Buttons - http://www.khanacademy.org/cs/clickable-buttons/1227851091

Checkbox - http://www.khanacademy.org/cs/checkbox/1316279500

Sliders and Indicators - http://www.khanacademy.org/cs/sliders-and-indicators/1351463629

Main Menu - http://www.khanacademy.org/cs/main-menu/1189662493

Print To The Console Window - http://www.khanacademy.org/cs/print-to-the-console-window/1186430090

Draggable Circles Function - http://www.khanacademy.org/cs/draggable-circles-function/1168305362

Drag Screen to Change Variables - http://www.khanacademy.org/cs/drag-screen-to-change-variables/1198344002

Four in One Framework - https://www.khanacademy.org/cs/four-in-one-framework/1356754841

Four in One - https://www.khanacademy.org/cs/four-in-one/1356727088

Framerate - http://www.khanacademy.org/cs/getting-framerate/1266708813

External Link - https://www.khanacademy.org/cs/pop-up-a-window-instead/1566393215

Times On This Program - https://www.khanacademy.org/cs/spin-off-of-times-on-this-program/2792337237

Educational

How 3D Works - http://www.khanacademy.org/cs/how-3d-works/1188224880

Sin & Cos Animated - http://www.khanacademy.org/cs/sin-cos-animated/1208526099

Cosine Sine Wheel - http://www.khanacademy.org/cs/cosine-sine-wheel/1000760120

Vertices, Edges, & Faces - http://www.khanacademy.org/cs/vertices-edges-faces/1212079897

Tesla Graph - http://www.khanacademy.org/cs/tesla-graph/1024416493

Convert to Binary - http://www.khanacademy.org/cs/convert-2-binary/1193828360

Binary Hands - http://www.khanacademy.org/cs/binary-hands/1194399615

Binary Operators - http://www.khanacademy.org/cs/binary-operators/1172491995

Math

Divisibility Test - https://www.khanacademy.org/cs/divisibility-test/1379937316

Grapher - http://www.khanacademy.org/cs/grapher/1293283565

lineCollision - https://www.khanacademy.org/cs/linecollision-algebraic/2433083041

Fake Sine Wave - https://www.khanacademy.org/cs/fake-sine-wave/1388308935

Spring - http://www.khanacademy.org/cs/spring/1110413475

Pi Approximation Lower Convergence - https://www.khanacademy.org/cs/pi-approximation-lower-convergence/1351929829

Animation

Forward Kinematics - http://www.khanacademy.org/cs/forward-kinematics/1174958268

Walk Cycle - http://www.khanacademy.org/cs/walk-cycle/1174960874

Inverse Kinematics - http://www.khanacademy.org/cs/inverse-kinematics/1191743453

See Chompy Chomp - https://www.khanacademy.org/cs/see-chompy-chomp/1322883118

Snowflakes - http://www.khanacademy.org/cs/snowflakes/1166824053

Random Snowflakes - http://www.khanacademy.org/cs/random-snowflakes/1227948404

Wiggly Worm - http://www.khanacademy.org/cs/wiggly-worm/1188590248

Origami Cranes - http://www.khanacademy.org/cs/origami-cranes/1221837000

Spinning Wheel Keeps On Turn'ng - http://www.khanacademy.org/cs/spinning-wheel-keeps-on-turnng/1256131476

HexaflexaKaleidoscope - http://www.khanacademy.org/cs/hexaflexakaleidoscope/1199945005

Kirlian Protozoa - http://www.khanacademy.org/cs/kirlian-protozoa/1212988077

Chromatic Convergence - http://www.khanacademy.org/cs/chromatic-convergence/1212965003

Pacific Vibrations - http://www.khanacademy.org/cs/pacific-vibrations/1213218118

Spermatozoa Dance - http://www.khanacademy.org/cs/spermatozoa-dance/1212879204

Elipsoid Variants - http://www.khanacademy.org/cs/ellipsoid-variants/1212478862

The Path to Enlightenment - http://www.khanacademy.org/cs/the-path-to-enlightenment/1244556377

Graphics

arcs 1 - http://www.khanacademy.org/cs/arcs-1/1168008663

bezierVertex - https://www.khanacademy.org/cs/beziervertex/1248425794

Equilateral Polygons - https://www.khanacademy.org/cs/equilateral-polygons/1304459398

Transparent Images - http://www.khanacademy.org/cs/transparent-images/1162903108

Color Gradient - http://www.khanacademy.org/cs/color-gradient/1191829465

Gradient Background - http://www.khanacademy.org/cs/gradient-background/1193558718

Flashing Background - http://www.khanacademy.org/cs/flashing-background/1221159588

HSB Color Mode - http://www.khanacademy.org/cs/hsb-color-mode/1060898352

HSB - http://www.khanacademy.org/cs/hsb/1249161617

HSB Color Spiral - http://www.khanacademy.org/cs/hsb-color-spiral/1244653261

createGraphics - http://www.khanacademy.org/cs/creategraphics/1233366842

KPT Sphere in Graphics Buffer - http://www.khanacademy.org/cs/kpt-sphere-in-graphics-buffer/1232699644

Wheel of For Loops - http://www.khanacademy.org/cs/wheel-of-for-loops/1240551916

Cubic Spline Generator - http://www.khanacademy.org/cs/cubic-spline-generator/1122996057

3D

The Khan Academy interactive programming environment does not currently support 3D. However, a number of students have done work which simulates the 3D environment using code:

3D Engine V.2 - https://www.khanacademy.org/cs/3d-engine-v2/2398428159

Regular Icosahedron (rotate with nmjk) - http://www.khanacademy.org/cs/regular-icosahedron-rotate-with-nmjk/2041174816

First Person Maze Game - http://www.khanacademy.org/cs/first-person-maze-game/972626402

Jack Raycaster - http://www.khanacademy.org/cs/jack-raycaster-new-fake-3d/1163555850

Raycaster - with Minimap! - https://www.khanacademy.org/cs/raycaster-with-minimap/2119163524

3D Camera - http://www.khanacademy.org/cs/3d-camera/1178955366

Utah Teapot - http://www.khanacademy.org/cs/3d-teapot/971436783

Wireframe Cube - http://www.khanacademy.org/cs/3d-box/971239310

Shaded Cube - http://www.khanacademy.org/cs/shaded-box/1066372924

Somewhat Editable Minecraft - http://www.khanacademy.org/cs/somewhat-editable-minecraft/1323308165

Shaded Torus - http://www.khanacademy.org/cs/shaded-torus/1071783640

Shaded Sphere - http://www.khanacademy.org/cs/shaded-sphere/1043363292