Simple 3-Bit Color Drawing Computer

                    

Source Code Binary Code   Memory   CPU
  
  
0000
  
P0

Your browser does not support the HTML5 canvas tag.
 
 
Auto Loop
 


Instruction Set for Simple 3-Bit Color Drawing Computer

Instruction Set

000 Move/Draw Down D
001 Move/Draw Right R
010 Move/Draw Left L
011 Move/Draw Up U
100 Pen Up PU
101 Pen Down PD
110 Color Short (#) CS
111 Color Long (RGB) CL
   

Color Short

000 Black 0
001 Blue 1
010 Green 2
011 Cyan 3
100 Red 4
101 Magenta 5
110 Yellow 6
111 White 7


-- Description --

This simple computer uses a series of three bit instructions to draw lines of different colors on a screen. The lines are drawn as a series of short vertical or horizontal segments using the 4 motion instructions ("D", "R", "L", and "U") as shown in the instruction set table above. The motion instructions will either move (when the pen is "up") or draw (when the pen is "down"). The pen is initially down, but can be changed with the Pen Up ("PU") or Pen Down ("PD") instructions. Colors can be specified using the Color Short ("CS") instruction or the Color Long ("CL") instruction. The Color Short ("CS") instruction takes a single digit color parameter (0-7) from the next 3-bit word to specify the red, green, and blue components of the color. The Color Long ("CL") instruction takes the next 3 single digit color parameters (0-7 each) in the next three successive 3-bit words to specify the red, green, and blue components of the color.

This computer can be programmed in either binary (1's and 0's) or with a text instructions ("d", "r", "l", "u", "pd", "pu", "cs", and "cl"). These text instructions are called "Source Code", and they are entered into the "Source Code" text block. Each instruction word of the source code may be separated from other instruction words with optional spaces or new lines. These instruction words are much easier to remember (and to type) than the three-bit binary instruction codes for this computer. All instructions may be written in either upper or lower or mixed case.

This computer has an optional "Auto Loop" switch that allows programs to continue to run again and again. For example, a stair case can be drawn by using the instructions "u" and "r" with the "Auto Loop" turned on. The computer will continually draw up and right over and over.

The "Compile Program" button will convert all of the source code into binary instructions and show the binary program (along with addresses) in the "Binary Code" text block. Pushing the "Compile" button will write over any binary instructions in the "Binary Code" text block.

Once a program is compiled (or entered directly in binary) it can be loaded from the Binary Code block into the computer Memory using the Load Program button.

Once a program is loaded into memory, it can be run with the "Run/Stop" button. The CPU shows the program counter ("P") which indicates the next instruction to be executed by the computer. This computer can hold up to 256 instructions. The controls are explained here:

The normal programming process goes as follows:

  1. Write or modify the program in the "Source Code" block
  2. Compile the "Source Code" to "Binary Code" with the "Compile Program" button
  3. Load the "Binary Code" program into "Memory" with the "Load Program" button
  4. Run the program with the "Run/Stop" button or step through it with the "Step" button.

The process is iterative as each program is written and tested.


-- Sample Programs --


Tiny Square:

This simple program draws a small square with draw up, draw right, draw down, and draw left.

u r d l


Repeating Square Wave:

This simple program draws a repeating square wave when run again and again. It can also repeat automatically with Auto Loop turned on.

r u r d


Red Square Green Square:

This simple program draws a red square beside a green square.

cs 4
u r d l
pu
r r
pd
cs 2
u r d l


Larger Dashed Square:

This program draws a larger square with dashed lines by alternating between draw and move instructions.

u pu u pd u pu u pd u pu u pd u
r pu r pd r pu r pd r pu r pd r
d pu d pd d pu d pd d pu d pd d
l pu l pd l pu l pd l pu l pd l


Colored Square Ready to Repeat:

This program draws a square with different colors on each of the 4 sides. The program finishes by moving to the upper left of the original square so that running it again will draw a new square in a slightly different position. This allows for repeated calls to draw a series of squares.

cs 5
r r r
cs 6
d d d
cs 2
l l l
cs 1
u u u
pu u l pd


Colored Angles Ready to Repeat:

This program draws pair of angles in 2 colors with the second above and to the right of the first. The program finishes by moving to the position where the next pair of angles would be drawn to continue the series. This allows for repeated calls to draw a series of angles.

cs 5
r r r
d d d
pu r u pd
cs 7
u u u
l l l
pu u r pd


Color Bars using ColorShort:

This program draws a series of vertical colored lines. Each line uses a different color from the short color table.

cs 0 u pu r d pd
cs 1 u pu r d pd
cs 2 u pu r d pd
cs 3 u pu r d pd
cs 4 u pu r d pd
cs 5 u pu r d pd
cs 6 u pu r d pd
cs 7 u pu r d pd


Tilted Figure 8:

This program draws a tilted (and squared) figure 8 skipping the intersection.

cl 700
u u u u u
cl 070
r r r r r
cl 007
d d d d d
cl 777
l l l l
pu l l pd
l l l l
cl 770
d d d d d
cl 707
r r r r r
cl 077
u u u u u


Concentric Color Squares:

This program draws a series of concentric squares from the center out. Each square is a different color using the Color Short (cs) instruction.
This is a pretty long program and is best run at full speed.

cs 4
u r d l
pu
l d
pd
cs 2
u u u
r r r
d d d
l l l
pu
l d
pd
cs 1
u u u u u
r r r r r
d d d d d
l l l l l
pu
l d
pd
cs 6
u u u u u u u
r r r r r r r
d d d d d d d
l l l l l l l
pu
l d
pd
cs 5
u u u u u u u u u
r r r r r r r r r
d d d d d d d d d
l l l l l l l l l
pu
l d
pd
cs 7
u u u u u u u u u u u
r r r r r r r r r r r
d d d d d d d d d d d
l l l l l l l l l l l


Concentric Blue Shaded Squares:

This program draws a series of concentric squares from the center out. Each square is a different shade of blue using the Color Long (cl) instruction.
This is a pretty long program and is best run at full speed.

cl 003
u r d l
pu
l d
pd
cl 004
u u u
r r r
d d d
l l l
pu
l d
pd
cl 005
u u u u u
r r r r r
d d d d d
l l l l l
pu
l d
pd
cl 116
u u u u u u u
r r r r r r r
d d d d d d d
l l l l l l l
pu
l d
pd
cl 007
u u u u u u u u u
r r r r r r r r r
d d d d d d d d d
l l l l l l l l l
pu
l d
pd
cl 117
u u u u u u u u u u u
r r r r r r r r r r r
d d d d d d d d d d d
l l l l l l l l l l l
pu
l d
pd
cl 227
u u u u u u u u u u u u u
r r r r r r r r r r r r r
d d d d d d d d d d d d d
l l l l l l l l l l l l l


Hi:

This program draws the word "Hi". It uses the move commands to skip between letters and to skip to the "dot" of the lower case "i".
This is a pretty long program and is best run at full speed.

cl 774
u u u u u
l
d d d d
l l l l
u u u u
l
d d d d
d d d d d
r
u u u u
r r r r
d d d d
r
u u u u
pu
r r r
pd
u u
pu u pd
u r d l
pu d pd
r
d d d d d d
l
u u u u


Gray Lines:

This program draws a number of vertical gray lines. After drawing, the program moves back to the starting location so the program may be run repeatedly (or in a loop). This seems to increase the brightness of the lines.

pu l l l l pd
cl 777
u u u u d d d d
pu r pd
cl 666
u u u u d d d d
pu r pd
cl 555
u u u u d d d d
pu r pd
cl 444
u u u u d d d d
pu r pd
cl 333
u u u u d d d d
pu r pd
cl 222
u u u u d d d d
pu r pd
cl 111
u u u u d d d d
pu r pd
cl 000
u u u u d d d d
pu l l l


RGB Lines:

This program draws a square wave pattern where each new wave uses a different shade of red, green, and blue.

pu
llllllllllll
pd

cs 7
du
cl 100
uuur
cl 200
dddr
cl 300
uuur
cl 400
dddr
cl 500
uuur
cl 600
dddr
cl 700
uuur
dddr
cs 7
du
cl 010
uuur
cl 020
dddr
cl 030
uuur
cl 040
dddr
cl 050
uuur
cl 060
dddr
cl 070
uuur
dddr
cs 7
du
cl 001
uuur
cl 002
dddr
cl 003
uuur
cl 004
dddr
cl 005
uuur
cl 006
dddr
cl 007
uuur
dddr
cs 7
du


Computer Window:

This program draws a simple computer window with a bar across the top of the window which might be used for dragging the window.

pu
uuuuuuuuu
llllllllllllll
pd
rrrrrrrrrrrrrrrrrrrrrrrrrrrr
dddddddddddddddddd
llllllllllllllllllllllllllll
uuuuuuuuuuuuuuuuuu
ddd
rrrrrrrrrrrrrrrrrrrrrrrrrrrr


Staircase:

This very simple program draws a staircase by repeating the same two instructions ("up" and "right") again and again using the "Auto Loop" switch. Be sure to enable "Auto Loop" before running.

u r