platotermjs

This is a version of PLATOTERM that has been ported to JavaScript by way of the emscripten (http://emscripten.org/) project. It connects to an existing CYBIS installation via a WebSockets proxy.

Demo

It can be seen at http://js.irata.online/

Requirements

A web server: IRATA.ONLINE uses nginx, but you can use any standard (Apache, IIS, whatever) standard web server.
A WebSockets proxy. I use websockify (https://github.com/novnc/websockify), but some web servers, such as IIS have a way to define WebSocket proxies. Your web socket proxy must be pointing to your CYBIS's ASCII port (usually port 8005)
Make sure your web socket proxy is protected by TLS (SSL). Many browsers now require this for all websockets.

Building

This is broken into two sections, first covering the build environment, followed by compiling the code.

Installing Emscripten

You can follow the instructions at https://emscripten.org/docs/getting_started/downloads.html , but for TL:DR:

You need:

Python 3.6 or newer (this is especially important on Windows)
git
If you're running in Windows, using the Windows Subsystem for Linux is highly recommended.

From a shell, do the following:

# Get the emsdk repo
git clone https://github.com/emscripten-core/emsdk.git

# Enter that directory
cd emsdk

# Fetch the latest version of the emsdk (not needed the first time you clone)
git pull

# Download and install the latest SDK tools.
./emsdk install latest

# Make the "latest" SDK "active" for the current user. (writes .emscripten file)
./emsdk activate latest

# Activate PATH and other environment variables in the current terminal
source ./emsdk_env.sh

NOTE If running from windows CMD, run emsdk instead of ./emsdk, and emsdk_env.bat instead of source ./emsdk_env.sh

Compiling the code

From a shell, do the following:

# Get the code
git clone https://github.com/tschak909/platotermjs.git

# enter that directory
cd platotermjs

# make the code, note the TARGET_URL must point to where the WebSocket will be listening.
TARGET_URL="wss://js.irata.online:2005" make

PLATOTERM will be built inside of build/ and you'll have the following:

plato.html - A basic HTML page which will load the PLATO terminal. This can be modified as needed.
plato.js - The compiled javascript of PLATOTERM
src - Dependency data generated during build process, not needed for deployment.

Setting up The WebSocket Proxy

Because JavaScript does not support connecting to raw sockets, we need to provide a WebSockets proxy. IRATA.ONLINE uses websockify (https://github.com/novnc/websockify), and other web servers have facilities to provide a WebSocket proxy (e.g. IIS)

websockify

You need:

websockify, either from source (link above), or via distribution, e.g. the websockify package in Debian or Ubuntu.
a TLS certificate and key, so that secure Websockets will function.

To use:

websockify --cert=/etc/letsencrypt/live/js.irata.online/cert.pem --key=/etc/letsencrypt/live/js.irata.online/privkey.pem 2005 localhost:8005

In this case, it is using LetsEncrypt TLS certificates generated by the letsencrypt tool, and it is forwarding websockets requests on port 2005, to the CYBIS ASCII socket on port 8005.

IIS

IIS has support for setting up WebSockets proxies in its user interface. More detailed information can be seen here (https://www.microfocus.com/documentation/extend-acucobol/1011/GUID-81B323FA-6AE6-438A-A1F5-016D7F45A097.html)

Deploying to server

Since PLATOTERM.js is entirely run on the client, all that is needed is to copy the plato.html and plato.js to an accessible directory on the web server.

Additional features

The irata-plato.html file is a more advanced shell showing how to implement on-screen keyboard control.