1 Quick Start
#lang planet dyoo/js-vm:1:9 |
(printf "hello world\n") |
(check-expect (* 3 4 5) 60) |
(current-seconds) |
(image-url "http://racket-lang.org/logo.png") |
(check-expect (big-bang 0 |
(on-tick add1 1) |
(stop-when (lambda (x) (= x 10)))) |
10) |
"last line" |
This program is in a language that has been enriched with Javascript-specific functions. It can be partially evaluated in plain Racket, but evaluation will halt at the call to image-url because image-url constructs a image DOM element and needs to run in an Javascript context.
Once the program is saved, create a new file called "run.rkt" in the same working directory with the following contents:
#lang racket |
(require (planet dyoo/js-vm:1:9)) |
(run-in-browser "test.rkt") |
When this program is executed, run-in-browser will take "test.rkt" and translate it to run on the browser; a temporary web-server will opened and your browser’s window will open with the running program.
Finally, you can create zip packages by using create-zip-package. For example, modify "run.rkt" to be:
#lang racket |
(require dyoo/js-vm:1:9) |
(create-zip-package "test.rkt" "test.zip") |
A slightly more substantial example is an animation using a built-in functional event-driven programming library.
#lang planet dyoo/js-vm:1:9 |
; falling.ball.rkt |
; Simple falling ball example. A red ball falls down the screen |
; until hitting the bottom. |
(define-struct world (radius y)) |
; The dimensions of the screen: |
(define WIDTH 320) |
(define HEIGHT 480) |
; The radius of the red circle. |
(define RADIUS 15) |
; The world is the distance from the top of the screen. |
(define INITIAL-WORLD (make-world RADIUS 0)) |
; tick: world -> world |
; Moves the ball down. |
(define (tick w) |
(make-world RADIUS (+ (world-y w) 5))) |
; hits-floor?: world -> boolean |
; Returns true when the distance reaches the screen height. |
(define (hits-floor? w) |
(>= (world-y w) HEIGHT)) |
; We have some simple test cases. |
(check-expect (hits-floor? (make-world RADIUS 0)) false) |
(check-expect (hits-floor? (make-world RADIUS HEIGHT)) true) |
; render: world -> scene |
; Produces a scene with the circle at a height described by the world. |
(define (render w) |
(place-image (circle RADIUS "solid" "red") |
(/ WIDTH 2) |
(world-y w) |
(empty-scene WIDTH HEIGHT))) |
; Start up a big bang, 15 frames a second. |
(check-expect (big-bang INITIAL-WORLD |
(on-tick tick 1/15) |
(to-draw render) |
(stop-when hits-floor?)) |
(make-world 15 480)) |
#lang racket |
(require (planet dyoo/js-vm:1:9)) |
(run-in-browser "falling-ball.rkt") |