Start using fenced code blocks with language identifiers to improve highlighting with GitHub Pages
This commit is contained in:
Jeff Parsons
parent
415e7ed984
commit
2ba7f502c1
12 changed files with 247 additions and 209 deletions
|
|
@ -6,7 +6,8 @@ menu_order: 2
|
|||
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).
|
||||
|
||||
For random musings about PCjs, web technologies, old hardware and software, and more, read on.
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
---
|
||||
layout: page
|
||||
title: Device Configurations
|
||||
menu_title: Devices
|
||||
menu_order: 3
|
||||
permalink: /devices/
|
||||
redirect_from:
|
||||
- /configs/
|
||||
|
|
@ -11,7 +13,7 @@ Device Configurations
|
|||
|
||||
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/))
|
||||
* [8086-based Devices](pc/) (e.g., [IBM PC, including 80286 and 80386-based compatibles](pc/machine/))
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ redirect_from:
|
|||
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)
|
||||
* 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/)
|
||||
[XML](/devices/pc/machine/5150/mda/64kb/machine.xml):
|
||||
|
||||
<machine id="ibm5150" class="pc" border="1" pos="center" background="#FAEBD7">
|
||||
<name pos="center">IBM PC (Model 5150) with Monochrome Display</name>
|
||||
<computer id="pc-mda-64k" name="IBM PC" resume="1"/>
|
||||
<ram id="ramLow" addr="0x00000"/>
|
||||
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="/devices/pc/rom/5150/basic/BASIC100.json"/>
|
||||
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="/devices/pc/rom/5150/1981-04-24/PCBIOS-REV1.json"/>
|
||||
<video ref="/devices/pc/video/ibm/mda/ibm-mda.xml"/>
|
||||
<fdc ref="/disks/pc/compiled/samples.xml"/>
|
||||
<cpu id="cpu8088" model="8088" autostart="true" pos="left" padleft="8px" padbottom="8px">
|
||||
<control type="button" binding="run">Run</control>
|
||||
<control type="button" binding="reset">Reset</control>
|
||||
</cpu>
|
||||
<keyboard ref="/devices/pc/keyboard/us83-buttons-arrows.xml"/>
|
||||
<chipset id="chipset" model="5150" sw1="01000001" sw2="11111000"/>
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="ibm5150" class="pc" border="1" pos="center" background="#FAEBD7">
|
||||
<name pos="center">IBM PC (Model 5150) with Monochrome Display</name>
|
||||
<computer id="pc-mda-64k" name="IBM PC" resume="1"/>
|
||||
<ram id="ramLow" addr="0x00000"/>
|
||||
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="/devices/pc/rom/5150/basic/BASIC100.json"/>
|
||||
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="/devices/pc/rom/5150/1981-04-24/PCBIOS-REV1.json"/>
|
||||
<video ref="/devices/pc/video/ibm/mda/ibm-mda.xml"/>
|
||||
<fdc ref="/disks/pc/compiled/samples.xml"/>
|
||||
<cpu id="cpu8088" model="8088" autostart="true" pos="left" padleft="8px" padbottom="8px">
|
||||
<control type="button" binding="run">Run</control>
|
||||
<control type="button" binding="reset">Reset</control>
|
||||
</cpu>
|
||||
<keyboard ref="/devices/pc/keyboard/us83-buttons-arrows.xml"/>
|
||||
<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
|
||||
[Video](/docs/pcjs/video/) [XML](/devices/pc/video/ibm/mda/ibm-mda.xml),
|
||||
|
|
|
|||
|
|
@ -1,8 +1,6 @@
|
|||
---
|
||||
layout: page
|
||||
title: IBM PC Machine Configurations
|
||||
menu_title: Machines
|
||||
menu_order: 6
|
||||
permalink: /devices/pc/machine/
|
||||
redirect_from:
|
||||
- /configs/pc/machines/
|
||||
|
|
@ -11,7 +9,7 @@ redirect_from:
|
|||
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 XT](/devices/pc/machine/5160/) (Model 5160)
|
||||
|
|
|
|||
|
|
@ -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/)
|
||||
[XML](/devices/pc8080/machine/invaders/machine.xml) looks like:
|
||||
|
||||
<?xml-stylesheet type="text/xsl" href="/versions/pc8080/1.22.0/machine.xsl"?>
|
||||
<machine id="invaders" class="pc8080" border="1" pos="center" background="#FAEBD7">
|
||||
<name pos="center">Space Invaders</name>
|
||||
<computer id="computer" busWidth="16"/>
|
||||
<cpu id="cpu8080" model="8080" cycles="2000000"/>
|
||||
<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="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"/>
|
||||
<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">
|
||||
<menu>
|
||||
<title>224x256 Screen (Rotated)</title>
|
||||
</menu>
|
||||
</video>
|
||||
<chipset id="chipset" model="SI1978"/>
|
||||
<panel ref="/devices/pc8080/panel/left.xml"/>
|
||||
<debugger id="debugger" commands="s 8086"/>
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="invaders" class="pc8080" border="1" pos="center" background="#FAEBD7">
|
||||
<name pos="center">Space Invaders</name>
|
||||
<computer id="computer" busWidth="16"/>
|
||||
<cpu id="cpu8080" model="8080" cycles="2000000"/>
|
||||
<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="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"/>
|
||||
<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">
|
||||
<menu>
|
||||
<title>224x256 Screen (Rotated)</title>
|
||||
</menu>
|
||||
</video>
|
||||
<chipset id="chipset" model="SI1978"/>
|
||||
<panel ref="/devices/pc8080/panel/left.xml"/>
|
||||
<debugger id="debugger" commands="s 8086"/>
|
||||
</machine>
|
||||
```
|
||||
|
||||
In this example, all the devices are fully configured within the machine XML file, except for the
|
||||
[Control Panel](panel/) [XML](panel/left.xml).
|
||||
|
|
|
|||
|
|
@ -11,5 +11,5 @@ permalink: /devices/pc8080/rom/exerciser/
|
|||
* [8080EXER](8080EXER.MAC)
|
||||
* [8080PRE](8080PRE.MAC)
|
||||
|
||||
Our [8080 Exerciser Test Machine](/devices/pc8080/machine/exerciser/) runs the [8080EX1](8080EX1.MAC),
|
||||
since it is the most comprehensive test, and was designed specifically for the Intel 8080.
|
||||
Our [8080 Exerciser Test Machine](/devices/pc8080/machine/exerciser/) runs [8080EX1](8080EX1.MAC),
|
||||
since it is the most comprehensive test and verifies strict compatibilty with the original Intel 8080.
|
||||
|
|
|
|||
|
|
@ -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 <disk>
|
||||
entries like:
|
||||
|
||||
<disk path="/disks/pc/dos/ibm/1.00/PCDOS100.json">PC-DOS 1.00</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-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>
|
||||
...
|
||||
```xml
|
||||
<disk path="/disks/pc/dos/ibm/1.00/PCDOS100.json">PC-DOS 1.00</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-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:
|
||||
|
||||
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:
|
||||
|
||||
<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.
|
||||
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:
|
||||
|
||||
<manifest type="software">
|
||||
<title>PC-DOS</title>
|
||||
<version>2.00</version>
|
||||
<type>DOS</type>
|
||||
<category>Operating System</category>
|
||||
<author>IBM/Microsoft</author>
|
||||
<releaseDate/>
|
||||
<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">
|
||||
<name>PC-DOS 2.00 (Disk 1)</name>
|
||||
</disk>
|
||||
<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">
|
||||
<name>PC-DOS 2.00 (Disk 2)</name>
|
||||
</disk>
|
||||
</manifest>
|
||||
```xml
|
||||
<manifest type="software">
|
||||
<title>PC-DOS</title>
|
||||
<version>2.00</version>
|
||||
<type>DOS</type>
|
||||
<category>Operating System</category>
|
||||
<author>IBM/Microsoft</author>
|
||||
<releaseDate/>
|
||||
<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">
|
||||
<name>PC-DOS 2.00 (Disk 1)</name>
|
||||
</disk>
|
||||
<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">
|
||||
<name>PC-DOS 2.00 (Disk 2)</name>
|
||||
</disk>
|
||||
</manifest>
|
||||
```
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
layout: page
|
||||
title: JavaScript Machines
|
||||
menu_title: About
|
||||
menu_order: 10
|
||||
menu_order: 9
|
||||
permalink: /docs/about/
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -26,22 +26,22 @@ experiment!
|
|||
|
||||
### 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
|
||||
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
|
||||
erase printed characters, so you had to count underscores to know how many characters had been
|
||||
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 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
|
||||
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
|
||||
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
|
||||
|
|
@ -49,18 +49,18 @@ idiosyncrasies and television-related limitations.
|
|||
|
||||
#### 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.
|
||||
|
||||
> 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,
|
||||
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
|
||||
|
|
@ -71,87 +71,87 @@ eventually want to patch the ROMs to enable 32 characters per row.
|
|||
|
||||
#### 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.
|
||||
|
||||
> 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.
|
||||
|
||||
> 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.
|
||||
|
||||
> 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".
|
||||
|
||||
> 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,
|
||||
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.
|
||||
|
||||
> 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.
|
||||
|
||||
#### 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.
|
||||
|
||||
> > 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.
|
||||
|
||||
> > 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.
|
||||
|
||||
> > 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 **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.
|
||||
|
||||
> ##### 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
|
||||
(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.
|
||||
|
||||
> > 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.
|
||||
|
||||
### 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"
|
||||
[demo](/devices/c1p/machine/8kb/array/).
|
||||
|
||||
### 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.
|
||||
|
||||
> 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
|
||||
<canvas> 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
|
||||
the <canvas> tag until IE9.
|
||||
|
||||
|
|
|
|||
|
|
@ -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:
|
||||
|
||||
<div id="myC1P"/></div><div style="clear:both"></div>
|
||||
<script type="text/javascript"
|
||||
src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js">
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
window.embedC1P(
|
||||
"myC1P",
|
||||
"http://www.pcjs.org/devices/c1p/machine/8kb/embed/machine.xml",
|
||||
"http://www.pcjs.org/versions/c1pjs/1.21.6/components.xsl"
|
||||
);
|
||||
</script>
|
||||
```html
|
||||
<div id="myC1P"/></div><div style="clear:both"></div>
|
||||
<script type="text/javascript"
|
||||
src="http://www.pcjs.org/versions/c1pjs/1.21.6/c1p.js">
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
window.embedC1P(
|
||||
"myC1P",
|
||||
"http://www.pcjs.org/devices/c1p/machine/8kb/embed/machine.xml",
|
||||
"http://www.pcjs.org/versions/c1pjs/1.21.6/components.xsl"
|
||||
);
|
||||
</script>
|
||||
```
|
||||
|
||||
Otherwise, read on to learn how embedding works, and how you can create your own machine configuration and customize
|
||||
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:
|
||||
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<machine id="OSI" class="c1pjs" border="1" width="272px" pos="right" padleft="16px" padright="16px" padbottom="16px">
|
||||
<computer id="c1p" name="Challenger 1P">
|
||||
<module type="cpu" refid="cpu6502" start="0x0000" end="0xffff"/>
|
||||
<module type="ram" refid="ram8K" start="0x0000" end="0x1fff"/>
|
||||
<module type="rom" refid="romNull" start="0x2000" end="0x9fff"/>
|
||||
<module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
|
||||
<module type="video" refid="video" start="0xd000" end="0xd3ff"/>
|
||||
<module type="keyboard" refid="keyboard" start="0xdf00" end="0xdfff"/>
|
||||
<module type="serial" refid="serialPort" start="0xf000" end="0xf0ff"/>
|
||||
<module type="rom" refid="romSystem" start="0xf800" end="0xffff"/>
|
||||
</computer>
|
||||
<cpu id="cpu6502"/>
|
||||
<ram id="ram8K" size="0x2000"/>
|
||||
<rom id="romNull" size="0x8000"/>
|
||||
<rom id="romBasic" size="0x2000" image="http://www.pcjs.org/devices/c1p/rom/basic-gcpatch.hex"/>
|
||||
<rom id="romSystem" size="0x0800" image="http://www.pcjs.org/devices/c1p/rom/system.hex"/>
|
||||
<video id="video" screenwidth="256" screenheight="192" cols="32" rows="32"
|
||||
charset="http://www.pcjs.org/devices/c1p/video/chargen1x.png" padtop="8px" padleft="8px" padbottom="8px"/>
|
||||
<keyboard id="keyboard" pos="center">
|
||||
<control type="button" class="input" binding="ctrl-c">CTRL-C</control>
|
||||
<control type="button" class="input" binding="ctrl-o">CTRL-O</control>
|
||||
<control type="button" class="input" binding="break">BREAK</control>
|
||||
</keyboard>
|
||||
<serial id="serialPort" demo="true"/>
|
||||
</machine>
|
||||
```xml
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<machine id="OSI" class="c1pjs" border="1" width="272px" pos="right" padleft="16px" padright="16px" padbottom="16px">
|
||||
<computer id="c1p" name="Challenger 1P">
|
||||
<module type="cpu" refid="cpu6502" start="0x0000" end="0xffff"/>
|
||||
<module type="ram" refid="ram8K" start="0x0000" end="0x1fff"/>
|
||||
<module type="rom" refid="romNull" start="0x2000" end="0x9fff"/>
|
||||
<module type="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
|
||||
<module type="video" refid="video" start="0xd000" end="0xd3ff"/>
|
||||
<module type="keyboard" refid="keyboard" start="0xdf00" end="0xdfff"/>
|
||||
<module type="serial" refid="serialPort" start="0xf000" end="0xf0ff"/>
|
||||
<module type="rom" refid="romSystem" start="0xf800" end="0xffff"/>
|
||||
</computer>
|
||||
<cpu id="cpu6502"/>
|
||||
<ram id="ram8K" size="0x2000"/>
|
||||
<rom id="romNull" size="0x8000"/>
|
||||
<rom id="romBasic" size="0x2000" image="http://www.pcjs.org/devices/c1p/rom/basic-gcpatch.hex"/>
|
||||
<rom id="romSystem" size="0x0800" image="http://www.pcjs.org/devices/c1p/rom/system.hex"/>
|
||||
<video id="video" screenwidth="256" screenheight="192" cols="32" rows="32"
|
||||
charset="http://www.pcjs.org/devices/c1p/video/chargen1x.png" padtop="8px" padleft="8px" padbottom="8px"/>
|
||||
<keyboard id="keyboard" pos="center">
|
||||
<control type="button" class="input" binding="ctrl-c">CTRL-C</control>
|
||||
<control type="button" class="input" binding="ctrl-o">CTRL-O</control>
|
||||
<control type="button" class="input" binding="break">BREAK</control>
|
||||
</keyboard>
|
||||
<serial id="serialPort" demo="true"/>
|
||||
</machine>
|
||||
```
|
||||
|
||||
Machine configuration files can also be "self-starting" if they contain the following XML stylesheet reference at the
|
||||
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.
|
||||
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 <disk> component, you can simply link to an existing component definition XML file,
|
||||
such as samples.xml:
|
||||
|
||||
<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="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
|
||||
<module type="disk" refid="disk" start="0xc000" end="0xc0ff"/>
|
||||
<module type="video" refid="video" start="0xd000" end="0xd7ff"/>
|
||||
...
|
||||
</computer>
|
||||
...
|
||||
<disk ref="http://www.pcjs.org/apps/c1p/samples.xml"/>
|
||||
...
|
||||
</machine>
|
||||
```xml
|
||||
<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="rom" refid="romBasic" start="0xa000" end="0xbfff"/>
|
||||
<module type="disk" refid="disk" start="0xc000" end="0xc0ff"/>
|
||||
<module type="video" refid="video" start="0xd000" end="0xd7ff"/>
|
||||
...
|
||||
</computer>
|
||||
...
|
||||
<disk ref="http://www.pcjs.org/apps/c1p/samples.xml"/>
|
||||
...
|
||||
</machine>
|
||||
```
|
||||
|
||||
Step 3: Add the C1Pjs Simulator to your web page
|
||||
---
|
||||
Somewhere on your page, you need to add the following **<script>** 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
|
||||
[c1p.js](/versions/c1pjs/1.21.6/c1p.js), and include some additional definitions in your machine
|
||||
definition XML file:
|
||||
|
||||
<machine id="OSI" border="1" width="272px">
|
||||
<computer id="c1p" name="Challenger 1P">
|
||||
...
|
||||
</computer>
|
||||
...
|
||||
<debugger id="debugger"/>
|
||||
<panel ref="http://www.pcjs.org/devices/c1p/panel/default.xml"/>
|
||||
...
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="OSI" border="1" width="272px">
|
||||
<computer id="c1p" name="Challenger 1P">
|
||||
...
|
||||
</computer>
|
||||
...
|
||||
<debugger id="debugger"/>
|
||||
<panel ref="http://www.pcjs.org/devices/c1p/panel/default.xml"/>
|
||||
...
|
||||
</machine>
|
||||
```
|
||||
|
||||
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*
|
||||
|
|
@ -149,7 +161,9 @@ Step 4: Activate the C1Pjs Simulator
|
|||
---
|
||||
Add the following to your page's **<body>** element:
|
||||
|
||||
<body onload="window.embedC1P('myC1P','embed.xml')">
|
||||
```html
|
||||
<body onload="window.embedC1P('myC1P','embed.xml')">
|
||||
```
|
||||
|
||||
and insert a **<div id="myC1P"></div>** where you want the simulator to appear.
|
||||
|
||||
|
|
|
|||
|
|
@ -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.
|
||||
|
||||
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!
|
||||
|
||||
{% 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:
|
||||
|
||||
<machine id="ibm">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088"/>
|
||||
<ram id="ramLow" addr="0x00000" size="0x04000"/>
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="ibm">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088"/>
|
||||
<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.
|
||||
|
||||
A simple machine definition that actually works might look like:
|
||||
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088"/>
|
||||
<ram id="ramLow" addr="0x00000" size="0x04000"/>
|
||||
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="ibm-basic-1.00.json"/>
|
||||
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="1981-04-24.json"/>
|
||||
<keyboard id="keyboard"/>
|
||||
<video id="videoMDA" model="mda" screenwidth="720" screenheight="350" charset="ibm-mda-cga.json">
|
||||
<name>Monochrome Display</name>
|
||||
</video>
|
||||
<chipset id="chipset" model="5150" sw1="01000001" sw2="11110000"/>
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088"/>
|
||||
<ram id="ramLow" addr="0x00000" size="0x04000"/>
|
||||
<rom id="romBASIC" addr="0xf6000" size="0x8000" file="ibm-basic-1.00.json"/>
|
||||
<rom id="romBIOS" addr="0xfe000" size="0x2000" file="1981-04-24.json"/>
|
||||
<keyboard id="keyboard"/>
|
||||
<video id="videoMDA" model="mda" screenwidth="720" screenheight="350" charset="ibm-mda-cga.json">
|
||||
<name>Monochrome Display</name>
|
||||
</video>
|
||||
<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.
|
||||
|
||||
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".
|
||||
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088">
|
||||
<control type="button" class="input" binding="run">Run</control>
|
||||
</cpu>
|
||||
...
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<computer id="pc" name="IBM PC"/>
|
||||
<cpu id="cpu8088" model="8088">
|
||||
<control type="button" class="input" binding="run">Run</control>
|
||||
</cpu>
|
||||
...
|
||||
</machine>
|
||||
```
|
||||
|
||||
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.
|
||||
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<fdc id="fdcNEC" autoMount="{A: {name: 'PC-DOS 1.0', path: 'pcdos-1.00.json'}}">
|
||||
<control type="container">
|
||||
<control type="list" class="input" binding="listDrives"/>
|
||||
<control type="list" class="input" binding="listDisks">
|
||||
<disk path="">None</disk>
|
||||
<disk path="pcdos-1.00.json">PC-DOS 1.0</disk>
|
||||
</control>
|
||||
<control type="button" class="input" binding="loadDrive">Load</control>
|
||||
</control>
|
||||
</fdc>
|
||||
...
|
||||
</machine>
|
||||
```xml
|
||||
<machine id="ibm" class="pc" width="720px">
|
||||
<fdc id="fdcNEC" autoMount="{A: {name: 'PC-DOS 1.0', path: 'pcdos-1.00.json'}}">
|
||||
<control type="container">
|
||||
<control type="list" class="input" binding="listDrives"/>
|
||||
<control type="list" class="input" binding="listDisks">
|
||||
<disk path="">None</disk>
|
||||
<disk path="pcdos-1.00.json">PC-DOS 1.0</disk>
|
||||
</control>
|
||||
<control type="button" class="input" binding="loadDrive">Load</control>
|
||||
</control>
|
||||
</fdc>
|
||||
...
|
||||
</machine>
|
||||
```
|
||||
|
||||
Here is an [example](examples/example2.html) of the updated machine's [XML](examples/example2.xml)
|
||||
file.
|
||||
|
|
@ -105,11 +113,13 @@ file.
|
|||
Inside a web page, add a <div> to contain the machine, load the *pc.js* script
|
||||
(*pc-dbg.js* if you need the PCjs [Debugger](debugger/)), and then call *embedPC()*:
|
||||
|
||||
<div id="example2"/>
|
||||
<script type="text/javascript" src="pc.js"/>
|
||||
<script type="text/javascript">
|
||||
embedPC("example2", "example2.xml", "components.xsl");
|
||||
</script>
|
||||
```xml
|
||||
<div id="example2"/>
|
||||
<script type="text/javascript" src="pc.js"/>
|
||||
<script type="text/javascript">
|
||||
embedPC("example2", "example2.xml", "components.xsl");
|
||||
</script>
|
||||
```
|
||||
|
||||
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 <link> tag inside the <head>
|
||||
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
|
||||
|
||||
|
|
|
|||
|
|
@ -32,8 +32,8 @@
|
|||
<ul>
|
||||
<li><a href="/">Home</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="/devices/pc/machine/">Machines</a></li>
|
||||
<li><a href="/docs/">Docs</a></li>
|
||||
<li><a href="/pubs/">Pubs</a></li>
|
||||
<li><a href="/blog/">Blog</a></li>
|
||||
|
|
|
|||
Loading…
Reference in a new issue