Repo for implementation of Logo in JavaScript p5
Supported commands
The description(s) and/or example(s) of the commands were taken (and corrected for this interpreter) from the Berkeley Logo Reference Manual under MIT license.
Moves the turtle forward, in the direction that it's facing, by the specified distance (measured in turtle steps).
fd units
Moves the turtle backward, i.e., exactly opposite to the direction that it's facing, by the specified distance. (The heading of the turtle does not change.)
bd units
Turns the turtle clockwise by the specified angle, measured by default in degrees (1/360 of a circle).
rt angle
Turns the turtle counterclockwise by the specified angle, measured by default in degrees (1/360 of a circle).
lt angle
Sets the pen's position to UP, without changing its mode.
pu
Sets the pen's position to DOWN, without changing its mode.
pd
Sets the thickness of the pen with the given the value. Note: If it's given a negative value, by default will be thickness of 1.
pensize thicknessValue
Moves the turtle to an absolute position in the graphics window. The two inputs are numbers, the X and Y coordinates.
setxy coordinateX coordinateY
Moves the turtle horizontally from its old position to a new absolute horizontal coordinate. The input is the new X coordinate.
setx coordinateX
Moves the turtle vertically from its old position to a new absolute vertical coordinate. The input is the new Y coordinate.
sety coordinateY
Moves the turtle to the center of the screen.
home
Changes the angle values to be used as radians
radians
Changes the angle values to be used as degrees
degrees
uns the following instruction list repeatedly, num times. Can be nested.
repeat num [instruction list]
Sets the pen color given the hexadecimal value in format #FFF / #FFFFFF.
color hexadecimalValue
Sets the pen color given the RGB value.
colorrgb [red green blue]
Prints the given in the developer console
author [author website twitter]
- Live Web Demo
- Coding Challenge Part 1 and Coding Challenge Part 2
- Coding Challenge Part 1 on Youtube and Coding Challenge Part 2 on Youtube
- Logo Wikipedia Page
- More Information about Logo and some Examples
Getting started just takes 3 simple steps, each one is a command in the terminal.
- Clone this GitHub repository.
- Navigate inside the repository directory on your machine.
- Host the directory with a local web server.
There are a few easy ways to achieve step number 3 depending on what you already have installed:
Node Package Manager (NPM)
If you have NPM installed you can use the live-server NPM package. The neat thing about live-server is that it automatically refreshes the web page every time you change a file.
If you don't have NPM installed you can download and install it here.
Once you have NPM, install live-server globally with
npm install --global live-server.Then run the following commands in your terminal.
git clone https://github.com/CodingTrain/Logo.git cd Logo live-server --port=8080 .Don't forget the dot at the end of the command on MacOS!
Finally, you can open http://localhost:8080 in your browser and you're away!
Note that when you close the terminal window, the web server will stop as well.
Python 2.x
You can use the SimpleHTTPServer python module.
If you don't have Python 2 installed you can download and install it here.
Then run the following commands in your terminal.
git clone https://github.com/CodingTrain/Logo.git cd Logo python -m SimpleHTTPServer 8080Finally, you can open http://localhost:8080 in your browser and you're away!
Note that when you close the terminal window, the web server will stop as well.
Python 3.x
You can use the http.server python module.
If you don't have Python 3 installed you can download and install it here.
Then run the following commands in your terminal.
git clone https://github.com/CodingTrain/Logo.git cd Logo python3 -m http.server 8080Finally, you can open http://localhost:8080 in your browser and you're away!
Note that when you close the terminal window, the web server will stop as well.