aframe-roomcreator/dist/room.min.js

A basic A-Frame component for building rooms and block based enviroments - edit maps with the map editing tool, export to json and then use A-Frame to render them via a componenet

let mapSourceRaw=[];AFRAME.registerComponent("room",{schema:{wallColor:{type:"string",default:"white"},floorColor:{type:"string",default:"white"},wallTexture:{type:"string",default:"none"},wallTexture2:{type:"string",default:"none"},wallTexture3:{type:"string",default:"none"},scale:{type:"string",default:"1 1 1"},wallSize:{type:"string",default:"1"},wallHeight:{type:"string",default:"3"},mapToLoad:{type:"string",default:"map"},mapSource:{type:"array",default:[]},indoor:{type:"boolean",default:!1}},init:async function(){await this.loadData()},loadData:async function(){let t=this.data,e=t.mapToLoad;await this.loadMap(e),await this.createRooms()},loadMap:async function t(e){this.data;let a=await fetch(e+".json");mapSourceRaw=await a.json(),this.data.mapSource=mapSourceRaw},createRooms:function(){let t=this.data,e=this.data.mapSource,a=t.wallTexture,i=t.wallTexture2,r=t.wallTexture3,o=t.floorTexture;t.scale,t.scale;let l=t.wallColor,s=t.floorColor,u=t.indoor,h=t.wallSize,d=t.wallHeight;console.log(e,h,d,e.height);for(let n=0;n<e.height;n++)for(let b=0;b<e.width;b++){console.log("room running");let c=b*e.width+n,p=`${(n-e.width/2)*h} ${d} ${(b-e.height/2)*h}`,A=`${(n-e.width/2)*h} 0 ${(b-e.height/2)*h}`,w=`${(n-e.width/2)*h} ${d/2} ${(b-e.height/2)*h}`,g=`${(n-e.width/2)*h} ${d/4} ${(b-e.height/2)*h}`,m=`${(n-e.width/2)*h} ${d/8} ${(b-e.height/2)*h}`;if(0===e.data[c]||1===e.data[c]||2==e.data[c]||3===e.data[c]){let f=document.createElement("a-box");if(f.setAttribute("width",h),f.setAttribute("height",d),f.setAttribute("depth",h),f.setAttribute("position",w),f.setAttribute("static-body",""),f.setAttribute("material","src:#"+a),this.el.appendChild(f),u){let y=document.createElement("a-box");y.setAttribute("color",s),y.setAttribute("height",d/20),y.setAttribute("position",p),y.setAttribute("material","src:#"+a),this.el.appendChild(y)}0===e.data[c]&&(f.setAttribute("color",s),f.setAttribute("height",d/20),f.setAttribute("static-body",""),f.setAttribute("position",A),f.setAttribute("material","src:#"+o),f.setAttribute("playermovement","")),1===e.data[c]&&(f.setAttribute("color",l),f.setAttribute("height",d),f.setAttribute("static-body",""),f.setAttribute("position",w),f.setAttribute("material","src:#"+a)),2===e.data[c]&&(f.setAttribute("color",l),f.setAttribute("height",d/2),f.setAttribute("static-body",""),f.setAttribute("position",g),f.setAttribute("material","src:#"+i)),3===e.data[c]&&(f.setAttribute("color",l),f.setAttribute("height",d/4),f.setAttribute("static-body",""),f.setAttribute("position",m),f.setAttribute("material","src:#"+r))}}}});