Compare commits
4 Commits
fe5f0c1c12
...
45110214c1
Author | SHA1 | Date | |
---|---|---|---|
45110214c1 | |||
dac2df0c75 | |||
08463c49b1 | |||
4a9a70fc06 |
114
README.md
114
README.md
|
@ -6,7 +6,7 @@ A toy language.
|
||||||
|
|
||||||
A kind of LOGO-like DSL built in the p5.js library.
|
A kind of LOGO-like DSL built in the p5.js library.
|
||||||
|
|
||||||
This is a rudimentary proof of concept right now with globals and without implementing classes or ability to loop.
|
This is a rudimentary proof of concept right now with globals and without implementing classes. To write loops or *subroutines* one must use regular javascript.
|
||||||
|
|
||||||
## How to Use
|
## How to Use
|
||||||
|
|
||||||
|
@ -14,32 +14,110 @@ Put your code inside the turtle function in turtle.js
|
||||||
|
|
||||||
## Reference Commands
|
## Reference Commands
|
||||||
|
|
||||||
|
|
||||||
|
### Movement
|
||||||
|
|
||||||
```
|
```
|
||||||
//movement
|
forward(n)
|
||||||
|
```
|
||||||
|
move n pixels ahead
|
||||||
|
|
||||||
forward(n); //moves n pixels ahead
|
```
|
||||||
|
back(n)
|
||||||
|
```
|
||||||
|
move n pixels back
|
||||||
|
|
||||||
back(n); //moves n pixels back
|
```
|
||||||
|
left(Δ)
|
||||||
|
```
|
||||||
|
turns Δ degrees to the left
|
||||||
|
|
||||||
left(Δ); //turns Δ degrees to the left
|
```
|
||||||
|
right(Δ)
|
||||||
|
```
|
||||||
|
turns Δ degrees to the right
|
||||||
|
|
||||||
right(Δ); //turns Δ degrees to the right
|
### Drawing
|
||||||
|
|
||||||
//drawing
|
```
|
||||||
|
penup()
|
||||||
|
```
|
||||||
|
Going forward, Turtle will stop drawing a line with movement commands
|
||||||
|
|
||||||
penup(); //will draw a line with movement commands
|
```
|
||||||
|
pendown()
|
||||||
|
```
|
||||||
|
Turtle will start drawing lines tracing route. **By default, pendown is on / true**
|
||||||
|
|
||||||
pendown(); //will move to x,y coordinates without drawing line
|
```
|
||||||
//By default, pendown is on / true
|
penColor('colorName')
|
||||||
penColor('colorName'); //any color word: purple, grey, blue, etc.
|
```
|
||||||
//color name must be in single or double quotes!
|
penColor takes any color word: purple, grey, blue, etc. **The color name must be in quotes.**
|
||||||
//or a HTML color like #ff4d4d (in quotes!)
|
|
||||||
penSize(n); //width of pen in pixels
|
Alternatively, a HTML color name, like #ff4d4d, may be specified in quotes. Example: ```penColor('$ff4d4d')```
|
||||||
|
|
||||||
|
Alternatively, a RGB color or RGBA color with transparency can be specified, with *color*. Example: ```penColor(color(255,0,255))```. See transparency example in examples section below.
|
||||||
|
|
||||||
|
```
|
||||||
|
penSize(n)
|
||||||
|
```
|
||||||
|
Width of pen in pixels
|
||||||
|
|
||||||
//randomness
|
### Randomness
|
||||||
|
|
||||||
randint(n); //returns a random int between 0 and n (exclusive)
|
```
|
||||||
//if no input, default is between 0 and 100
|
randint(n)
|
||||||
//example: forward(randint(30));
|
|
||||||
```
|
```
|
||||||
|
|
||||||
|
or
|
||||||
|
|
||||||
|
```
|
||||||
|
randint()
|
||||||
|
```
|
||||||
|
Returns a random int between 0 and n. Specifying a value is optional. If no input *n*, the default is between 0 and 100. Example: ```forward(randint(30))```
|
||||||
|
|
||||||
|
|
||||||
|
## Examples
|
||||||
|
|
||||||
|
### Backwards box
|
||||||
|
|
||||||
|
```
|
||||||
|
penColor('orange');
|
||||||
|
penSize(3);
|
||||||
|
|
||||||
|
left(90);
|
||||||
|
back(100);
|
||||||
|
left(90);
|
||||||
|
back(100);
|
||||||
|
left(90);
|
||||||
|
back(100);
|
||||||
|
left(90);
|
||||||
|
back(100);
|
||||||
|
```
|
||||||
|
|
||||||
|
### Random Walk (with javascript for-loop)
|
||||||
|
|
||||||
|
```
|
||||||
|
for (let i = 0; i < 100; i++){
|
||||||
|
right(randint());
|
||||||
|
forward(randint());
|
||||||
|
}
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
### Forward, with color transparency
|
||||||
|
|
||||||
|
In this example, the last parameter inside penColor's color is the alpha transparency amount. Like the individual red, green, blue colors specified before it, this can be a number from 0 to 255. The lower the number, the more transparent.
|
||||||
|
|
||||||
|
```
|
||||||
|
penSize(20);
|
||||||
|
|
||||||
|
penColor(color(100,0,100,50));
|
||||||
|
forward(100);
|
||||||
|
|
||||||
|
penColor(color(100,0,100,150));
|
||||||
|
forward(100);
|
||||||
|
|
||||||
|
penColor(color(100,0,100,250));
|
||||||
|
forward(100);
|
||||||
|
```
|
||||||
|
|
121
lib/plogo.js
121
lib/plogo.js
|
@ -1,66 +1,83 @@
|
||||||
let angle,x,y,drawing=true;
|
let angle,
|
||||||
function setup(){
|
x,
|
||||||
createCanvas(windowWidth,windowHeight); //canvas is size of window
|
y,
|
||||||
resetDefaults();
|
drawing = true,
|
||||||
turtle();
|
turtleC;
|
||||||
|
function setup() {
|
||||||
|
createCanvas(windowWidth, windowHeight); //canvas is size of window
|
||||||
|
resetDefaults();
|
||||||
|
turtle();
|
||||||
|
displayTurtle();
|
||||||
}
|
}
|
||||||
|
|
||||||
function resetDefaults(){
|
function resetDefaults() {
|
||||||
|
angleMode(DEGREES); //instead of p5.js's default RADIANS
|
||||||
|
|
||||||
angleMode(DEGREES); //instead of p5.js's default RADIANS
|
angle = 180; //facing up
|
||||||
|
x = width / 2; //start turtle in center
|
||||||
|
y = height / 2;
|
||||||
|
}
|
||||||
|
function forward(d, startx = x, starty = y, _angle = 360 - angle) {
|
||||||
|
let newX = startx + d * sin(_angle);
|
||||||
|
let newY = starty + d * cos(_angle);
|
||||||
|
|
||||||
angle=0; //facing up
|
if (drawing) {
|
||||||
x = width/2; //start turtle in center
|
line(startx, starty, newX, newY);
|
||||||
y = height/2;
|
}
|
||||||
|
|
||||||
|
x = newX;
|
||||||
|
y = newY;
|
||||||
|
}
|
||||||
|
function back(d, startx = x, starty = y, _angle = 180 - angle) {
|
||||||
|
let newX = startx + d * sin(_angle);
|
||||||
|
let newY = starty + d * cos(_angle);
|
||||||
|
|
||||||
|
if (drawing) {
|
||||||
|
line(startx, starty, newX, newY);
|
||||||
|
}
|
||||||
|
x = newX;
|
||||||
|
y = newY;
|
||||||
|
|
||||||
|
print(x, y);
|
||||||
|
}
|
||||||
|
function left(_angle) {
|
||||||
|
angle -= _angle;
|
||||||
|
}
|
||||||
|
function right(_angle) {
|
||||||
|
angle += _angle;
|
||||||
}
|
}
|
||||||
|
|
||||||
function forward(d,startx=x, starty = y, _angle = angle){
|
function pendown() {
|
||||||
|
drawing = true;
|
||||||
let newX = startx+d*sin(_angle);
|
|
||||||
let newY = starty+d*cos(_angle);
|
|
||||||
|
|
||||||
if (drawing){
|
|
||||||
line(startx,starty,newX,newY);
|
|
||||||
}
|
|
||||||
|
|
||||||
x=newX
|
|
||||||
y=newY
|
|
||||||
}
|
}
|
||||||
function back(d,startx=x, starty = y, _angle =360- angle){
|
function penup() {
|
||||||
|
drawing = false;
|
||||||
let newX = startx+d*sin(_angle);
|
|
||||||
let newY = starty+d*cos(_angle);
|
|
||||||
|
|
||||||
if (drawing){
|
|
||||||
line(startx,starty,newX,newY);
|
|
||||||
}
|
|
||||||
|
|
||||||
x=newX
|
|
||||||
y=newY
|
|
||||||
}
|
}
|
||||||
function left(_angle){
|
function penSize(weight = 1) {
|
||||||
angle=180+_angle;
|
strokeWeight(weight);
|
||||||
}
|
}
|
||||||
function right(_angle){
|
function penColor(c) {
|
||||||
angle=_angle;
|
stroke(c);
|
||||||
}
|
}
|
||||||
|
function randint(max = 100) {
|
||||||
function pendown(){
|
//default returns int between 0 and 100
|
||||||
drawing=true;
|
return int(random(max));
|
||||||
}
|
}
|
||||||
function penup(){
|
function displayTurtle() {
|
||||||
drawing=false;
|
stroke(0, 255, 0);
|
||||||
|
strokeWeight(1);
|
||||||
|
fill(0, 255, 0);
|
||||||
|
push();
|
||||||
|
translate(x, y);
|
||||||
|
rotate(180 + angle);
|
||||||
|
triangle(-10, 10, 10, 10, 0, -10);
|
||||||
|
pop();
|
||||||
}
|
}
|
||||||
function penSize(weight=1){
|
function windowResized() {
|
||||||
strokeWeight(weight);
|
//resizes canvas if window is resized
|
||||||
|
resizeCanvas(windowWidth, windowHeight);
|
||||||
}
|
}
|
||||||
function penColor(c){
|
function draw() {}
|
||||||
stroke(c);
|
function mousePressed() {
|
||||||
}
|
print(mouseY);
|
||||||
function randint(max=100){
|
|
||||||
//default returns int between 0 and 100
|
|
||||||
return int(random(max))
|
|
||||||
}
|
|
||||||
function windowResized(){ //resizes canvas if window is resized
|
|
||||||
resizeCanvas(windowWidth, windowHeight);
|
|
||||||
}
|
}
|
||||||
|
|
27
turtle.js
27
turtle.js
|
@ -1,18 +1,21 @@
|
||||||
function turtle(){
|
function turtle(){
|
||||||
|
|
||||||
penSize(3);
|
penColor('blue')
|
||||||
penColor('purple');
|
for (let i = 0; i < 100; i++){
|
||||||
|
penSize(randint())
|
||||||
|
right(randint());
|
||||||
|
forward(randint());
|
||||||
|
penColor(color(randint(),randint(),randint()))
|
||||||
|
}
|
||||||
|
|
||||||
right(randint(100));
|
penColor(color(100,0,100,50));
|
||||||
forward(randint(200));
|
penSize(20);
|
||||||
|
forward(100);
|
||||||
|
|
||||||
penup();
|
penColor(color(100,0,100,150));
|
||||||
right(randint());
|
forward(100);
|
||||||
forward(randint());
|
|
||||||
|
penColor(color(100,0,100,250));
|
||||||
|
forward(100);
|
||||||
|
|
||||||
penSize(12);
|
|
||||||
penColor('#00ff8f');
|
|
||||||
pendown();
|
|
||||||
right(randint(45));
|
|
||||||
forward(randint(300));
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user