Creational Design Patterns
Getting started with html5-canvas
Tail Call Optimization
Media types and the canvas
Collisions and Intersections
Clearing the screen
Navigating along a Path
Charts & Diagrams
Remainder / Modulus (%)
Exponentiation (Math.pow() or **)
Difference between var and let
Short-circuiting in boolean operators
Abstract equality / inequality and type conversion
Checking if an object is an Array
How to add the Html5 Canvas Element to a webpage
Removing all elements
Canvas size and resolution
Creating a responsive full page canvas
Off screen canvas
Simple animation with 2D context and requestAnimationFrame
Drawing many translated, scaled, and rotated images quickly
What is Tail Call Optimization (TCO)
Random with gaussian distribution
Convert a String to an Array
Image cropping using canvas
Math.atan2 to find direction
Sin & Cos to create a vector given direction & distance
Periodic functions using Math.sin
The Tained canvas
Loading and displaying an Image
Little / Big endian for typed arrays when using bitwise operators
Reuse objects rather than recreate
Basic loading and playing a video on the canvas.
Chainable object design and chaining
Getting maximum and minimum
Use requestAnimationFrame() NOT setInterval() for animation loops
Are 2 line segments intercepting?
Cubic & Quadratic Bezier curve with arrowheads
Line without blurryness
Bit fields to optimise comparison of multi state data
Set frame rate using requestAnimationFrame
Rendering text along an arc.
Render a rounded polygon.
Finding points along a cubic Bezier curve
Finding points along a quadratic curve
Finding points along a line
Finding points along an entire Path containing curves and lines
Length of a Quadratic Curve
Split bezier curves at position
Clear canvas with gradient.
Trim bezier curve.
Length of a Cubic Bezier Curve (a close approximation)
Scaling image to fit or fill.
Find point on curve
Text on curve, cubic and quadratic beziers
Capture canvas and Save as webM video
Invert or Negate image with "difference"
Black & White with "color"
Increase the color contrast with "saturation"
Sepia FX with "luminosity"
Finding extent of Quadratic Curve
Responsive canvas animations without resize events.
Perth, Western Australia
Programmer by nature, coder by nurture,