trillerpfeife/game.js

## game.js


var currentMap = new Image(),
    mrBrown = new Image();
    lastMap = new Image();
currentMap.src = 'res/010/010-010.png';
mrBrown.src = "res/mr_brown.gif";

var canvas = document.createElement('canvas');
canvas.width = 320;
canvas.height = 240;
var context = canvas.getContext('2d');
var mousePos = new Object;


function getMousePos(canvas, evt) {
  var rect = canvas.getBoundingClientRect();
  return {
    x: evt.clientX - rect.left,
    y: evt.clientY - rect.top
  };
}
// maus interation
canvas.addEventListener('mousemove', function(evt) {
  mousePos = getMousePos(canvas, evt);
  var p = context.getImageData(mousePos.x, mousePos.y, 1, 1).data;
  console.log(p[0],p[1],p[2])
  if (p[0] <= 150)
  console.log("LOSTT");
 }, false);


var x = 0,
y = 230,
speed = 10;


function init() {
  document.body.appendChild(canvas);
  gameInit();

  try {
    context.drawImage("asdsadlkj", 2,2);
  } catch (e) {
    console.log("hallo");

  }
}

function gameInit() {
  x = 0;
  y = 230;
  imageCircle = 0;
  gameLoop();

}

function random10() {
  return Math.round(Math.random())
}

function randomConnector() {
  var random = [random10(),random10(),random10()].join("");
  while (String(random) === "000"){
    random = [random10(),random10(),random10()].join("");
  }

  return String(random);
}


function fileStringArray(topConnector,bottomConnector) {
  return [String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_short.png"),
         String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + ".png"),
        String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_long.png"),
      String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_extralong.png")]
}

var topConnector = "010";
var bottomConnector = "010";
console.log(bottomConnector);

function fileCheck(path) {
  try {
    var exists = true;
    context.drawImage(path, 1000,1000);
  } catch (e) {
    exists = false;

  }
 finally {
   return exists;

  }

}

function gameLoop(){


    window.setTimeout(gameLoop, 100);


    if(y === -230){
      console.log(bottomConnector);

      topConnector = bottomConnector;

      bottomConnector = randomConnector();
      currentMap.src = fileStringShort(topConnector,bottomConnector);

      console.log(fileCheck(currentMap));

      while (!fileCheck(currentMap)) {
        bottomConnector = randomConnector();
        currentMap.src = fileStringShort(topConnector,bottomConnector);

      }

      y = 230;
      context.drawImage(currentMap, x,y);

    }
    else {

      context.drawImage(currentMap, x,y);
      y -= 10;

    }

    context.drawImage(mrBrown, mousePos.x, 10);


}

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>testing shit</title>
    <style type="text/css">
  canvas {
    border : 1px gray solid;
  }
</style>
<script src="game.js"></script>

  </head>
  <body onload="init()">

  </body>
</html>


	var currentMap = new Image(),
	mrBrown = new Image();
	lastMap = new Image();
	currentMap.src = 'res/010/010-010.png';
	mrBrown.src = "res/mr_brown.gif";

	var canvas = document.createElement('canvas');
	canvas.width = 320;
	canvas.height = 240;
	var context = canvas.getContext('2d');
	var mousePos = new Object;


	function getMousePos(canvas, evt) {
	var rect = canvas.getBoundingClientRect();
	return {
	x: evt.clientX - rect.left,
	y: evt.clientY - rect.top
	};
	}
	// maus interation
	canvas.addEventListener('mousemove', function(evt) {
	mousePos = getMousePos(canvas, evt);
	var p = context.getImageData(mousePos.x, mousePos.y, 1, 1).data;
	console.log(p[0],p[1],p[2])
	if (p[0] <= 150)
	console.log("LOSTT");
	}, false);


	var x = 0,
	y = 230,
	speed = 10;


	function init() {
	document.body.appendChild(canvas);
	gameInit();

	try {
	context.drawImage("asdsadlkj", 2,2);
	} catch (e) {
	console.log("hallo");

	}
	}

	function gameInit() {
	x = 0;
	y = 230;
	imageCircle = 0;
	gameLoop();

	}

	function random10() {
	return Math.round(Math.random())
	}

	function randomConnector() {
	var random = [random10(),random10(),random10()].join("");
	while (String(random) === "000"){
	random = [random10(),random10(),random10()].join("");
	}

	return String(random);
	}


	function fileStringArray(topConnector,bottomConnector) {
	return [String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_short.png"),
	String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + ".png"),
	String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_long.png"),
	String("res/"+ topConnector + "/" + topConnector + "-" + bottomConnector + "_extralong.png")]
	}

	var topConnector = "010";
	var bottomConnector = "010";
	console.log(bottomConnector);

	function fileCheck(path) {
	try {
	var exists = true;
	context.drawImage(path, 1000,1000);
	} catch (e) {
	exists = false;

	}
	finally {
	return exists;

	}

	}

	function gameLoop(){


	window.setTimeout(gameLoop, 100);


	if(y === -230){
	console.log(bottomConnector);

	topConnector = bottomConnector;

	bottomConnector = randomConnector();
	currentMap.src = fileStringShort(topConnector,bottomConnector);

	console.log(fileCheck(currentMap));

	while (!fileCheck(currentMap)) {
	bottomConnector = randomConnector();
	currentMap.src = fileStringShort(topConnector,bottomConnector);

	}

	y = 230;
	context.drawImage(currentMap, x,y);

	}
	else {

	context.drawImage(currentMap, x,y);
	y -= 10;

	}

	context.drawImage(mrBrown, mousePos.x, 10);



	}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>testing shit</title>
	<style type="text/css">
	canvas {
	border : 1px gray solid;
	}
	</style>
	<script src="game.js"></script>

	</head>
	<body onload="init()">

	</body>
	</html>