Viewing Program

Program Data

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

Title	NATUWARS Skins Batch 1
ID	5197996313985024
Created	3 months ago, 1727122806449
Updated	3 months ago, 1727122824189
Code	/***** * NATUWARS Chest Skins * Batch 1 * by LeaferStudios@LeaferStudios (https://www.khanacademy.org/profile/kaid_553656479258879622339276/projects) * * Click on left or right side of screen to go back or forward. * * @About: * A slideshow revealing the first 11 skin designs I made for my NATUWARS game. These will not be season skins/limited time skins, but will be available through regular chests. It's not finalized though, so skin rarity may be changed. * * Link to NATUWARS v0.4: https://www.khanacademy.org/computer-programming/natuwars-v04/5283314913427456 * * Subscribe here to get notified when the next version of NATUWARS is released: https://www.khanacademy.org/computer-programming/leaferstudios/4934504502870016 * * First released on the Khan Academy Computing community. * * Released 22 September 2024 ***/ var skinScale = 2; // Use this to zoom in to the skin (1 is how it will appear in-game) var skinIndex = 0; // Skin index // Main Code //{ size(600, 600, P2D); smooth(); enableContextMenu(); var click = false; var testing = false; var scene = 'logo'; / * LeaferStudios Logo Lib. v1.1 (last updated July 24, 2024) * v1.0: https://www.khanacademy.org/computer-programming/new-logo-by-leaferstudios/6036540180840448 * * USAGE: * LOGOsc1: Logo scene * LOGOsc2: Scene after logo * LOGOc1,LOGOc2,LOGOc3: red, green, blue values for fade out animation * LOGORUN(LOGOsc1,LOGOsc2,LOGOc1,LOGOc2,LOGOc3); */ //{ var LOGOR1 = 0, LOGOR2 = 0, z1 = 30; var LSLogo = function(x, y, s, r) { pushMatrix(); translate(x, y); scale(s); rotate(r); noStroke(); fill(0, LOGOR1 10, LOGOR2 * 5); ellipse(0, 0, 110, 110); fill(0, LOGOR2 * 20, 40, 250); ellipse(0, 0, 100, 100); fill(0, 0, 0, 10); arc(0, 0, 100, 100, 90, 270); var txt2 = '100101011000101010100010111010010110101000101101100101010100'; pushMatrix(); rotate(-85); for (var i = 0; i < txt2.length; i++) { textFont('monospace', 5); fill(11, 189, 14, LOGOR2 * 80); text(txt2.slice(i, i + 1), 0, -45); rotate(LOGOR1); } popMatrix(); textFont(createFont('Arial Bold'), 20); textAlign(CENTER, CENTER); fill(11, 189, 14); text('Studios', 0, 10 + 0.3); fill(0, 0, 0, LOGOR2 * 80); text('Studios', 0, 10); fill(11, 189, 14); text('Leafer', 0, -10); fill(0, 0, 0, LOGOR2 * 80); text('Leafer', 0, -10 - 0.3); popMatrix(); }; var LOGOSJ = 0, LOGODJ = 0; var LOGOBGC = color(120, 135, 245); var LOGORDC = color(112, 100, 83); var LOGOSPEEDD = 4; var LOGOParticle = function(x, y, s, pn) { this.x = x; this.y = y; this.s = s; this.place = []; for (var i = 0; i < pn; i++) { this.place.push({ rot: random(291), x: this.s, s: random(this.s / 10), spd: random(1, 5) * this.s / 100, trans: 255 }); } }; LOGOParticle.prototype.draw = function() { for (var i = 0; i < this.place.length; i++) { pushMatrix(); translate(this.x, this.y); rotate(this.place[i].rot); translate(this.place[i].x, 200); fill(32, 196, 92, z1); ellipse(0, 0, this.place[i].s, this.place[i].s); popMatrix(); } }; LOGOParticle.prototype.move = function() { for (var i = 0; i < this.place.length; i++) { this.place[i].x -= this.place[i].spd; this.place[i].trans = (this.place[i].x / this.s * 100) * 3; if (this.place[i].x + this.x <= this.x) { this.place[i].x = this.s; this.place[i].rot = random(360); this.place[i].s = random(this.s / 10); this.place[i].spd = random(1, 5) * this.s / 100; } } }; var LOGOParticle = new LOGOParticle(width / 2, height / 2, 300, 70); function LOGORUN(LOGOsc1, LOGOsc2, LOGOc1, LOGOc2, LOGOc3) { if (scene === LOGOsc1) { background(2, 99, 23); noStroke(); fill(93, 143, 57, 200); triangle(width, 0, 0, 0, width, height); fill(79, 117, 51, 100); triangle(width, 0, width, height, 0, height); LSLogo(width / 2, height / 2, 2.5 + LOGOSJ, LOGOSJ * 3); LOGODJ++; if (LOGODJ >= 0 && LOGODJ <= 50) { LOGOSJ = (sin(frameCount * 7) * 1); LOGOR2 = lerp(LOGOR2, 6, 0.005); LOGOR1 = lerp(LOGOR1, 3, 0.2); LOGODJ += 0.5; } else if (LOGODJ >= 50 && LOGODJ <= 150) { LOGOSJ = lerp(LOGOSJ, 0, 0.2); LOGOR2 = lerp(LOGOR2, 6, 0.1); LOGOR1 = lerp(LOGOR1, 6, 0.1); LOGOParticle.draw(); LOGOParticle.move(); } else if (LOGODJ >= 150) { LOGODJ += 1.5; z1 = lerp(z1, 0, 0.005); fill(0, 0, 0, LOGODJ - 100); rect(0, 0, width, height); if (LOGODJ >= 520) { scene = LOGOsc2; } LOGOParticle.draw(); LOGOParticle.move(); } } else { LOGODJ = lerp(LOGODJ, 0, 0.05); } fill(LOGOc1, LOGOc2, LOGOc3, LOGODJ - 100); rect(0, 0, width, height); } //} /** * Skins * Next step: make a skin loader which has properties like * { * name:'', * tier:'', * img:function() { * // graphic here * }, * } * * So I can use it as a databse / var skins = function(index, x, y, s1, s2, r) { pushMatrix(); pushStyle(); translate(x, y); scale(s1, s2); rotate(r); // always end the skin graphic with these: noStroke(); if (index === 0) { // purple alien fill(111, 89, 222); ellipse(0, 0, 43, 43); fill(123, 109, 199); arc(0, 9, 13, 25, -20, 373); stroke(0, 0, 0); strokeWeight(1); fill(224, 224, 224); ellipse(0, -12.5, 30, 16); noStroke(); fill(255, 255, 255); ellipse(0, -13.2, 26, 14); fill(0, 0, 0); bezier(0, -10, 11, -22, -11, -22, 0, -10); fill(255, 255, 255); ellipse(-2, -13.5, 3, 2); fill(146, 131, 242); stroke(73, 32, 224); bezier(0, 7, 15, 26, -15, 26, 0, 7); bezier(0, 7, 15, 16, -15, 16, 0, 7); bezier(0, 0, 15, 14, -15, 14, 0, 0); noFill(); stroke(97, 3, 105); strokeWeight(4); arc(11, -1, 5, 5, 0, 93); arc(-11, -1, 5, 5, 93, 186); arc(11, 9, 10, -15, 0, 93); arc(-11, 9, 10, -15, 93, 186); noStroke(); } else if (index === 1) { // circus strongman stroke(227, 0, 0); strokeWeight(0.5); fill(227, 29, 29); ellipse(0, -17, 13, 13); noStroke(); fill(212, 36, 36); arc(0, -17, 13, 12, 30, 150); fill(255, 255, 255, 240); ellipse(0, -21, 2, 2); stroke(112, 92, 4); strokeWeight(0.5); fill(255, 255, 255); ellipse(-11, -3, 6, 5); ellipse(11, -3, 6, 5); noStroke(); fill(0); ellipse(-11, -3, 2, 3); ellipse(11, -3, 2, 3); noFill(); stroke(0, 0, 0); strokeWeight(6); arc(11, 1, 5, -1, 0, 93); arc(-11, 1, 5, -1, 93, 186); noStroke(); } else if (index === 2) { // forest hat (grass) stroke(0, 82, 21, 200); strokeWeight(3); fill(29, 138, 60); arc(0, -10, 19, 19, -20, 373); fill(28, 140, 32); pushMatrix(); translate(0, -6); scale(1.4); bezier(0, 0, 15, 14, -15, 14, 0, 0); pushMatrix(); translate(7, -4); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(-7, -4); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(-7, 5); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(7, 5); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(0, 9); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); popMatrix(); noStroke(); } else if (index === 3) { // forest hat (pinecone) stroke(82, 61, 5, 200); strokeWeight(3); fill(138, 104, 30); arc(0, -10, 19, 19, -20, 373); fill(138, 111, 29); pushMatrix(); translate(0, -6); scale(1.4); bezier(0, 0, 15, 14, -15, 14, 0, 0); pushMatrix(); translate(7, -4); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(-7, -4); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(-7, 5); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(7, 5); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); pushMatrix(); translate(0, 9); bezier(0, 0, 15, 14, -15, 14, 0, 0); popMatrix(); popMatrix(); noStroke(); } else if (index === 4) { // Beret (Purple) stroke(52, 52, 52); strokeWeight(2); pushMatrix(); scale(1.5); translate(0, -3); fill(119, 19, 153); arc(0, 9, 19, 19, -20, 373); noStroke(); fill(166, 46, 209); arc(0, 9, 9, 9, -20, 373); fill(142, 23, 189); arc(0, 10, 2, 5, 262, 373); popMatrix(); noStroke(); } else if (index === 5) { // Beret (Green) stroke(52, 52, 52); strokeWeight(2); pushMatrix(); scale(1.5); translate(0, -3); fill(31, 153, 20); arc(0, 9, 19, 19, -20, 373); noStroke(); fill(90, 207, 48); arc(0, 9, 9, 9, -20, 373); fill(30, 189, 24); arc(0, 10, 2, 5, 262, 373); popMatrix(); noStroke(); } else if (index === 6) { // Beret (Red) stroke(52, 52, 52); strokeWeight(2); pushMatrix(); scale(1.5); translate(0, -3); fill(168, 16, 49); arc(0, 9, 19, 19, -20, 373); noStroke(); fill(219, 65, 65); arc(0, 9, 9, 9, -20, 373); fill(145, 9, 9); arc(0, 10, 2, 5, 262, 373); popMatrix(); noStroke(); } else if (index === 7) { // Beret (Yellow) stroke(52, 52, 52); strokeWeight(2); pushMatrix(); scale(1.5); translate(0, -3); fill(189, 182, 51); arc(0, 9, 19, 19, -20, 373); noStroke(); fill(231, 237, 52); arc(0, 9, 9, 9, -20, 373); fill(176, 174, 35); arc(0, 10, 2, 5, 262, 373); popMatrix(); noStroke(); } else if (index === 8) { // Cowboy Hat (Brown) stroke(52, 52, 52); strokeWeight(2.3); pushMatrix(); scale(1.5); translate(0, -3); fill(184, 131, 63); arc(0, 5,34, 26, -14, 195); arc(0, 2, 33, -16, 0, 180); noStroke(); ellipse(0, 2, 30, 4); stroke(52); strokeWeight(2); fill(145, 125, 105); arc(0, 7.5, 13, 13, -20, 373); fill(184, 131, 63); arc(0, 9.8,8, 8, -20, 373); popMatrix(); noStroke(); } else if (index === 9) { // Cowboy Hat (White) stroke(52, 52, 52); strokeWeight(2.3); pushMatrix(); scale(1.5); translate(0, -3); fill(230, 230, 230); arc(0, 5,34, 26, -14, 195); arc(0, 2, 33, -16, 0, 180); noStroke(); ellipse(0, 2, 30, 4); stroke(52); strokeWeight(2); fill(173, 173, 173); arc(0, 7.5, 13, 13, -20, 373); fill(230, 230, 230); arc(0, 9.8,8, 8, -20, 373); popMatrix(); noStroke(); }else if (index === 10) { // Cowboy Hat (Blue) stroke(52, 52, 52); strokeWeight(2.3); pushMatrix(); scale(1.5); translate(0, -3); fill(22, 116, 179); arc(0, 5,34, 26, -14, 195); arc(0, 2, 33, -16, 0, 180); noStroke(); ellipse(0, 2, 30, 4); stroke(52); strokeWeight(2); fill(112, 168, 181); arc(0, 7.5, 13, 13, -20, 373); fill(20, 103, 181); arc(0, 9.8,8, 8, -20, 373); popMatrix(); noStroke(); } popStyle(); popMatrix(); }; / * NATUWARS v0.4 Player Mockup * Prototypes: * display - Only U.prototype.display is needed */ var U = function(data) { this.trait = ''; // scout, juggernaut, bounty hunter, engineer? (building) this.traitlevel = 0; this.won = false; this.x = data.x; this.y = data.y; this.angle = 0; this.rad = data.rad; this.maxHealth = 100; this.axe = 1; this.altCursor = !true; this.cursorType = 0; //0 1 or 2 if altcursor is true this.xv = 0; this.yv = 0; this.speed = 0.6; this.normalSpeed = 0.6; this.scoutSpeed = 0.6 + (0.06 this.traitlevel); this.skin = data.skin; this.weapon = "fists"; this.reload = false; this.rnum = 0; this.kills = 0; this.shotsFired = []; this.health = data.health; this.haSize = 0; this.healRate = 4; this.zaSize = 0; this.killData = []; this.score = 0; this.weaponLevel = 0; this.food = 100; this.water = 100; this.wood = 0; this.rock = 0; this.money = 0; this.dead = false; this.timeAlive = 0; this.weapons = ["pistol", "musket", "AR", "SMG"]; this.recoil = 0; }; U.prototype.display = function() { pushMatrix(); pushStyle(); translate(this.x, this.y); scale(1); rotate( Math.atan2(mouseX - width / 2, -(mouseY - height / 2)) * (180 / PI)); noStroke(); fill(67, 207, 16, 20); ellipse(0, 0, this.haSize * 5, this.haSize * 5); fill(255, 0, 0, 20); ellipse(0, 0, this.zaSize * 5, this.zaSize * 5); // ellipse(0, 0, this.zaSize4, this.zaSize4); //ellipse(0, 0, this.zaSize3, this.zaSize3); //textSize(300); //text(this.weaponLevel, 0, 0); stroke(0, 0, 0); stroke(52, 51, 52); strokeWeight(3); fill(223,173,104); ellipse(-14, -15, 20, 20); ellipse(14, -15, 20, 20); pushStyle(); noStroke(); fill(0, 0, 0, 20); ellipse(0, 0, this.rad * 1.25, this.rad * 1.25); popStyle(); fill(this.skin); ellipse(0, 0, this.rad, this.rad); skins(skinIndex, 0, 0, 1, 1, 0); popStyle(); popMatrix(); }; var mockup = new U({ x: width/2, y: height/2, rad: 45, speed: 0.5, //skin: color(0xffBF8F54), skin: color(252, 200, 118), health: 100, }); var btn123color=color(7, 87, 11),btn123color2= color(0, 0, 0),btn123size=25,btn123size2=25; draw = function() { background(255, 0, 0); switch (scene) { case 'logo': // No need break; case 0: background(148, 148, 148); noStroke(); for (var i = 0; i < 5; i++) { fill(138, 138, 138); rect(0+i2width/7, 0, width/7, height); } LSLogo(35, 41, 0.5, 0); fill(255); text('', width / 2, height / 2); pushStyle(); translate(-(width/2)(skinScale-1), -(height/2)(skinScale-1)); scale(skinScale); mockup.display(); popStyle(); textFont(createFont('Helvetica'), 40); fill(0, 0, 0); text('SKIN ' + (skinIndex+1) + '/11', width/2, height- 50); text('NATUWARS Chest Skins', width/2, 50); textSize(16); text('Batch 1 - Released 22 September 2024\nNot season skins or limited time skins.\nAll of these skins will be available through chests.\nClick on left or right side of screen to go back or forward.', width/2, 126); textSize(btn123size); fill(btn123color); text('< BACK', 63, height- 50); textSize(btn123size2); fill(btn123color2); text('NEXT >', width-63, height- 50); break; } if (testing === false) { LOGORUN('logo', 0, 255, 255, 255); } else { scene = 0; } if (mouseX >= width/2) { btn123size = lerp(btn123size, 20, 0.1); btn123color = color(0, 0, 0); btn123color2 = color(7, 87, 11); btn123size2 = lerp(btn123size2, 25, 0.1); } else { btn123size2 = lerp(btn123size2, 20, 0.1); btn123color2 = color(0, 0, 0); btn123color = color(7, 87, 11); btn123size = lerp(btn123size, 25, 0.1); } }; mouseClicked = function() { if (mouseX >= width/2) { skinIndex++; } else { skinIndex--; } if (skinIndex === 11) { skinIndex = 0; } if (skinIndex === -1) { skinIndex = 10; } }; // (c) 2024-Present LeaferStudios (https://www.khanacademy.org/profile/kaid_553656479258879622339276/projects) //}
Folds	23,509
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgNuezfGdCQw
Votes	2
Spin-Offs	0
Type	PJS
Width	600
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	LeaferStudios
Author Name	LeaferStudios
Author ID	kaid_553656479258879622339276
Author Profile Access	PUBLIC

Archive Data

Added	3 months ago, 1727123252531
Updated	3 months ago, 1727123252531
Source Deleted	unknown