Recreating Discord Miner!

Hello! Welcome to Keplerteddy! And here is a post about my latest video, “Creating Discord Miner with code!” As you probably saw, it was mainly time lapse 😛 But there is more to it than you think! Get ready for some bonus content!

What I did add: Wooden, Stone, Iron, Gold, Diamond Pickaxes. Digging with different speeds. Levelling, Material Count.

What I added but never used: Material Graphics.

What I didn’t add: Redstone, Lapis, Emeralds, More Pickaxes, Bonuses, Enchantments, Long Term Saving, Trading, Money!

That’s all I’ve done on the game, I spent 1½ hours making this, and the graphics were made from 24 Hour Minecraft, saving me at least 15 minutes. Obviously, you probably want to try out the project for yourself! Just click this link to go to the Miner. You just hold to mine, pretty simple concept, let’s go thru the code to get a better understanding! Those 418 lines of code are just far too confusing!

Alright, the first few lines of code are mainly graphics, I store the information in string arrays:

{ //STONE
    d: [
        "001220",
        "011110",
        "020020",
        "002111",
        "111200",
        "001010",
    ],
    cs: [color(156, 156, 156),color(160),color(150),],
},

It checks the values in the array and will output the colour required, for example, 0 could be transparent, 1 could be yellow, 2 could be blue! you can add up to 10 values (0 – 9), You could put letters in too, but you’d need some conversion function. 

var Bs = function(block){
    strokeWeight(0.01);
    if(block === 0){
        // AIR
    }
    else{
        noStroke();
        for(var i = 0;i < 6;i ++){
            for(var j = 0;j < 6;j ++){
                var C = floor(BCs[block-1].d[i][j]);
                fill(BCs[block-1].cs[C]);
                rect(j*10, i*10, 10, 10);
            }
        }
    }
};

Then we have to store the images of the blocks. So instead of putting hundreds of rectangles every single frame,  we can store it in an image and it would just paste the image once every frame. It’s transparent too, Make sure you make a transparent background first, this is the best way to create images and then display them after:

var BGs = [];
var Block = function(){
    for(var i = 0;i < BCs.length+1;i ++){
        noStroke();
        background(0, 0, 0, 0);
        Bs(i);
        BGs.push(get(0, 0, 60, 60));
    }
    return{draw: function(x, y, w, r, block) {
        w = w || 60;
        pushMatrix();
        translate(x, y);
        rotate(r);
        image(BGs[block], -w/2, -w/2, w, w);
        popMatrix();
    }};
}();

Now we can easily call the blocks like this without any lag!

        Block.draw(30+i*60, 30+120+j*60, 60, 0, Bs[i][j].t+1);

Now we want to focus on the gameplay! We want to focus on drawing the blocks first! This first piece of the for loop consists of increasing the alpha on the block so it shows, or technically it’s actually the other way around as we are just making the box that seems to be part of the background’s alpha decrease. We also display the box in between

/** DRAW THE BLOCKS **/
for(var i = 0;i < Bs.length;i ++){
    for(var j = 0;j < Bs[i].length;j ++){
        Bs[i][j].a +=1/180;
        Bs[i][j].a = constrain(Bs[i][j].a, 0, 1);
        Block.draw(30+i*60, 30+120+j*60, 60, 0, Bs[i][j].t+1);
        fill(64, 64, 64, 255-Bs[i][j].a*256);
        rect(i*60, 120+j*60, 60, 60);

The other bit is kind of confusing, first we check if the alpha is whole or otherwise we won’t let the cracks show nor will we let the player dig. If the alpha is 1, we will check another if statement if the broken amount is more or equal to one which then we will show the cracks.

We will have another if statement if the alpha conditions apply. It checks if the mouse is being pressed and if the cursor is in the boundaries of those positions. If not, then it will reset the break state, removing all progress.

Otherwise, the break speed will increase by the pickaxe level divided by 60. Which is the frames per second as well! it will check if the break amount is past one, which means it will do the very complex function of: Picking an amount of the material varying on the pickaxe; spawning particles with very well set instructions; Resetting the Alpha so the block completely disappears; Resetting the cracks and lastly, Changing the block to a different type. Whew, that’s a lot, 

        if(Bs[i][j].a === 1){
            if(floor(Bs[i][j].b*6) >= 1){Break.draw(i*60, 120+j*60, 60, 60, constrain(floor(Bs[i][j].b*6-1), 0, 5));}
            if(mouseIsPressed && mouseX > i*60 && mouseY > 120+j*60 && mouseX < 60+i*60 && mouseY < 60+120+j*60){
                Bs[i][j].b +=pickaxe/60;
                if(Bs[i][j].b >= 1){
                    var am = floor(random(1*pickaxe, 5*pickaxe));
                    for(var a = 0;a < am;a ++){
                        Ps.push({p:new P(60-15+i*60+random(-10, 10), 60-15+120+j*60+random(-10, 10), random(12, 30), "moveto", {gx: 300+Bs[i][j].t*50+15+random(-10, 10), gy: 35+15+random(-10, 10), r:0,rs:random(-5, 5), sp: 0, g:1+Bs[i][j].t})});
                    }
                    Bs[i][j].a = 0;
                    Bs[i][j].b = 0;
                    Bs[i][j].t = GetBlock(pickaxe);
                }
            }
            else{
                Bs[i][j].b = 0;
            }
        }
    }
}

Those are basically the main components, I won’t go thru and detail everything though! Because this would get too long and I’m already having so much fun playing this game! Speaking of Discord Miner, you can add the official (not mine) bot to your discord server using this shiny piece of text here! 

However the post isn’t over yet! I give you some challenges! Be sure to spin off my project and take a shot at these!

• EASY: Add a delay between the appearance of the blocks!
• MEDIUM: Add Emeralds to the game!
• HARD: If you know code from the ups and downs, try creating an efficient bot that mines itself. (For example, make it look out for the ores like Diamond or Gold)

Good Luck! Hope you enjoyed this post! Be sure to leave a comment and a like on the post! 😀