{"id":75674,"date":"2022-11-13T19:40:49","date_gmt":"2022-11-14T00:40:49","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=75674"},"modified":"2022-11-13T19:45:02","modified_gmt":"2022-11-14T00:45:02","slug":"a-day-of-steve","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/11\/13\/a-day-of-steve\/","title":{"rendered":"A Day of Steve"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><p>Story: One beautiful morning Steve heard there&rsquo;s birds singing outside, so he went out to check for the birds that hides in the tree. He didn&rsquo;t notice there is a creeper on top of his house, and the creeper follows Steve to the tree. The Steve realized creeper is behind him, but it&rsquo;s too late for him to stop creeper from exploding.  <\/p>\n\n\n\n<p>Reflection: Though I was asked to use 2-3 seconds sounds for this project, I mostly able to find 4-5 second sounds that I felt fits for my story. Somehow the Audacity also does not work for the sounds I selected, so I have to use these 4-5 seconds sounds files directly. I also don&rsquo;t know how to find the images that directly blends into the canvas.<\/p>\n\n\n\n<div class=\"wp-block-file\"><a class=\"p5_sketch_link\" data-width=\"500\" data-height=\"400\" id=\"wp-block-file--media-a2eacbee-cc0c-4a36-a0f5-1a62a46ef530\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/11\/sketch-50.js\">sketch<\/a><a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/11\/sketch-50.js\" class=\"wp-block-file__button\" download aria-describedby=\"wp-block-file--media-a2eacbee-cc0c-4a36-a0f5-1a62a46ef530\">Download<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"500\" height=\"400\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/* Jiayi Chen\n   jiayiche    Section A *\/\n\/\/ sketch.js template for sound and DOM\n\/\/\n\/\/ This is the 15104 Version 1 template for sound and Dom.\n\/\/ This template prompts the user to click on the web page\n\/\/ when it is first loaded.\n\/\/ The function useSound() must be called in setup() if you\n\/\/ use sound functions.\n\/\/ The function soundSetup() is called when it is safe\n\/\/ to call sound functions, so put sound initialization there.\n\/\/ (But loadSound() should still be called in preload().)\n\n\/*Story:\nOne beautiful morning Steve heard there's birds singing outside,\nso he went out to check for the birds that hides in the tree.\nHe didn't notice there is a creeper on top of his house, and \nthe creeper follows Steve to the tree. The Steve realized creeper \nis behind him, but it's too late for him to stop creeper from exploding.  \n\nReflection:\nThough I was asked to use 2-3 seconds sounds for this project, I \nmostly able to find 4-5 second sounds that I felt fits for my story. \nSomehow the Audacity also does not works for the sounds I selected, \nso I have to use these 4-5 seconds sounds files directly.I also don't \nknow how to find the images that directly blends into the canvas. \n*\/\n\/\/Stevemovements\nvar steve=[]; \/\/array for stevemovement\nvar idle;\nvar walk;\nvar run;\nvar swordright;\nvar damaged;\n\/\/creeper\nvar creeperMovement =[]; \/\/array for creeper movement\nvar creeper;\nvar glowing;\nvar exploasion;\n\/\/house and bird for tree\nvar house;\nvar bird;\n\/\/sounds\nvar walkingsound;\nvar exploadsound;\nvar hurt;\nvar dooropen;\nvar morningbirds;\n\n\/\/ track the time\nvar frame=0;\nvar steveX=200;\nvar CreeperX=300;\nvar CreeperY=0;\nfunction preload() {\n    \/\/images\n    house=loadImage(\"https:\/\/i.imgur.com\/hAeVVrM.jpeg\");\n    exploasion=loadImage('https:\/\/i.imgur.com\/u0RA0C9.png');\n    glowing=loadImage('https:\/\/i.imgur.com\/wpqSTpR.png');\n    creeper=loadImage('https:\/\/i.imgur.com\/oXqwDBa.png');\n    damaged=loadImage('https:\/\/i.imgur.com\/27nSdZi.png');\n    swordright=loadImage('https:\/\/i.imgur.com\/UgtoVei.png');\n    run=loadImage('https:\/\/i.imgur.com\/3JwarD4.png');\n    walk=loadImage('https:\/\/i.imgur.com\/6adTjcs.png');\n    idle=loadImage('https:\/\/i.imgur.com\/bIFUPG3.png');\n    bird=loadImage('https:\/\/i.imgur.com\/Ttx4W2C.png');\n    \/\/sounds\n    walkingsound = loadSound('http:\/\/localhost:8000\/walkingsound.wav');\n    exploadsound = loadSound('http:\/\/localhost:8000\/exploadsound.wav');\n    hurt = loadSound('http:\/\/localhost:8000\/hurt.wav');\n    dooropen = loadSound('http:\/\/localhost:8000\/dooropen.wav');\n    morningbirds = loadSound('http:\/\/localhost:8000\/morningbirds.wav');\n}\n\n\nfunction setup() {\n    \/\/ you can change the next 2 lines:\n    createCanvas(500, 400);\n    \/\/======== call the following to use sound =========\n    useSound();\n    frameRate(1);\n    steve[0]=idle;\n    steve[1]=walk;\n    steve[2]=run;\n    steve[3]=swordright;\n    steve[4]=damaged;\n    \/\/attribute sounds\n    creeperMovement[0]=creeper;\n    creeperMovement[1]=glowing;\n    creeperMovement[2]=exploasion;\n}\n\n\nfunction soundSetup() { \/\/ setup for audio generation\n    \/\/ you can replace any of this with your own audio code:\n    morningbirds.setVolume(0.3);\n    dooropen.setVolume(0.3);\n    hurt.setVolume(0.3);\n    exploadsound.setVolume(0.3);\n    walkingsound.setVolume(0.3)\n}\n\n\nfunction draw() {\n    background('Cyan');\n    grassland();\n    tree(0,50);\n    frame += 1; \/\/track of frames  \n    \/\/print(\"Seconds = \" + frame);\n    \/\/end the canvas\n    if(frame == 28){\n        noLoop();\n    }\n    \/\/house\n    image(house, 250, 100, 200, 200);\n\n    steveMoving();\n\n    creeperMoving();\n\n    birdsmoving();\n\n    \/\/start the audio\n    if(frame == 4){\n        morningbirds.play();\/\/birds chats\n    }if(frame==9){\n        dooropen.play();\/\/door opens \n    }if(frame==11){\n        walkingsound.play();\/\/steve walks\n    }if(frame==20){\n        exploadsound.play();\/\/creeper exploads\n    }if(frame==24){\n        hurt.play();\/\/steve cries\n    }\n\n}\n\/\/build background grassland\nfunction grassland(){\n    push();\n    fill('lime');\n    noStroke();\n    rect(0,height\/2,width,height\/2);\n    pop();\n}\n\/\/build a tree\nfunction tree(x,y){\n    push();\n    fill('lime');\n    noStroke();\n    rect(x,y,100,100);\n    fill('brown')\n    rect(x+25,y+50,50,125);\n    pop();\n}\n\nfunction creeperMoving(){\/\/movement of creeper depend on framecount\n    var a=0;\n    if (frame &gt;= 0 & frame <=11){\n        image(creeperMovement[a],CreeperX,CreeperY,75,125);\n    }else if(frame &gt; 11 & frame <13){\n        CreeperX-=100;\n        CreeperY+=25;\n        image(creeperMovement[a],CreeperX,CreeperY,75,125);\n    }else if(frame &gt;= 13 & frame <=15){\n        CreeperX-=25;\n        CreeperY+=50;\n        image(creeperMovement[a],CreeperX,CreeperY,75,125);\n    }else if(frame &gt;= 16 & frame <=20){\n        a=1;\n        CreeperX-=3;\n        CreeperY+=3;\n        image(creeperMovement[a],CreeperX,CreeperY,75,125);\n    }else if(frame &gt; 20 & frame <=21){\n        a=1;\n        image(creeperMovement[a],CreeperX,CreeperY,75,125);\n    }else if(frame &gt;= 22 & frame <26){\n        a=2;\n        b=50;\n        image(creeperMovement[a],CreeperX-b,CreeperY-b,75+b,125+b);\/\/explosion\n    }\n}\n\nfunction steveMoving(){\n    var a=0;\n    if(frame==9 ){\n        image(steve[a],steveX,200,75,125);\/\/movement of steve depend on framecount\n    }else if(frame&gt;9 & frame<=11){\n        steveX -= 10;\n        a=1;\n        image(steve[a],steveX,200,75,125);\n    }else if(frame&gt;11 & frame<16){\n        a = 2;\n        steveX -=25;\n        if(frame==13){\n            steveX -=25;\n        }else if(frame==15){\n            steveX -=50;\n        }\n        image(steve[a],steveX,200,75,125);\n    }else if((frame&gt;=16 & frame<20)){\n        a = 0;\n        image(steve[a],steveX,200,75,125);\n    }else if(frame&gt;=20 & frame <=22){\n        a = 3;\n        image(steve[a],steveX,200,75,125);\n    }else if(frame &gt;=22 & frame<= 25){ \/\/steve hurt by the explosion\n        a=4;\n        image(steve[a],steveX,200,75,125);\n    }else if(frame == 26){\n        a=4;\n        image(steve[a],steveX,200+50,75,125);\n    }else if(frame == 27){\n        a=4;\n        image(steve[a],steveX,200+100,75,125);\n    }\n}\n\nfunction birdsmoving(){\n    if(frame&gt;=4 & frame <=11){\/\/birds scared off by steve\n        image(bird,0,50,50,50);\n    }\n}<\/code><\/pre><\/div>\n\n\n\n<p><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>Story: One beautiful morning Steve heard there&rsquo;s birds singing outside, so he went out to check for the birds that hides in the tree. He didn&rsquo;t notice there is a creeper on top of his house, and the creeper follows Steve to the tree. The Steve realized creeper is behind him, but it&rsquo;s too late &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/11\/13\/a-day-of-steve\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;A Day of Steve&#8221;<\/span><\/a><\/p>\n","protected":false},"author":710,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[113,55],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/75674"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/users\/710"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=75674"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/75674\/revisions"}],"predecessor-version":[{"id":75680,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/75674\/revisions\/75680"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=75674"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=75674"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=75674"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}