Implementing a CPU Emulator in SVG

Table of Contents

History of the Cardboard Computer
Prior Work

This paper describes the SECRET project, which stands for SVG and ECMAScript Cardiac Reproduction Emulator Tutor. SECRET emulates CARDIAC, the CARDboard Illustrative Aid to Computation introduced by Bell Systems Laboratories in the 1960's. CARDIC is a simple human-operated CPU made of cardboard. The SECRET project goals include:

  • Providing a visually rich user interface that faithfully captures the CARDIAC's original graphics.

  • Providing an intuitive interaction experience supported by meaningful animation sequences and realistic movements.

  • Providing a zero-setup installation model, such as that found using only an SVG- and ECMAScript-capable browser

  • Provide a single-file deployment which can run standalone or off-line.

  • Provide an environment for experimenting with the development of low-level emulators supporting interactivity, scripting, and animation, while using only SVG and ECMAScript.

This paper focuses on SECRET's implementation and presents some of the key development steps using SVG and ECMAScript in SECRET's development.

In 1961, the Bell System's "Aids to High School Science" program introduced a series of student work kits that were "intended as a concrete contribution to education in areas where Bell scientists are particularly competent"[2]. The kits included topics on solar energy, magnetism, speech synthesis, semiconductor physics, and crystallography, and were distributed to high schools by the 23 Bell System operating telephone companies. In 1968 a new kit, CARDIAC (the CARDboard Illustrative Aid to Computation), was introduced.

Designed to illustrate computer operations and serve as a programming introduction, CARDIAC uses base-10 arithmetic and human interaction to power its 10-opcode instruction set. The cardboard kit must be assembled from die-cut sliders, overlays, and printed cardstock with window openings. CARDIAC was developed by David Hagelbarger and Saul Fingerman, both members of Bell Labs' Information Processing Research Department.

CARDIAC is no longer distributed by the Bell operating phone companies, but there are organizations who offer historic cardboard reproductions for sale. There also have been some open-source efforts to provide software emulators for CARDIAC's instruction set. JCINC [3] is a Java-swing based program that was based on an earlier program called CINC. CEMU[4] is a CARDIAC emulator written in TI89-Basic, but its author describes CEMU as not functional, yet "very nearly though, and requires only a little tweaking".

SVG and ECMAScript offer the potential of a single-file interactive diagram representing the CARDIAC system that allows for user interaction. The SVG and ECMAScript implementation approach compares favorably with the CINC cardiac simulator, which requires a Java Runtime Environment (JRE), and renders with a user interface that is limited by Swing's widget set.

SECRET's first implementation step included scanning and importing historical CARDIAC graphics to Inkscape [5] and exporting to SVG. Then component graphics were surgically cut out into animation SVG sprites and layers. These were manually ID'ed and grafted onto a substrate SVG framework canvas. By using SVG transparency and z-ordering, the development of an interlaced layering mechanism allows for the illusion of cardboard pieces sliding under one another while portions show through cutout transparent "holes".

Next, several ECMAScript libraries were developed. The core CPU emulator was designed in ECMAScript to run with or without the SVG graphical front-end to ensure a faithful reproduction of CARDIAC CPU's semantic behavior. Various ECMAScript libraries were developed including libraries to provide animated movement, manage scenario time sequences, and abstract user-events.

The hope is that SECRET showcases the power of SVG in yielding an historically faithful reproduction of graphic artifacts and combined with ECMAScript yields a rich interactive emulation with rich animations and controls.

Fall 2009, SECRET is scheduled for beta release in an introductory computer science for non-majors course at San Jose State University and concurrently in teaching high-school students attending San Jose High Academy.

[1] "Cardboard 'Computer' Helps Students" Bell Laboratories Record, July 1969

[2] "New Bell System Teaching Aids" (Cover Story) The Journal of the Telephone Industry, Part 21 Practical Electronics, February 27, 1965

[3]"The CINC Project", latest version jcinc-0.2.0, December 12, 2005.

[4]"CEMU" a CARDIAC Emulator written in TI-89 Basic, Sean McCoy, Sept. 22, 2004,