Experimental forum for "Technology" discussions (computers, cameras, etc).

Learn to Program: Etch Series

Postby Bob Kuczewski » Sun Feb 06, 2022 3:56 am

Learn to Program: Etch Series

Collage_Small.png
Collage_Small.png (15.62 KiB) Viewed 1256 times


This topic is about learning to program a series of simulated graphics computers that will be named "Etch1", "Etch2", and so on. The name comes from the famous "Etch-a-Sketch" toy that could draw by moving a "pen" across the screen. The toy had 2 knobs - one for horizontal movement and one for vertical movement. A skilled operator could draw diagonally by moving both simultaneously at varying relative rates.

The "Etch" series of "computers" are being designed with 2 criteria in mind:

      1. To be easy to understand and to program
      2. To actually run right inside our forum

Each new version will be introduced as it is developed, and the full documentation is currently in the "Forum Help and "How To's"" section which documents our custom BBCodes. Please feel free to try them out with posts in this topic or elsewhere in the forum.

But most importantly, have fun!!
Join a National Hang Gliding Organization: US Hawks at ushawks.org
View my rating at: US Hang Gliding Rating System
Every human at every point in history has an opportunity to choose courage over cowardice. Look around and you will find that opportunity in your own time.
Bob Kuczewski
User avatar
Contributor
Contributor
 
Posts: 7631
Joined: Fri Aug 13, 2010 2:40 pm
Location: San Diego, CA

Re: Learn to Program: Etch Series

Postby Bob Kuczewski » Sun Feb 06, 2022 4:17 am

Learn to Program: Etch1 Introduction

The "Etch1" computer has a fairly simple instruction set where each instruction is just a single character. An Etch1 computer program is just a series of these single character instructions that tell the computer what to do. There are a total of 28 different instructions, but most programs will rely most heavily on only 4 (U, D, R, L). These 4 instructions (U, D, R, L) stand for Up, Down, Right, and Left. Here is an example program that draws a simple diagram using only those 4 instructions (You can ignore the spaces. They are just helping to show the structure of this program.):

      UUU RRR DDD LLL LLL DDD RRR UUU

This program begins with a series of three "Up" instructions (UUU) which draw a small vertical line starting at the center and moving upward (all "Etch1" programs start at the center of the drawing). The next three instructions are all "Right" instructions (RRR) which will draw a short line to the right. Similarly, the "D" instructions draw down, and the "L" instructions draw left.

Now look at that program, and try to visualize what those instructions will draw. Get out a pen and paper and try to draw for yourself what that computer program tells you to draw. When you're ready, click this first button below to see how the "Etch1" computer follows those same instructions.


Your browser does not support HTML5 canvas

Did it match what you expected? If not, please take some time to understand why the program drew what it drew. Maybe use pen and paper to try to follow the instructions again now that you know what it should be drawing.

Let's try another one. This one is a bit longer, and it might be helpful for you to use lined paper or even graph paper for this drawing. Here's the computer program:

      LLDDRRRRDLLLLLUUUUUUURRRRRDLLLLDDRRRDL

When you think you've got it, go ahead and press the button below to see if your drawing matches the computer output.


Your browser does not support HTML5 canvas

How did you do this time? Again, if your drawing didn't match, be sure to understand why and draw it again until it makes sense.

There's a lot more to this simple drawing "language" than that. For example, here's a simple hang glider outline drawn in "Etch1":


Your browser does not support HTML5 canvas

That glider was drawn with these instructions:

      WW3SSMUUKRRRRRRDDDkKLLLLLLUkKLLLLLLDkKRRRRRRUUUkK9DDDDk

For more details see the full set of instructions below or read the BBCode tutorial for "Etch1" at: https://ushawks.org/forum/viewtopic.php?f=7&t=24&start=10#p31050.

========================= Etch 1 Instruction Set =========================

Reference

This is the full "Etch1" instruction set. It is placed here for quick reference. These instructions will be explained in future posts.

u: Draw (or Move) up by 1 unit
d: Draw (or Move) down by 1 unit
r: Draw (or Move) right by 1 unit
l: Draw (or Move) left by 1 unit
U: Draw (or Move) up by 10 units
D: Draw (or Move) down by 10 units
R: Draw (or Move) right by 10 units
L: Draw (or Move) left by 10 units
M: Enter Move Mode
m: Exit Move Mode
+: Increase Unit Length by 1
-: Decrease Unit Length by 1
S: Increase Unit Length by factor of 2
s: Decrease Unit Length by factor of 2
W: Increase Line Width by 1
w: Decrease Line Width by 1
0: Set Color to Black
1: Set Color to Blue
2: Set Color to Green
3: Set Color to Cyan
4: Set Color to Red
5: Set Color to Magenta
6: Set Color to Yellow
7: Set Color to White
8: Set Color to Orange
9: Set Color to Gray
K: Keep this point for a later "k" draw
k: Draw line from previous Keep
Join a National Hang Gliding Organization: US Hawks at ushawks.org
View my rating at: US Hang Gliding Rating System
Every human at every point in history has an opportunity to choose courage over cowardice. Look around and you will find that opportunity in your own time.
Bob Kuczewski
User avatar
Contributor
Contributor
 
Posts: 7631
Joined: Fri Aug 13, 2010 2:40 pm
Location: San Diego, CA

Re: Learn to Program: Etch Series

Postby Bob Kuczewski » Sun Feb 06, 2022 6:11 am

Learn to Program: Etch1 - Your First Program

Computer programming is generally done in at least 2 steps: writing the program and running the program. These 2 steps are repeated again and again as the program is developed. We'll use a previous program (above) as our first step. So here is our first written program:

      UUU RRR DDD LLL LLL DDD RRR UUU

Now to run that program, you'll have to put it into your own post inside the "etch1" tags as shown here:

      [etch1=My_First_Etch_100_100]UUU RRR DDD LLL LLL DDD RRR UUU[/etch1]

Go ahead and copy that line and paste it into a post of your own to check it out. You should change the name part from "My_First_Etch_100_100" to something else like "Bobs_First_Etch_100_100" or "Joes_First_Etch_100_100". You can name it anything you like as long as it is both unique on the page and ends with two numbers like "_100_100". Those last two numbers ("_100_100") are the width and height of the drawing area that will be created inside your post. You can use different numbers for different sized drawings.

OK, go ahead and give it a try. Just copy that text into your own post and change the name to your name (or to something creative).
Join a National Hang Gliding Organization: US Hawks at ushawks.org
View my rating at: US Hang Gliding Rating System
Every human at every point in history has an opportunity to choose courage over cowardice. Look around and you will find that opportunity in your own time.
Bob Kuczewski
User avatar
Contributor
Contributor
 
Posts: 7631
Joined: Fri Aug 13, 2010 2:40 pm
Location: San Diego, CA

Re: Learn to Program: Etch Series

Postby Student Hawk » Sun Feb 06, 2022 11:32 pm

OK, I copied that text into my post right here and changed the name to "StudentHawks_First_Etch_100_100":


Your browser does not support HTML5 canvas

When I click the button, my post shows this:

StudentHawks_First_Etch.png
StudentHawks_First_Etch.png (5.11 KiB) Viewed 1251 times
Student Hawk
User avatar
Contributor
Contributor
 
Posts: 1
Joined: Sun Feb 06, 2022 11:45 pm

Forum Statistics

Who is online

Users browsing this forum: No registered users and 1 guest

Options

Return to Technology Forum