- Author:
- Pim Linders
- Twitter:
- @
- GitHub:
- Facebook:
- Google+:
- +
- Reddit:
- /r/
- Pouet:
- Website:
- pimlinders.com
- Compo:
- classic
- Demo link:
- https://js1k.com/2013-spring/demo/1411
- Shortlink:
- https://js1k.com/1411
- Blog post:
- please update here!
- Bytes:
- 1014
- Chars:
- 1014
- Submission
function gr(e,t){return Math.floor(Math.random()*t+e)}function gg(){return gr(0,z-r)}function gw(e){if(e>g){e=e-gr(0,5);if(e<g){g=gg()}}else{e=e+gr(0,5);if(e>g){g=gg()}}return e}function dw(){w.pop();w.unshift(gw(w[0]));a.clearRect(0,0,z,z);a.fillStyle="green";for(var e=0;e<w.length;e+=1){var t=w[e];a.fillRect(0,e*h,t,h);a.fillRect(t+r,e*h,z-t-r,h)}a.fillStyle="blue";a.fillRect(x,z-p-h,p,p);a.fillStyle="black";a.font="bold 16px Arial";a.fillText("Score: "+s,10,20);ch()}function ch(){var e=w.length,t=w.slice(e-p/h-1,e-1);for(var n=0;n<t.length;n+=1){var i=t[n];if(i>=x||i+r-p<=x){ci(v);ci(v2);setTimeout(st,2e3);break}}}function st(){a.clearRect(0,0,z,z);s=0;w=[];for(var e=0;e<z/h;e+=1){w.push(z/2-r/2)}x=w[w.length-1]+(r-p)/2;v=si(function(){dw()},20);v2=si(function(){s+=1},1e3)}var z=500,p=20,h=4,r=100,w=[],q=15,v,v2,x=0,s=0,g=gg(),si=setInterval,ci=clearInterval;window.addEventListener("keydown",function(e){var t=e.keyCode;if(t===65||t===37){x=x-q}if(t===68||t===39){x=x+q}});c.height=z;c.width=z;st()
- Description
- Find your way through the winding tunnel -- but don't hit the wall!
Use the left/right arrow keys or A/D keys to move the race car left and right
- Base64 encoded
ZnVuY3Rpb24gZ3IoZSx0KXtyZXR1cm4gTWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpKnQrZSl9ZnVuY3Rpb24gZ2coKXtyZXR1cm4gZ3IoMCx6LXIpfWZ1bmN0aW9uIGd3KGUpe2lmKGU+Zyl7ZT1lLWdyKDAsNSk7aWYoZTxnKXtnPWdnKCl9fWVsc2V7ZT1lK2dyKDAsNSk7aWYoZT5nKXtnPWdnKCl9fXJldHVybiBlfWZ1bmN0aW9uIGR3KCl7dy5wb3AoKTt3LnVuc2hpZnQoZ3cod1swXSkpO2EuY2xlYXJSZWN0KDAsMCx6LHopO2EuZmlsbFN0eWxlPSJncmVlbiI7Zm9yKHZhciBlPTA7ZTx3Lmxlbmd0aDtlKz0xKXt2YXIgdD13W2VdO2EuZmlsbFJlY3QoMCxlKmgsdCxoKTthLmZpbGxSZWN0KHQrcixlKmgsei10LXIsaCl9YS5maWxsU3R5bGU9ImJsdWUiO2EuZmlsbFJlY3QoeCx6LXAtaCxwLHApO2EuZmlsbFN0eWxlPSJibGFjayI7YS5mb250PSJib2xkIDE2cHggQXJpYWwiO2EuZmlsbFRleHQoIlNjb3JlOiAiK3MsMTAsMjApO2NoKCl9ZnVuY3Rpb24gY2goKXt2YXIgZT13Lmxlbmd0aCx0PXcuc2xpY2UoZS1wL2gtMSxlLTEpO2Zvcih2YXIgbj0wO248dC5sZW5ndGg7bis9MSl7dmFyIGk9dFtuXTtpZihpPj14fHxpK3ItcDw9eCl7Y2kodik7Y2kodjIpO3NldFRpbWVvdXQoc3QsMmUzKTticmVha319fWZ1bmN0aW9uIHN0KCl7YS5jbGVhclJlY3QoMCwwLHoseik7cz0wO3c9W107Zm9yKHZhciBlPTA7ZTx6L2g7ZSs9MSl7dy5wdXNoKHovMi1yLzIpfXg9d1t3Lmxlbmd0aC0xXSsoci1wKS8yO3Y9c2koZnVuY3Rpb24oKXtkdygpfSwyMCk7djI9c2koZnVuY3Rpb24oKXtzKz0xfSwxZTMpfXZhciB6PTUwMCxwPTIwLGg9NCxyPTEwMCx3PVtdLHE9MTUsdix2Mix4PTAscz0wLGc9Z2coKSxzaT1zZXRJbnRlcnZhbCxjaT1jbGVhckludGVydmFsO3dpbmRvdy5hZGRFdmVudExpc3RlbmVyKCJrZXlkb3duIixmdW5jdGlvbihlKXt2YXIgdD1lLmtleUNvZGU7aWYodD09PTY1fHx0PT09Mzcpe3g9eC1xfWlmKHQ9PT02OHx8dD09PTM5KXt4PXgrcX19KTtjLmhlaWdodD16O2Mud2lkdGg9ejtzdCgp
- Original source
/**
Tunnel Racer
(c) Pin Kubders (@pimlinders)
Find your way through the winding tunnel -- but don't hit the wall!
Gameplay:
- Use the left/right arrow keys or A/D keys to move the race car left and right
- Don't hit the wall!
**/
var canvasSize = 500,
playerSize = 20,
rowHeight = 4,
rowSpace = 100,
widths = [],
speed = 15,
interval,
scoreInterval,
x = 0,
score = 0,
goal = getGoal(),
si = setInterval,
ci = clearInterval;
// get random number
function getRandom(from, to) {
return Math.floor((Math.random()*to)+from);
}
// get new goal width
function getGoal() {
return getRandom(0, (canvasSize - rowSpace));
}
// move to goal width
function getWidth(width) {
// move left
if(width > goal) {
width = width - getRandom(0, 5);
// get new goal if goal is hit
if (width < goal) {
goal = getGoal();
}
}
// move right
else {
width = width + getRandom(0, 5);
if (width > goal) {
// get new goal if goal is hit
goal = getGoal();
}
}
return width;
}
function draw() {
// draw course
widths.pop();
widths.unshift(getWidth(widths[0]));
a.clearRect(0,0,canvasSize,canvasSize);
a.fillStyle = 'green';
for(var i=0; i<widths.length; i+=1) {
var width = widths[i];
// left side of course
a.fillRect(0, i*rowHeight, width, rowHeight);
// right side of course
a.fillRect(width+rowSpace, i*rowHeight, (canvasSize-width-rowSpace), rowHeight);
}
// draw player
a.fillStyle = 'blue';
a.fillRect(x, canvasSize-playerSize-rowHeight, playerSize, playerSize);
a.fillStyle = "black";
// draw score
a.font = "bold 16px Arial";
a.fillText("Score: " + score, 10, 20);
calculateHit();
}
function calculateHit() {
var wLength = widths.length,
//get all posibile hit points, note player starts ontop of the first rowHeight and range = playerSize / rowHeight
hits = widths.slice(wLength - (playerSize / rowHeight) - 1, wLength-1);
for(var i=0; i<hits.length; i+=1) {
var hit = hits[i];
if (hit >= x || (hit + rowSpace - playerSize) <= x) {
// reset
ci(interval);
ci(scoreInterval);
setTimeout(start, 2000);
break;
}
}
}
function start() {
// clear canvas
a.clearRect(0,0,canvasSize,canvasSize);
// reset score
score = 0;
// clear initial widths
widths = [];
// create initial straight away
for (var i=0; i<(canvasSize/rowHeight); i+=1) {
// all widths are the same (roughly middle of screen)
widths.push((canvasSize/2) - (rowSpace/2));
}
// initial player position, in middle of white space
x = widths[widths.length-1] + ((rowSpace-playerSize) / 2);
// redraw
interval = si(function() {
draw();
}, 20);
// increase score by one every second
scoreInterval = si(function() {
score += 1;
}, 1000);
}
// monitor keyboard events to move player left and right
window.addEventListener('keydown', function(e) {
var code = e.keyCode;
if (code === 65 || code === 37) {
x = x - speed;
}
if (code=== 68 || code === 39) {
x = x + speed;
}
});
c.height = canvasSize;
c.width = canvasSize;
start();