Forth Haiku Interactive

November 21, 2015

Brad Nelson / @flagxor

Forth Haiku

  • Tiny programs → Beauty
  • Forth → JavaScript → GLSL
  • Share + Evolve on the Web

forthsalon.appspot.com

Graphical Forth Haiku

  • No variables / loops
  • Floating point dstack + rstack
  • Run once per pixel
  • x ( -- n ) \ [0,1]
  • y ( -- n ) \ [0,1]
  • haiku ( -- r [g [b [a]]] )

Primrose Flower - adg


: i 2dup z* log
; x .5 - y .5 -
i i i log over

Primrose Flower - adg

Animated Forth Haiku

  • t ( -- n) \ seconds since midnight
  • 30fps

PONG 254 bytes - Manwe


: d dup ;
: m 0.4 * 0.5 + - ;
: a * - y - abs 0.1 < x ;
: r t swap / d floor - 1.96 * 0.98 -
  d 0 > 2 * 1 - * 0.01 + ;
: e 3 r 0.94 * 0.03 + ;
: p 5 r 0.9 * 0.05 + d t 3 * ;
e x - d * 5 r y - d * + sqrt 0.02 <
p sin m e a 0.03 < *
p cos m 1 e - a 0.97 > *

PONG 254 bytes - Manwe

Fractal 125 bytes - Manwe


: l 2dup z* .019 t 5 / cos * .6328 z+ ;
: f l l l l l l l l l l ;
y .5 -
.5 x -
f f f f f f
.45 max
-.2 rot -
2dup + abs 2 **

Fractal 125 bytes - Manwe

Forth Haiku 2015

  • Haiku Monthly
  • Users around the globe
  • SPAM
  • Full word search
  • IF..ELSE..THEN
  • Animate on mouse over
  • Haiku Genealogy
  • Disqus Forum
  • More Sound
  • Interactivity
  • State
  • Kiosk

Sound 1.0

  • Sample (0, 0) audio signal
  • Cacophony is easy
  • Sync with animation is hard

Sound 2.0

  • Sample (0, 0.5) for "note"
  • Sample (1, 0.5) for "volume"
  • Pentatonic scale
  • Sync with animation is weird

Sound 3.0

  • audio ( n -- )
  • Label works with audio

Interactivity

  • Mouse
  • Keys
  • Steno Keyboard

Button Interactivity

  • 23 Buttons
  • buttons ( -- n )
  • button ( n -- f )

Mouse Interactivity

  • mx ( -- n )
  • my ( -- n )
  • Share button 0 for click

State

  • @ ( a -- n )
  • ! ( n a -- )
  • Memory 0 - 15, mod, floored
  • Runs once per frame at (0, 0)
  • Dispersed to each pixel
  • dt ( -- n ) \ seconds since last frame

Fun with Unicode

  • Search: 🔍
  • Category: 🎥 🎮 🔈
  • Play/Pause: ▶ ❚❚
  • Love/Hate: 👍 👎

Stenography Keyboard

Postscript

  • Forth-like data stack
  • Dynamically typed elements

Postscript


/inch { 72 mul } def
        

4 inch 1.75 inch rmoveto
8 inch 5.5 inch box

Keys


/step { key_owidth 0 rmoveto } def
/halfstep { key_owidth 2 div 0 rmoveto } def
/up { 0 key_oheight 2 div rmoveto } def
/down { 0 key_oheight 2 div neg rmoveto } def
/key {
   key_width key_height box center step } def

Layout


currentpoint
  (S) bigkey (K) key (W) key (R) key
  (*) bigkey (R) key (B) key (G) key
             (S) key (Z) key
moveto up up currentpoint
  step (T) key (P) key (H) key
  step (F) key (P) key (L) key
       (T) key (D) key
moveto up up

Arduino MEGA ADK

ChromeOS + Chromebooks

  • Nothing but the Web
  • No Native Apps

Chromebook Pixel

Chrome Apps + Extensions

  • Javascript + HTML
  • Additional APIs
  • Chrome Web Store

Types

  • Extensions
  • Apps
    • Hosted Apps
    • Packaged Apps

Common APIs

  • storage
  • proxy
  • tabs
  • Message Passing
  • many more...

Apps APIs

  • windows
  • tts
  • sockets
  • usb
  • bluetooth
  • serial
  • many more...

chrome.serial

  • getDevices
  • connect
  • send
  • onReceive

Message Passing

  • chrome.runtime.onConnectExternal
  • chrome.runtime.connect

chrome.runtime.onConnectExternal.addListener(
    function(port) {
  port.onMessage.addListener(function(msg) {
    // send reply
    port.sendMessage(...);
  });
});

From Key to Color

 ↔
↔
chrome.serial
↕
↔
Message Passing
 ↔

Kiosk Mode

  • Apps available without login
  • Can be locked to one app

forthsalon.appspot.com

Source and slides at: github.com/flagxor

⚘

Thank you