icfp15/js/gui.js

252 lines
7.2 KiB
JavaScript
Raw Normal View History

2012-07-14 07:27:33 +00:00
var mineGui_mine, mineGui_curmap, mineGui_curndx, mineGui_moves = "";
var mineGui_movesBackup = [];
var mineGui_customNdx = 1;
var mineGui_canvas = true;
2012-07-14 07:27:33 +00:00
var mineGui_imgSources = {
'R': 'robot.png',
'#': 'wall.png',
'*': 'rock.png',
'\\': 'lambda.png',
'L': 'liftclosed.png',
'O': 'liftopen.png',
'.': 'earth.png',
' ': 'empty.png'
};
var mineGui_images = {};
var mineGui_imagesNeed = 0;
2012-07-14 07:27:33 +00:00
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;
2012-07-14 07:27:33 +00:00
}
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;
2012-07-14 07:27:33 +00:00
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();
};
2012-07-14 09:28:34 +00:00
var delayInpValidate = function(event) {
// console.log("input", event, event.type);
window.setTimeout(inpValidate, 0);
};
2012-07-14 07:27:33 +00:00
inpMoves.onchange = delayInpValidate;
inpMoves.onpaste = delayInpValidate;
inpMoves.onkeypress = delayInpValidate;
2012-07-14 09:28:34 +00:00
document.body.onkeydown = function (event) {
// console.log("body", event);
// console.log("isChar", event.isChar,
// "; char '"+String.fromCharCode(event.charCode)+
// "'; key '"+String.fromCharCode(event.keyCode)+"'")
2012-07-14 07:27:33 +00:00
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);
2012-07-14 09:28:34 +00:00
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
2012-07-14 07:27:33 +00:00
mineGui_moves = mineGui_moves.slice(0,-1);
mineGui_updateMine();
break;
2012-07-14 09:28:34 +00:00
case 33: // page up
if (selMap.selectedIndex > 0) {
selMap.selectedIndex--;
selMap.onchange();
2012-07-14 07:27:33 +00:00
}
2012-07-14 09:28:34 +00:00
break;
case 34: // page down
if (selMap.selectedIndex+1 < selMap.options.length) {
selMap.selectedIndex++;
selMap.onchange();
2012-07-14 07:27:33 +00:00
}
2012-07-14 09:28:34 +00:00
break;
case 37: // left
if (mineGui_mine.validMove('L')) mineGui_move('L');
2012-07-14 09:28:34 +00:00
break;
case 38: // up
if (mineGui_mine.validMove('U')) mineGui_move('U');
2012-07-14 09:28:34 +00:00
break;
case 39: // right
if (mineGui_mine.validMove('R')) mineGui_move('R');
2012-07-14 09:28:34 +00:00
break;
case 40: // down
if (mineGui_mine.validMove('D')) mineGui_move('D');
2012-07-14 09:28:34 +00:00
break;
default:
2012-07-14 07:27:33 +00:00
handled = false;
2012-07-14 09:28:34 +00:00
break;
}
if (handled) {
// console.log("body handled", event, event.type);
event.preventDefault();
return true;
2012-07-14 07:27:33 +00:00
}
};
for (k in mineGui_imgSources) {
if (mineGui_imgSources.hasOwnProperty(k)) {
mineGui_loadImg(k, mineGui_imgSources[k]);
}
}
2012-07-14 07:27:33 +00:00
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);
}
2012-07-14 07:27:33 +00:00
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);
for (var y = 0; y < mineGui_mine.height; ++y) {
for (var x = 0; x < mineGui_mine.width; ++x) {
ctx.drawImage(mineGui_images[map[y][x]],16*x,16*y);
}
}
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';
}
2012-07-14 07:27:33 +00:00
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");
2012-07-14 07:27:33 +00:00
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;
}