search

max-mapper / voxel-engine

3D HTML5 voxel game engine
http://maxogden.github.com/voxel-engine
BSD 3-Clause "New" or "Revised" License
1.29k stars 219 forks source link

I have this issue with blocks with transparency like glass or leaaves: #141

Open DrFrankatron opened 7 months ago

DrFrankatron commented 7 months ago

I have this issue with blocks with transparency like glass or leaaves: There its my code:

createGame = require('voxel-engine')
voxelGlass = require('voxel-glass')
voxel = require("voxel")

rnd1=()=>{
  return Math.random()
}
noise2d=(i,k)=>{
  return noise.simplex2(i,k)
}
noise3d=(i,j,k)=>{
  return noise.simplex3(i,j,k)
}
getSurfaceAt=(i,k)=>{
  return Math.floor(noise2d(i/10000,k/10000)*625+noise.simplex2(i/1000,k/1000)*125+noise.simplex2(i/100,k/100)*25)
}
getBiomeAt=(i,k)=>{
  noise1=noise2d(i/10**4,k/10**4)*100
  if( 33 <noise1&&noise1<=100){return "forest"}
  if(-33 <noise1&&noise1<= 33){return "meadows"}
  if(-100<noise1&&noise1<=-33){return "desert"}
}

initx=Math.random()*10**5
initz=Math.random()*10**5

var game = createGame({
  texturePath: 'textures/',
  generate: function(i, j, k) {
    let biome=getBiomeAt(i,k);
    let surface=getSurfaceAt(i,k)
    let target2d=noise2d(i/10,     k/10)
    let target3d=noise3d(i/10,j/10,k/10)
    if(biome=="forest"){
      //Forest.
      if(     j<surface-10&&                                                         target3d< 0.00)   {return 3}//Stone.
      else if(surface-10<j&&j<surface&&                                              target3d< 0.50)   {return 2}//Dirt.
      else if(surface===j&&                                                          target3d< 0.50)   {return 1}//Grass.
      else if(j===surface+1&&rnd1()<0.1&&                                            target3d< 0.00)   {return 5}//Bushes.
      else if(j>surface-100&&j<surface+15&&i%4<1&&k%4<1&&                            target2d<-0.50)   {return 4}//Trunks.
      else if(j>surface+10&&j<surface+15                                                           )   {return 5}//Leaves.
    }else if(biome=="meadows"){
      //Meadows.
      if(     j<surface-10&&                                                         target3d< 0.00)   {return 3}//Stone.
      else if(surface-10<j&&j<surface&&                                              target3d< 0.50)   {return 2}//Dirt.
      else if(surface===j&&                                                          target3d< 0.50)   {return 1}//Grass.
      else if(j===surface+1&&i%3!=1&&k%3!=1&&noise3d((i+1000)/10,j/10,k/10)<0&&      target3d< 0.00)   {return 5}//Bushes.
    }else if(biome=="desert"){
      //Desert.
      if(     j<surface-10&&                                                         target3d< 0.25)  {return 11}//Sandstone.
      else if(surface-10<j&&j<surface&&                                              target3d< 0.25)  {return 8}//Sand.
      else if(j<surface+4&&i%2<1&&k%2<1&&                                            target2d<-0.50)  {return 9}//Cactus body.
      else if(j===surface+4&&i%2<1&&k%2<1&&                                          target2d<-0.50)  {return 10}//Cactus head.
    }
  },
  plugins:[voxelGlass],
  materials: [
    ['grass', 'dirt', 'grass_dirt'],
     'dirt',
     'stone',
     ['trunk_top', 'trunk_top', 'trunk_side'],
     'leaves',
     'planks',
     'bricks',
     'sand',
     ['cactus_bottom', 'cactus_bottom', 'cactus_side'],
     ['cactus_top', 'cactus_bottom', 'cactus_side'],
     ['sandstone'],
     ['stone_pickaxe'],
     ['stone_axe'],
     ['stone_shovel'],
     ['stone_hoe'],
     ['glass']
  ],
  meshers:[
    voxel.meshers.greedy,
    voxel.meshers.transgreedy,
  ],
  lightsDisabled: false,
  fogDisabled: true,
  chunkDistance: 2,
  chunkSize: 16
});
game.materials.doubleSided = true
container=document.body
game.appendTo(container)
createPlayer=require('voxel-player')(game)
fawful=createPlayer('fawful.png')
fawful.possess()
fawful.yaw.position.set(initx,getSurfaceAt(initx,initz)+10,initz)
totalBlocks1Sum=0
currentBlock=12
blocks1={}
for(i=1;i<=11;i++){//A bunch of blocks.
  blocks1[i]={c:0,dur:0,space:1}
}
for(i=12;i<=15;i++){//Tools.
  blocks1[i]={c:1,dur:100,space:32}
}
for(i=16;i<=16;i++){//Glass.
  blocks1[i]={c:0,dur:0,space:1}
}
crafting=false
health={current:100,max:100}
food={current:100,max:100}
energy={current:100,max:100}
currentCraft=1
document.addEventListener("keydown",(e)=>{
  if(e.key=='g'){

  }
  if(e.key=='q'&&currentBlock>1){
    currentBlock--
    while(blocks1[currentBlock].c==0&&currentBlock>1){
      currentBlock--
    }
  }else if(e.key=='q'&&currentBlock==1){
    currentBlock=16
    while(blocks1[currentBlock].c==0&&currentBlock>1){
      currentBlock--
    }
  }
  if(e.key=='e'&&currentBlock<16){
    currentBlock++
    while(blocks1[currentBlock].c==0&&currentBlock<16){
      currentBlock++
    }
  }else if(e.key=='e'&&currentBlock==16){
    currentBlock=1
    while(blocks1[currentBlock].c==0&&currentBlock<16){
      currentBlock++
    }
  }
  if(e.key=='z'){
    if(currentCraft>0){
      currentCraft--
    }
  }
  if(e.key=='x'){
    //1 wood + 1 stone => stone pickaxe.
    if(currentCraft==1&&totalBlocks1Sum<512-32&&blocks1[3].c>=1&&blocks1[4].c>=1){
        crafting=true
        setTimeout(()=>{
            crafting=false
            blocks1[12].c++;blocks1[3].c--;blocks1[4].c--
        },3000)
    }
    //1 wood + 1 stone => stone axe.
    if(currentCraft==2&&totalBlocks1Sum<512-32&&blocks1[3].c>=1&&blocks1[4].c>=1){
        crafting=true
        setTimeout(()=>{
            crafting=false
            blocks1[13].c++;blocks1[3].c--;blocks1[4].c--
        },3000)
    }
    //1 wood + 1 stone => stone shovel.
    if(currentCraft==3&&totalBlocks1Sum<512-32&&blocks1[3].c>=1&&blocks1[4].c>=1){
        crafting=true
        setTimeout(()=>{
            crafting=false
            blocks1[14].c++;blocks1[3].c--;blocks1[4].c--
        },3000)
    }
    //1 wood + 1 stone => stone höe.
    if(currentCraft==4&&totalBlocks1Sum<512-32&&blocks1[3].c>=1&&blocks1[4].c>=1){
        crafting=true
        setTimeout(()=>{
            crafting=false
            blocks1[15].c++;blocks1[3].c--;blocks1[4].c--
        },3000)
    }
    //1 fuel + 1 sand => glass.
    if(currentCraft==5&&totalBlocks1Sum<512-1&&blocks1[8].c>0&&(blocks1[9].c>0||blocks1[10].c>0||blocks1[5].c>0||blocks1[4].c>0)){
      crafting=true
      setTimeout(()=>{
        blocks1[8].c--
        if(blocks1[9].c>0){
          blocks1[9].c--
        }else if(blocks1[10].c>0){
          blocks1[10].c--
        }else if(blocks1[5].c>0){
          blocks1[5].c--
        }else if(blocks1[4].c>0){
          blocks1[4].c--
        }
        blocks1[16].c++
        crafting=false
      },10000)
    }
  }
  if(e.key=='c'){
    if(currentCraft<5){
      currentCraft++
    }
  }
})
document.addEventListener("mousedown",(e)=>{
  if(e.button==0){
    //Destroy.
    raycastResults=game.raycastVoxels()
    if(totalBlocks1Sum<512){
      if(
        blocks1[currentBlock].dur>0
        &&
        energy.current>50
        &&
        (
          (game.getBlock(raycastResults.voxel)==1&&currentBlock==14)//Grass.
          ||
          (game.getBlock(raycastResults.voxel)==2&&currentBlock==14)//Dirt.
          ||
          (game.getBlock(raycastResults.voxel)==3&&currentBlock==12)//Stone.
          ||
          (game.getBlock(raycastResults.voxel)==4&&currentBlock==13)//Trunk.
          ||
          (game.getBlock(raycastResults.voxel)==5&&currentBlock==15)//Leaves.
          ||
          (game.getBlock(raycastResults.voxel)==6&&currentBlock==13)//Planks.
          ||
          (game.getBlock(raycastResults.voxel)==7&&currentBlock==12)//Bricks.
          ||
          (game.getBlock(raycastResults.voxel)==8&&currentBlock==14)//Sand.
          ||
          (game.getBlock(raycastResults.voxel)==9&&currentBlock==13)//Cactus bottom.
          ||
          (game.getBlock(raycastResults.voxel)==10&&currentBlock==13)//Cactus top.
          ||
          (game.getBlock(raycastResults.voxel)==11&&currentBlock==12)//Sandstone.

          ||//11 to 15 Bother Inclusive are tools.

          (game.getBlock(raycastResults.voxel)==16&&currentBlock==12)//Glass.
        )
      ){
        energy.current-=5
        blocks1[game.getBlock(raycastResults.voxel)].c++
        blocks1[currentBlock].dur--
        game.setBlock(raycastResults.voxel,0)
        console.log("Destroying block.")
      }else if(
        blocks1[currentBlock].c>0
        &&
        energy.current>50
        &&
        (
          (game.getBlock(raycastResults.voxel)==1&&currentBlock==14)//Grass.
          ||
          (game.getBlock(raycastResults.voxel)==2&&currentBlock==14)//Dirt.
          ||
          (game.getBlock(raycastResults.voxel)==3&&currentBlock==12)//Stone.
          ||
          (game.getBlock(raycastResults.voxel)==4&&currentBlock==13)//Trunk.
          ||
          (game.getBlock(raycastResults.voxel)==5&&currentBlock==15)//Leaves.
          ||
          (game.getBlock(raycastResults.voxel)==6&&currentBlock==13)//Planks.
          ||
          (game.getBlock(raycastResults.voxel)==7&&currentBlock==12)//Bricks.
          ||
          (game.getBlock(raycastResults.voxel)==8&&currentBlock==14)//Sand.
          ||
          (game.getBlock(raycastResults.voxel)==9&&currentBlock==13)//Cactus bottom.
          ||
          (game.getBlock(raycastResults.voxel)==10&&currentBlock==13)//Cactus top.
          ||
          (game.getBlock(raycastResults.voxel)==11&&currentBlock==12)//Sandstone.

          ||//11 to 15 Bother Inclusive are tools.

          (game.getBlock(raycastResults.voxel)==16&&currentBlock==12)//Glass.
        )
      ){
        blocks1[currentBlock].c--
        blocks1[currentBlock].dur=100
      }
    }
  }else{
    //Place.
    raycastResults=game.raycastVoxels()
    if(
      energy.current>50
      &&blocks1[currentBlock].c>0
      &&game.getBlock(raycastResults.adjacent)==0
      &&currentBlock!==12
      &&currentBlock!==13
      &&currentBlock!==14
      &&currentBlock!==15
    ){
      game.setBlock(raycastResults.adjacent,currentBlock)
      energy.current-=5
      blocks1[currentBlock].c--
      console.log("Placing block.")
    }
  }
})

fawful.yaw.cameraInside.position.set(0,5,0)
render=()=>{
  if(crafting==true){
    countCraftDIV.innerHTML="Crafting."
    countCraftDIV.color="rgb(0,255,0)"
  }else if(currentCraft==1&&blocks1[3].c>0&&blocks1[4].c>0){
    countCraftDIV.innerHTML="1 wood + 1 stone => 1 stone pickaxe."
    countCraftDIV.color="rgb(255,255,255)"
  }else if(currentCraft==2&&blocks1[3].c>0&&blocks1[4].c>0){
    countCraftDIV.innerHTML="1 wood + 1 stone => 1 stone axe."
    countCraftDIV.color="rgb(255,255,255)"
  }else if(currentCraft==3&&blocks1[3].c>0&&blocks1[4].c>0){
    countCraftDIV.innerHTML="1 wood + 1 stone => 1 stone shovel."
    countCraftDIV.color="rgb(255,255,255)"
  }else if(currentCraft==4&&blocks1[3].c>0&&blocks1[4].c>0){
    countCraftDIV.innerHTML="1 wood + 1 stone => 1 stone hoe."
    countCraftDIV.color="rgb(255,255,255)"
  }else if(currentCraft==5&&blocks1[8].c>0&&(blocks1[9].c>0||blocks1[10].c>0||blocks1[5].c>0||blocks1[4].c>0)){
    countCraftDIV.innerHTML="1 sand + 1 fuel => 1 glass."
    countCraftDIV.color="rgb(255,255,255)"
  }else{
    countCraftDIV.innerHTML="Nothing for craft."
    currentCraft=Math.floor(Math.random()*6+1)
  }
  food.current-=0.0001
  //Muerte de hambre.
  if(food.current<25&&health.current>0){
    health.current--
  }
  //Cualquier muerte.
  if(Math.floor(health.current)==0){
    location.reload()
  }
  //Descansar.
  if(energy.current<100){
    energy.current+=0.08
  }
  //Esforzarse.
  if(10<food.current&&energy.current<50){
    food.current-=0.0025
  }
  countHealthDIV.innerHTML="Health: "+Math.floor(health.current)+"%"
  countFoodDIV.innerHTML="Food: "+Math.floor(food.current)+"%"
  if(energy.current<50){
    countEnergyDIV.innerHTML="Energy: "+Math.floor(energy.current)+"%!!!"
    countEnergyDIV.style.color="red"
  }else{
    countEnergyDIV.innerHTML="Energy: "+Math.floor(energy.current)+"%"
    countEnergyDIV.style.color="white"
  }
  cactus_collide=false
  for(x=-1;x<1;x++){
    for(y=-1;y<1;y++){
      for(z=-1;z<1;z++){
        if(game.getBlock(
          Math.floor(fawful.yaw.position.x)+x,
          Math.floor(fawful.yaw.position.y)+y,
          Math.floor(fawful.yaw.position.z)+z
        )==9
        ||game.getBlock(
          Math.floor(fawful.yaw.position.x)+x,
          Math.floor(fawful.yaw.position.y)+y,
          Math.floor(fawful.yaw.position.z)+z
        )==10
        ){
          cactus_collide=true
        }
      }
    }
  }
  if(cactus_collide==true){
    countHealthDIV.style.color="rgb(255,0,0)"
    health.current-=0.05
  }else if((blocks1[9].c>0||blocks1[10].c>0)&&health.current>0){
    health.current-=0.05
    countHealthDIV.style.color="rgb(255,0,0)"
  }else{
    countHealthDIV.style.color="rgb(255,255,255)"
  }
  requestAnimationFrame(render)
  totalBlocks1Sum=0
  for(i=1;i<=16;i++){
    totalBlocks1Sum+=blocks1[i].c*blocks1[i].space
  }
  if(currentBlock!==12
   &&currentBlock!==13
   &&currentBlock!==14
   &&currentBlock!==15
  ){
    countBlockDIV.innerHTML=blocks1[currentBlock].c+" => "+totalBlocks1Sum+"/512"
  }else{
    countBlockDIV.innerHTML=blocks1[currentBlock].c+" => "+totalBlocks1Sum+"/512 "+blocks1[currentBlock].dur+"%"
  }
  if(blocks1[currentBlock].c!=0){
    if(currentBlock==1){
      IMGPlaceBlock.src="textures/grass_dirt.png"
    }else if(currentBlock==2){
      IMGPlaceBlock.src="textures/dirt.png"
    }else if(currentBlock==3){
      IMGPlaceBlock.src="textures/stone.png"
    }else if(currentBlock==4){
      IMGPlaceBlock.src="textures/trunk_side.png"
    }else if(currentBlock==5){
      IMGPlaceBlock.src="textures/leaves.png"
    }else if(currentBlock==6){
      IMGPlaceBlock.src="textures/planks.png"
    }else if(currentBlock==7){
      IMGPlaceBlock.src="textures/bricks.png"
    }else if(currentBlock==8){
      IMGPlaceBlock.src="textures/sand.png"
    }else if(currentBlock==9){
      IMGPlaceBlock.src="textures/cactus_side.png"
    }else if(currentBlock==10){
      IMGPlaceBlock.src="textures/cactus_top.png"
    }else if(currentBlock==11){
      IMGPlaceBlock.src="textures/sandstone.png"
    }else if(currentBlock==12){
      IMGPlaceBlock.src="textures/stone_pickaxe.png"
    }else if(currentBlock==13){
      IMGPlaceBlock.src="textures/stone_axe.png"
    }else if(currentBlock==14){
      IMGPlaceBlock.src="textures/stone_shovel.png"
    }else if(currentBlock==15){
      IMGPlaceBlock.src="textures/stone_hoe.png"
    }else if(currentBlock==16){
      IMGPlaceBlock.src="textures/glass.png"
    }else{
      IMGPlaceBlock.src="textures/question_block.png"
      countBlockDIV.innerHTML="Empty."
    }
  }else{
    IMGPlaceBlock.src="textures/question_block.png"
    countBlockDIV.innerHTML="Empty."
  }
}
render()

And the result is this:

image image