Viewing Program

Program Data

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

Title	Thank You Steve Jobs
ID	5425509884231680
Created	11 years ago, 1392987505702
Updated	10 years ago, 1420651437967
Code	/** * iPad Squared * * Steve Jobs (1955-2011) * * We will always remember him * * Troy Cook * * * 2/26 added clock, app registering * 3/1 added calendar / / There is a real program called Project V-Day http://www.khanacademy.org/cs/project-v-day-spin-off/4725666140389376 There is a real program called Robot Rampage https://www.khanacademy.org/cs/robot-rampage-with-moving-enemies/1197497851 / var externals; var _; angleMode="degrees"; var fonts = { // sans serif font sans: createFont("sans serif",null), impact: createFont("impact",null), }; var time = function(){ var h = hour(); var ap = (h>11)?"PM":"AM"; h = (h%12===0)?12:h%12; return h+":"+((minute()<10)?"0":"")+minute()+" "+ap; }; // day of week var dayOfWeek = function(m,d,y){ // Uspensky and Heaslet algorithm var weekDays = [ {n:0,s:"Sun",l:"Sunday"}, {n:1,s:"Mon",l:"Monday"}, {n:2,s:"Tue",l:"Tuesday"}, {n:3,s:"Wed",l:"Wednesday"}, {n:4,s:"Thu",l:"Thursday"}, {n:5,s:"Fri",l:"Friday"}, {n:6,s:"Sat",l:"Saturday"}, ]; if (m<3){ y -= 1; m += 12; } m -= 2; var c = floor(y/100); var ye = y%100; var dow = (d+floor(2.6m-0.2)+ye+floor(ye/4)+floor(c/4)-2 * c)%7; dow += (dow<0)?7:0; return weekDays[dow]; }; var clock = function(){ // week days // array holding the days of the week starting with // Sunday at index 0 pushMatrix(); pushStyle(); // clock // draw ellipses by specifying it's center ellipseMode(CENTER); // draw shadow on wall noStroke(); fill(0, 0, 0, 40); ellipse(5,15,350,350); // white face stroke(56, 55, 55); fill(240, 237, 240); ellipse(0,0,300,300); // shadow on face strokeWeight(6); stroke(158, 156, 156); noFill(); ellipse(3,3,300,300); // grey case with slightly brighter outline stroke(209, 207, 207); strokeWeight(20); noFill(); ellipse(0,0,320,320); // little box around day of week and day of month noFill(); strokeWeight(1); stroke(128, 135, 135); rect(30,-10,70,20); // get today's date var m = month(); var d = day(); var y = year(); // get day of week (0-6) var dow = dayOfWeek(m,d,y).s; // draw day of week in the box textAlign(CENTER,CENTER); var fser = loadFont("serif",20); textFont(fser,16); fill(5, 5, 5); // if day of week is Sunday then color it red if (dow === "SUN"){ fill(199, 6, 6); } text(dow,50,0); // black background for day of month fill(3, 3, 3); rect(70,-8,28,16); // draw day of month fill(247, 244, 244); text(d,85,0); // face numbers fill(10, 10, 10); textSize(35); angleMode="degrees"; for (var n = 1; n <= 12; n++){ var a = n * 30 - 90; var x = cos(a) * 118; var y = sin(a) * 118; text(n,x,y); } // second marks pushMatrix(); noStroke(); for (var a = 0; a < 360; a += 6){ // set mark size to small var s = 2; // if the angle is evenly divisible by 30 then // make the mark larger if (a/30 === floor(a/30)){ s = 5; } ellipse(140,0,s,s); rotate(6); } popMatrix(); // calculate hour hand angle var ha = hour()30 + minute()/2 + second()/120 -90; pushMatrix(); translate(2,3); // rotate the hand rotate(ha); // draw hand stroke(0, 0, 0, 50); strokeWeight(6); line(0,0,70,0); popMatrix(); pushMatrix(); // rotate the hand rotate(ha); // draw hand stroke(8, 8, 8); strokeWeight(6); line(0,0,70,0); popMatrix(); // calculate minute hand angle var ma = minute()6+second()/10 -90; pushMatrix(); //rotate the hand translate(3,4); rotate(ma); // draw hand stroke(0,0,0,50); strokeWeight(6); line(0,0,100,0); popMatrix(); pushMatrix(); //rotate the hand rotate(ma); // draw hand stroke(8,8,8); strokeWeight(6); line(0,0,100,0); popMatrix(); // calculate second hand angle var sa = second()6 - 90; pushMatrix(); // move center down and to the right translate(4,5); //rotate the hand rotate(sa); // draw hand stroke(0,0,0,50); strokeWeight(3); line(0,0,110,0); popMatrix(); pushMatrix(); //rotate the hand rotate(sa); // draw hand stroke(8, 8, 8); strokeWeight(3); line(0,0,110,0); popMatrix(); // draw center cap noStroke(); fill(0,0,0,50); ellipse(4,5,20,20); fill(0, 0, 0); ellipse(0,0,20,20); popMatrix(); popStyle(); }; var ellipseGrad = function(x,y,w,h,r,cb,cc,ce){ // x,y center coordinates // w,h width / height // r rotational angle // cb color begin // cc center color [optional] // ce color end if (typeof ce === "undefined"){ ce = cc; cc = lerpColor(cb,ce,0.5); } pushMatrix(); pushStyle(); translate(x,y); if (r>0){ rotate(r); } var p = w/h; var sw = ((abs(r%90)===0)?1:0.4); strokeWeight(2); var mc = 0; for (var i = 0; i<=h; i ++){ var my = i - h/2; var s = p sqrt(i(h-i)); var mx = -s; if (i<h/2){ mc = lerpColor(cb,cc,i/(h/2)); } else { mc = lerpColor(cc,ce,(i-h/2)/(h/2)); } stroke(mc); line(mx,my,mx+2s,my); } popStyle(); popMatrix(); }; var rectGrad = function(x,y,w,h,r,cb,cc,ce){ // x,y center coordinates // w,h width / height // r rotational angle // cb color begin // cc center color [optional] // ce color end if (typeof ce === "undefined"){ ce = cc; cc = lerpColor(cb,ce,0.5); } pushMatrix(); pushStyle(); translate(x,y); if (r!==0){ rotate(r); } var p = w/h; var sw = ((abs(r%90)===0)?1:0.4); strokeWeight(2); var mc = 0; var s = w; for (var i = 0; i<=h; i ++){ var my = i - h/2; var mx = -s/2; if (i<h/2){ mc = lerpColor(cb,cc,i/(h/2)); } else { mc = lerpColor(cc,ce,(i-h/2)/(h/2)); } stroke(mc); line(mx,my,mx+s,my); } popStyle(); popMatrix(); }; var drawiPad = function(){ background(255); rectMode(CORNER); // shadow stroke(0,0,0,80); strokeWeight(8); fill(0,0,0,100); rect(5,5,394,394,40); // iPad frame strokeWeight(2); stroke(221, 222, 224); fill(0); rect(4,4,392,392,40); // sky rectGrad(200,140,340,210,0,color(11, 44, 97),color(118, 153, 171),color(240, 209, 84)); // water rectGrad(200,290,340,100,0,color(71, 99, 130),color(57, 77, 82),color(11, 24, 46)); // land randomSeed(10); // forces land to have one shape var h = 20; noStroke(); fill(36, 34, 30); beginShape(); vertex(371,250); vertex(29,250); vertex(29,230); for (var x = 32; x<=370; x+= random(5,10)){ vertex(x,250-h); h += random(-4,5)+0.1; ellipseGrad(x,250+h,random(1,9),h2-random(10),0,color(20, 26, 86,70-h),color(246, 246, 183,2),color(251, 251, 111,30-h)); } vertex(371,250-h); endShape(); // launch rectGrad(200,350,340,20,0,color(59, 55, 66),color(75, 78, 79),color(51, 61, 57)); stroke(11, 24, 46); fill(11, 24, 46); triangle(30,340,30,360,50,340); triangle(350,340,370,340,370,360); // home button ellipseGrad(200,380,20,20,0,color(0, 0, 0),color(40, 40, 40),color(80,80,80)); noFill(); strokeWeight(2); stroke(125, 123, 125); rectMode(CENTER); rect(199,380,11,10,2); // mic ellipseGrad(200,20,20,5,0,color(0,0,0),color(80,80,80)); // front camera ellipseGrad(220,20,5,5,0,color(0,0,0),color(80,80,80)); // glare rectGrad(380,200,200,700,-15,color(255, 255, 255,92),color(255, 255, 255,1),color(1, 4, 184,21)); }; var cursorChange = function(c){ this.cursor(c); }; var App = function(t,c,i,p,x,y,w,h){ // coordinates are upper left this.x = x; this.y = y; // width/height on screen this.w = w; this.h = h; this.i = i; // image or function this.t = t; // text or function this.c = c; // color this.p = p; // program function this.draw = function() { pushMatrix(); pushStyle(); // draw relative to 400x400 with center origin translate(this.x,this.y); scale(this.w/400,this.h/400); rectMode(CENTER); imageMode(CENTER); // draw shadow noStroke(); fill(40,40,40,22); rect(0,100,400,400,30); rect(0,150,380,380,30); rect(0,200,360,360,30); // draw button background fill(this.c); rect(0,0,400,400,90); // draw button upper highlight stroke(60,60,60,34); strokeWeight(30); fill(255, 255, 255,88); rect(0,-100,400,200,90); pushMatrix(); pushStyle(); // invoke i if (this.i.width !== undefined){ image(this.i,0,0,320,320); } // invoke draw if (typeof this.i === "function") { this.i(); } popStyle(); popMatrix(); pushMatrix(); translate(0,200); // invoke text if (this.t !== undefined){ var t=this.t; if (typeof this.t === "function"){ t = this.t(); } textFont(fonts.sans,100); textAlign(CENTER,TOP); // draw text drop shadow fill(0); text(t,0-10,10); text(t,0,10); text(t,0+10,10); //text(t,x+1,y+h/2+3-1); //text(t,x-1,y+h/2+3-1); // draw foreground fill(255); text(t,0,0); } popMatrix(); // draw edge highlight strokeWeight(10); stroke(255, 255, 255, 170); rectMode(CENTER); noFill(); rect(0,0,380,380,70); popMatrix(); popStyle(); }; }; var calendar = function(){ pushMatrix(); pushStyle(); rectMode(CENTER); noStroke(); fill(150, 0, 0); rect(0,-110,400,180,80); fill(255); rect(0,30,400,200); rectGrad(0,-80,400,100,0,color(150,0,0),color(80,0,0)); var dow = dayOfWeek(month(),day(),year()).l; fill(255); textFont(fonts.sans,90); textAlign(CENTER,TOP); text(dow,0,-170); fill(0); textSize(200); text(day(),0,-30); popMatrix(); popStyle(); }; var apps = { arrange: function(x,y,ww,wh,iw){ x += 5; y += 5; var xs = (ww-10)/(floor(ww/(iw+10))); var ys = iw 1.65; var xp = xs/2; var yp = iw/2+10; for (var i in this.reg){ this.reg[i].x = x+xp; this.reg[i].y = y+yp; this.reg[i].w = iw; this.reg[i].h = iw; xp += xs; if (xp>ww){ xp = xs/2; yp += ys; } } }, draw: function(){ for (var i in this.reg){ this.reg[i].draw(); } }, mouseMoved: function(mx,my){ for (var i in this.reg){ var o = this.reg[i]; if (mx>=o.x-o.w/2 && mx<=o.x+o.w/2 && my>=o.y-o.h/2 && my<=o.y+o.h/2){ cursorChange(HAND); return; } } cursorChange(ARROW); }, reg:[ new App("Weather",color(0,102,255), getImage("creatures/Hopper-Cool")), new App("Khan\nAcademy",color(50,50,50), getImage("avatars/leaf-green")), new App("Piceratops",color(196, 135, 14), getImage("avatars/piceratops-sapling")), new App("Leafer",color(78, 156, 126), getImage("avatars/leafers-sapling")), new App("Orange\nSquid",color(39, 118, 140), getImage("avatars/orange-juice-squid")), new App("Help",color(194, 15, 84), getImage("creatures/OhNoes")), new App("Baby\nNames",color(119, 210, 217), getImage("creatures/BabyWinston")), new App("GemLock",color(129, 147, 227), getImage("cute/GemBlue")), new App("V-Day",color(215, 119, 217), getImage("space/healthheart")), new App("Planet\nWatch",color(20, 37, 222), getImage("space/planet")), new App("Space\nTrek",color(143, 87, 19), getImage("space/rocketship")), new App("Favorites",color(26, 5, 97), getImage("space/star")), new App("Ecology",color(25, 138, 10), getImage("cute/TreeTall")), new App("Locator",color(133, 64, 15), getImage("cute/Selector")), new App("Hidden\nTreasure",color(193, 199, 14), getImage("cute/ChestClosed")), new App("Character\nGenerator",color(20, 37, 222), getImage("cute/CharacterBoy")), new App("Robot\nRampage",color(93, 113, 133), getImage("avatars/robot_male_3")), new App("Math\nBlaster",color(56, 6, 122), getImage("avatars/purple-pi")), new App(function(){ return time();},color(138, 107, 45), function(){ clock();}), new App("Calendar",color(255), function(){ calendar();}), ], }; apps.arrange(30,30,340,340,40); var bg = 0; draw = function() { if (bg === 0){ drawiPad(); bg = get(0,0,400,400); return; } image(bg,200,200); apps.draw(); }; mouseOver = function(){ cursorChange(ARROW); }; mouseMoved = function(){ apps.mouseMoved(mouseX,mouseY); }; mouseClicked = function(){ };
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgICrj8_RCQw
Votes	308
Spin-Offs	9
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	{"id":"5288323528523776","title":"THANK YOU KA","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Troy Cook
Author Name	onetruetroy
Author ID	kaid_1050040908180717789041673
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739381872675
Updated	8 months ago, 1744844841530
Source Deleted	unknown