Viewing Program

Program Data

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

Title	Astralume
ID	5335537740972032
Created	7 years ago, 1538000485097
Updated	7 years ago, 1538000509653
Code	/I have been programming for about 22 months, and I have completed 100% of Intro to JS. Credit: to ChainLink for using translate to get a smoother oscillating motion for small changes per frame If you want to subscribe by any chance, you can go here: https://www.khanacademy.org/computer-programming/subscribe-to-reader-writer-penguin/5019495151632384 I know this won't win lol, I did this in three days, but it was fun making it, and I hope you'll like it!/ //code { //transparent background background(0, 0, 0, 0); //smooth smooth(); //loading the images (like, two, but it's easier on the computer){ var images = { "city": function(){ pushMatrix(); translate(69, 203); scale(0.98); //a light sparkle function { var sparkle = function(x, y, amt, rot, alpha){ pushMatrix(); translate(x, y); scale(amt); rotate(rot); noStroke(); (fill)(255, alpha); var numrots = floor(random(4, 6)); for(var i = 0; i < 360; i += 360/numrots){ pushMatrix(); rotate(i); triangle(-2, 0, 2, 0, 0, -10); popMatrix(); } popMatrix(); }; //} //foundation { noStroke(); //background "glass" fill(180, 224, 237, 100); beginShape(); vertex(74, 64); vertex(212, 64); vertex(196, 153); vertex(144, 216); vertex(136, 216); vertex(77, 136); endShape(); //lighting on glass stroke(255, 255, 255, 5); for(var i = 0; i < 15; i++){ strokeWeight(i2); line(196, 70, 120, 178); line(153, 70, 120, 114); strokeWeight(i); line(115, 70, 77, 110); } //bottom part function(it's symmetrical, and allows me to have holes without using mask) noStroke(); var oneside = function(x, y, flip){ pushMatrix(); translate(x, y); if(flip){ scale(1, -1); rotate(180); } fill(153, 153, 153); beginShape(); vertex(141, 63); vertex(161, 71); vertex(197, 94); vertex(192, 125); vertex(206, 94); vertex(189, 69); vertex(210, 63); bezierVertex(216, 65, 198, 154, 234, 127); bezierVertex(237, 145, 196, 134, 172, 200); vertex(141, 200); vertex(154, 192); vertex(141, 190); bezierVertex(172, 145, 170, 173, 192, 136); bezierVertex(182, 166, 153, 136, 147, 173); vertex(141, 188); vertex(141, 162); vertex(169, 120); vertex(161, 103); vertex(141, 161); vertex(156, 99); vertex(148, 81); vertex(141, 160); endShape(); popMatrix(); }; //bottom part oneside(0, 0, false); oneside(283, 0, true); //shadowing from bottom ridge on part above fill(107, 107, 107, 5); for(var j = 0; j < 10; j++){ arc(140, 130, 173+j1, 5+j2, 0, 180); arc(140, 131, 155+j1, j1.5, 180, 360); } //a function for the ring/ridge shape var ring = function(x, y, amt, col){ pushMatrix(); translate(x, y); scale(amt); var ringshape = function(y, isshadow){ pushMatrix(); translate(0, y); var fillcol = isshadow === true ? color(0, 0, 0, 20):col; fill(fillcol); beginShape(); vertex(0, 0); bezierVertex(49, 16, 193, 29, 270, 0); vertex(270, 20); bezierVertex(243, 56, 16, 46, 0, 20); endShape(); popMatrix(); }; ringshape(4, true); ringshape(0, false); popMatrix(); }; //ridges ring(48, 128, 0.69, color(168, 168, 168)); ring(65, 49, 0.55, color(148, 148, 148)); ring(22, 22, 0.86, color(166, 166, 166)); ring(-33, -10, 1.25, color(191, 191, 191)); //lighting on ridges strokeCap(SQUARE); stroke(255, 255, 255, 5); for(var i = 0; i < 20; i++){ strokeWeight(i2.5); line(140, 11, 140, 43); strokeWeight(i); line(167, 11, 167, 44); strokeWeight(i1.5); line(157, 138, 157, 157); } //"ground" on top noStroke(); fill(75, 176, 44); ellipse(136, -8, 337, 39); //} //actual buildings { //a general building function var building = function(x, y, bwidth, bheight, windw, windh, deccont, colors){ pushMatrix(); translate(x, y); //a variable for color (stroke and stuff) var col = lerpColor(colors[0], colors[1], 0.2); //constraining window bwidth and bheight if(windw < 1){ windw = 1; } if(windh < 1){ windh = 1; } //drawing the building for(var i = 14; i < bheight0.88; i++){ stroke(lerpColor(colors[0], colors[1], i/bheight)); line(0, i, bwidth, i); } //top decorations noStroke(); switch(deccont){ case 1: fill(col); arc(bwidth/2, 0, bwidth, bwidth, 180, 360); ellipse(bwidth/2, -bwidth/2, bwidth0.2, bwidth0.2); stroke(col); strokeWeight(1); line(bwidth/2, bwidth/2-bwidth0.2, bwidth/2, bwidth/2-bwidth1.8); sparkle(bwidth/2+random(-3, 3), bwidth/2-bwidth1.8+random(-20, 24), random(0.7, 1.2), random(0, 360), random(20, 90)); noStroke(); fill(255, 255, 255, 5); pushMatrix(); translate(bwidth3/4, -bwidth/4.1); rotate(-22); for(var i = 0; i < 10; i++){ ellipse(0, 0, i, i1.5); } popMatrix(); break; case 2: fill(lerpColor(col, color(255), 0.5)); triangle(0, 0, bwidth, 0, bwidth0.14, -bwidth0.42); fill(lerpColor(col, color(255), 0.3)); ellipse(bwidth0.4, bheight-0.09, 4, 4); fill(col); triangle(0, 0, bwidth, 0, bwidth0.75, -bwidth0.63); break; case 3: fill(lerpColor(col, color(255), 0.5)); triangle(0, 0, bwidth, 0, bwidth0.1, -bwidth/1.78); triangle(0, 0, bwidth, 0, bwidth0.9, -bwidth/1.78); fill(col); triangle(0, 0, bwidth, 0, bwidth/2, -bwidth/1.28); stroke(col); strokeWeight(1); line(bwidth/2, bwidth/2-bwidth0.2, bwidth/2, bwidth/2-bwidth1.8); break; } //lighting if(floor(random(0, 3)) !== 0){ stroke(255, 255, 255, 10); for(var i = 0; i < bwidth0.5; i++){ strokeWeight(i); line(bwidth0.25, bheight0.2-i, bwidth0.25, bheight0.8+i); strokeWeight(i/3); line(bwidth0.65, bheight0.1-i, bwidth0.65, bheight0.8+i); } } //adding windows noStroke(); for(var i = windw; i < bwidth-windw2; i += windw1.5){ for(var j = windh; j < bheight-windh2; j += windh1.5){ if(floor(random(0, 3)) !== 0){ fill(255, 255, 255, random(90, 150)); rect(i+((bwidth-windw2)%(windw1.5))/2, j+((bheight-windh2)%(windh1.5))/2, windw, windh); } } } popMatrix(); }; //color schemes for the buildings var colorschemes = [[color(116, 111, 222), color(77, 12, 133)], [color(214, 246, 255), color(23, 39, 117)], [color(151, 65, 217), color(83, 81, 84)], [color(209, 171, 206), color(45, 9, 117)], [color(240, 240, 240), color(30, 78, 97)]]; //those two special buildings in the back { //capitol building { pushMatrix(); translate(126, -168); fill(143, 103, 163); rect(0, 0, 35, 170); //texture for(var i = 0; i < 7; i++){ fill(lerpColor(color(255), color(174, 117, 217), abs(i-2.5)/5)); rect(i5+1, i5, 2, 132); } //top parts strokeWeight(1); stroke(238, 207, 255, 190); for(var j = 0; j < 5; j++){ for(var k = 0; k < constrain(j5, 1, 19); k++){ line(20+k2-j5, 10-j2, 20+k2-j5, -29+j6); } } popMatrix(); //} //clock tower { pushMatrix(); translate(193, -134); noStroke(); fill(115, 178, 191); rect(0, 0, 30, 130); fill(227, 227, 227, 90); beginShape(); vertex(0, 0); bezierVertex(14, 36, 21, 10, 30, 130); vertex(0, 130); endShape(); fill(227, 227, 227, 150); beginShape(); vertex(30, 0); bezierVertex(20, 46, -7, 13, 0, 130); vertex(30, 130); endShape(); fill(156, 204, 255); arc(15, 0, 30, 37, 180, 360); triangle(5, -13, 25, -12, 15, -30); ellipse(15, -30, 3, 3); //the texture for(var j = 0; j < 15; j++){ fill(lerpColor(color(28, 126, 217, 120), color(0, 0, 0, 50), j/20)); rect(25-j2, j5+17, 5+j2, 3); } //clock translate(-1, 1); scale(1.07); fill(255); strokeWeight(2); stroke(28, 126, 217); ellipse(15, 0, 25, 25); translate(15, 0); strokeWeight(1); stroke(0); fill(0); textSize(5); for(var i = 0; i < 360; i += 360/12){ pushMatrix(); rotate(i); line(7, 0, 12, 0); text(i/(360/12), 8, 0); popMatrix(); } line(0, 0, 1, -10); line(0, 0, 5, -2); strokeWeight(2); point(0, 0); popMatrix(); //} //} //drawing the city pushMatrix(); translate(-16, -30); scale(0.9); for(var i = 0; i < 20; i++){ var buildingh = constrain(random(50, 150)-random(abs(i-10)14, abs(i-10)6), 20, 200); var buildingw = random(20, 50); var cont = floor(random(0, colorschemes.length)); var index = cont === colorschemes.length ? cont-1:cont; building(i16+random(-10, 10), 30-abs(i-10)1.5-buildingh, buildingw, buildingh, random(2, 5), random(2, 10), floor(random(0, 4)), colorschemes[index]); } //special buildings in front { //the school { pushMatrix(); translate(133, -19); fill(117, 117, 117); rect(0, 0, 40, 60); //gradient triangle strokeWeight(2); for(var i = 0; i < 60; i++){ stroke(lerpColor(color(240, 240, 240), color(150, 150, 150), i/50)); line(abs(i-35), i, 40, i); } //windows noStroke(); var col1 = color(195, 108, 217); var col2 = color(47, 126, 196); for(var k = 0; k < 4; k++){ for(var l = 0; l < 11; l++){ fill(lerpColor(col1, col2, (k5+l)/25)); rect(11+k7, 2+l5, 5, 3); } } //white triangle type thing and gray coverup for windows fill(163, 163, 163); triangle(0, 0, 40, 0, 0, 35); noFill(); stroke(212, 212, 212); strokeWeight(1); for(var j = 0; j < 20; j++){ line(0, j, j2, 60); } //circle thing noStroke(); for(var m = 0; m < 20; m++){ fill(255, 255, 255, 6); ellipse(11, 10, m1.5, m1.5); fill(85, 162, 224, 10); ellipse(11, 10, m, m); } popMatrix(); //} //library { pushMatrix(); translate(29, 32); //back face fill(255, 255, 255, 120); triangle(0, 0, 30, -30sqrt(3), 60, 0); //bookshelves var bookshelf = function(x, y){ pushMatrix(); translate(x, y); noStroke(); fill(158, 97, 40); rect(0, 0, 2, 7); fill(107, 74, 44); quad(2, 0, 2, 7, 5, 6, 5, -1); strokeWeight(2); for(var i = 0; i < 5; i++){ stroke(random(0, 255), random(0, 255), random(0, 255)); point(random(2, 5), random(0, 6)); } noStroke(); popMatrix(); }; for(var i = 0; i < 5; i++){ for(var j = 0; j < constrain(i2, 1, 11); j++){ bookshelf(j7+random(-2, 2)-i7+32, i8-39); } stroke(255, 255, 255, 150); strokeWeight(2); line(-i7+32, i8-32, i7+30, i8-32); } //top few faces noStroke(); fill(255, 255, 255, 120); triangle(0, 0, 30, -30sqrt(3), 30, 6); fill(255, 255, 255, 50); triangle(60, 0, 30, -30sqrt(3), 30, 6); popMatrix(); //} //zoo { pushMatrix(); translate(218, 16); scale(0.95); //variables for easy tweaking var graything = color(150); var othercol = color(158, 225, 247); var zoowidth = 80; //the shape strokeWeight(1); noFill(); for(var i = 0; i < zoowidth; i++){ //background stroke(lerpColor(graything, othercol, i/zoowidth)); arc(0, 0, abs(i-zoowidth/2), zoowidth/2, i-zoowidth/2 <= 0 ? 180:270, i-zoowidth/2 <= 0 ? 270:360); arc(0, 19, abs(i-zoowidth/2), zoowidth/9, i-zoowidth/2 <= 0 ? 90:360, i-zoowidth/2 <= 0 ? 180:450); line((i-zoowidth/2)/2, 0, (i-zoowidth/2)/2, 20); //texture if(i % 8 === 0 && i !== 0){ stroke(245, 245, 245); arc(0, 0, abs(i-zoowidth/2), zoowidth/2, i-zoowidth/2 <= 0 ? 180:270, i-zoowidth/2 <= 0 ? 270:360); line((i-zoowidth/2)/2, 0, (i-zoowidth/2)/2, 25-abs(i-zoowidth/2)/5); } } //circle on top and spire line(0, -zoowidth/4, 0, -zoowidth/2); noStroke(); fill(lerpColor(othercol, color(0), 0.3)); ellipse(0, -zoowidth/4-2, 5, 5); popMatrix(); //} //} popMatrix(); //} //mist/fog { //a function for a misty thing var placers = function(x, y, width, height){ noStroke(); (fill)(255, random(8, 15)); rectMode(CENTER); for(var i = 0; i < random(5, 7); i++){ rect(x, y, width+i5, height+i2, random(width0.1, width0.5)); } sparkle(random(x, x+width), random(y, y-height), random(0.2, 0.7), random(0, 360), random(20, 90)); rectMode(LEFT); }; //drawing them over the city for(var j = 0; j < 25; j++){ var buildingheight = random(10, 20); placers(random(-12, 250), random(10, -72)-buildingheight, random(10, 40), buildingheight); } //} //tree things { //a tree function var tree = function(x, y, amt, flip){ pushMatrix(); translate(x, y); scale(amt); if(flip){ scale(1, -1); rotate(180); } //the actual tree shape noStroke(); fill(255, 255, 255); beginShape(); vertex(0, 0); vertex(0, -31); vertex(7, -35); vertex(16, -30); vertex(12, -36); vertex(14, -46); vertex(28, -53); vertex(16, -50); vertex(15, -58); vertex(12, -48); vertex(10, -41); vertex(5, -38); vertex(1, -38); vertex(4, -49); vertex(10, -52); vertex(14, -58); vertex(7, -54); vertex(4, -54); vertex(4, -66); vertex(0, -51); vertex(-5, -54); vertex(-1, -47); vertex(-4, -40); vertex(-10, -47); vertex(-10, -54); vertex(-12, -46); vertex(-16, -46); vertex(-11, -42); vertex(-5, -36); vertex(-5, -32); vertex(-17, -34); vertex(-17, -39); vertex(-20, -36); vertex(-22, -47); vertex(-23, -37); vertex(-21, -33); vertex(-6, -27); vertex(-4, -21); vertex(-8, 0); endShape(); //base (fill)(255, 70); ellipse(-3, 0, 36, 10); //"leaves" (fill)(255, 130); ellipse(-21, -44, 10, 10); ellipse(-14, -47, 10, 10); ellipse(-11, -57, 10, 10); ellipse(-7, -53, 10, 10); ellipse(3, -62, 10, 10); ellipse(14, -57, 10, 10); ellipse(15, -61, 10, 10); ellipse(28, -51, 10, 10); ellipse(17, -29, 10, 10); popMatrix(); }; //drawing the trees tree(6, -2, 0.35, false); tree(25, 4, 0.39, true); tree(65, 0, 0.29, false); tree(91, 6, 0.38, false); tree(70, 6, 0.26, true); tree(157, 3, 0.34, true); tree(127, 9, 0.28, false); tree(203, 6, 0.26, false); tree(220, 4, 0.32, true); tree(256, -1, 0.32, true); tree(287, -7, 0.32, false); //} //floating light things { noStroke(); var lightcol = color(120, 226, 255); for(var i = 0; i < 22; i++){ var randx = random(-40, 290); var randy = random(-75, -175); if(sq(randx-140) + sq(randy) < sq(190) && i <= 20){ var rands = random(10, 20); (fill)(lightcol, random(8, 15)); for(var j = rands0.5; j < rands1.5; j+=1.5){ ellipse(randx, randy, j, j); } (fill)(255, random(4, 8)); for(var k = 0; k < rands0.85; k++){ ellipse(randx, randy, k, k); } } else if(i > 20){ (fill)(lightcol, random(8, 15)); for(var j = 150.5; j < 151.5; j+=1.5){ ellipse(26, -148, j, j); } (fill)(255, random(4, 8)); for(var k = 0; k < 150.85; k++){ ellipse(26, -148, k, k); } } } //} //dome { stroke(255, 255, 255, 20); strokeWeight(5); strokeCap(ROUND); fill(255, 255, 255, 60); arc(137, -47, 355, 320, 165, 376); noStroke(); triangle(-29, -4, 137, -47, 304, -4); arc(137, -4, 330, 30, 0, 180); stroke(255, 255, 255, 20); //lighting noFill(); strokeWeight(20); stroke(255, 255, 255, 10); arc(247, -60, 94, 134, 295, 397); stroke(255, 255, 255, 10); strokeWeight(23); point(225, -151); //sparkles pushMatrix(); translate(171, 256); for(var i = 0; i < 5; i++){ var randx = random(20, 82); sparkle(randx, -1.7sqrt(abs(sq(250)-sq(randx))), random(1.3, 1.1), random(90, 360), random(20, 50)); } popMatrix(); //} popMatrix(); return get(0, 0, width, height); }, "starback": function(){ //linear gradient var col1 = color(18, 0, 41); var col2 = color(4, 0, 79); for(var i = 0; i < height; i++){ stroke(lerpColor(col1, col2, i/height)); line(0, i, width, i); } //noise overlay noStroke(); for(var i = 0; i < width; i += 5){ for(var j = 0; j < height; j += 5){ var trans = 1000.8-noise(i/50, j/50)75; fill(255, 255, 255, trans); rect(i, j, 5, 5); } } //randomized stars in background for(var i = 0; i < 100; i++){ stroke(255, 255, 255, random(70, 200)); strokeWeight(random(1, 3)); point(random(0, width), random(0, height)); } //star band var slope = -0.59; var yint = 342; noStroke(); for(var i = 0; i < 6; i++){ for(var j = 0; j < 45; j++){ var randx = random(0, width); var y = slope * randx + yint; var rands = random(2, 4); fill(255, 255, 255, random(20, 90)); ellipse(randx, y+random(-5i2.5, 5i2.5), rands, rands); } } //the text pushMatrix(); translate(345, 50); scale(0.7); stroke(255, 255, 255); strokeWeight(1); //A line(0, 0, 15, -40); line(5, 0, 20, -40); line(20, -40, 35, 0); line(14, -20, 27, -20); //s noFill(); arc(54, -30, 20, 19, 80, 305); arc(53, -11, 20, 20, 285, 534); line(50, -38, 50, -22); line(57, -21, 57, -3); //t line(73, -40, 103, -40); line(85, -40, 85, 0); line(90, -40, 90, 0); //r line(114, -40, 114, 0); line(119, -40, 119, 0); arc(121, -29, 27, 20, 270, 450); line(119, -19, 137, 0); //a pushMatrix(); translate(145, 0); line(0, 0, 15, -40); line(5, 0, 20, -40); line(20, -40, 35, 0); line(14, -20, 27, -20); popMatrix(); //l line(190, -40, 190, 0); line(195, -40, 195, 0); line(214, 0, 195, 0); //u line(220, -40, 220, -10); arc(231, -10, 21, 24, 108, 180); line(225, -40, 225, -10); arc(237, -10, 23, 20, 0, 180); line(248, -40, 248, -10); //m line(260, -40, 260, 0); line(265, -40, 265, 0); line(265, -40, 283, 0); line(302, -40, 283, 0); line(302, -40, 302, 0); //e line(317, -40, 317, 0); line(322, -40, 322, 0); line(322, -40, 341, -40); line(322, -20, 341, -20); line(322, 0, 341, 0); fill(235, 235, 235, 180); textSize(18); textAlign(CENTER); text("The first of its kind", 175, 33); popMatrix(); return get(0, 0, width, height); } }; var loaded = false; var loadindex = 0; var load = function(){ if(loadindex < Object.keys(images).length){ images[Object.keys(images)[loadindex]] = images[Object.keys(images)[loadindex]](); loadindex++; } else { loaded = true; } }; //} //some variables { var messagex = 400; var messagey = 380; var hovering = false; var textopacity = 0; //} //info button constructor { var Info = function(title, message, circx, circy){ this.text = message; this.title = title; this.x = circx; this.y = circy; this.radius = 10; this.originalradius = this.radius; this.angle = atan((messagey-this.y)/(messagex-this.x)); this.slantedlinelength = 0; this.linelength = 0; this.rectwidth = 0; this.rectheight = 270; this.finalrectwidth = 180; this.opacity = 0; }; Info.prototype.display = function(){ //the info button stroke(0, 162, 255, 200); strokeWeight(2); fill(40, 125, 222, 90); ellipse(this.x, this.y, this.radius2, this.radius2); stroke(255, 255, 255); noFill(); strokeWeight(this.radius/7); arc(this.x-this.radius0.05, this.y-this.radius0.3, this.radius0.6, this.radius0.6, 200, 425); arc(this.x, this.y+this.radius0.2, this.radius0.3, this.radius0.4, 139, 252); strokeWeight(this.radius/5); point(this.x-1, this.y+this.radius0.7); //if lines are greater than certain lengths draw them if(this.slantedlinelength > this.radius){ pushMatrix(); translate(this.x, this.y); rotate(this.angle); strokeWeight(6); stroke(54, 183, 209, 30); line(this.radius, 0, this.slantedlinelength, 0); strokeWeight(1); stroke(54, 183, 209, 160); line(this.radius, 0, this.slantedlinelength, 0); popMatrix(); } if(this.linelength > 1){ strokeWeight(6); stroke(54, 183, 209, 30); line(messagex, messagey, messagex+this.linelength, messagey); strokeWeight(1); stroke(54, 183, 209, 160); line(messagex, messagey, messagex+this.linelength, messagey); } //at a certain point draw the rect if(this.linelength > 1){ noStroke(); fill(130, 224, 232, 60); rect(messagex, messagey-this.rectheight-12, this.rectwidth+8, this.rectheight+8); fill(130, 224, 232, 130); rect(messagex+4, messagey-this.rectheight-8, this.rectwidth, this.rectheight); (fill)(255, 20); rect(messagex+10, messagey-this.rectheight-8, this.rectwidth/7, this.rectheight); if(this.rectwidth > 50){ rect(messagex+50, messagey-this.rectheight-8, floor(this.rectwidth/17), this.rectheight); } if(this.rectwidth > 130){ rect(messagex+130, messagey-this.rectheight-8, floor(this.rectwidth/17), this.rectheight); } } //the message (fill)(255, this.opacity); textSize(18); textAlign(CENTER); text(this.title, messagex+this.rectwidth/2, messagey-this.rectheight+10); textSize(15); textAlign(LEFT); text(this.text, messagex+8, messagey-this.rectheight+20, this.finalrectwidth-5, this.rectheight); }; Info.prototype.update = function(){ //if hovering if(dist(mouseX, mouseY, this.x, this.y) <= this.radius){ //cursor is pointer cursor(HAND); //set hovering to true hovering = true; //increase size of info button if(this.radius < this.originalradius1.4){ this.radius += 2; } //draw slanted line this.slantedlinelength = lerp(this.slantedlinelength, dist(this.x, this.y, messagex, messagey), 0.1); //once slanted line is at a certain point, draw straight line and rect if(this.slantedlinelength > dist(this.x, this.y, messagex, messagey)0.98){ this.linelength = lerp(this.linelength, this.finalrectwidth+10, 0.1); this.rectwidth = lerp(this.rectwidth, this.finalrectwidth, 0.1); } //one straight line and rect are drawn, draw text if(this.rectwidth > this.finalrectwidth0.98 && this.opacity <= 255){ this.opacity += 25; } } //otherwise else { //decrease radius if(this.radius > this.originalradius){ this.radius -= 2; } //decrease opacity first if(this.opacity > 0){ this.opacity -= 25; } //once opacity is 0, decrease rect width and lines if(this.opacity <= 0){ this.linelength = lerp(this.linelength, 0, 0.1); this.rectwidth = lerp(this.rectwidth, 0, 0.1); if(this.linelength <= 1){ this.slantedlinelength = lerp(this.slantedlinelength, 0, 0.1); } } } }; //} //infos { var infos = [ new Info("The Library", "Books are rare occurances by now in this futuristic world, but as relics of past learning and knowledge, many old scrolls and tomes have been transferred into this glass pyramid to be preserved. This is more of a tourist location than one of study and use.", 106, 180), new Info("School", "All classrooms are merely rooms where teachers can sit and plan out lessons, and, during classes, where students and teachers meet holographically. It serves as a physical place for students to manifest--only occasionally do some of them enter the building.", 185, 193), new Info("The Zoo", "During the construction and moving into of this city, many species of animals were transferred into this zoo as a reminder of the past, and to provide life other than that of humans on the island.", 254, 193), new Info("The Clocktower", "In this mainly digital world where almost nothing has physical manifestations anymore, the clocktower perhaps isn't quite necessary but is a beautiful reminder of past centuries. The chimes on each hour grounds the citizens in their reality that's becoming more and more in their mind.", 271, 105), new Info("Capitol Building", "The tallest building in the skyline, the capitol building is one of the few that still remains entered and exited on a relatively frequent basis. It's the headquarters of the city, where business is done and order is kept.", 207, 49), new Info("Lights", "The lights serve as regulatory presences in the sky, keeping the weather under control. They drift and float as they please for the most part, but on special occasions they may be used in a more theatrical manner, almost like fireworks.", 107, 59), new Info("Trees", "The trees are not like the trees of the past, instead very similar to the glowing lights in the sky. They take in and analyze surrounding environmental factors, such as air quality, and their \"leaves\" both serve as an air filter and lights when night falls.", 56, 186) ]; //} //drawing it all { var draw = function() { if(!loaded){ load(); } else { //resetting cursor cursor(ARROW); //the background image(images.starback, 0, 0); //the city pushMatrix(); translate(0, sin(frameCount)5); image(images.city, 0, 6); popMatrix(); //drawing the information buttons for(var i in infos){ infos[i].update(); infos[i].display(); } //the information text if(!hovering){ if(textopacity < 150){ textopacity += 2; } } else { if(textopacity > 0){ textopacity -= 8; } } fill(255, 255, 255, textopacity); textSize(15); textAlign(CENTER); text("Hover on one of the bubbles for more information on the object.", 430, 143, 100, height); //resetting hover hovering = false; } }; //} //}
Folds	8,939
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgPL9ypS9CQw
Votes	229
Spin-Offs	6
Type	PJS
Width	600
Height	400
User Flagged	false
Origin Scratchpad	{"id":"5632647043514368","title":"Contest: Futuristic Tech","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Reader Writer Penguin
Author Name	WriterPenguin1127
Author ID	kaid_660115468292459786165770
Author Profile Access	PUBLIC

Archive Data

Added	10 months ago, 1739380454578
Updated	10 months ago, 1739380464056
Source Deleted	unknown