SqueakJS
SqueakJS is an HTML5 runtime engine for
Squeak Smalltalk written in pure JavaScript by Bert Freudenberg.
See the
SqueakJS Project page for more information.
Run Squeak images from your local machine
Use drag-and-drop to run a Squeak image from your machine: drop the image (perhaps together with a changes and sources file) into this page.
All images and related files are stored persistently in a database inside your browser.
The box below shows the files that are currently in your database. Inside Squeak, you can use a FileList
to manage them.
Drop Squeak images and other files here.
Clicking on a name in the box will export that file to your browser's downloads folder.
Run Squeak images from the internet
Construct a URL linking to this page and pass the image and options.
Beware that the server needs to allow script access via CORS.
Here are a few examples:
- Squeak 1.13 (1996) link
- Squeak 2.8 (2000) link
- Squeak 3.8 (2006) link
- Squeak 3.9 (2008) link
- Squeak 4.5 (2014) link
- Squeak 5.0 (2015) link
- SpeechPlugin Demo (2016) link
On the first run these will be stored locally. Subsequent starts are much faster.
Run SqueakJS apps
SqueakJS can be used to run Squeak apps. Here are some examples.
Note how they differ when you resize the browser window—Etoys is scaled,
whereas Scratch is resized.
The apps are configured to use template files (e.g. example projects and artwork)
that are loaded from a server on demand.
On some mobile devices you can save these apps to the home screen, and run them like a real app.
Use SqueakJS on your own website
Instead of passing options by URL to this page, you can
download SqueakJS
from GitHub and use it on your own website like this:
<html>
<head>
<script src="squeak.js"></script>
<script>
window.onload = function() {
SqueakJS.runSqueak("my.image", sqCanvas, { /*put options here*/ });
}
</script>
</head>
<body>
<canvas id="sqCanvas"></canvas>
</body>
</html>
Options include display resolution, template file URLs, etc.
For example usage take a look at the demo pages included in the GitHub repo:
Etoys
(
source) or
Scratch
(
source)
Modify SqueakJS
I am developing SqueakJS using “Lively”, a browser-based development environment for JavaScript inspired by Smalltalk.
Instead of having to constantly reload the page after every source code change,
I am executing Squeak in my
Lively SqueakJS Debugger
and can change its code while it is running.
That's why the SqueakJS source code has a somewhat unusual layout, it fits the Lively way of developing.
You can still use a plain text editor if you feel that's simpler.
Contribute to SqueakJS
SqueakJS is free software (MIT license).
You're very welcome to
discuss,
report bugs,
and
contribute code.
Have fun! — Bert Freudenberg