JS-DOS API: we start DOS in the browser

For over 5 years , the emscripten project has existed. During the existence of the project has been done a lot of work. Surprise the sophisticated reader has become much more difficult. We have already seen DOOM, Dune 2, TTD, C & C and a lot more in the browser. However, it is still difficult to launch a DOS program in the browser: you need to understand C / C ++ and emscripten not bad. Experiments with Dosbox resulted in an em-dosbox project, most DOS programs are available for the browser. To put an end, it remains only to create an open API for running DOS programs in the browser.

A holy place is never empty. The concept is simple, to run the DOS program you will need:

• ZIP archive with the program (executable file + necessary resources)
• Minimal JavaScript knowledge
• Server giving static html

Alley cat

The wonderful game of 1983, which I recall with great warmth. So many great ideas implemented in this game, perhaps this is the first game with mini games. Try again to plunge into the world of childhood. So, we try to start.

First of all, you need to set the dosbox screen size, in the page styles, set the size to the dosbox-container class. This is a utility class for styling the dosbox screen.

.dosbox-container { width: 640px; height: 400px; } 

')
Create a DOM element in which, after initialization, the dosbox screen will be placed. You can use any DOM element that can be referenced through the id attribute.

 <div id="dosbox"></div> 

During initialization, js-dos will create child DOM elements to display the game loading process and a canvas element to display the dosbox screen.

Note: I do not recommend stylizing the dosbox screen with shadows or translucent gradients due to significant FPS subsidence in any browser.

It remains only to connect and configure the js-dos engine.

 01. <script type="text/javascript" src="http://js-dos.com/cdn/js-dos-api.js"></script> 02. <script type="text/javascript"> 03. var dosbox = new Dosbox({ 04. id: "dosbox", 05. onload: function (dosbox) { 06. dosbox.run("http://js-dos.com/cdn/alley_cat.zip", "./CAT.EXE"); 07. }, 08. onrun: function (dosbox, app) { 09. console.log("App '" + app + "' is runned"); 10. } 11. }); 12. </script> 

The first line connects the js-dos engine, the script can be downloaded and used locally. The following is the dosbox instance creation code (line 03).

• id - the unique identifier of the DOM element in which you want to create a dosbox instance
• onload - callback function that will be called after dosbox has been successfully launched
• onrun - callback function that will be called after the successful launch of the program inside dosbox

Line 06 shows the actual launch code for the game.

 06. dosbox.run("http://js-dos.com/cdn/alley_cat.zip", "./CAT.EXE"); 

• The first argument is the url to the zip archive with the game. This archive will be downloaded and unpacked into the dosbox virtual file system.
• The second argument is the executable program file to run. The path is relative to the root of the archive file system.

Full page plunk .


Now you can run Alley Cat or anything else in the browser.

PS: The source code can be run using the file: // protocol in the browser