Objects can be placed on the grid.

master
sigonasr2 5 years ago
parent 31289d1ff2
commit 3ec8b29afc
  1. 161
      game.js

@ -43,23 +43,23 @@ var WRITERLEFT = {type:"WRITER",direction:LEFT,color:RED}
var WRITERRIGHT = {type:"WRITER",direction:RIGHT,color:RED}
var WRITERUP = {type:"WRITER",direction:UP,color:RED}
var DEF_BRANCHUP_RB = {img:IMAGE_BRANCH,color1:RED,color2:BLUE}
var DEF_BRANCHUP_BR = {img:IMAGE_BRANCH,color1:BLUE,color2:RED}
var DEF_BRANCHUP_GY = {img:IMAGE_BRANCH,color1:GREEN,color2:YELLOW}
var DEF_BRANCHUP_YG = {img:IMAGE_BRANCH,color1:YELLOW,color2:GREEN}
var DEF_BRANCHUP_PPI = {img:IMAGE_BRANCH,color1:PURPLE,color2:PINK}
var DEF_BRANCHUP_PIP = {img:IMAGE_BRANCH,color1:PINK,color2:PURPLE}
var DEF_BRANCHUP_BLGR = {img:IMAGE_BRANCH,color1:BLACK,color2:GRAY}
var DEF_BRANCHUP_GRBL = {img:IMAGE_BRANCH,color1:GRAY,color2:BLACK}
var DEF_WRITERRIGHT_R = {img:IMAGE_WRITER,color1:RED}
var DEF_WRITERRIGHT_B = {img:IMAGE_WRITER,color1:BLUE}
var DEF_WRITERRIGHT_G = {img:IMAGE_WRITER,color1:GREEN}
var DEF_WRITERRIGHT_Y = {img:IMAGE_WRITER,color1:YELLOW}
var DEF_WRITERRIGHT_P = {img:IMAGE_WRITER,color1:PURPLE}
var DEF_WRITERRIGHT_PI = {img:IMAGE_WRITER,color1:PINK}
var DEF_WRITERRIGHT_BL = {img:IMAGE_WRITER,color1:BLACK}
var DEF_WRITERRIGHT_GR = {img:IMAGE_WRITER,color1:GRAY}
var DEF_CONVEYOR = {img:IMAGE_CONVEYOR}
var DEF_BRANCHUP_RB = {img:IMAGE_BRANCH,color1:RED,color2:BLUE,type:"BRANCH"}
var DEF_BRANCHUP_BR = {img:IMAGE_BRANCH,color1:BLUE,color2:RED,type:"BRANCH"}
var DEF_BRANCHUP_GY = {img:IMAGE_BRANCH,color1:GREEN,color2:YELLOW,type:"BRANCH"}
var DEF_BRANCHUP_YG = {img:IMAGE_BRANCH,color1:YELLOW,color2:GREEN,type:"BRANCH"}
var DEF_BRANCHUP_PPI = {img:IMAGE_BRANCH,color1:PURPLE,color2:PINK,type:"BRANCH"}
var DEF_BRANCHUP_PIP = {img:IMAGE_BRANCH,color1:PINK,color2:PURPLE,type:"BRANCH"}
var DEF_BRANCHUP_BLGR = {img:IMAGE_BRANCH,color1:BLACK,color2:GRAY,type:"BRANCH"}
var DEF_BRANCHUP_GRBL = {img:IMAGE_BRANCH,color1:GRAY,color2:BLACK,type:"BRANCH"}
var DEF_WRITERRIGHT_R = {img:IMAGE_WRITER,color1:RED,type:"WRITER"}
var DEF_WRITERRIGHT_B = {img:IMAGE_WRITER,color1:BLUE,type:"WRITER"}
var DEF_WRITERRIGHT_G = {img:IMAGE_WRITER,color1:GREEN,type:"WRITER"}
var DEF_WRITERRIGHT_Y = {img:IMAGE_WRITER,color1:YELLOW,type:"WRITER"}
var DEF_WRITERRIGHT_P = {img:IMAGE_WRITER,color1:PURPLE,type:"WRITER"}
var DEF_WRITERRIGHT_PI = {img:IMAGE_WRITER,color1:PINK,type:"WRITER"}
var DEF_WRITERRIGHT_BL = {img:IMAGE_WRITER,color1:BLACK,type:"WRITER"}
var DEF_WRITERRIGHT_GR = {img:IMAGE_WRITER,color1:GRAY,type:"WRITER"}
var DEF_CONVEYOR = {img:IMAGE_CONVEYOR,type:"BELT"}
var GRID_W = 32
@ -70,6 +70,8 @@ var GRID_Y = 20
var LAST_MOUSE_X=0;
var LAST_MOUSE_Y=0;
var ITEM_DIRECTION=RIGHT;
var SUBMENU = {
visible:false,
width:0,
@ -332,10 +334,10 @@ function setupGame() {
}
function mouseOverButton(canvas,e,button) {
return (getMousePos(canvas,e).x>=button.x &&
getMousePos(canvas,e).x<=button.x+button.w &&
getMousePos(canvas,e).y>=button.y &&
getMousePos(canvas,e).y<=button.y+button.h)
return (getMousePos(e).x>=button.x &&
getMousePos(e).x<=button.x+button.w &&
getMousePos(e).y>=button.y &&
getMousePos(e).y<=button.y+button.h)
}
function clickEvent(e) {
@ -356,10 +358,31 @@ function clickEvent(e) {
}
}
ITEM_SELECTED=button.lastselected
console.log(button)
//console.log(button)
return
}
}
}
//console.log(getGridCoords(getMousePos(e)))
if (ITEM_SELECTED!==undefined) {
var clickCoords = getGridCoords(getMousePos(e))
if (clickCoords.x>=0&&clickCoords.y>=0&&clickCoords.y<gameGrid.length&&clickCoords.x<gameGrid[clickCoords.y].length) {
placeObject(clickCoords,ITEM_SELECTED)
//console.log(gameGrid)
}
}
}
function placeObject(coords,def) {
var newObj={...def,direction:ITEM_DIRECTION}
gameGrid[coords.y][coords.x]=newObj
}
function getGridCoords(pos) {
var x = Math.round((pos.x-GRID_X)/GRID_W-1)
var y = Math.round((pos.y-GRID_Y)/GRID_H-1)
return {x:x,y:y}
}
function releaseEvent(e) {
@ -368,9 +391,10 @@ function releaseEvent(e) {
if (mouseOverButton(canvas,e,button)) {
ITEM_SELECTED=button.def
BUTTON_SELECTED.lastselected=button.def
SUBMENU.visible=false
return
}
}
SUBMENU.visible=false
}
}
@ -403,34 +427,51 @@ function step() {
}
function updateMouse(e) {
//console.log(getMousePos(canvas,e))
//console.log(getMousePos(e))
e.preventDefault()
var mousepos = getMousePos(canvas,e)
var mousepos = getMousePos(e)
LAST_MOUSE_X=mousepos.x
LAST_MOUSE_Y=mousepos.y
}
function getMousePos(canvas, evt) {
function getMousePos(e) {
var rect = canvas.getBoundingClientRect();
if (evt.changedTouches) {
if (e.changedTouches) {
return {
x: evt.changedTouches[0].clientX - rect.left,
y: evt.changedTouches[0].clientY - rect.top
x: e.changedTouches[0].clientX - rect.left,
y: e.changedTouches[0].clientY - rect.top
};
} else {
return {
x: evt.clientX - rect.left,
y: evt.clientY - rect.top
x: e.clientX - rect.left,
y: e.clientY - rect.top
};
}
}
function renderGame() {
function renderGame(ctx) {
var displayGrid = []
displayGrid = deepCopy(gameGrid)
if (BOT_X!==-1&&BOT_Y!==-1) {
displayGrid[BOT_Y][BOT_X]["BOT"]=true
}
for (var y=0;y<=gameGrid.length;y++) {
ctx.moveTo(GRID_X, GRID_Y+GRID_H*y);
ctx.lineTo(GRID_X+GRID_W*gameGrid.length, GRID_Y+GRID_H*y);
}
for (var x=0;x<=gameGrid.length;x++) {
ctx.moveTo(GRID_X+GRID_W*x, GRID_Y);
ctx.lineTo(GRID_X+GRID_W*x, GRID_Y+GRID_H*gameGrid.length);
}
ctx.fillStyle="#000000"
ctx.stroke();
for (var y=0;y<gameGrid.length;y++) {
for (var x=0;x<gameGrid[y].length;x++) {
if (gameGrid[y][x].img!==undefined) {
RenderIcon(GRID_X+GRID_W*x+16,GRID_Y+GRID_H*y+16,ctx,gameGrid[y][x],gameGrid[y][x].direction)
}
}
}
/*console.log("Tape: "+BOT_TAPE)
console.log(displayGrid)*/
}
@ -481,31 +522,24 @@ function drawImage(x,y,img,ctx,degrees){
function draw() {
var ctx = canvas.getContext("2d")
if (Math.random()<0.01) {
ctx.fillStyle="#a3adab"
ctx.fillStyle="rgba(63, 73, 71, 0.5)"
ctx.globalAlpha=0.5
ctx.fillRect(0,0,canvas.width,canvas.height)
} else {
ctx.fillStyle="#b5c4c1"
ctx.globalAlpha=1.0
ctx.fillRect(0,0,canvas.width,canvas.height)
renderGame(ctx)
if (ITEM_SELECTED) {
RenderIcon(LAST_MOUSE_X-16,LAST_MOUSE_Y-16,ctx,ITEM_SELECTED,0)
}
//drawImage(0,0,IMAGE_CONVEYOR,ctx,0)
//drawImage(LAST_MOUSE_X,LAST_MOUSE_Y,IMAGE_ARROW,ctx,0)
RenderSubmenu(ctx)
RenderMenu(ctx)
RenderIcon(32,32,ctx,DEF_BRANCHUP_GY,270)
}
ctx.fillRect(0,0,canvas.width,canvas.height)
renderGame()
for (var y=0;y<=gameGrid.length;y++) {
ctx.moveTo(GRID_X, GRID_Y+GRID_H*y);
ctx.lineTo(GRID_X+GRID_W*gameGrid.length, GRID_Y+GRID_H*y);
}
for (var x=0;x<=gameGrid.length;x++) {
ctx.moveTo(GRID_X+GRID_W*x, GRID_Y);
ctx.lineTo(GRID_X+GRID_W*x, GRID_Y+GRID_H*gameGrid.length);
}
ctx.fillStyle="#000000"
ctx.stroke();
if (ITEM_SELECTED) {
RenderIcon(LAST_MOUSE_X-16,LAST_MOUSE_Y-16,ctx,ITEM_SELECTED,0)
}
//drawImage(0,0,IMAGE_CONVEYOR,ctx,0)
//drawImage(LAST_MOUSE_X,LAST_MOUSE_Y,IMAGE_ARROW,ctx,0)
RenderSubmenu(ctx)
RenderMenu(ctx)
RenderIcon(32,32,ctx,DEF_BRANCHUP_GY,270)
}
function RenderIcon(x,y,ctx,icon_definition,rot=0,background=undefined) {
@ -513,20 +547,27 @@ function RenderIcon(x,y,ctx,icon_definition,rot=0,background=undefined) {
ctx.fillStyle=background
ctx.fillRect(x,y,32,32)
}
drawImage(
x+16,
y+16,
icon_definition.img,ctx,rot)
if (icon_definition.img===IMAGE_BRANCH) {
drawImage(
x+16,
y+16,
icon_definition.img,ctx,rot+90)
} else {
drawImage(
x+16,
y+16,
icon_definition.img,ctx,rot)
}
switch (icon_definition.img) {
case IMAGE_BRANCH:{
drawImage(
x+16,
y+16,
GetArrowImage(icon_definition.color1),ctx,rot+180)
GetArrowImage(icon_definition.color1),ctx,rot+270)
drawImage(
x+16,
y+16,
GetArrowImage(icon_definition.color2),ctx,rot)
GetArrowImage(icon_definition.color2),ctx,rot+90)
}break;
case IMAGE_WRITER:{
drawImage(

Loading…
Cancel
Save