Viewing Program

Program Data

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

Title	Tablet Simulation
ID	6253489841258496
Created	5 years ago, 1581358477367
Updated	1 years ago, 1710216913200
Code	/ Tablet 8 fully functional apps, including 2 games, a paint program, and a fireworks simulation! Enjoy! 1000 Kelvin??? Wow thanks everyone! My second one! @Credits padZero() function, taken from: https://www.khanacademy.org/computer-programming/hour/5806957302644736 All other code written by Mushy Avocado, @MushyAvocado. @Info Started: 2/3/2020 Completed: 2/8/2020 2600+ lines of code. / //start of code //scene var scene = "Off"; //thumbnail var thumbnail = ""; //unlock var unlock = 0; var unlocking = false; var sleepTimer = 0; var sleepTime = 1200; var turnedOn = false; var pluggedIn = false; var khanImg = null; //stopwatch var stopwatch = false; var swTimer = 0; //theme var theme = { light: color(255), detail: color(131, 231, 242), dark: color(183), veryDark: color(112), }; //display var screenBright = 100; var blueShade = !true; var tapSounds = false; //home image var homeImg = false; //volume var volume = 50; var volumeTimer = 0; //apps var apps = []; //forecasts var forecasts = [ { fill: color(0, 145, 255), name: "Sunny", low: 67, high: 74, symbol: function() { fill(255, 162, 0); noStroke(); ellipse(0, 0, 70, 70); } }, { fill: color(107, 193, 255), name: "Partly Sunny", low: 62, high: 71, symbol: function() { fill(255, 162, 0); noStroke(); ellipse(0, 0, 70, 70); fill(255); ellipse(-30, 20, 75, 50); ellipse(10, 15, 60, 40); } }, { fill: color(171, 220, 255), name: "Partly Cloudy", low: 58, high: 65, symbol: function() { fill(255, 162, 0); noStroke(); ellipse(0, 0, 70, 70); fill(255); ellipse(-30, 20, 75, 50); ellipse(10, 15, 60, 40); ellipse(25, 0, 40, 25); } }, { fill: color(186, 227, 255), name: "Snowy", low: 28, high: 34, symbol: function() { noStroke(); fill(255); ellipse(-30, 15, 75, 50); ellipse(10, 10, 60, 40); ellipse(5, -10, 50, 25); fill(96, 142, 222); translate(20, 30); stroke(126, 206, 222); strokeWeight(1.5); for(var i = 0; i < 5; i++) { var posX = cos(i * (360 / 5)); var posY = sin(i * (360 / 5)); line(posX * 13, posY * 13, posX * -13, posY * -13); posX = cos(i * (360 / 5) - 360 / 20) * 10; posY = sin(i * (360 / 5) - 360 / 20) * 10; var pos2x = cos(i * (360 / 5) + 360 / 20) * 10; var pos2y = sin(i * (360 / 5) + 360 / 20) * 10; line(posX, posY, pos2x, pos2y); } } }, { fill: color(119, 163, 194), name: "Rainy", low: 38, high: 51, symbol: function() { noStroke(); fill(255); ellipse(-30, 15, 75, 50); ellipse(10, 10, 60, 40); ellipse(5, -10, 50, 25); fill(96, 142, 222); beginShape(); vertex(15, 5); bezierVertex(-15, 50, 45, 50, 15, 5); endShape(); } }, { fill: color(169, 195, 214), name: "Cloudy", low: 47, high: 62, symbol: function() { noStroke(); fill(255); ellipse(-30, 20, 75, 50); ellipse(10, 15, 60, 40); ellipse(5, -5, 50, 25); } }, ]; var forecast = ~~random(0, forecasts.length - 1); //power var power = 51; //lock image var lockImgs = []; var lockImg = 7; var viewImg = 0; //create lock images /* lockImgs.push(getImage("")); / lockImgs.push(getImage("animals/butterfly_monarch")); lockImgs.push(getImage("animals/retriever")); lockImgs.push(getImage("animals/horse")); lockImgs.push(getImage("animals/penguins")); lockImgs.push(getImage("animals/fox")); lockImgs.push(getImage("animals/cheetah")); lockImgs.push(getImage("landscapes/waterfall_niagara-falls")); lockImgs.push(getImage("landscapes/beach-in-hawaii")); lockImgs.push(getImage("landscapes/mountain_matterhorn")); lockImgs.push(getImage("food/fruits")); lockImgs.push(getImage("food/strawberries")); //fonts var font = { title: createFont("Mushy Custom Extra Bold"), text: createFont("monospace"), label: createFont("cursive"), }; //pad zero function, taken from: https://www.khanacademy.org/computer-programming/hour/5806957302644736 var padZero = function(num, numZeros) { var numDigits = numZeros \|\| 2; var n = abs(num); var zeros = max(0, numDigits - floor(n).toString().length ); var zeroString = pow(10, zeros).toString().substr(1); return zeroString + n; }; //time var time = { hour: hour(), minute: minute(), second: second(), }; //date var date = { day: day(), month: month(), year: year(), }; //symbols var symbols = { //settings settings: function(x, y, size, rot, col) { //border var hover = false; pushMatrix(); //position translate(x, y); scale( !hover ? size: size 1.2 ); rotate(rot); //cursor if(hover) { cursor(HAND); } //body strokeWeight(8); stroke(col); noFill(); ellipse(0, 0, 30, 30); //detail ring strokeWeight(3); stroke(lerpColor(col, color(255), 0.4)); noFill(); ellipse(0, 0, 25, 25); //teeth noStroke(); fill(col); pushMatrix(); for(var i = 0; i < 360 / 40; i++) { rotate(40); rect(13, -5, 9, 8); } popMatrix(); popMatrix(); }, //main menu mainMenu: function(x, y, size, col, col2) { size -= 0.3; //borders var hover = false; pushMatrix(); if(hover) { x = x - ((50 * 1.2) - 50) / 2; y = y - ((50 * 1.2) - 50) / 2; } //position translate(x, y); scale( !hover ? size: size * 1.2); //cursor if(hover) { cursor(HAND); } //body fill(col2); noStroke(); rect(-3, -3, 56, 56, 3); //long lines fill(col); noStroke(); for(var i = 0; i < 3; i++) { rect(20, i * 15 + 6.5, 25, 7, 1); } //squares fill(col); noStroke(); for(var i = 0; i < 3; i++) { rect(6, i * 15 + 6.5, 9, 7, 1); } popMatrix(); }, //sound sound: function(x, y, size, amount, col) { //border var hover = false; pushMatrix(); //position translate(x, y); scale( !hover ? size: size * 1.2); //cursor if(hover) { cursor(HAND); } //forget labels for this one. What am I supposed to call the different parts, lol fill(col); noStroke(); ellipse(-5, 0, 20, 20); triangle(-10, 0, 10, -20, 10, 20); arc(12, 0, 20, 20, -90, 90); for(var i = 0; i < min(amount, 3); i++) { noFill(); strokeWeight(2); stroke(col); strokeCap(SQUARE); arc(22 + i * 6, 0, 15, i * 5 + 20, -70 - i * 13, 70 + i * 13); } if(amount === 0) { strokeWeight(3); stroke(col); line(-20, -20, 20, 20); line(-20, 20, 20, -20); } popMatrix(); }, //wifi wifi: function(x, y, size, amount, col) { //border var hover = false; pushMatrix(); //postion translate(x, y); scale( !hover ? size: size * 1.3 ); //cursor if(hover) { cursor(HAND); } //rings for(var i = 0; i < 4; i++) { strokeWeight(5); noFill(); stroke(lerpColor(col, color(255), 0.5)); if(amount > i) { stroke(col); } if(i !== 0) { arc(0, 10 + i * -7, 10 + i * 10, 10 + i * 5, 200, 340); } else { strokeWeight(8); point(0, 7); } } popMatrix(); }, }; //time and date as a string var currTime; var currDate; var subPage = "https://khanacademy.org/cs/i/5889323124883456", author = "Mushy Avocado"; //app object var App = function(config) { this.label = config.label \|\| "Untitled"; this.dest = config.dest \|\| "home"; this.size = 40; this.display = config.display; this.collide = function(x, y) { return mouseX > x && mouseX < x + this.size && mouseY > y && mouseY < y + this.size; }; }; //create apps apps.push(new App( { label: "Weather", dest: "Weather", display: function(x, y) { pushMatrix(); translate(x + 3, y); scale(0.3); forecasts[1].symbol(); popMatrix(); }, } )); apps.push(new App( { label: "Clock", dest: "Clock", display: function(x, y) { fill(0); noStroke(); ellipse(x, y, 30, 30); fill(240); ellipse(x, y, 25, 25); for(var i = 0; i < 12; i++) { var posX = cos(i * (360 / 12)) * 10; var posY = sin(i * (360 / 12)) * 10; strokeWeight(1); stroke(theme.dark); line(x + posX, y + posY, x + (posX * 0.8), y + (posY * 0.8)); } stroke(0); strokeWeight(1.5); line(x, y - 10, x, y); line(x + 5, y + 5, x, y); }, } )); apps.push(new App( { label: "Flappy Flap", dest: "Flappy", display: function(x, y) { fill(64, 195, 255); noStroke(); ellipse(x, y, 30, 30); fill(255, 196, 0); noStroke(); var sized = 20; pushMatrix(); translate(x, y); scale(1); ellipse(0, 0, sized, sized * 0.75); triangle(-sized * 0.75 / 2, -3, -sized * 0.75 / 2, 6, -sized * 1.25 / 2, -4); fill(196, 156, 24); noStroke(); arc(-5, 0, sized * 0.5, 2, 0, 180); fill(240); ellipse(5, -2, 4, 4); fill(0); ellipse(5, -1, 2, 2); fill(255, 225, 0); triangle(sized / 2 - 3, -3, sized / 2 - 3, 3, sized / 2 + 5, 0); popMatrix(); }, } )); apps.push(new App( { label: "Paint", dest: "Paint", display: function(x, y) { pushMatrix(); translate(x - 7, y + 7); rotate(-45); fill(143, 109, 73); noStroke(); quad(-10, 2, -10, -2, 10, -4, 10, 4); fill(196, 154, 120); noStroke(); beginShape(); vertex(30, 0); bezierVertex(2, -20, 2, 20, 30, 0); endShape(); fill(222, 0, 0); triangle(30, 0, 22, -5, 22, 5); popMatrix(); }, } )); apps.push(new App( { label: "Khan Academy", dest: "Khan", display: function(x, y) { fill(104, 204, 152); noStroke(); beginShape(); for(var i = 0; i < 6; i++) { var posX = cos(i * 60 + 30) * 15; var posY = sin(i * 60 + 30) * 15; vertex(x + posX, y + posY); } endShape(); fill(232, 232, 232); noStroke(); beginShape(); vertex(x, y + 10); bezierVertex(x - 2, y, x - 2, y - 3, x - 12, y - 2); endShape(); beginShape(); vertex(x, y + 10); bezierVertex(x + 2, y, x + 2, y - 3, x + 12, y - 2); endShape(); ellipse(x, y - 5, 5, 5); }, } )); apps.push(new App( { label: "Settings", dest: "Settings", display: function(x, y) { symbols.settings(x, y, 0.7, 0, color(255, 82, 82)); }, } )); apps.push(new App( { label: "Fire Works", dest: "Works", display: function(x, y) { noStroke(); fill(40); ellipse(x, y, 35, 35); strokeWeight(1.5); stroke(209, 0, 143); for(var i = 0; i < 15; i++) { var posX = cos(i * (360 / 15)) * 13; var posY = sin(i * (360 / 15)) * 13; line(x, y, x + posX, y + posY); } }, } )); apps.push(new App( { label: "Click Infinity", dest: "Clicker", display: function(x, y) { pushMatrix(); translate(x, y); scale(1); fill(78, 139, 237); noStroke(); triangle(-5, -15, 10, 5, -10, 10); rotate(-14); rect(-6.5, 5, 10, 10, 3); popMatrix(); }, } )); //collision with mouse var mouseInside = function(x, y, w, h) { return mouseX > x && mouseX < x + w && mouseY > y && mouseY < y + h; }; //cover (replaces background) var cover = function(fillCol) { noStroke(); fill(fillCol); rect(150, 100, 300, 200); }; //clicker game var clicker = { clicks: 0, cps: 1, cpc: 1, moneys: [], items: [ {name: "Clicks per sec", price: 60, func: function() { return function(that) { that.cps++; }; }, }, {name: "Clicks per click", price: 120, func: function() { return function(that) { that.cpc++; }; }, }, ], Money: function(x, y) { this.x = x; this.y = y; this.destX = 200; this.destY = 200; this.fill = lerpColor(color(78, 139, 237), color(0), random(-0.05, 0.05)); this.size = random(5, 12); this.speed = 0.05 + random(-0.02, 0.02); this.run = function() { this.x = lerp(this.x, this.destX, this.speed); this.y = lerp(this.y, this.destY, this.speed); noStroke(); fill(this.fill); ellipse(this.x, this.y, this.size, this.size); }; this.arrived = function() { return dist(this.x, this.y, this.destX, this.destY) < 5; }; }, run: function() { cover(theme.veryDark); for(var i = this.moneys.length - 1; i >= 0; i--) { var m = this.moneys[i]; m.run(); if(m.arrived()) { this.moneys.splice(i, 1); this.clicks++; } } fill(78, 139, 237); noStroke(); ellipse(200, 200, 30 + min(this.clicks / 10, 50), 30 + min(this.clicks / 10, 50)); if(dist(mouseX, mouseY, 300, 200) < 50 && mouseIsPressed && mouseButton === LEFT) { fill(68, 117, 189); ellipse(300, 200, 95, 95); } else { ellipse(300, 200, 100, 100); } if(dist(mouseX, mouseY, 300, 200) < 50) { cursor(HAND); } fill(127, 182, 255); textFont(font.label, 20); textAlign(CENTER, CENTER); text("Click me!", 300, 200); text(this.clicks, 200, 200); if(frameCount % 60 === 3) { for(var i = 0; i < this.cps; i++) { this.moneys.push(new this.Money(300 + random(-30, 30), 200 + random(-30, 30))); } } for(var i = 0; i < this.items.length; i++) { var s = this.items[i]; fill(78, 139, 237); noStroke(); if(mouseInside(360, 160 + i * 50, 80, 30)) { cursor(HAND); fill(68, 117, 189); } rect(360, 160 + i * 50, 80, 30, 2); fill(127, 182, 255); textFont(font.label, 10); textAlign(CENTER, CENTER); text(s.name + "\n$" + s.price, 360 + 40, 160 + i * 50 + 15); } }, whenClicked: function() { if(dist(mouseX, mouseY, 300, 200) < 50 && mouseButton === LEFT) { for(var i = 0; i < this.cpc; i++) { this.moneys.push(new this.Money(300 + random(-30, 30), 200 + random(-30, 30))); } } for(var i = 0; i < this.items.length; i++) { var s = this.items[i]; if(mouseInside(360, 160 + i * 50, 80, 30) && this.clicks >= s.price) { if(s.name.toLowerCase() === "clicks per sec") { this.cps++; } if(s.name.toLowerCase() === "clicks per click") { this.cpc++; } this.clicks -= s.price; s.price += 10; } } }, }; //flappy game var flappy = { again: true, ground: 0, groundScroll: 0, groundScroll2: 450, score: 0, hiScore: 0, clickTimer: 0, speed: 2, scene: "play", bird: { x: 200, y: 150, velY: 0, flapSize: 3, dead: false, lostImg: null, size: 20, display: function() { fill(255, 196, 0); noStroke(); ellipse(this.x, this.y, this.size, this.size * 0.75); triangle(this.x - this.size * 0.75 / 2, this.y - 3, this.x - this.size * 0.75 / 2, this.y + 6, this.x - this.size * 1.25 / 2, this.y + this.velY * -1 - 4); fill(196, 156, 24); noStroke(); arc(this.x - 5, this.y, this.size * 0.5, this.velY * -5 + 2, 0, 180); fill(240); ellipse(this.x + 5, this.y - 2, 4, 4); fill(0); ellipse(this.x + 5, this.y - 1 + constrain(this.velY, -0.5, 0.5), 2, 2); fill(255, 225, 0); triangle(this.x + this.size / 2 - 3, this.y - 3, this.x + this.size / 2 - 3, this.y + 3, this.x + this.size / 2 + 5, this.y); }, update: function() { this.velY += 0.15; this.y += this.velY; this.velY = min(this.velY, 4); if(this.y > 300 - 50 - this.size / 2) { this.dead = true; } if(this.y < this.size / 2 + 100) { this.velY = 0.1; this.y = this.size / 2 + 100; } }, collide: function(that) { return this.x + this.size / 2 > that.x - 5 && this.x - this.size / 2 < that.x + 60 + 5 && (this.y - this.size / 2 * 0.75 < that.y \|\| this.y + this.size / 2 * 0.75 > that.y + that.gapSize); }, }, pipes: [], Pipe: function(y, gapSize) { this.x = 500; this.y = y; this.gapSize = gapSize; this.display = function() { fill(104, 214, 98); noStroke(); rect(this.x, 0, 60, this.y); fill(87, 171, 80); rect(this.x + 5, 0, 10, this.y); fill(104, 214, 98); rect(this.x, this.y + this.gapSize, 60, 300); fill(87, 171, 80); rect(this.x + 5, this.y + this.gapSize, 10, 300); fill(94, 255, 82); rect(this.x - 5, this.y - 10, 70, 10, 3); rect(this.x - 5, this.y + this.gapSize, 70, 10, 3); }; this.update = function(me) { this.x -= me.speed; }; }, drawGround: function(depth) { fill(191, 138, 111); noStroke(); rect(150, 300 - depth, 300, depth); fill(100, 227, 104); rect(150, 300 - depth, 300, 10); for(var i = 0; i < 300 / 10; i++) { var x = 50 + i * 30; fill(12, 186, 0); quad(x, 300 - depth, x + 20, 300 - depth, x + 30, 300 - depth + 10, x + 10, 300 - depth + 10); } this.ground = get(150, 300 - depth, 300, depth); }, run: function() { textFont(font.label); switch(this.scene) { case "play": background(94, 201, 255); this.groundScroll -= 1.5; this.groundScroll2 -= 1.5; if(this.groundScroll < -300) { this.groundScroll = 300 - 10; } if(this.groundScroll2 < -150) { this.groundScroll2 = 290 + 150; } this.bird.update(); this.bird.display(); if(frameCount % 80 === 0) { this.pipes.push(new this.Pipe(random(125, 175), random(50, 75))); } for(var i = this.pipes.length - 1; i >= 0; i--) { var p = this.pipes[i]; p.update(this); p.display(); if(this.bird.collide(p)) { this.bird.dead = true; } if(abs(p.x - 100) <= 1.5) { this.score++; } } image(this.ground, 150 + this.groundScroll, 300 - 50); image(this.ground, this.groundScroll2, 300 - 50); if(this.bird.dead) { this.lostImg = get(150, 100, 300, 200); this.scene = "lost"; } this.speed += 0.001; fill(76, 125, 168); textAlign(RIGHT, TOP); textSize(12); text("Score: " + this.score + "\nHi score: " + this.hiScore, 450 - 10, 120); break; case "lost": if(this.hiScore < this.score) { this.hiScore = this.score; } image(this.lostImg, 150, 100); //tint cover(color(0, 50)); //you lost fill(0, 100); textAlign(CENTER, CENTER); textFont(font.label, 20); text("You lost with a\nscore of " + this.score, 300, 150); //retry fill(109, 211, 227); noStroke(); var hover = false; if(mouseInside(300 - 50, 200 - 10, 100, 30)) { cursor(HAND); fill(104, 192, 204); hover = true; } rect(300 - 50, 200 - 10, 100, 30, 3); fill(76, 125, 168); textAlign(CENTER, CENTER); textSize(18); if(hover) { textSize(20); } text("Retry?", 300, 205); this.clickTimer++; break; } }, whenClicked: function() { this.bird.velY = -this.bird.flapSize; if(mouseInside(300 - 50, 200 - 10, 100, 30) && this.scene === "lost" && this.clickTimer > 20) { this.bird.dead = false; this.bird.y = 150; this.bird.velY = 0; this.scene = "play"; this.pipes = []; this.speed = 2; this.score = 0; this.clickTimer = 0; } }, }; //fireworks var fireworks = { fireworks: [], Firework: function(x, targetY) { this.x = x; this.y = 350; this.targetX = x; this.targetY = targetY; this.speed = random(-3, -5); this.hue = random(0, 255); this.exploded = false; this.timer = 20; this.sparkles = []; this.display = function() { colorMode(HSB); for(var i = this.sparkles.length - 1; i >= 0; i--) { var s = this.sparkles[i]; stroke(s.fill); strokeWeight(s.size / 2); line(s.x, s.y, s.x + s.velX * 5, s.y + s.velY * 5); s.velX = 0.99; s.velY = 0.99; s.velY += 0.02; s.x += s.velX; s.y += s.velY; s.size -= 0.1; if(s.size <= 0) { this.sparkles.splice(i, 1); } } if(!this.exploded) { noStroke(); fill(color(this.hue, 255, 180 + random(-50, 50))); ellipse(this.x, this.y, 5, 5); this.sparkles.push( { x: this.x, y: this.y, fill: color(this.hue, 255, 180 + random(-50, 50)), size: random(2, 6), velX: random(-0.5, 0.5), velY: random(-0.25, 0.75), } ); if(dist(this.x, this.y, this.x, this.targetY) < 3) { this.exploded = true; } } else if(this.timer >= 0) { this.timer--; for(var i = 0; i < 8; i++) { this.sparkles.push( { x: this.x + random(-5, 5), y: this.y + random(-5, 5), fill: color(this.hue, 255, 180 + random(-50, 50)), size: random(2, 8), velX: random(-1.5, 1.5), velY: random(-1.5, 1.5), } ); } } colorMode(RGB); }; this.update = function() { if(!this.exploded) { this.y += this.speed; } }; }, run: function() { cover(color(25)); for(var i = this.fireworks.length - 1; i >= 0; i--) { var f = this.fireworks[i]; f.update(); f.display(); if(f.exploded && f.sparkles.length === 0) { this.fireworks.splice(i, 1); } } if(frameCount % 20 === 1) { this.fireworks.push(new this.Firework(random(200, 400), random(150, 200))); } }, whenClicked: function() { if(this.fireworks.length < 10) { this.fireworks.push(new this.Firework(mouseX, mouseY)); } }, }; flappy.drawGround(50); //paint var paint = { currFill: color(0), circles: [], Circle: function(x, y, x2, y2, fillCol) { this.x = x; this.y = y; this.x2 = x2; this.y2 = y2; this.size = 6; this.fill = fillCol; this.display = function() { strokeWeight(this.size); stroke(this.fill); line(this.x, this.y, this.x2, this.y2); }; }, fillButtons: [], FillButton: function(x, y, fillCol) { this.x = x; this.y = y; this.size = 20; this.fill = fillCol; this.display = function(that) { strokeWeight(2); stroke(255); fill(this.fill); if(this.collide() \|\| that.currFill === this.fill) { stroke(120); strokeWeight(3); if(this.collide()) { cursor(HAND); } } rect(this.x, this.y, this.size, this.size, 2); }; this.collide = function() { return mouseInside(this.x, this.y, this.size, this.size); }; }, init: function() { this.fillButtons.push(new this.FillButton(450 - 75 + 10, 120, color(0))); this.fillButtons.push(new this.FillButton(450 - 75 + 10, 145, color(240))); this.fillButtons.push(new this.FillButton(450 - 75 + 10, 170, color(250, 0, 29))); this.fillButtons.push(new this.FillButton(450 - 75 + 10, 195, color(0, 4, 255))); this.fillButtons.push(new this.FillButton(450 - 75 + 10, 220, color(3, 255, 11))); this.fillButtons.push(new this.FillButton(450 - 75 + 10, 245, color(242, 255, 0))); }, run: function() { cover(color(240)); for(var i = 0; i < this.circles.length; i++) { var c = this.circles[i]; c.display(); } //panel fill(32, 32, 46); noStroke(); rect(450 - 75, 100, 75, 300); for(var i = 0; i < this.fillButtons.length; i++) { var f = this.fillButtons[i]; f.display(this); } fill(145, 145, 145); strokeWeight(2); stroke(255); if(mouseInside(450 - 40, 120, 35, 20)) { strokeWeight(3); stroke(120); cursor(HAND); } rect(450 - 40, 120, 35, 20, 2); fill(255); textAlign(CENTER, CENTER); textFont(font.label, 10); text("New", 450 - 40 + 35 / 2, 130); if(mouseIsPressed) { this.whenDragged(); } }, whenDragged: function() { this.circles.push(new this.Circle(mouseX, mouseY, pmouseX, pmouseY, this.currFill)); }, whenClicked: function() { for(var i = 0; i < this.fillButtons.length; i++) { var f = this.fillButtons[i]; if(f.collide()) { this.currFill = f.fill; } } if(mouseInside(450 - 40, 120, 35, 20)) { this.circles.length = 0; this.currFill = this.fillButtons[0].fill; } }, }; paint.init(); //draw charger var drawCharger = function(fade, plugged) { //cord strokeWeight(6); stroke(245, fade); noFill(); if(plugged) { bezier(600, 200, 550, 200, 550, 280, 480, 280); } else { bezier(650, 200, 600, 200, 600, 200, 530, 200); } //pluggin fill(255, fade); noStroke(); if(plugged) { rect(450, 270, 40, 20, 2); } else { rect(500, 200 - 10, 40, 20, 2); fill(199, 199, 199); noStroke(); rect(500 - 7, 200 - 7, 7, 14, 1); } }; //draw power var drawPower = function(x, y, sized) { pushMatrix(); translate(x, y); scale(sized); fill(theme.light); noStroke(); rect(0, 0, 14, 6, 2); fill(0); rect(1, 1, 12, 4, 1); fill(theme.detail); if(power < 20) { fill(163, 0, 0); } rect(2, 2, 10 * (power / 100), 2, 0.5); translate(0, 0.5); fill(theme.light); rect(14, 1, 1, 3); textAlign(RIGHT, TOP); textFont(font.text, 8); fill(255); translate(0, 0.5); text(~~power + "%", -3, -2); popMatrix(); }; //update time var updateTime = function() { //time time.hour = hour(); time.minute = minute(); time.second = second(); //date date.day = day(); date.month = month(); date.year = year(); }; //draw volume bar var volumeBar = function(x, y, sized) { if(volumeTimer > 0) { pushMatrix(); translate(x, y); scale(sized); fill(theme.dark); noStroke(); rect(-75, 0, 159, 15, 3); fill(0); rect(-65, 5, 140, 5, 3); fill(theme.detail); ellipse(-65 + (volume / 100) * 140, 7, 10, 10); popMatrix(); } }; //tablet function var drawTablet = function(x, y) { //mask fill(0); noStroke(); rect(0, 0, x, 400); rect(0, 0, width, y); rect(width - 150, 0, 200, height); rect(0, height - 100, width, 200); if(sleepTimer > sleepTime * 0.75) { cover(color(0, constrain(sleepTimer - (sleepTime * 0.75), 0, 100))); } if(blueShade) { cover(color(255, 111, 0, 60)); } noStroke(); fill(0, (140 - screenBright * 2)); rect(150, 100, 300, 200); //body noFill(); stroke(255); strokeWeight(15); rect(x, y, 310, 210, 1); //power button noStroke(); fill(222, 222, 222); if( mouseIsPressed && mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 5 && mouseY < y + 5 + 20 ) { rect(x - 8, y + 5, 1, 20, 1); } else { rect(x - 10, y + 5, 3, 20, 3); } if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 5 && mouseY < y + 5 + 20 ) { cursor(HAND); } //volume button if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 130 && mouseY < y + 180 ) { cursor(HAND); } if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 130 && mouseY < y + 155 && mouseIsPressed ) { rect(x - 8, y + 130, 1, 25, 3); } else { rect(x - 10, y + 130, 3, 25, 3); } if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 155 && mouseY < y + 180 && mouseIsPressed ) { rect(x - 8, y + 155, 1, 25, 3); } else { rect(x - 10, y + 155, 3, 25, 3); } //audio jack fill(92, 92, 92); noStroke(); arc(x + 320 - 2, y + 15, 7, 10, 90, 270); //charger fill(199, 199, 199); rect(x + 320 - 6, y + 180, 4, 15, 3); //directions if(!turnedOn) { strokeWeight(3); stroke(255); noFill(); bezier(x - 50, y - 40, x - 80, y - 10, x - 70, y - 10, x - 30, y + 10); bezier(x - 40, y - 5, x - 20, y + 10, x - 20, y + 10, x - 45, y + 15); textSize(20); textFont(font.label, 20); fill(255); textAlign(CENTER, CENTER); text("Press to power on", x + 45, y - 40); } }; //top and bottom bars var drawBars = function() { //top bar fill(0, 150); noStroke(); rect(150, 100, 300, 15); //time var h = time.hour <= 12 ? time.hour: time.hour - 12; var t = h + ":" + padZero(time.minute); textAlign(LEFT, TOP); textFont(font.text, 10); fill(theme.light); text(t, 156, 104); //am or pm textSize(10); fill(theme.detail); text((time.hour <= 12 ? " am": " pm"), 154 + textWidth(t), 103); drawPower(420, 105, 1.3); //home button fill(0); rect(150, 100 + 200 - 20, 300, 20); fill(255); ellipse(300, 100 + 200 - 12, 10, 10); if(dist(300, 100 + 200 - 12, mouseX, mouseY) < 5) { cursor(HAND); } }; var scenes = {}; //logo var drawLogo = function(x, y) { fill(108, 235, 152); noStroke(); triangle(0, 400, 150, 400, 0, 250); var hovering = dist(mouseX, mouseY, x, y) < 20; pushMatrix(); translate(x, y); if(hovering) { scale(1.1); cursor(HAND); } noStroke(); fill(70, 99, 71); ellipse(0, 0, 50, 30); fill(45, 214, 57); arc(0, -6, 50, 20, 0, 360); fill(145, 93, 93); arc(0, -6, 20, 15, -180, 0); ellipse(0, -6, 20, 7); fill(70, 99, 71); textAlign(CENTER, CENTER); textFont(createFont("Mushy Custom Extra Bold"), 11); text("Subscribe" + (hovering ? "?": ""), 0, 23); popMatrix(); }; //home function scenes.drawHome = function() { //lock image image(lockImgs[lockImg], 150, 100, 300, 200); //tint fill(0, 100); noStroke(); rect(150, 100, 300, 200); //apps for(var i = 0; i < 4; i++) { var a = apps[i]; var x = 190 + i * (a.size + 20); var y = 140; noStroke(); fill(255, 200); if(a.collide(x, y)) { fill(200, 200); cursor(HAND); } rect(x, y, a.size, a.size, 3); a.display(x + a.size / 2, y + a.size / 2); textFont(font.label, 9); textAlign(CENTER, CENTER); fill(255); text(a.label, x + a.size / 2, y + a.size + 7); } for(var i = 0; i < apps.length - 4; i++) { var a = apps[i + 4]; var x = 190 + i * (a.size + 20); var y = 205; noStroke(); fill(255, 200); if(a.collide(x, y)) { fill(200, 200); cursor(HAND); } rect(x, y, a.size, a.size, 3); a.display(x + a.size / 2, y + a.size / 2); textFont(font.label, 9); textAlign(CENTER, CENTER); fill(255); text(a.label, x + a.size / 2, y + a.size + 7); } }; //settings function scenes.drawSettings = function() { var fillCol = color(255, 212, 102); //constrain wallpaper lockImg = constrain(lockImg, 0, lockImgs.length - 1); //background cover(color(125, 201, 255)); //image viewer fill(255); noStroke(); rect(249, 199, 102, 200 / 3 + 2); image(lockImgs[lockImg], 250, 200, 100, 200 / 3); //arrows fill(fillCol); stroke(255); strokeWeight(1); if( (mouseX > 220 && mouseX < 240 && mouseY > 210 && mouseY < 200 + (180 / 3)) \|\| lockImg === 0 ) { fill(lerpColor(fillCol, color(0), 0.2)); cursor(HAND); } triangle(240, 210, 240, 200 + (180 / 3), 220, 202 + (200 / 6)); fill(fillCol); if( (mouseX > 360 && mouseX < 380 && mouseY > 210 && mouseY < 200 + (180 / 3)) \|\| lockImg === lockImgs.length - 1 ) { fill(lerpColor(fillCol, color(0), 0.2)); cursor(HAND); } triangle(260 + 100, 210, 260 + 100, 200 + (180 / 3), 380, 202 + (200 / 6)); //blue shade fill(fillCol); stroke(255); strokeWeight(1); if(mouseInside(175, 125, 100, 25)) { fill(lerpColor(fillCol, color(0), 0.2)); cursor(HAND); } rect(175, 125, 100, 25, 3); fill(0); textAlign(CENTER, CENTER); textFont(font.text, 11); text("Blue shade: " + (!blueShade ? "OFF": "ON"), 175 + 50, 125 + 25 / 2); //screen sleep fill(fillCol); stroke(255); strokeWeight(1); if(mouseInside(310, 125, 120, 25)) { fill(lerpColor(fillCol, color(0), 0.2)); cursor(HAND); } rect(310, 125, 120, 25, 3); fill(0); textAlign(CENTER, CENTER); textFont(font.text, 11); text("Sleep after: " + sleepTime / 60 + "s", 310 + 60, 125 + 25 / 2); //screen sleep fill(fillCol); stroke(255); strokeWeight(1); if(mouseInside(175, 165, 100, 25)) { fill(lerpColor(fillCol, color(0), 0.2)); cursor(HAND); } rect(175, 165, 100, 25, 3); fill(0); textAlign(CENTER, CENTER); textFont(font.text, 11); text("Tap sounds: " + (!tapSounds ? "OFF": "ON"), 175 + 50, 165 + 25 / 2); }; //lock function scenes.drawLock = function() { //home img if(homeImg !== false) { image(homeImg, 150, 100, 300, 200); } //lock image image(lockImgs[lockImg], 150, 100 - unlock, 300, 200); //tint fill(0, 80); noStroke(); rect(300, 110 - unlock, 140, 75); //time textFont(font.text, 30); fill(255); textAlign(LEFT, TOP); text(currTime, 280 + 30, 100 + 20 - unlock); //am or pm textSize(20); text((time.hour <= 12 ? " am": " pm"), 280 + 52 + textWidth(currTime), 100 + 29 - unlock); //date fill(theme.detail); textSize(12); text(currDate, 280 + 30, 100 + 55 - unlock); //power drawPower(405, 157 - unlock, 1.5); //lock symbol pushMatrix(); translate(300, 280 - unlock); scale(0.8, 0.7); //body fill(255); noStroke(); rect(-10, -10, 20, 20, 3); //keyhole fill(0); rect(2, -5, 3, 10, 3); ellipse(3.5, -5, 5, 5); //loop strokeWeight(3); noFill(); stroke(255); arc(0, -10, 13, 15, -180, 0); popMatrix(); //directions textFont(font.title, 14); textAlign(CENTER, CENTER); fill(255); text("swipe up", 300, 250 - unlock); //unlocking if(mouseIsPressed && mouseY - pmouseY < -10) { unlocking = true; } if(unlocking && unlock === 0) { scenes.drawHome(); homeImg = get(150, 100, 300, 200); image(lockImgs[lockImg], 150, 100 - unlock, 300, 200); } if(unlocking) { unlock = lerp(unlock, 200, 0.1); } if(unlock >= 200 - 15) { scene = "Home"; } }; //off function scenes.drawOff = function() { cover(color(0)); if(power <= 1) { fill(255); noStroke(); pushMatrix(); translate(300, 200); beginShape(); vertex(40, -30); vertex(10, 0); vertex(25, 10); vertex(-40, 30); vertex(-10, 0); vertex(-25, -10); endShape(); popMatrix(); } }; //clock function scenes.drawClock = function() { cover(theme.veryDark); pushMatrix(); translate(230, 200); scale(3); var x = 0; var y = 0; fill(0); noStroke(); ellipse(x, y, 30, 30); fill(240); ellipse(x, y, 25, 25); for(var i = 0; i < 12; i++) { var posX = cos(i * (360 / 12)) * 10; var posY = sin(i * (360 / 12)) * 10; strokeWeight(1); stroke(theme.dark); line(x + posX, y + posY, x + (posX * 0.8), y + (posY * 0.8)); } rotate(360 * (time.minute / 60)); stroke(0); strokeWeight(1); line(0, -8, 0, 0); rotate(-360 * (time.minute / 60)); rotate(360 * (time.second / 60)); strokeWeight(0.6); stroke(255, 0, 0); line(0, -10, 0, 0); rotate(-360 * (time.second / 60)); rotate(360 * (time.hour - (time.hour > 12 ? 12: 0) / 12)); strokeWeight(1); stroke(0); line(0, -5, 0, 0); textFont(font.label, 6); textAlign(CENTER, TOP); fill(255); text(currTime + ":" + padZero(time.second), -0, 16); popMatrix(); //start stopwatch fill(161); stroke(255); strokeWeight(1); if(mouseInside(325, 200, 100, 25)) { fill(lerpColor(color(161), color(0), 0.2)); cursor(HAND); } rect(325, 200, 100, 25, 3); fill(0); textAlign(CENTER, CENTER); textFont(font.text, 11); text((!stopwatch ? "Start": "Stop"), 325 + 50, 200 + 25 / 2); //reset stopwatch fill(161); stroke(255); strokeWeight(1); if(mouseInside(325, 235, 100, 25)) { fill(lerpColor(161, color(0), 0.2)); cursor(HAND); } rect(325, 235, 100, 25, 3); fill(0); textAlign(CENTER, CENTER); textFont(font.text, 11); text("Reset", 325 + 50, 235 + 25 / 2); if(stopwatch) { swTimer += 1 / 60; } //stopwatch textAlign(CENTER, CENTER); textFont(font.text, 25); fill(theme.white); if(swTimer !== 0 && !stopwatch && frameCount % 80 > 60) { fill(0, 0); } text(swTimer, 375, 170); }; //clicker function scenes.drawClicker = function() { cover(theme.veryDark); clicker.run(); }; //flappy function scenes.drawFlappy = function() { flappy.run(); }; //fireworks function scenes.drawWorks = function() { fireworks.run(); }; //paint function scenes.drawPaint = function() { paint.run(); }; //khan function scenes.drawKhan = function() { //background cover(color(230)); //top bar fill(60, 45, 117); noStroke(); rect(150, 100, 300, 40); //title textAlign(CENTER, CENTER); textFont(font.title, 10); fill(255); text("Khan Academy", 300, 125); pushMatrix(); translate(252, 127); scale(0.6); apps[4].display(0, 0); popMatrix(); //program image image(khanImg, 275, 150, 600 * 0.25, 400 * 0.25); //code fill(255); noStroke(); rect(175, 150, 100, 400 * 0.25); //lines fill(200); noStroke(); rect(175, 150, 10, 100); for(var i = 0; i < 9; i++) { strokeWeight(1); stroke(61); line(200, 160 + i * 10, 185 + 80, 160 + i * 10); } var khanButton = function(x, y, txt, txtSize) { //buttons fill(56, 163, 82); noStroke(); if(mouseInside(x, y, 30, 13)) { cursor(HAND); fill(47, 130, 66); } rect(x, y, 30, 13, 3); textFont(font.title, txtSize); fill(255); textAlign(CENTER, CENTER); text(txt, x + 15, y + 13 / 2); }; khanButton(200, 255, "Delete", 7); khanButton(235, 255, "Settings", 7); khanButton(270, 255, "Vote up", 7); khanButton(305, 255, "Share", 7); }; //weather function scenes.drawWeather = function() { //shortcut var f = forecasts[forecast]; //fill cover(f.fill); //symbol pushMatrix(); translate(300, 165); scale(1); f.symbol(); popMatrix(); //panel fill(240); noStroke(); rect(150, 225, 300, 200); //title fill(65, 72, 171); textFont(font.title, 20); textAlign(CENTER, CENTER); text(f.name, 300, 240); //low/high textFont(font.text, 15); textAlign(LEFT, TOP); text("Low: " + f.low + "\nHigh: " + f.high, 160, 230); //location textAlign(RIGHT, TOP); textFont(font.label, 12); fill(65, 72, 171); text("Salem\nOregon", 450 - 9, 225 + 3); }; //mouse clicked mouseClicked = function() { if(dist(mouseX, mouseY, 40, height - 40) < 20) { println("You can to subscribe " + author + " here:\n\n" + subPage); } sleepTimer = 0; var x = 145, y = 95; if((mouseInside(500, 175, 100, 50) && !pluggedIn) \|\| (mouseInside(450, 250, 100, 50) && pluggedIn)) { pluggedIn = !pluggedIn; } if( mouseIsPressed && mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 5 && mouseY < y + 5 + 20 && power > 1 ) { if(scene !== "Off") { scene = "Off"; } else { unlocking = false; turnedOn = true; unlock = 0; scene = "Lock"; } } if(scene !== "Off") { if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 130 && mouseY < y + 155 ) { volume += 5; volumeTimer = 100; } if( mouseX > x - 15 && mouseX < x - 10 + 5 && mouseY > y + 155 && mouseY < y + 180 ) { volume -= 5; volumeTimer = 100; } volume = constrain(volume, 0, 100); if(scene !== "Home" && scene !== "Lock" && scene !== "Off") { if(dist(300, 100 + 200 - 12, mouseX, mouseY) < 10) { scene = "Home"; } } switch(scene) { case "Home": //apps for(var i = 0; i < 4; i++) { var a = apps[i]; var x = 190 + i * (a.size + 20); var y = 140; if(a.collide(x, y)) { scene = a.dest; } } for(var i = 0; i < apps.length - 4; i++) { var a = apps[i + 4]; var x = 190 + i * (a.size + 20); var y = 205; if(a.collide(x, y)) { scene = a.dest; } } break; case "Settings": if( mouseX > 220 && mouseX < 240 && mouseY > 210 && mouseY < 200 + (180 / 3) ) { lockImg--; } if( mouseX > 360 && mouseX < 380 && mouseY > 210 && mouseY < 200 + (180 / 3) ) { lockImg++; } if(mouseInside(175, 125, 100, 25)) { blueShade = !blueShade; } if(mouseInside(310, 125, 120, 25)) { sleepTime += 60 * 5; if(sleepTime / 60 > 45) { sleepTime = 10 * 60; } } if(mouseInside(175, 165, 100, 25)) { tapSounds = !tapSounds; } break; case "Clock": if(mouseInside(325, 200, 100, 25)) { stopwatch = !stopwatch; } if(mouseInside(325, 235, 100, 25)) { swTimer = 0; } break; case "Clicker": clicker.whenClicked(); break; case "Flappy": flappy.whenClicked(); break; case "Works": fireworks.whenClicked(); break; case "Paint": paint.whenClicked(); break; } if(tapSounds) { playSound(getSound("rpg/battle-swing")); } } }; //mouse moved mouseMoved = function() { sleepTimer = 0; }; //key pressed keyPressed = function() { sleepTimer = 0; if(scene === "Flappy" && flappy.again) { flappy.bird.velY = -flappy.bird.flapSize; flappy.again = false; } thumbnail += key.toString(); }; //key released keyReleased = function() { flappy.again = true; }; //background background(255, 0, 0); //call scene scenes.drawOff(); //tablet drawTablet(145, 95); khanImg = get(); background(0); //draw loop draw = function() { pushMatrix(); if(thumbnail === "expand") { translate(-150, 0); scale(1.5, 1); } //time and date var h = time.hour <= 12 ? time.hour: time.hour - 12; currTime = h + ":" + padZero(time.minute); currDate = date.month + "/" + date.day + "/" + date.year; //cursor cursor(ARROW); //background background(255, 0, 0); //call scene scenes["draw" + scene](); //draw bars if(scene !== "Lock" && scene !== "Off") { drawBars(); } //tablet drawTablet(145, 95); volumeBar(300, 110, 1.0); //charger if(mouseInside(500, 175, 100, 50) && !pluggedIn) { drawCharger(100, true); cursor(HAND); } else if(mouseInside(450, 250, 100, 50) && pluggedIn) { drawCharger(100, false); cursor(HAND); } if(!pluggedIn) { drawCharger(255, false); } else { drawCharger(255, true); } //update time updateTime(); //decrease power if(scene !== "Off" && !pluggedIn) { power -= 0.001; sleepTimer++; } else if(pluggedIn) { power += 0.003; } //volume display time volumeTimer--; //sleep if(sleepTimer > sleepTime \|\| power <= 1) { scene = "Off"; } //constrain power power = constrain(power, 0, 100); popMatrix(); //background(255); }; //end of code
Folds	75,88,90,107,109,127,129,166,168,191,193,207,238,242,245,251,271,317,320,371,374,421,424,464,485,490,501,512,521,549,558,594,603,630,639,676,685,687,696,715,724,741,746,751,754,761,772,775,789,799,801,803,807,877,879,908,940,962,964,978,980,987,993,1026,1028,1049,1051,1161,1163,1177,1186,1277,1279,1300,1302,1306,1329,1335,1348,1365,1367,1369,1373,1380,1382,1430,1432,1434,1436,1453,1460,1493,1496,1534,1537,1549,1552,1577,1580,1706,1709,1745,1750,1786,1789,1853,1856,1961,1964,2053,2056,2085,2088,2201,2204,2207,2210,2212,2215,2217,2220,2222,2225,2302,2305,2349,2352,2520,2523,2525,2540,2542
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgOGEwfCNCww
Votes	607
Spin-Offs	21
Type	PJS
Width	600
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Mushy Avocado
Author Name	MushyAvocado
Author ID	kaid_889538221957342292210697
Author Profile Access	PUBLIC

Archive Data

Added	10 months ago, 1739455606039
Updated	8 months ago, 1744820738394
Source Deleted	unknown