Start using fenced code blocks with language identifiers to improve highlighting with GitHub Pages

This commit is contained in:
Jeff Parsons 2016-05-01 16:09:33 -07:00
commit 2ba7f502c1
12 changed files with 247 additions and 209 deletions

View file

@ -6,7 +6,8 @@ menu_order: 2
permalink: /blog/ permalink: /blog/
--- ---
Keep tabs on the [PCjs Project](https://github.com/jeffpar/pcjs) on GitHub: [Releases](https://github.com/jeffpar/pcjs/releases), [Issues](https://github.com/jeffpar/pcjs/issues), Keep tabs on the [PCjs Project](https://github.com/jeffpar/pcjs) on GitHub:
[Releases](https://github.com/jeffpar/pcjs/releases), [Issues](https://github.com/jeffpar/pcjs/issues),
and [Commits](https://github.com/jeffpar/pcjs/commits/master). and [Commits](https://github.com/jeffpar/pcjs/commits/master).
For random musings about PCjs, web technologies, old hardware and software, and more, read on. For random musings about PCjs, web technologies, old hardware and software, and more, read on.

View file

@ -1,6 +1,8 @@
--- ---
layout: page layout: page
title: Device Configurations title: Device Configurations
menu_title: Devices
menu_order: 3
permalink: /devices/ permalink: /devices/
redirect_from: redirect_from:
- /configs/ - /configs/
@ -11,7 +13,7 @@ Device Configurations
All PCjs machines are built from the following collections of devices: All PCjs machines are built from the following collections of devices:
* 6502-based Devices (e.g., [Challenger 1P](c1p/)) * 6502-based Devices (e.g., [Challenger 1P](c1p/machine/))
* [8080-based Devices](pc8080/) (e.g., [Space Invaders](pc8080/machine/invaders/)) * [8080-based Devices](pc8080/) (e.g., [Space Invaders](pc8080/machine/invaders/))
* [8086-based Devices](pc/) (e.g., [IBM PC, including 80286 and 80386-based compatibles](pc/machine/)) * [8086-based Devices](pc/) (e.g., [IBM PC, including 80286 and 80386-based compatibles](pc/machine/))

View file

@ -9,7 +9,7 @@ redirect_from:
IBM PC Device Configurations IBM PC Device Configurations
--- ---
[IBM PC Machines](machine/) are built from a collection of PC Devices, including: [IBM PC Machines](machine/) are built from a collection of devices, including:
* CPU (e.g., 8088, 80286, 80386) * CPU (e.g., 8088, 80286, 80386)
* RAM * RAM
@ -34,21 +34,23 @@ or it can include pre-configured device XML files, such as those provided above
Here's an example of [IBM 5150](/devices/pc/machine/5150/mda/64kb/) Here's an example of [IBM 5150](/devices/pc/machine/5150/mda/64kb/)
[XML](/devices/pc/machine/5150/mda/64kb/machine.xml): [XML](/devices/pc/machine/5150/mda/64kb/machine.xml):
<machine id="ibm5150" class="pc" border="1" pos="center" background="#FAEBD7"> ```xml
<name pos="center">IBM PC (Model 5150) with Monochrome Display</name> <machine id="ibm5150" class="pc" border="1" pos="center" background="#FAEBD7">
<computer id="pc-mda-64k" name="IBM PC" resume="1"/> <name pos="center">IBM PC (Model 5150) with Monochrome Display</name>
<ram id="ramLow" addr="0x00000"/> <computer id="pc-mda-64k" name="IBM PC" resume="1"/>
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="/devices/pc/rom/5150/basic/BASIC100.json"/> <ram id="ramLow" addr="0x00000"/>
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="/devices/pc/rom/5150/1981-04-24/PCBIOS-REV1.json"/> <rom id="romBASIC" addr="0xf6000" size="0x8000" file="/devices/pc/rom/5150/basic/BASIC100.json"/>
<video ref="/devices/pc/video/ibm/mda/ibm-mda.xml"/> <rom id="romBIOS" addr="0xfe000" size="0x2000" file="/devices/pc/rom/5150/1981-04-24/PCBIOS-REV1.json"/>
<fdc ref="/disks/pc/compiled/samples.xml"/> <video ref="/devices/pc/video/ibm/mda/ibm-mda.xml"/>
<cpu id="cpu8088" model="8088" autostart="true" pos="left" padleft="8px" padbottom="8px"> <fdc ref="/disks/pc/compiled/samples.xml"/>
<control type="button" binding="run">Run</control> <cpu id="cpu8088" model="8088" autostart="true" pos="left" padleft="8px" padbottom="8px">
<control type="button" binding="reset">Reset</control> <control type="button" binding="run">Run</control>
</cpu> <control type="button" binding="reset">Reset</control>
<keyboard ref="/devices/pc/keyboard/us83-buttons-arrows.xml"/> </cpu>
<chipset id="chipset" model="5150" sw1="01000001" sw2="11111000"/> <keyboard ref="/devices/pc/keyboard/us83-buttons-arrows.xml"/>
</machine> <chipset id="chipset" model="5150" sw1="01000001" sw2="11111000"/>
</machine>
```
In this example, all the devices are fully configured within the machine XML file, except for the In this example, all the devices are fully configured within the machine XML file, except for the
[Video](/docs/pcjs/video/) [XML](/devices/pc/video/ibm/mda/ibm-mda.xml), [Video](/docs/pcjs/video/) [XML](/devices/pc/video/ibm/mda/ibm-mda.xml),

View file

@ -1,8 +1,6 @@
--- ---
layout: page layout: page
title: IBM PC Machine Configurations title: IBM PC Machine Configurations
menu_title: Machines
menu_order: 6
permalink: /devices/pc/machine/ permalink: /devices/pc/machine/
redirect_from: redirect_from:
- /configs/pc/machines/ - /configs/pc/machines/
@ -11,7 +9,7 @@ redirect_from:
IBM PC Machine Configurations IBM PC Machine Configurations
--- ---
[PC Devices](/devices/pc/) are the building blocks of these early [IBM PC Machines](#ibm-pc-machines): PCjs supports these early [IBM PC Machines](#ibm-pc-machines):
* [IBM PC](/devices/pc/machine/5150/) (Model 5150) * [IBM PC](/devices/pc/machine/5150/) (Model 5150)
* [IBM PC XT](/devices/pc/machine/5160/) (Model 5160) * [IBM PC XT](/devices/pc/machine/5160/) (Model 5160)

View file

@ -23,25 +23,26 @@ or it can include pre-configured device XML files, such as those provided above
For example, here's what the [Space Invaders (1978)](/devices/pc8080/machine/invaders/) For example, here's what the [Space Invaders (1978)](/devices/pc8080/machine/invaders/)
[XML](/devices/pc8080/machine/invaders/machine.xml) looks like: [XML](/devices/pc8080/machine/invaders/machine.xml) looks like:
<?xml-stylesheet type="text/xsl" href="/versions/pc8080/1.22.0/machine.xsl"?> ```xml
<machine id="invaders" class="pc8080" border="1" pos="center" background="#FAEBD7"> <machine id="invaders" class="pc8080" border="1" pos="center" background="#FAEBD7">
<name pos="center">Space Invaders</name> <name pos="center">Space Invaders</name>
<computer id="computer" busWidth="16"/> <computer id="computer" busWidth="16"/>
<cpu id="cpu8080" model="8080" cycles="2000000"/> <cpu id="cpu8080" model="8080" cycles="2000000"/>
<rom id="romH" addr="0x0000" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-H.json"/> <rom id="romH" addr="0x0000" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-H.json"/>
<rom id="romG" addr="0x0800" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-G.json"/> <rom id="romG" addr="0x0800" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-G.json"/>
<rom id="romF" addr="0x1000" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-F.json"/> <rom id="romF" addr="0x1000" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-F.json"/>
<rom id="romE" addr="0x1800" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-E.json"/> <rom id="romE" addr="0x1800" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-E.json"/>
<ram id="ram" addr="0x2000" size="0x2000"/> <ram id="ram" addr="0x2000" size="0x2000"/>
<video id="video" screenWidth="224" screenHeight="256" bufferAddr="0x2400" bufferCols="256" bufferRows="224" bufferBits="1" interruptRate="120" rotation="90" width="40%" pos="left" padding="8px"> <video id="video" screenWidth="224" screenHeight="256" bufferAddr="0x2400" bufferCols="256" bufferRows="224" bufferBits="1" interruptRate="120" rotation="90" width="40%" pos="left" padding="8px">
<menu> <menu>
<title>224x256 Screen (Rotated)</title> <title>224x256 Screen (Rotated)</title>
</menu> </menu>
</video> </video>
<chipset id="chipset" model="SI1978"/> <chipset id="chipset" model="SI1978"/>
<panel ref="/devices/pc8080/panel/left.xml"/> <panel ref="/devices/pc8080/panel/left.xml"/>
<debugger id="debugger" commands="s 8086"/> <debugger id="debugger" commands="s 8086"/>
</machine> </machine>
```
In this example, all the devices are fully configured within the machine XML file, except for the In this example, all the devices are fully configured within the machine XML file, except for the
[Control Panel](panel/) [XML](panel/left.xml). [Control Panel](panel/) [XML](panel/left.xml).

View file

@ -11,5 +11,5 @@ permalink: /devices/pc8080/rom/exerciser/
* [8080EXER](8080EXER.MAC) * [8080EXER](8080EXER.MAC)
* [8080PRE](8080PRE.MAC) * [8080PRE](8080PRE.MAC)
Our [8080 Exerciser Test Machine](/devices/pc8080/machine/exerciser/) runs the [8080EX1](8080EX1.MAC), Our [8080 Exerciser Test Machine](/devices/pc8080/machine/exerciser/) runs [8080EX1](8080EX1.MAC),
since it is the most comprehensive test, and was designed specifically for the Intel 8080. since it is the most comprehensive test and verifies strict compatibilty with the original Intel 8080.

View file

@ -78,37 +78,45 @@ making all its disks available to any machine loading that particular configurat
A simple FDC configuration file, such as [samples.xml](samples.xml), *could* contain individual &lt;disk&gt; A simple FDC configuration file, such as [samples.xml](samples.xml), *could* contain individual &lt;disk&gt;
entries like: entries like:
<disk path="/disks/pc/dos/ibm/1.00/PCDOS100.json">PC-DOS 1.00</disk> ```xml
<disk path="/disks/pc/dos/ibm/1.10/PCDOS110.json">PC-DOS 1.10</disk> <disk path="/disks/pc/dos/ibm/1.00/PCDOS100.json">PC-DOS 1.00</disk>
<disk path="/disks/pc/dos/ibm/2.00/PCDOS200-DISK1.json">PC-DOS 2.00 (Disk 1)</disk> <disk path="/disks/pc/dos/ibm/1.10/PCDOS110.json">PC-DOS 1.10</disk>
<disk path="/disks/pc/dos/ibm/2.00/PCDOS200-DISK2.json">PC-DOS 2.00 (Disk 2)</disk> <disk path="/disks/pc/dos/ibm/2.00/PCDOS200-DISK1.json">PC-DOS 2.00 (Disk 1)</disk>
... <disk path="/disks/pc/dos/ibm/2.00/PCDOS200-DISK2.json">PC-DOS 2.00 (Disk 2)</disk>
...
```
However, listing individual diskettes like that is tedious, so support was added for Disk Manifest references: However, listing individual diskettes like that is tedious, so support was added for Disk Manifest references:
Instead of listing the PC-DOS 2.00 diskettes individually, they can now be added to an XML configuration file Instead of listing the PC-DOS 2.00 diskettes individually, they can now be added to an XML configuration file
with a single Disk Manifest reference: with a single Disk Manifest reference:
<manifest ref="/disks/pc/dos/ibm/2.00/manifest.xml" disk="*"/> ```xml
<manifest ref="/disks/pc/dos/ibm/2.00/manifest.xml" disk="*"/>
```
When you want to include only one particular disk from a manifest, set the *disk* value to the *id* of the disk. When you want to include only one particular disk from a manifest, set the *disk* value to the *id* of the disk.
Here's how you would include only the *first* disk from PC-DOS 2.00: Here's how you would include only the *first* disk from PC-DOS 2.00:
<manifest ref="/disks/pc/dos/ibm/2.00/manifest.xml" disk="disk01"/> ```xml
<manifest ref="/disks/pc/dos/ibm/2.00/manifest.xml" disk="disk01"/>
```
Here's what the entire Disk Manifest for PC-DOS 2.00 currently looks like: Here's what the entire Disk Manifest for PC-DOS 2.00 currently looks like:
<manifest type="software"> ```xml
<title>PC-DOS</title> <manifest type="software">
<version>2.00</version> <title>PC-DOS</title>
<type>DOS</type> <version>2.00</version>
<category>Operating System</category> <type>DOS</type>
<author>IBM/Microsoft</author> <category>Operating System</category>
<releaseDate/> <author>IBM/Microsoft</author>
<disk id="disk01" size="184320" chs="40:1:9" img="archive/PCDOS200-DISK1.img" href="/disks/pc/dos/ibm/2.00/PCDOS200-DISK1.json" md5="d57ceef82122790d1c0ff7bebc12f90a" md5json="2507c02da6cbafe9a94a35cbdd993be2"> <releaseDate/>
<name>PC-DOS 2.00 (Disk 1)</name> <disk id="disk01" size="184320" chs="40:1:9" img="archive/PCDOS200-DISK1.img" href="/disks/pc/dos/ibm/2.00/PCDOS200-DISK1.json" md5="d57ceef82122790d1c0ff7bebc12f90a" md5json="2507c02da6cbafe9a94a35cbdd993be2">
</disk> <name>PC-DOS 2.00 (Disk 1)</name>
<disk id="disk02" size="184320" chs="40:1:9" img="archive/PCDOS200-DISK2.img" href="/disks/pc/dos/ibm/2.00/PCDOS200-DISK2.json" md5="1c7aac53c78446992f8821cf42d04c4a" md5json="b66e296319c1f97990b596b1aa376d39"> </disk>
<name>PC-DOS 2.00 (Disk 2)</name> <disk id="disk02" size="184320" chs="40:1:9" img="archive/PCDOS200-DISK2.img" href="/disks/pc/dos/ibm/2.00/PCDOS200-DISK2.json" md5="1c7aac53c78446992f8821cf42d04c4a" md5json="b66e296319c1f97990b596b1aa376d39">
</disk> <name>PC-DOS 2.00 (Disk 2)</name>
</manifest> </disk>
</manifest>
```

View file

@ -2,7 +2,7 @@
layout: page layout: page
title: JavaScript Machines title: JavaScript Machines
menu_title: About menu_title: About
menu_order: 10 menu_order: 9
permalink: /docs/about/ permalink: /docs/about/
--- ---

View file

@ -26,22 +26,22 @@ experiment!
### Using C1Pjs ### Using C1Pjs
> **NOTE:** For those of you who never used a *real* Challenger 1P machine, if any of the operational **NOTE:** For those of you who never used a *real* Challenger 1P machine, if any of the operational
details of the machine seem bizarre, that's not the simulator's fault. It's how the machine details of the machine seem bizarre, that's not the simulator's fault. It's how the machine
actually operated. actually operated.
> Some of those details are artifacts of teletype-based interfaces, which were more common Some of those details are artifacts of teletype-based interfaces, which were more common
than a video monitor interface in the 1970's. On a teletype, there was no way to physically than a video monitor interface in the 1970's. On a teletype, there was no way to physically
erase printed characters, so you had to count underscores to know how many characters had been erase printed characters, so you had to count underscores to know how many characters had been
erased internally. erased internally.
> Also, the wide margins on either side of the screen were a side-effect of how the machine Also, the wide margins on either side of the screen were a side-effect of how the machine
displayed video on a conventional television set; they helped ensure that no characters would be displayed video on a conventional television set; they helped ensure that no characters would be
displayed off-screen and therefore unreadable. As a result, even though the machine contained displayed off-screen and therefore unreadable. As a result, even though the machine contained
enough video memory for 32 rows of characters, each with 32 columns, the usable portion was much enough video memory for 32 rows of characters, each with 32 columns, the usable portion was much
smaller. smaller.
> The original C1P, with its more modern keyboard and video monitor interface, obviously could The original C1P, with its more modern keyboard and video monitor interface, obviously could
have done a better job processing and displaying user input (and in fact, I wrote some have done a better job processing and displaying user input (and in fact, I wrote some
machine-language extensions back in the day that did exactly that). And Ohio Scientific did improve machine-language extensions back in the day that did exactly that). And Ohio Scientific did improve
later models, but the original C1P functioned exactly as shown, with all its teletype-like later models, but the original C1P functioned exactly as shown, with all its teletype-like
@ -49,18 +49,18 @@ idiosyncrasies and television-related limitations.
#### Starting the Simulator #### Starting the Simulator
> Press the **RUN** or **BREAK** button to start the C1Pjs Simulator. Press the **RUN** or **BREAK** button to start the C1Pjs Simulator.
> Press **C** to select a COLD START. Press **C** to select a COLD START.
> At the MEMORY SIZE prompt, press **Return** to use all available memory. At the MEMORY SIZE prompt, press **Return** to use all available memory.
> At the TERMINAL WIDTH prompt, press **Return** to select the default screen width. At the TERMINAL WIDTH prompt, press **Return** to select the default screen width.
> Wait for the BASIC "OK" prompt before using the **Load File** button; Wait for the BASIC "OK" prompt before using the **Load File** button;
this will allow the Simulator to automatically "LOAD" and "RUN" the selected program. this will allow the Simulator to automatically "LOAD" and "RUN" the selected program.
> NOTE: The wide margins on the left and right sides of the screen are normal. NOTE: The wide margins on the left and right sides of the screen are normal.
The Challenger 1P's display was organized as 32 rows x 32 columns of text, The Challenger 1P's display was organized as 32 rows x 32 columns of text,
but its video circuitry lacked a "guard band" feature, which meant that only but its video circuitry lacked a "guard band" feature, which meant that only
about 24 characters per line, and 24 total lines, in the center of the screen about 24 characters per line, and 24 total lines, in the center of the screen
@ -71,87 +71,87 @@ eventually want to patch the ROMs to enable 32 characters per row.
#### Typing in the Simulator #### Typing in the Simulator
> The C1P normally uses only upper-case characters and expects its SHIFT-LOCK key to be locked, The C1P normally uses only upper-case characters and expects its SHIFT-LOCK key to be locked,
so the Simulator initially locks it, independent of your CAPS-LOCK key. so the Simulator initially locks it, independent of your CAPS-LOCK key.
> The C1P keyboard lacks characters found on modern keyboards such as ~ and \_. The C1P keyboard lacks characters found on modern keyboards such as ~ and \_.
Unsupported keys are simply ignored. Unsupported keys are simply ignored.
> Characters can be erased using the **DELETE** key instead of the documented **SHIFT-O**. Characters can be erased using the **DELETE** key instead of the documented **SHIFT-O**.
For each character that's erased internally, an underscore is displayed. For each character that's erased internally, an underscore is displayed.
> Lines can be erased using the **@** key instead of the documented **SHIFT-P**. Lines can be erased using the **@** key instead of the documented **SHIFT-P**.
> The BASIC power operator can be typed using the **^** key instead of the documented **SHIFT-N**; The BASIC power operator can be typed using the **^** key instead of the documented **SHIFT-N**;
for example, typing "PRINT 5^2" should display "25". for example, typing "PRINT 5^2" should display "25".
> RUN and LIST commands can be aborted by pressing **CTRL-C**, unless the current program has RUN and LIST commands can be aborted by pressing **CTRL-C**, unless the current program has
disabled BASIC keyboard polling. Use the BASIC command "POKE 530,0" to re-enable BASIC keyboard polling, disabled BASIC keyboard polling. Use the BASIC command "POKE 530,0" to re-enable BASIC keyboard polling,
or press **BREAK** and then **W** for a WARM START. or press **BREAK** and then **W** for a WARM START.
> Pressing **CTRL-O** disables input echo until it is pressed again; Pressing **CTRL-O** disables input echo until it is pressed again;
presumably this feature was added to prevent the display of passwords or other sensitive information. presumably this feature was added to prevent the display of passwords or other sensitive information.
> If the Simulator is not responding to any keys, try clicking on the black display area to restore focus; If the Simulator is not responding to any keys, try clicking on the black display area to restore focus;
if all else fails, press **BREAK** and then **W** for a WARM START. if all else fails, press **BREAK** and then **W** for a WARM START.
#### Operating Tips #### Operating Tips
> ##### Using The Control Panel ##### Using The Control Panel
> > Press the **Run** button to start the Simulator; it will change to **Halt** while running. Press the **Run** button to start the Simulator; it will change to **Halt** while running.
> > Press the **Step** button while the simulated CPU is halted to execute a single instruction; Press the **Step** button while the simulated CPU is halted to execute a single instruction;
hold the **Step** button to step through multiple instructions. hold the **Step** button to step through multiple instructions.
> > Press the **Reset** button to halt and reset the simulated CPU; screen memory will be erased, Press the **Reset** button to halt and reset the simulated CPU; screen memory will be erased,
but all other memory will be preserved, permitting a WARM START. but all other memory will be preserved, permitting a WARM START.
> > Press the **Load File** button to load the selected BASIC program into the simulated cassette device; Press the **Load File** button to load the selected BASIC program into the simulated cassette device;
the Simulator will attempt to automatically "LOAD" and "RUN" the selected program. the Simulator will attempt to automatically "LOAD" and "RUN" the selected program.
> > Alternatively, use the BASIC "LOAD" command to begin loading a program from the simulated cassette device. Alternatively, use the BASIC "LOAD" command to begin loading a program from the simulated cassette device.
Press the spacebar at the end of the "LOAD" operation to restore keyboard control. Press the spacebar at the end of the "LOAD" operation to restore keyboard control.
> > Press the **Load Disk** button to mount the selected disk image into the simulated floppy disk drive; Press the **Load Disk** button to mount the selected disk image into the simulated floppy disk drive;
press **BREAK** and then **D** to boot from the image and load the OS-65D operating system. press **BREAK** and then **D** to boot from the image and load the OS-65D operating system.
> ##### Using The Debugger ##### Using The Debugger
> > A built-in Debugger is provided as part of the Control Panel. A built-in Debugger is provided as part of the Control Panel.
> > Type **?** and then **Enter** to display the list of Debugger commands. Type **?** and then **Enter** to display the list of Debugger commands.
> > The instruction frequency ("f") and history ("p") commands collect data only while the CPU is The instruction frequency ("f") and history ("p") commands collect data only while the CPU is
running (not stepping) and one or more breakpoints have been set; set a dummy execution breakpoint running (not stepping) and one or more breakpoints have been set; set a dummy execution breakpoint
(eg, "bp 0") to enable collection. (eg, "bp 0") to enable collection.
> ##### Controlling The Speed ##### Controlling The Speed
> > The default speed of the simulated CPU is roughly 1Mhz, or one million simulated CPU cycles per second. The default speed of the simulated CPU is roughly 1Mhz, or one million simulated CPU cycles per second.
> > Press the **FAST** button to allow the Simulator to run as fast as possible; press **SLOW** to return to Press the **FAST** button to allow the Simulator to run as fast as possible; press **SLOW** to return to
the default speed of 1Mhz. the default speed of 1Mhz.
> > Slow computers, as well as browsers with slow JavaScript interpreters, may not be able to achieve 1Mhz operation; Slow computers, as well as browsers with slow JavaScript interpreters, may not be able to achieve 1Mhz operation;
in those situations, the speed controls will have no effect. in those situations, the speed controls will have no effect.
### Embedding ### Embedding
> Want to embed the C1Pjs Simulator on your own web page? Everything you need to know is explained [here](embed/). Want to embed the C1Pjs Simulator on your own web page? Everything you need to know is explained [here](embed/).
You can even launch multiple simulations on a single page; check out the C1P "Server Array" You can even launch multiple simulations on a single page; check out the C1P "Server Array"
[demo](/devices/c1p/machine/8kb/array/). [demo](/devices/c1p/machine/8kb/array/).
### Implementation ### Implementation
> This computer simulation was written in JavaScript, in part to test the performance limits of web-based applications. This computer simulation was written in JavaScript, in part to test the performance limits of web-based applications.
The result was one of the **fastest** JavaScript implementations of a 6502-based computer simulation on the web. The result was one of the **fastest** JavaScript implementations of a 6502-based computer simulation on the web.
> This application uses XML to define the machine architecture, XSLT to transform the XML into HTML, and JavaScript This application uses XML to define the machine architecture, XSLT to transform the XML into HTML, and JavaScript
to implement the simulation and bind it to the various HTML elements. The C1Pjs screen is implemented using the HTML5 to implement the simulation and bind it to the various HTML elements. The C1Pjs screen is implemented using the HTML5
&lt;canvas&gt; element, so the application requires a browser that supports HTML5. &lt;canvas&gt; element, so the application requires a browser that supports HTML5.
> This application was tested with current versions of Safari, Firefox, Chrome and Internet Explorer. Somewhat less This application was tested with current versions of Safari, Firefox, Chrome and Internet Explorer. Somewhat less
current versions will probably work as well, with the exception of Internet Explorer, which did not add support for current versions will probably work as well, with the exception of Internet Explorer, which did not add support for
the &lt;canvas&gt; tag until IE9. the &lt;canvas&gt; tag until IE9.

View file

@ -18,17 +18,19 @@ Embedding The C1Pjs Simulator
If you want to read as little as possible, then just paste the following code onto a web page: If you want to read as little as possible, then just paste the following code onto a web page:
<div id="myC1P"/></div><div style="clear:both"></div> ```html
<script type="text/javascript" <div id="myC1P"/></div><div style="clear:both"></div>
src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js"> <script type="text/javascript"
</script> src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js">
<script type="text/javascript"> </script>
window.embedC1P( <script type="text/javascript">
"myC1P", window.embedC1P(
"http://www.pcjs.org/devices/c1p/machine/8kb/embed/machine.xml", "myC1P",
"http://www.pcjs.org/versions/c1pjs/1.21.6/components.xsl" "http://www.pcjs.org/devices/c1p/machine/8kb/embed/machine.xml",
); "http://www.pcjs.org/versions/c1pjs/1.21.6/components.xsl"
</script> );
</script>
```
Otherwise, read on to learn how embedding works, and how you can create your own machine configuration and customize Otherwise, read on to learn how embedding works, and how you can create your own machine configuration and customize
its appearance. its appearance.
@ -46,37 +48,41 @@ there's no documentation beyond the sample XML files and the default [XML styles
The example at the top of this page uses an [XML file](/devices/c1p/machine/8kb/embed/machine.xml) that looks like: The example at the top of this page uses an [XML file](/devices/c1p/machine/8kb/embed/machine.xml) that looks like:
<?xml version="1.0" encoding="UTF-8"?> ```xml
<machine id="OSI" class="c1pjs" border="1" width="272px" pos="right" padleft="16px" padright="16px" padbottom="16px"> <?xml version="1.0" encoding="UTF-8"?>
<computer id="c1p" name="Challenger 1P"> <machine id="OSI" class="c1pjs" border="1" width="272px" pos="right" padleft="16px" padright="16px" padbottom="16px">
<module type="cpu" refid="cpu6502" start="0x0000" end="0xffff"/> <computer id="c1p" name="Challenger 1P">
<module type="ram" refid="ram8K" start="0x0000" end="0x1fff"/> <module type="cpu" refid="cpu6502" start="0x0000" end="0xffff"/>
<module type="rom" refid="romNull" start="0x2000" end="0x9fff"/> <module type="ram" refid="ram8K" start="0x0000" end="0x1fff"/>
<module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/> <module type="rom" refid="romNull" start="0x2000" end="0x9fff"/>
<module type="video" refid="video" start="0xd000" end="0xd3ff"/> <module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
<module type="keyboard" refid="keyboard" start="0xdf00" end="0xdfff"/> <module type="video" refid="video" start="0xd000" end="0xd3ff"/>
<module type="serial" refid="serialPort" start="0xf000" end="0xf0ff"/> <module type="keyboard" refid="keyboard" start="0xdf00" end="0xdfff"/>
<module type="rom" refid="romSystem" start="0xf800" end="0xffff"/> <module type="serial" refid="serialPort" start="0xf000" end="0xf0ff"/>
</computer> <module type="rom" refid="romSystem" start="0xf800" end="0xffff"/>
<cpu id="cpu6502"/> </computer>
<ram id="ram8K" size="0x2000"/> <cpu id="cpu6502"/>
<rom id="romNull" size="0x8000"/> <ram id="ram8K" size="0x2000"/>
<rom id="romBasic" size="0x2000" image="http://www.pcjs.org/devices/c1p/rom/basic-gcpatch.hex"/> <rom id="romNull" size="0x8000"/>
<rom id="romSystem" size="0x0800" image="http://www.pcjs.org/devices/c1p/rom/system.hex"/> <rom id="romBasic" size="0x2000" image="http://www.pcjs.org/devices/c1p/rom/basic-gcpatch.hex"/>
<video id="video" screenwidth="256" screenheight="192" cols="32" rows="32" <rom id="romSystem" size="0x0800" image="http://www.pcjs.org/devices/c1p/rom/system.hex"/>
charset="http://www.pcjs.org/devices/c1p/video/chargen1x.png" padtop="8px" padleft="8px" padbottom="8px"/> <video id="video" screenwidth="256" screenheight="192" cols="32" rows="32"
<keyboard id="keyboard" pos="center"> charset="http://www.pcjs.org/devices/c1p/video/chargen1x.png" padtop="8px" padleft="8px" padbottom="8px"/>
<control type="button" class="input" binding="ctrl-c">CTRL-C</control> <keyboard id="keyboard" pos="center">
<control type="button" class="input" binding="ctrl-o">CTRL-O</control> <control type="button" class="input" binding="ctrl-c">CTRL-C</control>
<control type="button" class="input" binding="break">BREAK</control> <control type="button" class="input" binding="ctrl-o">CTRL-O</control>
</keyboard> <control type="button" class="input" binding="break">BREAK</control>
<serial id="serialPort" demo="true"/> </keyboard>
</machine> <serial id="serialPort" demo="true"/>
</machine>
```
Machine configuration files can also be "self-starting" if they contain the following XML stylesheet reference at the Machine configuration files can also be "self-starting" if they contain the following XML stylesheet reference at the
top of the file: top of the file:
<?xml-stylesheet type="text/xsl" href="http://www.pcjs.org/versions/c1pjs/1.21.6/machine.xsl"?> ```xml
<?xml-stylesheet type="text/xsl" href="http://www.pcjs.org/versions/c1pjs/1.21.6/machine.xsl"?>
```
For example, here's a self-starting [machine.xml](/devices/c1p/machine/8kb/large/machine.xml) configuration. For example, here's a self-starting [machine.xml](/devices/c1p/machine/8kb/large/machine.xml) configuration.
After it loads, use your browser's "View Source" command and you'll see that it's very similar to the After it loads, use your browser's "View Source" command and you'll see that it's very similar to the
@ -102,40 +108,46 @@ NOTE: For larger simulator windows (eg, screenwidth of 512 and screenheight of 3
If you decide to include the &lt;disk&gt; component, you can simply link to an existing component definition XML file, If you decide to include the &lt;disk&gt; component, you can simply link to an existing component definition XML file,
such as samples.xml: such as samples.xml:
<machine id="OSI" border="1" width="272px"> ```xml
<computer id="c1p" name="Challenger 1P"> <machine id="OSI" border="1" width="272px">
... <computer id="c1p" name="Challenger 1P">
<module type="ram" refid="ram32K" start="0x0000" end="0x7fff"/> ...
<module type="rom" refid="romNull" start="0x8000" end="0x9fff"/> <module type="ram" refid="ram32K" start="0x0000" end="0x7fff"/>
<module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/> <module type="rom" refid="romNull" start="0x8000" end="0x9fff"/>
<module type="disk" refid="disk" start="0xc000" end="0xc0ff"/> <module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
<module type="video" refid="video" start="0xd000" end="0xd7ff"/> <module type="disk" refid="disk" start="0xc000" end="0xc0ff"/>
... <module type="video" refid="video" start="0xd000" end="0xd7ff"/>
</computer> ...
... </computer>
<disk ref="http://www.pcjs.org/apps/c1p/samples.xml"/> ...
... <disk ref="http://www.pcjs.org/apps/c1p/samples.xml"/>
</machine> ...
</machine>
```
Step 3: Add the C1Pjs Simulator to your web page Step 3: Add the C1Pjs Simulator to your web page
--- ---
Somewhere on your page, you need to add the following **&lt;script&gt;** element: Somewhere on your page, you need to add the following **&lt;script&gt;** element:
<script type="text/javascript" src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js"></script> ```html
<script type="text/javascript" src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js"></script>
```
To include the C1Pjs Debugger, use [c1p-dbg.js](/versions/c1pjs/1.21.6/c1p-dbg.js) instead of To include the C1Pjs Debugger, use [c1p-dbg.js](/versions/c1pjs/1.21.6/c1p-dbg.js) instead of
[c1p.js](/versions/c1pjs/1.21.6/c1p.js), and include some additional definitions in your machine [c1p.js](/versions/c1pjs/1.21.6/c1p.js), and include some additional definitions in your machine
definition XML file: definition XML file:
<machine id="OSI" border="1" width="272px"> ```xml
<computer id="c1p" name="Challenger 1P"> <machine id="OSI" border="1" width="272px">
... <computer id="c1p" name="Challenger 1P">
</computer> ...
... </computer>
<debugger id="debugger"/> ...
<panel ref="http://www.pcjs.org/devices/c1p/panel/default.xml"/> <debugger id="debugger"/>
... <panel ref="http://www.pcjs.org/devices/c1p/panel/default.xml"/>
</machine> ...
</machine>
```
The [Panel](/devices/c1p/panel/default.xml) XML file included above defines a variety of buttons and The [Panel](/devices/c1p/panel/default.xml) XML file included above defines a variety of buttons and
input/output controls that are bound to the CPU and Debugger components according to their *binding* input/output controls that are bound to the CPU and Debugger components according to their *binding*
@ -149,7 +161,9 @@ Step 4: Activate the C1Pjs Simulator
--- ---
Add the following to your page's **&lt;body&gt;** element: Add the following to your page's **&lt;body&gt;** element:
<body onload="window.embedC1P('myC1P','embed.xml')"> ```html
<body onload="window.embedC1P('myC1P','embed.xml')">
```
and insert a **&lt;div id="myC1P"&gt;&lt;/div&gt;** where you want the simulator to appear. and insert a **&lt;div id="myC1P"&gt;&lt;/div&gt;** where you want the simulator to appear.

View file

@ -13,7 +13,7 @@ PCjs Documentation
[PCjs](/docs/about/pcjs/) is a full-featured IBM PC, PC XT and PC AT emulator written entirely in JavaScript. [PCjs](/docs/about/pcjs/) is a full-featured IBM PC, PC XT and PC AT emulator written entirely in JavaScript.
After you've read the Documentation, check out with the [Examples](examples/), read the [Source Code](/modules/pcjs/), After you've read the Documentation, check out the [Examples](examples/), read the [Source Code](/modules/pcjs/),
and experiment! and experiment!
{% include machine.html id="ibm5150" %} {% include machine.html id="ibm5150" %}
@ -44,58 +44,66 @@ A PCjs machine XML file defines all a machine's components, including:
Here's a simple machine XML file that includes an 8088 CPU and 16Kb of RAM: Here's a simple machine XML file that includes an 8088 CPU and 16Kb of RAM:
<machine id="ibm"> ```xml
<computer id="pc" name="IBM PC"/> <machine id="ibm">
<cpu id="cpu8088" model="8088"/> <computer id="pc" name="IBM PC"/>
<ram id="ramLow" addr="0x00000" size="0x04000"/> <cpu id="cpu8088" model="8088"/>
</machine> <ram id="ramLow" addr="0x00000" size="0x04000"/>
</machine>
```
However, that machine isn't usable, since it lacks a keyboard, screen, or any code (ROMs) to execute. However, that machine isn't usable, since it lacks a keyboard, screen, or any code (ROMs) to execute.
A simple machine definition that actually works might look like: A simple machine definition that actually works might look like:
<machine id="ibm" class="pc" width="720px"> ```xml
<computer id="pc" name="IBM PC"/> <machine id="ibm" class="pc" width="720px">
<cpu id="cpu8088" model="8088"/> <computer id="pc" name="IBM PC"/>
<ram id="ramLow" addr="0x00000" size="0x04000"/> <cpu id="cpu8088" model="8088"/>
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="ibm-basic-1.00.json"/> <ram id="ramLow" addr="0x00000" size="0x04000"/>
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="1981-04-24.json"/> <rom id="romBASIC" addr="0xf6000" size="0x8000" file="ibm-basic-1.00.json"/>
<keyboard id="keyboard"/> <rom id="romBIOS" addr="0xfe000" size="0x2000" file="1981-04-24.json"/>
<video id="videoMDA" model="mda" screenwidth="720" screenheight="350" charset="ibm-mda-cga.json"> <keyboard id="keyboard"/>
<name>Monochrome Display</name> <video id="videoMDA" model="mda" screenwidth="720" screenheight="350" charset="ibm-mda-cga.json">
</video> <name>Monochrome Display</name>
<chipset id="chipset" model="5150" sw1="01000001" sw2="11110000"/> </video>
</machine> <chipset id="chipset" model="5150" sw1="01000001" sw2="11110000"/>
</machine>
```
Here is an [example](examples/example1.html) of this machine's [XML](examples/example1.xml) file. Here is an [example](examples/example1.html) of this machine's [XML](examples/example1.xml) file.
Machine definitions can also include visual elements. For example, we can include a "Run" button with the CPU component. Machine definitions can also include visual elements. For example, we can include a "Run" button with the CPU component.
Note that as soon as the machine is ready and the CPU starts running, the "Run" button will change to "Halt". Note that as soon as the machine is ready and the CPU starts running, the "Run" button will change to "Halt".
<machine id="ibm" class="pc" width="720px"> ```xml
<computer id="pc" name="IBM PC"/> <machine id="ibm" class="pc" width="720px">
<cpu id="cpu8088" model="8088"> <computer id="pc" name="IBM PC"/>
<control type="button" class="input" binding="run">Run</control> <cpu id="cpu8088" model="8088">
</cpu> <control type="button" class="input" binding="run">Run</control>
... </cpu>
</machine> ...
</machine>
```
Next, we can add a Floppy Disk Controller (FDC) component. And since we want to be able to "load" and "unload" floppy Next, we can add a Floppy Disk Controller (FDC) component. And since we want to be able to "load" and "unload" floppy
disks at will, we'll include some UI controls. disks at will, we'll include some UI controls.
<machine id="ibm" class="pc" width="720px"> ```xml
<fdc id="fdcNEC" autoMount="{A: {name: 'PC-DOS 1.0', path: 'pcdos-1.00.json'}}"> <machine id="ibm" class="pc" width="720px">
<control type="container"> <fdc id="fdcNEC" autoMount="{A: {name: 'PC-DOS 1.0', path: 'pcdos-1.00.json'}}">
<control type="list" class="input" binding="listDrives"/> <control type="container">
<control type="list" class="input" binding="listDisks"> <control type="list" class="input" binding="listDrives"/>
<disk path="">None</disk> <control type="list" class="input" binding="listDisks">
<disk path="pcdos-1.00.json">PC-DOS 1.0</disk> <disk path="">None</disk>
</control> <disk path="pcdos-1.00.json">PC-DOS 1.0</disk>
<control type="button" class="input" binding="loadDrive">Load</control> </control>
</control> <control type="button" class="input" binding="loadDrive">Load</control>
</fdc> </control>
... </fdc>
</machine> ...
</machine>
```
Here is an [example](examples/example2.html) of the updated machine's [XML](examples/example2.xml) Here is an [example](examples/example2.html) of the updated machine's [XML](examples/example2.xml)
file. file.
@ -105,11 +113,13 @@ file.
Inside a web page, add a &lt;div&gt; to contain the machine, load the *pc.js* script Inside a web page, add a &lt;div&gt; to contain the machine, load the *pc.js* script
(*pc-dbg.js* if you need the PCjs [Debugger](debugger/)), and then call *embedPC()*: (*pc-dbg.js* if you need the PCjs [Debugger](debugger/)), and then call *embedPC()*:
<div id="example2"/> ```xml
<script type="text/javascript" src="pc.js"/> <div id="example2"/>
<script type="text/javascript"> <script type="text/javascript" src="pc.js"/>
embedPC("example2", "example2.xml", "components.xsl"); <script type="text/javascript">
</script> embedPC("example2", "example2.xml", "components.xsl");
</script>
```
In fact, this is exactly what we did in the previous [example](examples/example2.html). In fact, this is exactly what we did in the previous [example](examples/example2.html).
@ -131,7 +141,9 @@ machine XML file; eg:
*components.css*, which your web page should also load, usually with a &lt;link&gt; tag inside the &lt;head&gt; *components.css*, which your web page should also load, usually with a &lt;link&gt; tag inside the &lt;head&gt;
element; eg: element; eg:
<link rel="stylesheet" type="text/css" href="components.css"> ```xml
<link rel="stylesheet" type="text/css" href="components.css">
```
### Using the PCjs Debugger ### Using the PCjs Debugger

View file

@ -32,8 +32,8 @@
<ul> <ul>
<li><a href="/">Home</a></li> <li><a href="/">Home</a></li>
<li><a href="/apps/pc/">Apps</a></li> <li><a href="/apps/pc/">Apps</a></li>
<li><a href="/devices/">Devices</a></li>
<li><a href="/disks/pc/">Disks</a></li> <li><a href="/disks/pc/">Disks</a></li>
<li><a href="/devices/pc/machine/">Machines</a></li>
<li><a href="/docs/">Docs</a></li> <li><a href="/docs/">Docs</a></li>
<li><a href="/pubs/">Pubs</a></li> <li><a href="/pubs/">Pubs</a></li>
<li><a href="/blog/">Blog</a></li> <li><a href="/blog/">Blog</a></li>