import * as main from '../script.js'; import {tileArray} from './tileRenderer.js'; import { cursor } from '../interface/game/mouse.js' import { ctx, hctx } from './html.js'; import { game } from '../game/game.js' import * as animation from './visualLoop.js' export function render() { renderTiles() } export function renderTiles() { // DRAW THE IMAGE TO THE CANVAS. let x, y = 0 const gridSize = game.gridSize; const tileSize = game.tileSize; for(x = 0; x < gridSize[0]; x++){ for(y = 0; y < gridSize[1]; y++){ const xu = x*tileSize; const yu = y*tileSize; const tempWorld = game.world; // Draw buildings switch (tempWorld[x][y].type) { case (0): ctx.drawImage(tileArray[0], xu,yu) break; case (1): ctx.drawImage(tileArray[2], xu,yu) break; case (2): ctx.drawImage(tileArray[1], xu,yu) break; } // Draw Structures switch (tempWorld[x][y].structure) { case (1): ctx.drawImage(tileArray[4], xu,yu) break; case (2): ctx.drawImage(tileArray[32], xu,yu) break; case (3): ctx.drawImage(tileArray[33], xu,yu) break; case (4): ctx.drawImage(tileArray[34], xu,yu) break; } // Draw Property overlays if (tempWorld[x][y].color != null){ ctx.beginPath(); ctx.fillStyle = tempWorld[x][y].color; ctx.rect(xu, yu, tileSize, tileSize) ctx.globalAlpha = 0.6; ctx.fill() ctx.globalAlpha = 1; } } } console.log("image Rendered") } export function renderHud(x, y) { const tileSize = game.tileSize; hctx.clearRect(cursor.xold*tileSize, cursor.yold*tileSize, tileSize, tileSize) hctx.drawImage(tileArray[80], x*tileSize,y*tileSize) }