package elm_playground

  1. Overview
  2. Docs

elm_playground

OCaml Elm Playground

Create pictures, animations, and games with OCaml!

This is a port of the excellent Elm playground package to OCaml.

This is the package I wanted when I was learning programming. Start by putting shapes on screen and work up to making games. I hope this package will be fun for a broad range of ages and backgrounds!

Pictures

A picture is a list of shapes. For example, this picture combines a brown rectangle and a green circle to make a tree

open Playground

let app =
  picture [
    rectangle brown 40. 200.;
    circle green 100.
      |> move_up 100.;
  ]

let main = Playground_platform.run_app app

Play around to get familiar with all the different shapes and transformations in the library.

Animations

An animation is a list of shapes that changes over time. For example, here is a spinning triangle:

open Playground

let view time = [ 
   triangle orange 50.
      |> rotate (spin 8. time);
  ]

let app = animation view

let main = Playground_platform.run_app app

It will do a full spin every 8 seconds.

Maybe try making a car with spinning octogons as wheels? Try using Playground.wave to move things back-and-forth? Try using Playground.zigzag to fade things in-and-out?

Games

A game lets you use input from the mouse and keyboard to change your picture. For example, here is a square that moves around based on the arrow keys:

open Playground

let view _computer (x, y) = [ 
  square blue 40.
   |> move x y
 ]

let update computer (x, y) =
  (x +. to_x computer.keyboard, y +. to_y computer.keyboard)

let app = 
  game view update (0., 0.)

let main = Playground_platform.run_app app

Every game has three important parts:

  1. memory - Store information. Our example stores (x,y) coordinates.
  2. update - Update the memory based on mouse movements, key presses, etc. Our example moves the (x,y) coordinate around based on the arrow keys.
  3. view - Turn the memory into a picture. Our example just shows one blue square at the (x,y) coordinate we have been tracking in memory.

When you start making fancier games, you will store fancier things in memory. There is a lot of room to develop your programming skills here: Making lists, using records, creating custom types, etc.

I started off trying to make Pong, then worked on games like Breakout and Space Invaders as I learned more and more. It was really fun, and I hope it will be for you as well!

Animated sprites

To make characters like Mario walk, see Making animated sprites.

Index of modules

  • Playground
  • Playground_platform

The same in 3D is Playground3d (package elm_playground_3d).

The library, area by area

Everything a game or an application needs is written in this repository from scratch, one idea per module, and each module's interface explains its idea. Here they are, grouped as the README's table groups them.

The playground

The APIs over the libraries below, where games meet them:

  • Physics
  • Audio
  • Ai
  • Gui
  • Juice
  • Multiplayer
  • Ai_debug
  • Audio_debug

and in 3D Physics3d, Audio3d, Juice3d, Multiplayer3d.

The layers, a camera, sprites, a tilemap, a scene:

  • Camera2d
  • Sprite
  • Tilemap
  • Scene2d

and in 3D Camera3d, Character3d, Ragdoll3d, Portal3d.

Other ways to program, each building a Playground app for you:

  • Logo
  • Bigbang
  • Universe
  • Puzzlescript
  • Karel
  • Povray
  • Teletype
  • Textmode

and Logo3d.

What Elm's core gives, and a few more, is tiny_libs' core.

The libraries under the playground, from graphics to the terminal, know nothing of it: they are a package of their own, tiny_libs, whose front page lists their modules, area by area.

Graphics

The 2D and 3D rasterizers, the ray tracer, image processing, the image and video formats: tiny_libs' graphics.

Physics

In 2D and 3D: tiny_libs' physics.

Audio

Signals, synthesis, the engine, a synthesizer's live blocks, effects, and the files (WAV, MIDI, ABC, solfège, MOD, MP2, MP3): tiny_libs' audio.

AI

tiny_libs' game AI.

GUI

tiny_libs' GUI, and the game juice.

Networking, cryptography, compression

The protocols, the netcode, TLS 1.3 and the sockets, cryptography and compression.

The terminal

tiny_libs' terminal.

Application engines

What a few applications share: a spreadsheet, rich text, paint and draw, a browser's layout, editors, CAD, ... None of them draws with the playground: a package of their own, tiny_appkits, whose front page lists their modules.

The kits that draw with it are here, beside the apps they help: the File menu, compound documents, letters in a look, a drawing's figures, and the browsers (a page read, drawn, browsed and scripted):

  • File_menu
  • Component
  • Compound
  • Stroke_text
  • Figure_shapes
  • Browser_page
  • Browser_draw
  • Browser_history
  • Browser_forms
  • Browser_tab
  • Browser_script
  • Browser_text
  • Browser_boxes
  • Browser_picture
  • Browser_url
  • Browser_devtools

Game kits

How each genre works, what the games of a genre share: shoot 'em ups, fighting games, platformers, mazes, puzzles, cards, adventures, racing, sports, strategy, rhythm games, and the levels of Doom, Descent and Comanche: a package of their own, elm_playground_gamekits, whose front page lists their modules, genre by genre.

Languages

Languages as text, parsed and run: a spreadsheet's formulas, BASIC, s-expressions, Emacs Lisp, Scheme, Pascal, HyperTalk, Smalltalk-80, Scratch, PostScript, JavaScript, HTML and CSS, JSON and jsonnet (the code map's configurations), and OCaml, C and assembly read for the code map. They know nothing of the playground either: a package of their own, tiny_languages, whose front page lists their modules, language by language.