A compact, dependency-free Javascript wasm recreation of the beloved 16-bit Screen Mate Poe Windows program, distributed as a standalone library and a Firefox browser extension.
There have been several ports of Screen Mate Poe since its original release in 1996, but modern desktop environments simply aren't capable of running anything like a "screen mate" app anymore. (Display servers no longer give applications unfettered, global access to every conceivable windowing property, for reasons obvious in hindsight.)
But hey, the Internet is a thing now!
JS Mate Poe is a lean, web-first iteration designed for playback in modern web browsers. It was originally written in vanilla Javascript, but has since been re-rewritten in Rust, and is now compactly compiled to wasm.
It includes all the original characters and sounds, most of the animation sequences — a few desktop-specific things have been omitted, and I've probably forgotten a few — and some new sequences and visual enhancements.
JS Mate Poe has been heavily optimized for both performance and size — it's smaller than the original! — ensuring a minimal impact on page load, bandwidth, and/or user experience. It is framework-free, isolated (via ShadowDOM), leverages hardware-accelerated rendering, and is all around adorable.
You're welcome!
JS Mate Poe is distributed as both a general purpose Javascript library and a Firefox browser extension.
To add the screen mate to your own web page, all you need to do is grab the js-mate-poe.min.js script from the latest release, upload it to a location of your choosing, and add the following code snippet before the closing </body> tag of your HTML:
<script async src="https://domain.com/path/to/js-mate-poe.min.js"></script>By default, that's all you need to do! Poe will automatically start running around as soon as the script has loaded.
The following attributes can be added to the script tag for more granular control:
| Attribute | Description |
|---|---|
data-no-start |
Disable autostart. (You'll need to start Poe manually.) |
data-no-audio |
Disable audio playback. |
data-no-focus |
Disable Poe's draggability. |
For example, if you wanted to launch Poe without sound support, you'd write this instead:
<script async data-no-sound src="https://domain.com/path/to/js-mate-poe.min.js"></script>The next section covers the minimal API, which you'd need to use to enable Poe programmatically.
The Firefox browser extension lets you add Poe to any and every web site for constant companionship!
To install it, simply click the js-mate-poe_firefox_#.#.#.xpi package link from the latest release.
Firefox should prompt you to install it then and there, but if you end up downloading the file, you can either double-click it, or go to the "Manage Your Extensions" settings page (about:addons), click the gear/settings icon, and select "Install Add-on From File".
Once installed, look for the little sheep icon in the URL bar — visible on all regular pages (but not local or settings-type stuff) — and click that to turn Poe on or off.
If you want to allow audio — see also the known issues section below — you can enable that from the add-on's preferences tab. (Sound is disabled by default.)
Browser extension permissions lack nuance, and as such, JS Mate Poe technically requires "access [to] your data on all sites" in order to run.
To be clear, it does not give two bleats about your personal data or browsing history, but because DOM access is an all-or-nothing proposition, is has to ask for EVERYTHING to be able to do anything. 😕
In actuality, all JS Mate Poe needs from the DOM is an ability to add and manipulate its own page elements — the sheep — and query relevant environmental details like the current window size.
The alarmist phrasing is unfortunate, but is what it is.
The standalone Javascript library adds a global Poe class to the window object that you can use for basic control (if you want it):
| Property | Type | Description | Default |
|---|---|---|---|
active |
bool |
Start or stop the Poe script. | true |
audio |
bool |
Enable or disable audio playback. | true |
focus |
bool |
Enable or disable the ability to click and drag Poe. | true |
These are standard getter/setter methods, so can either give you the current value or allow you to make changes depending on how you use them. For example:
// Stop Poe (and remove its DOM elements and event bindings).
Poe.active = false;
// The current status should be `false`, i.e. stopped.
console.log(Poe.active);
// Restart Poe (and recreate its DOM elements, etc.)
Poe.active = true;
// The current status should be `true`, i.e. started.
console.log(Poe.active);Short and sweet!
The Internet is a good habitat for Poe, but not a perfect one. There are a few quirks he has to live with, at least for the time being. Before reporting an issue, please double-check it isn't listed below.
| Issue | Library | Extension | Fixed |
|---|---|---|---|
| No Audio | X | X | |
| X | 1.5.0 |
||
| X | 1.4.3 |
Browsers automatically block autoplaying audio to protect users from disruptive advertisements and SPAM. This is a sound decision 😜, but unfortunately means that even when Poe's audio option is enabled, it might not actually be allowed to make any noise.
The only workaround for this is to click somewhere — anywhere — on the page. (Browsers aren't smart enough to recognize PLAY buttons, so have to assume that any sort of click might indicate the user's desire to play something.)
Firefox kills any active instances of an add-on before applying an update, but does not reload the page(s) it was running on, effectively orphaning any elements — like sheep! — it may have been managing.
A workaround was added to 1.5.0 to detect and clean up any frozen old sheep resulting from such updates, but if for some reason that doesn't work, all you need to do is manually reload the affected page(s) to return to normal.
The Firefox extension has supported automatic updates since version 1.4.3, but if you were a really early adopter — thanks! — you'll need to manually upgrade once to benefit.
Thankfully that's easy to do: just click the #.#.#.xpi link attached to the latest release to update to that version.
The original Screen Mate Poe (AKA eSheep, Screen Mate Poo, etc.) was based on Tatsutoshi Nomura's animated shorts "Stray Sheep", which aired on the Fuji Television network in Japan. Mr. Nomura has subsequently published a series of cute children's books and games featuring Poe.
If you're looking for an adorable gift for young readers, be sure to check out "Poe At Play"!