Viewing Program

Program Data

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

Title	Stackz
ID	6430049960951808
Created	6 years ago, 1574103062551
Updated	5 years ago, 1581986671169
Code	/ Started : 11/06/19 Finished: 11/17/19 Released: 11/18/19 Lines of code: 907 Creator: LittleMoose (@LittleMoose14) ^^ for future reference ^^ / //2/17/2020 - added space to jump (168 votes) var init = function() { var pjs = this; pjs.textAlign(CENTER, CENTER); //sets the pjs.text alignment to center pjs.rectMode(CORNER); //sets the pjs.rect mode to center pjs.imageMode(CENTER); //sets the pjs.image mode to center pjs.smooth(); //smooths out animations pjs.frameRate(62); //sets the frame rate var score = 0, topScore = 0, clicked = false, // checks to see if you clicked start = false, //checks to see if the animaton is over. If it is then the blocks start character = false, fps = false, //set to true if you want to see the fps (fps = frames per second) messages = ["Try, try, try again.", "Don't give up, try again!", "Oof, that's gotta hurt.\nTry again?", "Try jumping higher next time. \n Try again?", "2 + 2 = try again!\n\nI was never too good at math.", "Do ya know da way...\n to the Retry button?", "If you try again then there\nmay be a cookie at the end."], messageNum = 0; var smoothTrans = function(obj, amt, amtDiv) { return (amt - obj) / amtDiv; }; //function made by KWC (I think it was him) to replace the "new" command var construct = function(ctor, args, newTarget) { var obj = Object.create(ctor.prototype); return (newTarget \|\| ctor).apply(obj, args), obj; }; var keys = []; /* An easier way of using translate(), rotate(), scale() Example: pjs.pushMatrix(); translate(200, 200); rotate(50); scale(2, 1.5); pjs.rect(0, 0, 50, 50); pjs.popMatrix(); ---- gets turned into this: transform(200, 200, 50, 2, 1.5); pjs.rect(0, 0, 50, 50); pjs.popMatrix(); / var transform = (function() { var transform = function(x, y, r, w, h) { pjs.pushMatrix(); pjs.translate(x, y); pjs.rotate(r); pjs.scale(w, h); }; return transform; })(); //button constructor var button = (function() { button = function(x, y, s, message, do_what) { this.x = x; this.y = y; this.radius = s; this.message = message; this.do_what = do_what; this.grow = this.radius 1.5; }; button.prototype = { paint: function() { transform(this.x, this.y); pjs.noFill(); pjs.stroke(0, 0, 0); pjs.strokeWeight(this.radius / 9); pjs.ellipse(0, 0, this.radius * 2, this.radius * 2); pjs.stroke(0, 50); pjs.ellipse(10, 5, this.radius * 2, this.radius * 2); pjs.fill(0); textFont(createFont("impact"), this.radius / 1.5); pjs.text(this.message, 0, 0); pjs.fill(0, 50); pjs.text(this.message, 10, 5); pjs.popMatrix(); this.update(); }, update: function() { this.radius += this.mouseOver() ? smoothTrans(this.radius, this.grow, 3) : smoothTrans(this.radius, this.grow / 1.5, 3); if (this.mouseOver() && clicked) { if (typeof this.do_what !== "undefined") { this.do_what(); } } }, mouseOver: function() { return dist(this.x, this.y, mouseX, mouseY) < this.radius; }, }; return button; })(); // images { var grass_block = (function() { background(255, 0); transform(1, 1); pjs.strokeWeight(2); pjs.stroke(120, 72, 0); pjs.fill(232, 117, 28); pjs.rect(0, 0, 100, 50); pjs.stroke(20, 122, 0); pjs.fill(47, 186, 0); pjs.rect(0, 0, 100, 18); pjs.noStroke(); for (var i = 0; i < 6; i++) { pjs.fill(0, 50); pjs.triangle(i * 17 + 2, 18, i * 17 + 7.7, 31, i * 17 + 16, 18); pjs.fill(47, 186, 0); pjs.triangle(i * 17, 16, i * 17 + 4.7, 29, i * 17 + 14, 16); } pjs.fill(0, 40); pjs.rect(86, 0, 15, 50); pjs.fill(255, 50); pjs.rect(0, 0, 15, 50); pjs.fill(0, 179, 12); quad(0, 0, 15, 5, 85, 5, 100, 0); pjs.popMatrix(); return get(0, 0, 102, 52); })(); var antler = (function() { background(255, 0); transform(-25, -80, 0.5, 0.5); pjs.stroke(0, 0, 0); { pjs.strokeWeight(3); pjs.fill(189, 150, 42); pjs.beginShape(); pjs.vertex(188, 208); pjs.bezierVertex(167, 204, 154, 162, 144, 181); pjs.bezierVertex(144, 209, 126, 204, 124, 187); pjs.bezierVertex(122, 173, 101, 161, 101, 179); pjs.bezierVertex(108, 200, 99, 206, 82, 193); pjs.bezierVertex(81, 187, 35, 185, 70, 217); pjs.bezierVertex(89, 235, 119, 236, 182, 234); pjs.endShape(CLOSE); pjs.noStroke(); pjs.fill(207, 166, 52); pjs.beginShape(); pjs.vertex(186, 208); pjs.bezierVertex(167, 212, 154, 167, 145, 181); pjs.bezierVertex(153, 209, 126, 210, 120, 187); pjs.bezierVertex(122, 173, 99, 164, 106, 179); pjs.bezierVertex(114, 200, 103, 210, 82, 195); pjs.bezierVertex(81, 192, 38, 188, 74, 213); pjs.bezierVertex(89, 220, 119, 232, 184, 222); pjs.endShape(CLOSE); pjs.stroke(0); } pjs.popMatrix(); return get(0, 0, 70, 40); })(); var flyingSaucer = (function() { background(25, 0); transform(89, 45, 0); pjs.strokeWeight(2); pjs.fill(199, 199, 199); pjs.ellipse(0, -19, 64, 50); pjs.noStroke(); pjs.fill(247, 242, 247); pjs.ellipse(-3, -19, 56, 47); pjs.stroke(0); pjs.fill(173, 173, 173); pjs.ellipse(0, 0, 175, 39); pjs.fill(204, 204, 204); pjs.noStroke(); pjs.ellipse(-6, -1, 160, 31); pjs.stroke(0); pjs.fill(255, 0, 0); pjs.ellipse(48, -4, 10, 10); pjs.ellipse(19, 0, 10, 10); pjs.ellipse(-13, 0, 10, 10); pjs.ellipse(-47, -4, 10, 10); pjs.popMatrix(); return get(0, 0, 177, 65); })(); var mouseImg = (function() { background(255, 0); transform(40, 49); pjs.strokeWeight(2); pjs.stroke(163, 163, 163, 150); pjs.fill(217, 217, 217, 150); pjs.rect(0, 0, 20, 40, 15, 0, 0, 0); pjs.rect(22, 0, 20, 40, 0, 15, 0, 0); pjs.rect(0, 43, 42, 34, 0, 0, 8, 8); pjs.noFill(); pjs.strokeWeight(4); pjs.bezier(22, 0, 27, -13, 5, -26, 20, -41); pjs.line(-3, -3, -15, -15); pjs.line(-6, 8, -18, 9); pjs.line(6, -8, 5, -21); pjs.text("Click", -31, 28); pjs.popMatrix(); return get(0, 0, 85, 128); })(); //} //Checks to see if a object 'a' collides with object 'b' var collide = function(a, b) { if (!a.hit) { / Collide top / if ((a.x + a.w / 2 - 3) > b.x - a.w / 2 && (a.x) < (b.x + b.w - 3) && (a.y + a.h) > b.y && (a.y < b.y - 3)) { a.y = b.y - a.h; b.stop = true; a.jump = true; } if ((a.x + a.w / 2 - 3) > b.x - a.w / 2 && (a.x) < (b.x + b.w - 3) && (a.y + a.h) > b.y && (a.y < b.y + b.h)) { a.y = b.y + b.h; } / Collide Right / if ((a.x) > b.x - a.w / 2 && (a.x) < (b.x + b.w) && (a.y + a.h) > b.y && (a.y < b.y + b.h)) { a.hit = true; a.yVel = -3; a.xVel = 10; a.x = b.x + b.w; } / Collide left / if ((a.x + a.w / 2) > b.x - a.w / 2 && (a.x) < (b.x) && (a.y + a.h) > b.y && (a.y < b.y + b.h)) { a.yVel = -3; a.x = b.x - a.w; a.xVel = -10; a.hit = true; } } }; //variables for the camera movement var cam = { x: 0, y: 0, s: 1 }; //the "platforms" array var platforms = []; //variables for the starting animation var ballX = 220, ballY = 285, alienY = -50, groundX = 0; //the player function var player = { x: 200, y: 200, w: 30, h: 100, jump: true, yVel: 0, xVel: 0, chr: "default", hit: false, at: 0, // animation time limb: function(x, y, x2, y2, s, c, c2, c3) { pjs.strokeWeight(10 + s); pjs.stroke(c); pjs.line(x, y, x2, y2); pjs.strokeWeight(8 + s); pjs.stroke(c2); pjs.line(x, y, x2, y2); pjs.strokeWeight(5 + s); pjs.stroke(c3); pjs.line(x - 1, y, x2 - 2, y2); }, drawMoose: function() { pjs.rectMode(CENTER); transform(this.x + this.w / 2, this.y + 14 + (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 0, 0.8, 0.8); // translat, rotate, scale this.limb(-17, 31, -28 - 5 * sin(pjs.frameCount * 2), 58, 1, color(89, 36, 0), color(143, 60, 0), color(179, 92, 0)); //the left arm this.limb(17, 31, 28 + 5 * sin(pjs.frameCount * 2), 58, 1, color(89, 36, 0), color(143, 60, 0), color(179, 92, 0)); //the right arm this.limb(-10, 74, -11, 100 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 3.3, color(89, 36, 0), color(143, 60, 0), color(179, 92, 0)); //the left leg this.limb(10, 80, 11, 100 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 3.3, color(89, 36, 0), color(143, 60, 0), color(179, 92, 0)); //the right leg / The body / pjs.strokeWeight(2); pjs.stroke(102, 44, 0); //the dark part of the body pjs.fill(148, 74, 0); pjs.rect(0, 47, 34, 64, 5, 5, 2, 2); //the light part of the body pjs.noStroke(); pjs.fill(179, 92, 0); pjs.rect(-3, 42, 25, 70, 5, 5, 2, 2); /*******************/ { imageMode(CENTER); transform(0, 0, 0, -1, 1); pjs.image(antler, -45, -11, 54, 30); pjs.popMatrix(); pjs.image(antler, -45, -11, 54, 30); } //antlers pjs.strokeWeight(2); pjs.stroke(102, 44, 0); //the dark part of the head pjs.fill(148, 74, 0); pjs.rect(0, 0, 50, 50, 3); //the light part of the head pjs.noStroke(); pjs.fill(179, 92, 0); pjs.rect(-2, 0, 44, 47, 3); //open eyes if (pjs.frameCount % 150 > 15) { pjs.stroke(0); pjs.fill(0); pjs.rect(-10, -6, 10, 15, 5); pjs.rect(9, -6, 10, 15, 5); pjs.noStroke(); pjs.fill(255); pjs.rect(-12, -10, 5, 5, 5); pjs.rect(7, -10, 5, 5, 5); } //closed eyes else { pjs.stroke(0); pjs.rect(-10, -6, 10, 1, 5); pjs.rect(9, -6, 10, 1, 5); } pjs.stroke(0); //eyebrowes pjs.line(7, -19 - 2 sin(pjs.frameCount * 2), 16 + 2 * sin(pjs.frameCount * 2), -16); pjs.line(-7, -19 - 2 * sin(pjs.frameCount * 2), -16 - 2 * sin(pjs.frameCount * 2), -16); //the mouth pjs.fill(0); pjs.ellipse(0 + 2 * sin(pjs.frameCount * 2), 14, 5 + 5 * sin(pjs.frameCount * 2), 5 + 5 * sin(pjs.frameCount * 2)); pjs.noStroke(); pjs.rect(-11, 102 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 18, 11, 5, 5, 0, 0); //the left hoof pjs.rect(11, 102 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 18, 11, 5, 5, 0, 0); //the right hoof pjs.rectMode(CORNER); pjs.stroke(255, 0, 0); pjs.noFill(); //pjs.rect(this.x, this.y, this.w, this.h); pjs.popMatrix(); }, drawdefault: function() { pjs.rectMode(CENTER); transform(this.x + this.w / 2, this.y + 14 + (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 0, 0.8, 0.8); // translat, rotate, scale this.limb(-17, 31, -28 - 5 * sin(pjs.frameCount * 2), 58, 1, color(145, 119, 42), color(204, 174, 75), color(217, 191, 104)); //the left arm this.limb(17, 31, 28 + 5 * sin(pjs.frameCount * 2), 58, 1, color(145, 119, 42), color(204, 174, 75), color(217, 191, 104)); //the right arm this.limb(-10, 74, -11, 100 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 3.3, color(0, 0, 0), color(0, 0, 0), color(61, 61, 61)); //the left leg this.limb(10, 80, 11, 100 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 3.3, color(0, 0, 0), color(0, 0, 0), color(61, 61, 61)); //the right leg / The body / pjs.strokeWeight(2); pjs.stroke(0, 0, 0); //the dark part of the body pjs.fill(22, 0, 148); pjs.rect(0, 47, 34, 64, 5, 5, 2, 2); //the light part of the body pjs.noStroke(); pjs.fill(27, 0, 179); pjs.rect(-3, 42, 25, 70, 5, 5, 2, 2); /*******************/ pjs.strokeWeight(2); pjs.stroke(145, 119, 42); //the dark part of the head pjs.fill(209, 175, 65); pjs.rect(0, 0, 50, 50, 3); //the light part of the head pjs.noStroke(); pjs.fill(217, 191, 104); pjs.rect(-2, 0, 44, 47, 3); pjs.fill(186, 113, 4); pjs.rect(0, -19, 53, 10, 5, 5, 0, 0); //open eyes if (pjs.frameCount % 150 > 15) { pjs.stroke(0); pjs.fill(0); pjs.rect(-10, -6, 10, 15, 5); pjs.rect(9, -6, 10, 15, 5); pjs.noStroke(); pjs.fill(255); pjs.rect(-12, -10, 5, 5, 5); pjs.rect(7, -10, 5, 5, 5); } //closed eyes else { pjs.stroke(0); pjs.rect(-10, -6, 10, 1, 5); pjs.rect(9, -6, 10, 1, 5); } pjs.stroke(0); //eyebrowes pjs.line(7, -19 - 2 sin(pjs.frameCount * 2), 16 + 2 * sin(pjs.frameCount * 2), -16); pjs.line(-7, -19 - 2 * sin(pjs.frameCount * 2), -16 - 2 * sin(pjs.frameCount * 2), -16); //the mouth pjs.fill(0); pjs.ellipse(0 + 2 * sin(pjs.frameCount * 2), 14, 5 + 5 * sin(pjs.frameCount * 2), 5 + 5 * sin(pjs.frameCount * 2)); pjs.noStroke(); pjs.rect(-11, 102 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 18, 11, 5, 5, 0, 0); //the left hoof pjs.rect(11, 102 - (mouseIsPressed ? (this.jump ? 8 : 0) : 0), 18, 11, 5, 5, 0, 0); //the right hoof pjs.rectMode(CORNER); pjs.stroke(255, 0, 0); pjs.noFill(); //pjs.rect(this.x, this.y, this.w, this.h); pjs.popMatrix(); }, paint: function() { switch (this.chr) { case "moose": this.drawMoose(); break; case "default": this.drawdefault(); break; } }, update: function() { this.y += this.yVel; this.x += this.xVel; if (this.xVel > 0 \|\| this.xVel < 0) { this.xVel /= 1.05; } if (this.y >= 150) { this.yVel = 0; this.y = 150; this.jump = true; } if (this.jump && (clicked \|\| keys[32]) && start && !player.hit) { this.yVel = -5; this.jump = true; } this.yVel += 0.15; this.jump = false; /if(this.chr === "moose") { this.w = 30; this.h = 100; }else { this.w = 50; this.h = 100; } / }, }; // The platform constructor (AKA: OOP) var Platform = (function() { Platform = function(x, d) { this.x = x; this.y = 0; this.w = 100; this.h = 50; this.speed = 0; this.stop = false; this.d = d; }; Platform.prototype = { paint: function() { pjs.image(grass_block, this.x + this.w / 2, this.y + this.h / 2, this.w, this.h); }, update: function() { /if(!this.stop) { if(this.x >= width/2-25 && this.d < 0){ }else if(this.x <= width/2-25 && this.d > 0){ this.x += this.d; } } / if (!this.stop) { this.x += this.d; } }, }; return Platform; })(); var speed, // variable for the platform speed y = 0, x = 0, // variables for the camera platformPos = 1; // what side the platforms come from. 0 = right, 1 = left //variables for some misc stuff var textX = -100, menuX = 0, showMenu = true, mouseImgTime = 0, mouseImgY = -80; //stuff for the buttons var btn1 = construct(button, [width / 2, height / 2, 50, "Retry", function() { player.hit = false; player.x = width / 2; player.y = 150; platforms.length = 0; player.xVel = 0; player.yVel = 0; messageNum = ~~random(messages.length); }]), btn2 = construct(button, [width / 2, height / 2, 50, "Play", function() { start = true; }]), btn3 = construct(button, [width / 2, height / 1.2, 30, "Char", function() { character = true; showMenu = false; }]), left = construct(button, [width - 50, height / 2, 25, ">", function() { player.chr = "moose"; }]), right = construct(button, [50, height / 2, 25, "<", function() { player.chr = "default"; }]), home = construct(button, [50, height - 50, 25, "Menu", function() { showMenu = true; character = false; start = false; player.hit = false; player.x = width / 2; player.y = 150; platforms.length = 0; player.xVel = 0; player.yVel = 0; menuX = 0; }]); pjs.draw = function() { try { pjs.background(41, 180, 245); if (player.hit) { y = lerp(y, -200, 0.05) \|\| 0; cam.x = lerp(cam.x, 170, 0.05) \|\| 0; cam.s = lerp(cam.s, 0.2, 0.05) \|\| 0; } else { cam.x = lerp(cam.x, 0, 0.05) \|\| 0; cam.s = lerp(cam.s, 1, 0.05) \|\| 0; y = cam.y += (player.y - cam.y) / 20 \|\| 0; //x = cam.x += ((player.x-cam.x)/15) \|\| 0; } //makes everything below this point move with the camera transform(cam.x - 15, -y + 200, 0, cam.s); //background pjs.noStroke(); pjs.fill(75, 177, 232); pjs.triangle(-900, -1000, 1300, -500, 1300, -1500); pjs.fill(120, 218, 240); pjs.triangle(-900, 250, 1300, -500, -900, -1000); pjs.fill(161, 236, 255); pjs.triangle(-900, 250, 1300, 250, 1300, -500); pjs.image(flyingSaucer, 600, -1900 + 5 * sin(pjs.frameCount)); if (score > topScore && player.hit && score > 1) { topScore = score; } if (start) { pjs.textSize(20); pjs.noStroke(); pjs.fill(173, 159, 0, 100); pjs.text("Your High Score", 100, topScore * -48 + 190); pjs.rect(0, topScore * -48 + 200, 400, 5); } pjs.fill(0, 50); for (var i = platforms.length - 1; i >= 0; i--) { //a little shadow for the platforms pjs.rect(platforms[i].x + 10, platforms[i].y + 5, 100, 50); platforms[i].update(); //updates the platforms platforms[i].paint(); //draws the platforms platforms[i].y = i * -48 + 200; //makes the platforms "stack" //this is what makes the player collide with the platforms collide(player, platforms[i]); //if the player hits the side of the platforms then the blockes stop moving if (player.hit) { platforms[i].d = 0; } } if (pjs.frameCount % 100 === 0 && start === true && !player.hit) { speed = random(2, 4); if (platformPos === 0) { platforms.push(construct(Platform, [400, -abs(~~speed + platforms.length / 30)])); } if (platformPos === 1) { platforms.push(construct(Platform, [-100, ~~speed + platforms.length / 30])); } platformPos = floor(random(0, 2)); } player.paint(); player.update(); //ground{ pjs.noStroke(); for (var i = 0; i < 21; i++) { pjs.fill(0, 25); pjs.image(grass_block, -800 + i * 100, 275); } pjs.fill(232, 117, 28); pjs.rect(-1000, 298, 3000, 1000); pjs.fill(255); pjs.stroke(0); pjs.noStroke(); for (var i = -1; i < 21; i++) { pjs.fill(0, 40); pjs.rect(i * 100 + 86 - 850, 298, 15, 1000); pjs.fill(255, 50); pjs.rect(i * 100 - 850, 298, 15, 1000); pjs.fill(0, 0, 0, 150); pjs.rect(i * 100 - 851, 298, 1.5, 1000); } //} pjs.popMatrix(); if (player.hit) { pjs.fill(0); pjs.textSize(30); pjs.text(messages[messageNum], width / 2, 66); pjs.fill(0, 50); pjs.text(messages[messageNum], width / 2 + 10, 66 + 5); btn1.paint(); home.paint(); } else { textFont(createFont("impact"), 20); //pjs.text("score: " + score, 200, 20); score = (platforms.length - (platforms.length === 0 ? 0 : 1)); } //menu stuff if (showMenu) { transform(menuX, 0); pjs.textSize(60); pjs.fill(0); textX += smoothTrans(textX, width / 2, 6); pjs.text("Stackz", textX, 50); pjs.fill(0, 50); pjs.text("Stackz", textX + 10, 55); btn2.paint(); btn3.paint(); pjs.popMatrix(); if (start) { menuX = lerp(menuX, -width, 0.2); } if (menuX <= (-width) + 5) { showMenu = false; } } if (character) { if(player.chr === "default") { left.paint(); }else { right.paint(); } home.paint(); } //stuff for the mouse pjs.image pjs.image(mouseImg, width / 2 - 10, mouseImgY); if (start && mouseImgTime < 100) { mouseImgY = 80; mouseImgTime++; } else if (mouseImgTime >= 100 && mouseImgY < 150) { mouseImgY += smoothTrans(mouseImgY, -100, 6); } //if the variable "fps" equals true and the screen is not on animtion then it shows the fps if (fps) { pjs.textSize(10); pjs.fill(0, 0, 0); pjs.text("fps: " + ~~pjs.__frameRate, 30, 24); } clicked = false; // if the mouse is not clicked then "clicked" equals false //press "s" to activate then press a diffrent key to deactivate (make sure all of this is at the bottom of the draw function) if (keyCode === 83) { var snapshot = get(0, 0, width, height); background(255, 255, 255); imageMode(CENTER); pjs.image(snapshot, width / 2, height / 2, width / 1.3, height); } } catch (e) { println(e); } //if there is an error then intsted of Oh nose popping up a println will show up (only with certain errors though) }; pjs.mouseClicked = function() { clicked = true; //if the mouse is clicked then "clicked" equals true }; pjs.keyPressed = function() { keys[keyCode] = true; }; pjs.keyReleased = function() { keys[keyCode] = true; }; }; init();
Folds	14,913
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgL7eioO2Cww
Votes	191
Spin-Offs	25
Type	PJS
Width	400
Height	500
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	LittleMoose
Author Name	LittleMoose14
Author ID	kaid_705925867208151877881149
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739457795939
Updated	10 months ago, 1739457801979
Source Deleted	unknown