var mineGui_mine, mineGui_curmap, mineGui_curndx, mineGui_moves = ""; var mineGui_movesBackup = []; var mineGui_customNdx = 1; var mineGui_canvas = true; var mineGui_imgSources = { 'sprites': 'sprites.png' }; var mineGui_spriteOffset = { 'R': 5, '#': 7, '*': 6, '\\': 2, 'L': 3, 'O': 4, '.': 0, ' ': 1 }; var mineGui_images = {}; var mineGui_imagesNeed = 0; function mineGui_loadImg(key, src) { var img; ++mineGui_imagesNeed; mineGui_images[key] = img = new Image(); img.onload = function() { if (0 == --mineGui_imagesNeed) { mineGui_show(); } }; img.src = src; } function mineGui_start() { var div = document.getElementById("mineGui"); var selMap = document.getElementById("mineGui_selectMap"); var inpMoves = document.getElementById("mineGui_moves"); var customMapInput = document.getElementById("mineGui_data") var validMoves = {L:1,U:1,R:1,D:1,A:1,W:1}; var k; document.getElementById("mineGui_addData").onclick = mineGui_addCustomMap; selMap.onchange = function() { var k = selMap.options[selMap.selectedIndex].text; mineGui_setMap(mineMaps[k], selMap.selectedIndex); selMap.blur(); }; var inpValidate = function() { if (inpMoves.value == mineGui_moves) return; mineGui_moves = ""; var txt = inpMoves.value.toUpperCase(), i; for (i = 0; i < txt.length; ++i) { if (validMoves[txt[i]]) mineGui_moves += txt[i]; } mineGui_updateMine(); }; var delayInpValidate = function(event) { // console.log("input", event, event.type); window.setTimeout(inpValidate, 0); }; inpMoves.onchange = delayInpValidate; inpMoves.onpaste = delayInpValidate; inpMoves.onkeypress = delayInpValidate; document.body.onkeydown = function (event) { // console.log("body", event); // console.log("isChar", event.isChar, // "; char '"+String.fromCharCode(event.charCode)+ // "'; key '"+String.fromCharCode(event.keyCode)+"'") if (document.activeElement === customMapInput) return; if (event.ctrlKey || event.altKey || event.metaKey) return; var handled = true; // ascii keys are reported as uppercase ascii code var cmd = String.fromCharCode(event.keyCode); if (validMoves[cmd]) { mineGui_move(cmd); } else if (cmd == 'C') { // clear mineGui_moves = ""; mineGui_updateMine(); } else if (cmd == 'T') { // toggle text/canvas mineGui_canvas = !mineGui_canvas; console.log("canvas show", mineGui_canvas); mineGui_show(); } else switch (event.keyCode) { case 8: // backspace -> undo mineGui_moves = mineGui_moves.slice(0,-1); mineGui_updateMine(); break; case 33: // page up if (selMap.selectedIndex > 0) { selMap.selectedIndex--; selMap.onchange(); } break; case 34: // page down if (selMap.selectedIndex+1 < selMap.options.length) { selMap.selectedIndex++; selMap.onchange(); } break; case 37: // left if (mineGui_mine.validMove('L')) mineGui_move('L'); break; case 38: // up if (mineGui_mine.validMove('U')) mineGui_move('U'); break; case 39: // right if (mineGui_mine.validMove('R')) mineGui_move('R'); break; case 40: // down if (mineGui_mine.validMove('D')) mineGui_move('D'); break; default: handled = false; break; } if (handled) { // console.log("body handled", event, event.type); event.preventDefault(); return true; } }; for (k in mineGui_imgSources) { if (mineGui_imgSources.hasOwnProperty(k)) { mineGui_loadImg(k, mineGui_imgSources[k]); } } for (k in mineMaps) { if (mineMaps.hasOwnProperty(k)) { var entry = document.createElement("option"); entry.textContent = k; selMap.appendChild(entry); } //entry.add } selMap.selectedIndex = 0; selMap.onchange(); } function mineGui_addCustomMap() { var map = document.getElementById("mineGui_data").value; var mine; var selMap = document.getElementById("mineGui_selectMap"); document.getElementById("mineGui_addDataResult").textContent = ""; try { mine = new Mine(map); } catch (e) { document.getElementById("mineGui_addDataResult").textContent = "Adding map failed: " + e; return; } mineMaps["custom" + mineGui_customNdx] = map; var entry = document.createElement("option"); entry.textContent = "custom" + mineGui_customNdx; selMap.appendChild(entry); mineGui_customNdx++; window.setTimeout(function() { selMap.selectedIndex = selMap.options.length - 1; selMap.onchange(); }, 0); } function mineGui_move(cmd) { for (i = 0; i < cmd.length; ++i) { if (mineGui_mine.state != Mine.ALIVE) break; mineGui_moves += cmd[i]; mineGui_mine.move(cmd[i]); } mineGui_show(); } function mineGui_setMap(map, ndx) { mineGui_movesBackup[mineGui_curndx] = mineGui_moves; mineGui_curmap = map; mineGui_curndx = ndx; mineGui_moves = mineGui_movesBackup[mineGui_curndx]; if (!mineGui_moves) mineGui_moves = ""; mineGui_updateMine(); } function mineGui_updateMine() { // redo moves mineGui_mine = new Mine(mineGui_curmap); var cmd = mineGui_moves; mineGui_moves = ""; for (i = 0; i < cmd.length; ++i) { if (mineGui_mine.state != Mine.ALIVE) break; mineGui_moves += cmd[i]; mineGui_mine.move(cmd[i]); } mineGui_show(); } function mineGui_show() { var waterLevel = Math.max(mineGui_mine.meta.Water, 0); var map = mineGui_mine.toString().split(/\n/); var canv = document.getElementById("mineGui_mineCanvas"); var mapNode = document.getElementById("mineGui_mineMap"); if (mineGui_canvas && 0 == mineGui_imagesNeed) { canv.style.display = ''; canv.style.visibility = 'visible'; mapNode.style.display = 'none'; mapNode.style.visibility = 'hidden'; canv.width = 16*mineGui_mine.width; canv.height = 16*mineGui_mine.height; var ctx = canv.getContext("2d"); ctx.globalAlpha=1.0; ctx.fillStyle = "black"; ctx.fillRect(0,0,canv.width, canv.height); var sprites = mineGui_images.sprites; for (var y = 0; y < mineGui_mine.height; ++y) { for (var x = 0; x < mineGui_mine.width; ++x) { ctx.drawImage(sprites, mineGui_spriteOffset[map[y][x]] * 16, 0, 16, 16, 16*x, 16*y, 16, 16); } } ctx.fillStyle = "#0000FF"; ctx.globalAlpha = 0.3; y = 16*(mineGui_mine.height - waterLevel); ctx.fillRect(0,y,canv.width, canv.height-y); } else { canv.style.display = 'none'; canv.style.visibility = 'hidden'; mapNode.style.display = ''; mapNode.style.visibility = 'visible'; } if (waterLevel > 0) { document.getElementById("mineGui_mineMapWater").textContent = map.splice(-waterLevel).join("\n"); } else { document.getElementById("mineGui_mineMapWater").textContent = ""; } document.getElementById("mineGui_mineMapDry").textContent = map.join("\n"); document.getElementById("mineGui_moves").value = mineGui_moves; var state = ""; switch (mineGui_mine.state) { case Mine.ALIVE: state = "Still mining"; break; case Mine.LOST: state = "Robot broken - " + mineGui_mine.reason; break; case Mine.ABORTED: state = "Aborted"; break; case Mine.WON: state = "Won - " + mineGui_mine.reason; break; } document.getElementById("mineGui_meta").textContent = mineGui_mine.metaText(); document.getElementById("mineGui_state").textContent = state; document.getElementById("mineGui_score").textContent = mineGui_mine.score; document.getElementById("mineGui_scoreMoves").textContent = mineGui_mine.moves; document.getElementById("mineGui_scoreLambdas").textContent = mineGui_mine.found_lambdas; document.getElementById("mineGui_belowWater").textContent = mineGui_mine.moves_below_water; }