Bob's public fiddles
-
Arrays#7 Unordered Search
Compare every element checking for a matching value.
-
Arrays#3 Fountains of Particles
Uses function objects to create a new fountain of particles at every mouse-tap position.
-
Procedures#9 Better Recursive Shapes
Illustrates principle of Separation of Concerns. The draw routine is defined as a parameter.
-
Procedures#7 Space-Filling Shapes
Recursion is used in graphics to generate iterated shapes, such as trees, mountains, flowers, etc.
-
Statements#16 Zoom Circles
No-Library (pure JS), HTML, CSS, JavaScript
-
Statements#12 Archimedes Spiral
Implemented using do { statements } while(conditionTrue);
-
Statements#11 Decision Tables
Implemented using the Multiple form of the "if" statement.
-
Statements#10 Right Triangle Test Solution
Click three points. X/Y is shown in top right. Remember coordinates on each click so that you align the next point.
-
Statesments#8 Right Triangle Test
Assume each side is the hypotenuse. If Pythagorean Theorem holds, we have a right triangle, assuming that it is a triangle in the first place.
-
Statements#6 IF
Using step-wise refinement to solve the right-triangle problem, we first write a program that just draws a red or green triangle from 3 given points.
-
Statements#4 JavaScript Debugging
Debugging needs to take place on your local machine using the instructions in the book to set up index.html and sketch.js.
-
Statements#3 Assigment
Parametric Equation expressions draw cool curves. Google the term to find different equations.
-
Statements#2 Assignment
Projectile is shot into the air and falls because of gravity. The draw subroutine is called many times a second. The background is turned off to show the flight history.
-
P5#9 JavaScript Subroutines
Define two subroutines to set the fill color and call a third subroutine to draw text.
-
P5#8 Drawing at Random Points
Try different frame rates. width - canvas width height - canvas height
-
P5#3 Shape/Text Drawing
Study, fork, Run and modify one step at a time to learn.
-
P5#2 Setting External Resources
Fork this Fiddle and the P5 library will be included automatically.
-
P5#1 Canvas Size and Color
Canvas #s are width, height. Background colors are RGB, each 0 to 255. Fork, modify, Run to experiment.
-
Intro#1 HTML Example
Fork and modify to explore the features of HTML.