Viewing Program

Program Data

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

Title	Minecraft World
ID	1198524768
Created	Unknown
Updated	13 years ago, 1354729517063
Code	// A demonstration of drawing a Minecraft World // Uses the data and code from: // http://www.khanacademy.org/cs/3d-minecraft-tunnel/1193254153 // Move using the arrow keys // Click a tile to change it to another type // There are 10 block types: // 0 = Nothing // 1 = Grass // 2 = Dirt // 3 = Coal Ore // 4 = Stone // 5 = Brick // 6 = Diamond Ore // 7 = Wood // 8 = Leaves // 9 = Water // Note: Blocks after 9 go A, B, C, D, etc. var numBlocks = 10; // A simple level, edit to change it! var level = [ " ", " 88 5 ", " 888 555 ", " 7 555 ", "1111111111111111111199999", "2326424422422222222229999", "2244224444222222222229999" ]; // Blocks are 16 by 16 pixels var blockWidth = 16; var blockHeight = 16; // How large a single pixel of a block should be var blockScale = 4; // Each block has three sides: // 0 = Top // 1 = Side // 2 = Bottom // You can choose which one to draw // by default the Side (1) is drawn var blockSide = 1; // Draw a block // Takes two arguments: // block (which is the # of the block to draw) // side (which side to draw) // seed (optional, to keep the same pattern on the block) var drawBlock = function(block, side, seed) { // If a seed is provided, keep the same // pattern on the block if (seed !== undefined) { randomSeed(seed); } // Randomly dim the block var br = 255 - floor(random(96)); // Only compute the side of the block we need var sideStart = side * blockHeight; for (var y = sideStart; y < sideStart + blockHeight; y++) { for (var x = 0; x < blockWidth; x++) { // Base color for dirt blocks var pxColor = color(150, 108, 74); // Coal Ore if (block === "3") { pxColor = color(127, 127, 127); if (floor(random(5)) === 0) { pxColor = color(0, 0, 0); } } // Diamond Ore if (block === "6") { pxColor = color(127, 127, 127); if (floor(random(5)) === 0) { pxColor = color(50, 235, 235); } } // Base color for stone if (block === "4") { pxColor = color(127, 127, 127); } // Add speckles to the blocks // (Randomly dim the block color more.) // (For stones, make it happen less often // which makes it streak-y.) if (block !== "4" \|\| floor(random(3)) === 0) { br = 255 - floor(random(96)); } // Grassy blocks if (block === "1") { // Draw the top of the side grass // (Use some math for making grass droop) var sideGrassLength = blockHeight + (blockHeight / 8) + (((x * x * 3 + x * 81) >> 2) & 3); if (y < sideGrassLength) { pxColor = color(106, 170, 64); // Draw the side grass shadow // (Dim the dirt by 1/3) } else if (y < sideGrassLength + 1) { br = 2 / 3; } } // Wood block if (block === "7") { // Dark brown base color pxColor = color(103, 82, 49); // Draw the top and bottom of the wood if (x > 0 && x < blockWidth - 1 && ((y > 0 && y < blockHeight - 1) \|\| (y > blockHeight 2 && y < blockHeight * 3 - 1))) { pxColor = color(188, 152, 98); // Draw the rings on the wood var xd = (x - 7); var yd = ((y & 15) - 7); if (xd < 0) { xd = 1 - xd; } if (yd < 0) { yd = 1 - yd; } if (yd > xd) { xd = yd; } // Randomly dim the tops and bottoms // of the wood block br = 196 - floor(random(32)) + xd % 3 * 32; // Add the dark streaks in the wood side } else if (floor(random(2)) === 0) { br = (150 - (x & 1) 100) / 100; } } // Red brick blocks if (block === "5") { // Red base color pxColor = color(181, 58, 21); // Add the white break streaks // Stagger the rows of bricks // Add line every brick row if ((x + (y >> 2) * 4) % (blockWidth / 2) === 0 \|\| y % (blockHeight / 4) === 0) { pxColor = color(188, 175, 165); } } // Blue water block if (block === "9") { pxColor = color(64, 64, 255); } var brr = br; // Make all the bottom sides darker // (divide the color in half) if (y >= blockHeight * 2) { brr /= 2; } // Hanging grass/vine block if (block === "8") { // Use green as the base color pxColor = color(80, 217, 55); // Randomly make parts invisible if (floor(random(2)) === 0) { pxColor = 0; brr = 255; } } // Only draw something if we have a color if (pxColor) { // Darken the pixel using this color var darkColor = color(brr, brr, brr); // Multiply the color with the darkening // color, creating the new one stroke(blendColor(pxColor, darkColor, MULTIPLY)); // Draw the pixel onto the screen point(x, y - sideStart); } } } }; var sky = getImage("space/background"); // Where the screen is currently positioned var posX = 0; // How many tiles in a level there are var numTiles = level[0].length; // How many tiles to show at a time var showTiles = ceil(width / (blockScale * blockWidth)) + 1; var draw = function() { // Draw the background image(sky, 0, 0); // Shift the blocks on the screen var xOffset = -posX % blockWidth; // Make sure the blocks line up with the bottom var yOffset = (height - (blockHeight * blockScale * level.length)) / blockScale; // Get the tile we'll start draw var firstTile = floor(posX / blockWidth) % numTiles; // Increase the size of the blocks scale(blockScale, blockScale); // Go through each vertical layer of the level for (var l = 0; l < level.length; l += 1) { var tiles = level[l]; // Grab out all the tiles on the screen for (var tile = firstTile, pos = 0; tile < firstTile + showTiles; tile += 1, pos += 1) { // Get the tile we'll draw var t = tile % numTiles; // Loop the tiles around if (t < 0) { t += tiles.length; } // Position of block var left = pos * blockWidth + xOffset; var top = l * blockHeight + yOffset; // Scaled mouse position var mx = mouseX / blockScale; var my = mouseY / blockScale; // Mouse is clicking block if (mouseIsPressed && mx >= left && mx <= left + blockWidth && my >= top && my <= top + blockHeight) { // Get the new block to toggle to var newBlock = (floor(tiles[t]) + 1) % numBlocks; // Handle A .. Z blocks (beyond 0 .. 9) if (newBlock >= 10) { newBlock = String.fromCharCode(newBlock + 55); } // Switch the tile to the next tile tiles = level[l] = tiles.substr(0, t) + newBlock + tiles.substr(t + 1); } // NOTE: If you're going to use this to make // levels then be sure to log out the new // level structure using: //debug(level); // Don't draw empty tiles if (tiles[t] !== " " && tiles[t] !== "0") { // Make sure that the block will always // have the same pattern var seed = l * t; // Make the leaves and water constantly shift // Gives a sense of motion if (tiles[t] === "8" \|\| tiles[t] === "9") { seed = second(); } // Draw the block at the specified position pushMatrix(); translate(left, top); drawBlock(tiles[t], blockSide, seed); popMatrix(); } } } resetMatrix(); // Handle user navigation if (keyIsPressed) { if (keyCode === RIGHT) { posX += 5; } else if (keyCode === LEFT) { posX -= 5; } // Loop back around if we go too far if (posX < 0) { posX += numTiles blockWidth; } } };
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIUCxIKU2NyYXRjaHBhZBjgksC7BAw
Votes	1641
Spin-Offs	1369
Type
Width	400
Height	400
User Flagged	false
Origin Scratchpad	{"id":"1193254153","title":"3D Minecraft Tunnel","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	true
By Child	false
Author Nick	John (Khan Team)
Author Name	john
Author ID	kaid_793081664775613255842983
Author Profile Access	PUBLIC

Archive Data

Added	1 years ago, 1707881089696
Updated	1 years ago, 1707884029730
Source Deleted	unknown