Compare commits

...

3 Commits

Author SHA1 Message Date
lee2sman 4fb8e5cbbc change turtle.js starter code 2021-02-14 02:07:26 -05:00
lee2sman 06c47c9e01 add bg() and console text display 2021-02-14 01:44:15 -05:00
lee2sman aad87ec36d add minimal stylesheet spacing 2021-02-14 01:43:47 -05:00
5 changed files with 57 additions and 27 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 52 KiB

View File

@ -4,11 +4,11 @@
<head>
<meta charset="utf-8" />
<!-- <link rel="stylesheet" href="style.css" /> -->
<link rel="stylesheet" href="style.css" />
<script src="lib/p5.min.js"></script>
<script src="lib/p5.sound.min.js"></script>
<title>PLogo</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
</head>
<body>
<script src="turtle.js"></script>

View File

@ -3,6 +3,7 @@ let angle,
y,
drawing = true,
retroStyle = false,
showCommands = true,
turtleC;
function setup() {
createCanvas(windowWidth, windowHeight); //canvas is size of window
@ -10,6 +11,7 @@ function setup() {
turtle();
displayTurtle();
retroFilter();
displayConsole();
}
function resetDefaults() {
@ -28,15 +30,6 @@ function setpos(_newX, _newY, startx = x, starty = y) {
}
x = newX;
y = newY;
try {
if (_newX == "" || _newY == "") throw "is missing input x,y coordinates";
if (isNaN(_newX) || isNaN(_newY)) throw "requires: x,y input coordinates";
if (_newX < 0 || _newY < 0 || _newX > windowWidth || _newY > windowHeight)
throw "drawing offscreen";
} catch (err) {
console.log("Error: setpos " + err);
}
}
function forward(d, startx = x, starty = y, _angle = 360 - angle) {
let newX = startx + d * sin(_angle);
@ -82,9 +75,15 @@ function randint(max = 100) {
//default returns int between 0 and 100
return int(random(max));
}
function bg(c='black'){
background(c)
}
function retro() {
retroStyle = true;
}
function noConsole() {
showCommands = false;
}
function retroFilter() {
if (retroStyle) {
//attempts a 'retro' aesthetic
@ -102,6 +101,31 @@ function displayTurtle() {
triangle(-10, 10, 10, 10, 0, -10);
pop();
}
function displayConsole() {
if (showCommands) {
let programCode = turtle.toString();
programCodeArr = splitTokens(programCode, "\n");
let container = createDiv();
for (let i = 1; i < programCodeArr.length - 1; i++) {
createP("\u00A0" + programCodeArr[i])
.style("font-family", "monospace")
.style("font-weight", "bold")
.style("font-size", "2rem")
.style("display", "fixed")
.style("background-color", "black")
.style("color", "yellow")
.style("border", "0")
.style("margin", "0")
.style("padding", "0")
.style("display", "inline-block")
.parent(container);
}
container.position(0, height - height / 8);
}
}
function windowResized() {
//resizes canvas if window is resized
resizeCanvas(windowWidth, windowHeight);

5
style.css Normal file
View File

@ -0,0 +1,5 @@
html, body, canvas {
margin: 0;
padding: 0;
border: 0;
}

View File

@ -1,21 +1,22 @@
function turtle(){
penColor('blue')
for (let i = 0; i < 100; i++){
penSize(randint())
right(randint());
forward(randint());
penColor(color(randint(),randint(),randint()))
bg('blue')
penColor('pink')
penSize(12)
forward(randint())
for (let i = 0; i < 13; i++){
forward(170)
left(120)
forward(180)
right(10)
back(18)
}
penColor(color(100,0,100,50));
penSize(20);
forward(100);
penColor(color(100,0,100,150));
forward(100);
penColor(color(100,0,100,250));
forward(100);
}