{"id":69029,"date":"2021-11-14T01:30:34","date_gmt":"2021-11-14T06:30:34","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=69029"},"modified":"2021-11-14T01:30:34","modified_gmt":"2021-11-14T06:30:34","slug":"project-11","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/11\/14\/project-11\/","title":{"rendered":"Project 11"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><div class=\"wp-block-file\"><a class=\"p5_sketch_link\" data-width=\"&ldquo;4000&rdquo;\" data-height=\"&ldquo;4000&rdquo;\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/sketch-49.js\">sketch<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"&ldquo;4000&rdquo;\" height=\"&ldquo;4000&rdquo;\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">function setup() {\n    createCanvas(400,400);\n    \/\/ create an initial collection of buildings\n    for (var i = 0; i &lt; 4; i++){\n        var cx = random(width);\n        var cy = random(320,350)\n        cars[i] = makeCar(cx,cy,color(random(255),random(255),random(255)),random(25,45));\n    }\n    for (var i = 0; i &lt; 3; i++){\n        var bx = random(width);\n        var by = random(20,150)\n        birds[i] = makeBird(bx,by,color(random(255),random(255),random(255)));\n    }\n    frameRate(10);\n}\nvar cars = [];\nvar birds = [];\nfunction draw() {\n    push()\n    fill(170,170,255)\n    rect(0,0,400,270)\n    fill(0,170,0)\n    rect(0,270,400,130)\n    drawRoad()\n    drawSun()\n    for (i=0; i&lt;=50; i++){\n        drawTree(i*50+20,260)  \n    }\n    updateAndDisplayCars();\n    removeCarsThatHaveSlippedOutOfView();\n    addNewCarsWithSomeRandomProbability();\n    updateAndDisplayBirds(); \n    removeBirdsThatHaveSlippedOutOfView();\n    addNewBirdsWithSomeRandomProbability();\n}\nfunction drawSun(){\n    fill(255,200,0)\n    ellipse(0,0,100,100)\n}\nfunction drawTree(x,y){\n    fill(0,255,0)\n    triangle(x,y,x-7,y+15,x+7,y+15)\n    fill(50,30,0)\n    rect(x-2,y+15,4,10)\n}\nfunction drawRoad(){\n    fill(0)\n    rect(0,300,400,60)\n    fill(255,255,0)\n    for (i = 0; i &lt;= 10; i++){\n        rect(50*i+15,325,20,5)\n    }\n}\nfunction removeCarsThatHaveSlippedOutOfView(){\n    var carsToKeep = [];\n    for (var i = 0; i &lt; cars.length; i++){\n        if (cars[i].x &gt; 0) {\n            carsToKeep.push(cars[i]);\n        }\n        print(cars[i])\n    }\n    cars = carsToKeep; \/\/ remember the surviving cars\n\n}\nfunction updateAndDisplayCars(){\n    \/\/ Update the cars's positions, and display them.\n    for (var i = 0; i &lt; cars.length; i++){\n        cars[i].move();\n        cars[i].display();\n    }\n}\nfunction addNewCarsWithSomeRandomProbability() {\n    \/\/ With a probability, add a new car to the end.\n    var newCarLikelihood = 0.05; \n    if (random(0,1) &lt; newCarLikelihood) {\n        cars.push(makeCar(0,random(305,345),color(random(255),random(255),random(255)),random(25,45)));\n    }\n}\n\n\/\/ method to update position of cars every frame\nfunction carMove() {\n    this.x += this.speed;\n}\n\/\/ draw the cars\nfunction carDisplay() {\n    push()\n    fill(this.c)\n    rect(this.x,this.y,this.l,10)\n    rect(this.x+8,this.y-10,14,10)\n    ellipse(this.x+11,this.y+8,10,10)\n    ellipse(this.x+26,this.y+8,10,10)\n    pop()\n}\n\/\/make new car with different XY location, color, length, and speed\nfunction makeCar(birthLocationX,birthLocationY,color,carLength) {\n    var car = {x: birthLocationX,\n                y: birthLocationY,\n                c: color,\n                l: carLength,\n                speed: random(2,10),\n                move: carMove,\n                display: carDisplay}\n    return car;\n}\nfunction removeBirdsThatHaveSlippedOutOfView(){\n    var birdsToKeep = [];\n    for (var i = 0; i &lt; birds.length; i++){\n        if (birds[i].x &gt; 0) {\n            birdsToKeep.push(birds[i]);\n        }\n        print(birds[i])\n    }\n    birds = birdsToKeep; \/\/ remember the surviving cars\n}\nfunction updateAndDisplayBirds(){\n    \/\/ Update the cars's positions, and display them.\n    for (var i = 0; i &lt; birds.length; i++){\n        birds[i].move();\n        birds[i].display();\n    }\n}\nfunction addNewBirdsWithSomeRandomProbability() {\n    \/\/ With a probability, add a new bird to the end.\n    var newBirdLikelihood = 0.05; \n    if (random(0,1) &lt; newBirdLikelihood) {\n        birds.push(makeBird(width,random(20,160),color(random(255),random(255),random(255))));\n    }\n}\n\n\/\/ method to update position of birds every frame\nfunction birdMove() {\n    this.x -= this.speedX;\n    this.y += this.speedY\n}\n\/\/ draw the birds\nfunction birdDisplay() {\n    push()\n    fill(this.c)\n    triangle(this.x,this.y,this.x+6,this.y+1.5,this.x+6,this.y-1.5)\/\/beak\n    ellipse(this.x+9,this.y,7,7) \/\/head\n    ellipse(this.x+17,this.y+4,15,8)\/\/body\n    arc(this.x+18, this.y, 10, 10, -0.7, PI-0.7,CHORD)\/\/wings\n    ellipse(this.x+8,this.y-1,1,1)\/\/eyes\n    pop()\n}\n\/\/make new bird with different location, color, speedXY\nfunction makeBird(birthLocationX,birthLocationY,color) {\n    var bird = {x: birthLocationX,\n                y: birthLocationY,\n                c: color,\n                speedX: random(5,8),\n                speedY: random(-1.5,1.5),\n                move: birdMove,\n                display: birdDisplay}\n    return bird;\n}\n<\/code><\/pre><\/div>\n\n\n\n<p>For this project, I created 2 arrays of objects: cars and birds. Cars have random color, length, speedX, and y position on the road; birds have random color, y position in the sky, speedX, and speedY. <\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>For this project, I created 2 arrays of objects: cars and birds. Cars have random color, length, speedX, and y position on the road; birds have random color, y position in the sky, speedX, and speedY.<\/p>\n","protected":false},"author":667,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[115,55],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/69029"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/users\/667"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=69029"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/69029\/revisions"}],"predecessor-version":[{"id":69033,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/69029\/revisions\/69033"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=69029"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=69029"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=69029"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}