Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Spin-off of "Project: Magic 8-Ball"
ID	5838974732500992
Created	7 years ago, 1525337047782
Updated	7 years ago, 1527424202146
Code	/* To view the fog effect by itself, please refer to this project: https://www.khanacademy.org/computer-programming/fog-test/5150287078129664 / background(58,0,0); var xMid=200; var yMid=206; var xShd=200; var yShd=200; var xFog=200; var yFog=162; var instructOpa=150; var instructY=23; var yHover=0; var opa1=0; var opa2=-5; var opa3=-10; var opa4=-12; var opaText=-8; var endOpa=12; var scryChk=0; var scryText,scryNum,scryRand; //background graphics { var rectGrad=function(rectPos,rectLen){ for (var j=0; j<rectLen+1; j+=0.1){ noStroke(); fill(0,0,0,17-(255/rectLen)j); rect(rectPos,0,j/0.1+j,270); } }; var curtainGrad=function(opaK,startX,width){ for (var k=0; k<161; k+=0.1){ noStroke(); fill(0,0,0,opaK-(255/160)k); rect(startX,0,width,k/0.1+k); } }; //back curtains noStroke(); fill(0,0,0,50); rect(141,0,259,270); rectGrad(141,137); rectGrad(163,57); rectGrad(218,39); rectGrad(254,39); rectGrad(291,39); rectGrad(323,39); rectGrad(354,39); rectGrad(379,21); fill(35,0,0,205); rect(210,0,9.5,270); rect(246,0,9.5,270); rect(281,0,9.5,270); rect(314,0,9.5,270); rect(345,0,9.5,270); rect(369,0,9.5,270); fill(16,0,0,205); triangle(240,0,256,0,256,270); triangle(276,0,294,0,294,270); triangle(308,0,325,0,325,270); triangle(342,0,355,0,355,270); triangle(363,0,380,0,380,270); curtainGrad(15,140,260); //front curtains fill(0,0,0,90); bezier(146,253,184,244,282,152,286,-6); fill(70,0,0); triangle(0,0,261,0,0,327); bezier(0,323,100,320,260,200,260,0); stroke(25,0,0); strokeWeight(2); fill(35,0,0); bezier(20,321,120,319,279,180,281,-49); noStroke(); fill(92,0,0,77); bezier(-5,322,92,318,251,178,251,-49); bezier(-4.7,322,91,318,243,179,246,-49); fill(42,0,0,146); strokeWeight(1); stroke(92,0,0); bezier(-13,322,72,318,216,180,216,-49); fill(84,0,0,146); noStroke(); bezier(-18,322,64,318,210,205,199,-40); fill(42,0,0,146); strokeWeight(1); stroke(118,0,0); bezier(-25,310,70,310,178,190,171,-61); fill(80,0,0,146); stroke(70,0,0); bezier(-37,308,80,309,165,190,160,-63); fill(42,0,0,146); strokeWeight(4); stroke(92,0,0); bezier(-2,307,58,288,110,170,117,-63); noStroke(); fill(58,0,0,146); quad(60,124,69,0,111,0,109,31); fill(84,0,0,146); stroke(58,0,0); strokeWeight(1); bezier(0,300,38,282,68,170,71,-64); fill(58,0,0); stroke(92,0,0); bezier(0,305,24,288,44,174,46,-59); fill(42,0,0); //shading and highlighting noStroke(); triangle(0,308,0,0,26,0); bezier(0,308,13,289,24,176,26,-56); noFill(); strokeWeight(1.3); stroke(118,0,0); bezier(4,311,57,292,109,133,115,0); fill(40,0,0,205); noStroke(); //mechatrilobite-2018 triangle(46,0,59,0,38,106); triangle(25,0,42,0,24,115); triangle(67,259,114,211,76,265); triangle(103,248,138,215,110,249); fill(30,0,0,64); arc(205,0,80,118,0,95); arc(166,0,106,133,0,92); arc(16,0,93,81,0,95); arc(71,0,102,231,0,93); arc(112,0,107,165,0,91); arc(24,0,93,333,0,94); fill(35,0,0,150); triangle(150,0,168,0,151,88); triangle(189,0,207,0,195,54); triangle(232,0,250,0,238,51); triangle(60,0,89,0,60,117); fill(84,0,0,102); triangle(116,0,138,0,111,66); curtainGrad(10,0,277); //table noStroke(); fill(24,9,29); rect(0,270,400,134); arc(200,284,420,85,180,360); fill(18,7,23); triangle(0,376,47,400,0,400); triangle(337,400,400,380,400,400); //cushion noStroke(); fill(12,5,15,153); //shadows arc(114,338,135,30,31,220); arc(202,348,252,53,-7,198); arc(298,340,135,30,-133,189); arc(193,361,147,58,-8,198); fill(0,21,62); //underside arc(131,280,207,119,21,163); arc(201,318,180,119,94,166); arc(256,298,233,101,4,118); arc(188,318,175,120,-34,85); arc(208,314,218,106,3,138); arc(181,307,218,106,54,180); fill(0,23,70); //top arc(132,308,203,110,191,376); arc(263,316,224,118,188,347); stroke(0,41,122,38); strokeWeight(2); arc(218,291,200,122,217,269); arc(203,290,167,122,280,349); fill(0,9,26,87); noStroke(); arc(164,282,90,63,228,360); arc(239,281,112,62,189,341); fill(0,23,70); stroke(0,41,122,38); arc(142,282,124,60,231,360); arc(265,285,125,58,180,317); fill(0,9,26,87); noStroke(); arc(209,297,165,62,184,358); fill(0,23,70); arc(201,325,238,102,209,342); triangle(126,306,300,310,196,349); fill(0,9,26,51); //shading quad(171,255,192,264,203,273,191,274); quad(219,264,240,259,215,274,206,273); fill(0,18,54); bezier(34,300,47,326,101,340,115,337); bezier(83,313,81,346,124,355,138,352); bezier(113,314,107,355,166,378,197,377); bezier(288,345,302,349,365,332,372,306); bezier(236,364,248,368,325,348,301,322); fill(0,21,62); bezier(114,310,123,355,181,375,196,375); bezier(240,356,251,355,295,350,301,319); fill(0,18,54); bezier(191,377,222,375,259,371,258,330); triangle(301,327,320,338,298,342); fill(0,21,62); bezier(194,374,203,375,240,372,258,328); noFill(); //trimming stroke(0,18,54); bezier(36,300,65,308,99,309,120,308); bezier(120,308,163,318,161,342,196,350); bezier(196,350,241,346,262,313,286,314); bezier(286,314,323,318,360,297,371,302); stroke(80,61,0); bezier(33,297,65,306,99,307,120,306); bezier(120,306,163,316,161,340,196,348); bezier(196,348,241,344,262,311,286,312); bezier(286,312,323,316,360,295,371,300); } var backdrop=get(0,0,400,400); //converts the backdrop into an image var gradCircle=function(xPos,yPos,opacity){ for(var i=3; i>0; i-=0.1){ noStroke(); fill(255,255,255,opacity-i3); ellipse(xPos,yPos,25i,25i); } { //mechatrilobite-2018 } }; //generates semi-transparent circles var fogGen=function(){ gradCircle(xFog+10,yFog-10,opa1); gradCircle(xFog-9,yFog+10,opa1); gradCircle(xFog-15,yFog-22,opa1); gradCircle(xFog-56,yFog,opa2); gradCircle(xFog+1,yFog-46,opa2); gradCircle(xFog+6,yFog+34,opa2); gradCircle(xFog-44,yFog+7,opa2); gradCircle(xFog+32,yFog+3,opa3); gradCircle(xFog-25,yFog+23,opa3); gradCircle(xFog-12,yFog+56,opa3); gradCircle(xFog+28,yFog+26,opa3); gradCircle(xFog-21,yFog+43,opa3); gradCircle(xFog+15,yFog-63,opa3); gradCircle(xFog+28,yFog-36,opa3); gradCircle(xFog+56,yFog-24,opa3); //mechatrilobite-2018 gradCircle(xFog+62,yFog+22,opa4); gradCircle(xFog-28,yFog-51,opa4); gradCircle(xFog+27,yFog+57,opa4); gradCircle(xFog-49,yFog-36,opa4); gradCircle(xFog-54,yFog+42,opa4); }; //draws the fog var scryFunc=function(){ if (scryChk===0) { scryNum=floor(random(1,21)); scryRand=round(random(1,999)); scryChk=1; }else if(scryNum===1){ scryText="The coming season\nbrings fortune."; }else if(scryNum===2){ scryText="An ill wind blows\nfrom the west."; }else if(scryNum===3){ scryText = "Avoid the\nblack dog."; }else if(scryNum===4){ scryText="The number "+scryRand+"\nis important."; }else if(scryNum===5){ scryText="A storm is\ncoming."; }else if(scryNum===6){ scryText="Keep a silver coin\nin your pocket."; }else if(scryNum===7){ scryText="Ask a favor\nfrom a woman\nin blue."; }else if(scryNum===8){ scryText="Make the wrong\ndecision for the\nright reasons."; }else if(scryNum===9){ scryText="Your heart already\nknows the answer."; }else if(scryNum===10){ scryText="The call shall\nsound only once."; //mechatrilobite-2018 }else if(scryNum===11){ scryText="Beware the\nsmiling man."; }else if(scryNum===12){ scryText="If it is\nuseless, throw it\noverboard."; }else if(scryNum===13){ scryText="Failure will be\nthe only option."; }else if(scryNum===14){ scryText="Red is lucky,\nbut beware of\nyellow..."; }else if(scryNum===15){ scryText="A small, green\ncreature will\npester you."; }else if(scryNum===16){ scryText="Fortune cookies\nare inferior."; }else if(scryNum===17){ scryText="Behind you."; }else if(scryNum===18){ scryText="I don’t know. I’m\njust a JavaScript\nprogram."; }else if(scryNum>=19&&scryNum<=21){ //more frequent outcome scryText="The future is\ntoo hazy. Refocus\nand try again."; } }; //determines the message displayed draw=function(){ image(backdrop,0,0); //shadow { fill(0,0,0,38); noStroke(); ellipse(xShd+8,yShd+79,154,23); ellipse(xShd+5,yShd+60,118,21); ellipse(xShd-39,yShd+67,96,16); ellipse(xShd+52,yShd+67,90,16); } //far hemisphere { noFill(); strokeWeight(8); stroke(255,255,255,38); ellipse(xMid,yMid-41,196,196); strokeWeight(1); stroke(255,255,255,89); ellipse(xMid,yMid-41,200,200); fill(24,8,34,56); noStroke(); beginShape(); vertex(xMid-5,yMid-133); bezierVertex(xMid-72,yMid-123,xMid-140,yMid+6,xMid-11,yMid+54); bezierVertex(xMid-60,yMid+2,xMid-47,yMid-89,xMid-5,yMid-133); endShape(); fill(11,4,16,56); beginShape(); vertex(xMid+2,yMid-131); bezierVertex(xMid-35,yMid-52,xMid-44,yMid-13,xMid,yMid+56); bezierVertex(xMid+23,yMid+37,xMid+67,yMid-39,xMid+2,yMid-131); endShape(); //mechatrilobite-2018 beginShape(); vertex(xMid+3,yMid-133); bezierVertex(xMid+86,yMid-49,xMid+53,yMid+17,xMid+14,yMid+55); bezierVertex(xMid+83,yMid+56,xMid+143,yMid-106,xMid+3,yMid-133); endShape(); fill(168,24,24,38); beginShape(); vertex(xMid-92, yMid-69); bezierVertex(xMid-88,yMid+34,xMid-7,yMid-201,xMid+84,yMid-77); bezierVertex(xMid+6,yMid-210,xMid-82,yMid-1,xMid-92,yMid-69); endShape(); fill(251,58,5,51); beginShape(); vertex(xMid-84,yMid-88); bezierVertex(xMid-97,yMid-9,xMid-18,yMid-166,xMid+50,yMid-120); bezierVertex(xMid-15,yMid-171,xMid-86,yMid-37,xMid-84,yMid-88); endShape(); beginShape(); vertex(xMid-67,yMid-112); bezierVertex(xMid-88,yMid-56,xMid-39,yMid-138,xMid+1,yMid-137); bezierVertex(xMid-43,yMid-146,xMid-69,yMid-76,xMid-67,yMid-112); endShape(); fill(0,41,122,51); beginShape(); vertex(xMid-79,yMid+12); bezierVertex(xMid-23,yMid+84,xMid+45,yMid+53,xMid+75,yMid+16); bezierVertex(xMid+66,yMid-13,xMid+11,yMid+100,xMid-79,yMid+12); endShape(); } textFont(createFont("serif"),19); textAlign(CENTER,CENTER); scryFunc(); fogGen(); //text fill(255,255,255,instructOpa); text("Focus your inner eye.",200,instructY); textSize(15); text("(hold the mouse button)",200,instructY+21); fill(39,20,54,opaText); textSize(19); text(scryText,xFog,yFog+5); //hover animation if(mouseIsPressed){ yHover=yHover; //stops hover when mouse is pressed }else if(yHover===200){ yHover=0; }else if(yHover>=100){ yMid+=0.05; yFog+=0.05; yShd-=0.05; yHover+=1; }else{ yMid-=0.05; yFog-=0.05; yShd+=0.05; yHover+=1; } //fog and text entrance/exit if(mouseIsPressed){ instructOpa-=2; //instructions leave instructY-=0.5; if(opa1<endOpa){ opa1+=0.1; opa2+=0.1; opa3+=0.1; opa4+=0.1; }else if(opa2<endOpa){ opa1=endOpa; opa2+=0.1; opa3+=0.1; opa4+=0.1; }else if(opa3<endOpa){ opa2=endOpa; opa3+=0.1; opa4+=0.1; }else if(opa4<endOpa){ opa3=endOpa; opa4+=0.1; opaText+=10; }else if(opa4===endOpa\|\|opaText<255){ opa4=endOpa; opaText+=10; }else if(opaText>=205){ opaText=205; } }else{ if(opaText===205\|\|opaText>120){ opaText-=1.5(opaText/10); opa1-=0.1; opa2-=0.1; opa3-=0.1; opa4-=0.1; }else if(opa1>0){ opa1-=0.1; opa2-=0.1; opa3-=0.1; opa4-=0.1; opaText=0; scryChk=0; }else if(opa2>-5){ opa1=0; opa2-=0.1; opa3-=0.1; opa4-=0.1; opaText=-5; }else if(opa3>-10){ opa2=-5; opa3-=0.1; opa4-=0.1; opaText=-10; }else if(opa4>-12){ opa3=-10; opa4-=0.1; opaText=-15; }else if(opa4===-12){ opa4=-12; opaText=-20; } } //near hemisphere { noStroke(); fill(255,255,255,18); beginShape(); vertex(xMid-95,yMid-34); bezierVertex(xMid-96,yMid-3,xMid-70,yMid+40,xMid-20,yMid+55); bezierVertex(xMid-39,yMid+44,xMid-50,yMid+23,xMid-58,yMid); bezierVertex(xMid-70,yMid-2,xMid-89,yMid-20,xMid-95,yMid-34); endShape(); beginShape(); vertex(xMid-34,yMid-132); bezierVertex(xMid-110,yMid-101,xMid-112,yMid+3,xMid-51,yMid+38); bezierVertex(xMid-110,yMid-12,xMid-81,yMid-104,xMid-34,yMid-132); endShape(); beginShape(); vertex(xMid-50,yMid+5); bezierVertex(xMid-43,yMid+21,xMid-31,yMid+48,xMid-8,yMid+55); bezierVertex(xMid+53,yMid+61,xMid+96,yMid+12,xMid+96,yMid-39); bezierVertex(xMid+66,yMid+20,xMid-22,yMid+22,xMid-50,yMid+5); endShape(); fill(255,255,255,51); beginShape(); vertex(xMid+27,yMid-131); bezierVertex(xMid+81,yMid-104,xMid+113,yMid-12,xMid+47,yMid+39); bezierVertex(xMid+114,yMid+3,xMid+112,yMid-100,xMid+27,yMid-131); endShape(); fill(255,255,255,26); beginShape(); vertex(xMid+12,yMid-134); bezierVertex(xMid+67,yMid-74,xMid+67,yMid+10,xMid+22,yMid+51); bezierVertex(xMid+118,yMid-4,xMid+72,yMid-104,xMid+12,yMid-134); endShape(); //mechatrilobite-2018 fill(255,255,255,35); beginShape(); vertex(xMid-10,yMid-133); bezierVertex(xMid-36,yMid-135,xMid-87,yMid-109,xMid-96,yMid-42); bezierVertex(xMid-88,yMid-25,xMid-66,yMid-10,xMid-58,yMid-7); bezierVertex(xMid-64,yMid-63,xMid-24,yMid-105,xMid-10,yMid-133); endShape(); } }; //default code / fill(0, 0, 0); ellipse(200, 200, 375, 375); fill(60, 0, 255); triangle(200, 104, 280, 280, 120, 280); fill(255, 255, 255); var answer = floor(random(1, 5)); if (answer > 0) { text("NOT YET", 176, 200); text("IMPLEMENTED", 159, 229); } */
Folds	26,219,222,231,233,257,259,303,305,503,506,517
Fork	true
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgKL2w9CvCgw
Votes	174
Spin-Offs	2
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	{"id":"2545987231","title":"Project: Magic 8-Ball","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	mechatrilobite
Author Name	mechatrilobite
Author ID	kaid_311370091145325053980717
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739449784997
Updated	10 months ago, 1739449792872
Source Deleted	unknown