platforming game v7

<!doctype html>
<head>
<title>Platformer</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="styles.css">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
</head>

<body>

<h1>Platformer</h1>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

// canvas
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
canvas.width = 700;
canvas.height = 450;
document.body.appendChild(canvas);

canvas.addEventListener("mousedown", getClickPosition, false);

var framecount = 0;
var activecount = 0; //wie framecount aber wird für fadein fadeout zwecke benutzt
var debug=true; //enable for debug stats
var insideloadingzone=false;
var currentroom=0;
var nextroom=0;  //this is used to save room name of loadingzone you touch
var deathtimer=0;
var dmgtimer=0; //set to 5 when taking damage, used to draw graphical effect
var timeattack=true;
var gamestate=0; // 0 = loading   1 = title screen   2 = ingame     3 = gameover    4 = config     5 = help
var standingtime = 0; // increments when hero stands without moving. If moves, is reset. Used to trigger standing animation.
var helpscreen=0; // which helpscreen is shown  1~5
var xscrolled=0;
var yscrolled=0;
var FPS=0;

// These values can later be changed to balance the game:
var globalFallStun = 26;
var globalMaxHealthMaximum = 200; //soviel maxhealth kann der spieler maximal haben
var globalMaxHealthMinimum = 15; //soviel maxhealth wird der spieler mindestens immer haben
var globalFallDamageFallDuration = 46; //solange muss player fallen bevor er damage nimmt beim landen
var globalPlayerAcceleration = 20; // langsam 5 ~ ca. 60 schnell
var globalStrongPoison=0.25;  //soviel damage per frame mit strong poison (übertrumpft weak poison)
var globalWeakPoison=0.1;     // soviel damage per frame mit weak poison
var globalFrictionGround=1;  //Friction 0-40, the higher the more momentum is applied
var globalFrictionAir=18;
var globalFrictionIce=38;
var globalFrictionConstant=0.3; //How much Friction plays a role. 0.3 is a good value, 0=no friction 0.6 = huge friction
var globalDamageFlashTime=10; //how long does the taking dmg graphical effect show
var globalDeathTime=100; //waiting time after death

//Keycodes todo

var keySettingLeft=37;
var keySettingRight=39;
var keySettingUp=38;
var keySettingConfirm=13;  //used on gameover->resetgame, titlescreen->start
var keySettingAttack=17;  //17=ctrl


// Images


  //titlescreen
var titleReady = false;
var titleImg = new Image();
titleImg.onload = function () {
    titleReady = true;
};
titleImg.src = "img/titlescreen.png";


  //config
var configReady = false;
var configImg = new Image();
configImg.onload = function () {
    configReady = true;
};
configImg.src = "img/configscreen.png";

  //help1
var help1Ready = false;
var help1Img = new Image();
help1Img.onload = function () {
    help1Ready = true;
};
help1Img.src = "img/helpscreen1.png";

  //help2
var help2Ready = false;
var help2Img = new Image();
help2Img.onload = function () {
    help2Ready = true;
};
help2Img.src = "img/helpscreen2.png";

  //help3
var help3Ready = false;
var help3Img = new Image();
help3Img.onload = function () {
    help3Ready = true;
};
help3Img.src = "img/helpscreen3.png";

  //help4
var help4Ready = false;
var help4Img = new Image();
help4Img.onload = function () {
    help4Ready = true;
};
help4Img.src = "img/helpscreen4.png";

  //help1
var help1Ready = false;
var help11Img = new Image();
help1Img.onload = function () {
    help1Ready = true;
};
help1Img.src = "img/helpscreen1.png";

  //help1
var help1Ready = false;
var help11Img = new Image();
help1Img.onload = function () {
    help1Ready = true;
};
help1Img.src = "img/helpscreen1.png";


  //Char Template
var charTemplateReady = false;
var charTemplate = new Image();
charTemplate.onload = function () {
    charTemplateReady = true;
};
charTemplate.src = "img/charTemplate.png";


  //bg room1
var bg1Ready = false;
var bg1Img = new Image();
bg1Img.onload = function () {
    bg1Ready = true;
};
bg1Img.src = "img/bg1.png";

  //bg room2
var bg2Ready = false;
var bg2Img = new Image();
bg2Img.onload = function () {
    bg2Ready = true;
};
bg2Img.src = "img/bg2.png";

  //gameover
var gameoverReady = false;
var gameoverImg = new Image();
gameoverImg.onload = function () {
    gameoverReady = true;
};
gameoverImg.src = "img/gameover.png";

  //itemslot border
var itemslotborderReady = false;
var itemslotborderImg = new Image();
itemslotborderImg.onload = function () {
    itemslotborderReady = true;
};
itemslotborderImg.src = "img/itemslotborder.png";

  //Item:Key
var keyReady = false;
var keyImg = new Image();
keyImg.onload = function () {
    keyReady = true;
};
keyImg.src = "img/itemkey.png";

  //Item:nothing
var nothingReady = false;
var nothingImg = new Image();
nothingImg.onload = function () {
    nothingReady = true;
};
nothingImg.src = "img/itemnothing.png";

  //Item:ball
var ballReady = false;
var ballImg = new Image();
ballImg.onload = function () {
    ballReady = true;
};
ballImg.src = "img/itemball.png";

  //Item:rope
var ropeReady = false;
var ropeImg = new Image();
ropeImg.onload = function () {
    ropeReady = true;
};
ropeImg.src = "img/itemrope.png";

  //Item:plank
var plankReady = false;
var plankImg = new Image();
plankImg.onload = function () {
    plankReady = true;
};
plankImg.src = "img/itemplank.png";

  //Weapon:sword
var swordReady = false;
var swordImg = new Image();
swordImg.onload = function () {
    swordReady = true;
};
swordImg.src = "img/weaponsword.png";


  //Life Icon
var LifeReady = false;
var LifeImg = new Image();
LifeImg.onload = function () {
    LifeReady = true;
};
LifeImg.src = "img/lifeIcon.png";


//Game objects
var hero = {
        direction: 0, //facing direction   0:right 1:left
        state: 0, //0:stand 1:jump 2:fall 3:ded
    jumpingframe: 0, // if jump, increments. if 30, resets
        fallingframe: 0, //if fall, increments. if >50, dies on impact
    x:0,
    y:0,
        xspeed:0,
        yspeed:0,
        xbefore: 0, // these are to see if player has moved
        ybefore: 0,
        hasmoved:false,
        lives:2,
        health:100,
        healthbefore:100, // used, to know if dmg is taken
        maxhealth:100,
        hurtImg:0,
        onleftslope:false,
        onrightslope:false,
        items:["nothing","nothing","nothing"],
        weapon:"sword",
        selectedslot:-1, //0~3 falls -1 dann kein slot ausgewählt
        stun:0,
        poisoned:false,     //weak poison damage over time
        strongpoisoned:false,   //really strong poison damage over time
        friction:1,
        insidelava:false, //falls inside lava dann true. Benutzt zum rendern des chars

        movesLeft:function(modif) {
                                    if (hero.xspeed>0) hero.xspeed=hero.xspeed-(40-hero.friction); //falls xspeed positiv, setze auf 0

                                    hero.xspeed = hero.xspeed -globalPlayerAcceleration+hero.friction*globalFrictionConstant;
                                    if (hero.xspeed < -320) hero.xspeed = -320; //xspeed negative grenze

                                    hero.x = hero.x - (7 * modif) * -hero.xspeed / 320;
                                    hero.direction = 1;     },

        movesRight:function(modif) {
                                     if (hero.xspeed<0) hero.xspeed=hero.xspeed+(40-hero.friction); //falls xspeed negativ, setze auf 0

                                     hero.xspeed = hero.xspeed +globalPlayerAcceleration-hero.friction*globalFrictionConstant;
                                     if (hero.xspeed > 320) hero.xspeed = 320; //xspeed positive grenze

                                     hero.x = hero.x + (7 * modif) * hero.xspeed / 320;
                                     hero.direction = 0;   },

        applyMomentum:function(modif)  {    hero.x = hero.x + 4*  hero.xspeed / 320;
                                                                               },

        descends:function(modif) {   hero.state =2;
                                     hero.y = hero.y + 7 * modif;
                                     hero.fallingframe++;
                                     hero.friction=globalFrictionAir;},

        ascends:function(modif) {    hero.state=1;
                                     hero.y = hero.y - 7 * modif;
                                     hero.jumpingframe++;
                                     hero.friction=globalFrictionAir;},

        landsWithFallDamage:function(modif) {      hero.health = hero.health-hero.fallingframe+15; //je länger gefallen desto mehr damage
                                     hero.state=0;
                                     hero.stun=hero.stun+globalFallStun;
                                     dmgtimer=globalFallStun;
                                     hero.fallingframe=0;
                                     hero.jumpingframe=0;
                                     hero.friction=globalFrictionGround;},

        lands:function(modif) {      hero.state=0;
                                     hero.fallingframe=0;
                                     hero.jumpingframe=0;
                                     hero.friction=globalFrictionGround;}


};

var leftwalls = {   //wände die einen nach rechts pushen
                    //coordinates ist ein array; jew. 4 values machen x,y,width,height aus eines rects
    coordinates:0
};

var rightwalls = {
    coordinates:0
};

var grounds= {
    coordinates: 0
};

var ceilings= {
    coordinates: 0
};

var icegrounds= {   //note: diese teile bezwecken keine wall collision checks sondern lediglich dass die friction erhöht wird.
    coordinates: 0
};

var warps = { //i.e. loading zones
    coordinates: 0
};

var leftslopes = {
    coordinates:0    //coordinates ist array, jew 4 values geben 2 punkte an
};

var rightslopes = {
    coordinates:0
};

var liquid = {
    coordinates:0
};

var spikes = {
    coordinates:0
};


// MAUS KLICK
function getClickPosition(event) {

 if (gamestate===3) { //falls gameover screen, dann bezweckt der click den neustart

   resetGame();

     }


        if (event.x !== undefined && event.y !== undefined)
        {
          x = event.x;
          y = event.y;
        }
        else // Firefox method to get the position
        {
          x = event.clientX + document.body.scrollLeft +
              document.documentElement.scrollLeft;
          y = event.clientY + document.body.scrollTop +
              document.documentElement.scrollTop;
        }

  x -= canvas.offsetLeft;
  y -= canvas.offsetTop;


//click on slot => slot gets selected

if (gamestate===2) {

if (y>390)
{hero.selectedslot=-1;}

if (   x>460
    && x<500
    && y>400
    && y<440)
hero.selectedslot=0;

if (   x>503
    && x<543
    && y>400
    && y<440)
hero.selectedslot=1;

if (   x>546
    && x<586
    && y>400
    && y<440)
hero.selectedslot=2;

if (   x>613
    && x<653
    && y>400
    && y<440)
hero.selectedslot=3;

}

if (gamestate===1 && activecount > 120) { //falls titlescreen

if (y>325 && y<412 && x>40 && x < 212) {
     getNewroom("r1");
     framecount=0;
     activecount=0;
     gamestate=2;
     hero.health=hero.maxhealth;
     }

     if (y>330 && y<420 && x>264 && x < 440) {

     gamestate=4; //configscreen
     }

     if (y>330 && y<420 && x>490 && x < 670) {

     gamestate=5; //helpscreen
     }

 }


if (x>0 && x <20 && y >0 && y < 50) debug= !debug; // todo delete later


//todo add ability to pick up nearby item

//todo add attack


}


// draw wallbox function

var drawWallboxes = function () {

ctx.globalAlpha=0.4;


for (var i = 0; i < leftwalls.coordinates.length; i=i+4 )  //leftwalls
{
ctx.fillStyle ="orange";
ctx.fillRect(leftwalls.coordinates[i] - xscrolled,   leftwalls.coordinates[i+1]-yscrolled,   leftwalls.coordinates[i+2],   leftwalls.coordinates[i+3]) ;

ctx.beginPath();
ctx.moveTo(leftwalls.coordinates[i] - xscrolled,                           leftwalls.coordinates[i+1] - yscrolled);
ctx.lineTo(leftwalls.coordinates[i] - xscrolled,                           leftwalls.coordinates[i+1] + leftwalls.coordinates[i+3] - yscrolled);
ctx.lineTo(leftwalls.coordinates[i]+leftwalls.coordinates[i+2] - xscrolled ,leftwalls.coordinates[i+1]+leftwalls.coordinates[i+3] - yscrolled);
ctx.lineTo(leftwalls.coordinates[i]+leftwalls.coordinates[i+2] - xscrolled ,leftwalls.coordinates[i+1] - yscrolled);
ctx.closePath();
ctx.strokeStyle="brown";
ctx.stroke();
 }


ctx.fillStyle = "purple"; //rightwalls
for (var i = 0; i < rightwalls.coordinates.length; i=i+4 )
{
    ctx.fillStyle ="pink";
ctx.fillRect(rightwalls.coordinates[i] - xscrolled,   rightwalls.coordinates[i+1]-yscrolled,   rightwalls.coordinates[i+2],rightwalls.coordinates[i+3]) ;

ctx.beginPath();
ctx.moveTo(rightwalls.coordinates[i] - xscrolled,                           rightwalls.coordinates[i+1] - yscrolled);
ctx.lineTo(rightwalls.coordinates[i] - xscrolled,                           rightwalls.coordinates[i+1] + rightwalls.coordinates[i+3] - yscrolled);
ctx.lineTo(rightwalls.coordinates[i]+rightwalls.coordinates[i+2] - xscrolled,   rightwalls.coordinates[i+1]+ rightwalls.coordinates[i+3] - yscrolled);
ctx.lineTo(rightwalls.coordinates[i]+rightwalls.coordinates[i+2] - xscrolled,   rightwalls.coordinates[i+1] - yscrolled);
ctx.closePath();
ctx.strokeStyle="purple";
ctx.stroke();

 }


ctx.fillStyle = "black"; //grounds
for (var i = 0; i < grounds.coordinates.length; i=i+4 )
{
ctx.fillStyle ="rgb(80,80,80)";
ctx.fillRect(grounds.coordinates[i]-xscrolled,   grounds.coordinates[i+1]-yscrolled,   grounds.coordinates[i+2],grounds.coordinates[i+3]) ;

ctx.beginPath();
ctx.moveTo(grounds.coordinates[i]-xscrolled,                           grounds.coordinates[i+1] - yscrolled);
ctx.lineTo(grounds.coordinates[i]-xscrolled,                           grounds.coordinates[i+1] + grounds.coordinates[i+3] - yscrolled);
ctx.lineTo(grounds.coordinates[i]+grounds.coordinates[i+2]-xscrolled,   grounds.coordinates[i+1]+ grounds.coordinates[i+3] - yscrolled);
ctx.lineTo(grounds.coordinates[i]+grounds.coordinates[i+2]-xscrolled,   grounds.coordinates[i+1] - yscrolled);
ctx.closePath();
ctx.strokeStyle="rgb(120,120,120)";
ctx.stroke();
   }


ctx.fillStyle = "brown"; //ceilings
for (var i = 0; i < ceilings.coordinates.length; i=i+4 )
{
ctx.fillStyle ="brown";
ctx.fillRect(ceilings.coordinates[i]-xscrolled,   ceilings.coordinates[i+1]-yscrolled,   ceilings.coordinates[i+2],ceilings.coordinates[i+3]) ;

ctx.beginPath();
ctx.moveTo(ceilings.coordinates[i]-xscrolled,                           ceilings.coordinates[i+1]-yscrolled);
ctx.lineTo(ceilings.coordinates[i]-xscrolled,                           ceilings.coordinates[i+1] + ceilings.coordinates[i+3]-yscrolled);
ctx.lineTo(ceilings.coordinates[i]+ceilings.coordinates[i+2]-xscrolled,   ceilings.coordinates[i+1]+ ceilings.coordinates[i+3]-yscrolled);
ctx.lineTo(ceilings.coordinates[i]+ceilings.coordinates[i+2]-xscrolled,   ceilings.coordinates[i+1]-yscrolled);
ctx.closePath();
ctx.strokeStyle="darkred";
ctx.stroke();
 ;}


ctx.fillStyle = "white"; //icegrounds
for (var i = 0; i < icegrounds.coordinates.length; i=i+4 )
{ ctx.fillRect(icegrounds.coordinates[i]-xscrolled,   icegrounds.coordinates[i+1]-yscrolled,   icegrounds.coordinates[i+2],icegrounds.coordinates[i+3]) ;

   ctx.fillStyle = "rgba(250, 250, 250,0.9)";
  ctx.fillText("ice", icegrounds.coordinates[i]-xscrolled, icegrounds.coordinates[i+1]-yscrolled);
}


ctx.fillStyle = "green"; //loadingzones
for (var i = 0; i < warps.coordinates.length; i=i+5 )
{ ctx.fillRect(warps.coordinates[i+1]-xscrolled,warps.coordinates[i+2]-yscrolled,warps.coordinates[i+3],warps.coordinates[i+4]) ;
  ctx.fillStyle = "rgba(250, 250, 250,0.9)";
  ctx.fillText(warps.coordinates[i], warps.coordinates[i+1]-xscrolled, warps.coordinates[i+2]-yscrolled);}


for (var i = 0; i < liquid.coordinates.length; i=i+5 )  //liquid
{
  if (liquid.coordinates[i] === "lava") ctx.fillStyle = "rgb(200,0,0)"; //lava
  else if (liquid.coordinates[i] === "water") ctx.fillStyle = "rgb(100,100,200)"; //water
  ctx.fillRect(liquid.coordinates[i+1] - xscrolled,   liquid.coordinates[i+2]-yscrolled,   liquid.coordinates[i+3],liquid.coordinates[i+4]) ;

   ctx.fillStyle = "rgba(250, 250, 250,0.9)";
  ctx.fillText(liquid.coordinates[i], liquid.coordinates[i+1]-xscrolled, liquid.coordinates[i+2]-yscrolled);
}


ctx.fillStyle = "white"; //slopes
for (var i = 0; i < leftslopes.coordinates.length; i=i+4 )
{
ctx.beginPath();
ctx.moveTo(leftslopes.coordinates[i]-xscrolled,    leftslopes.coordinates[i+1]-yscrolled);
ctx.lineTo(leftslopes.coordinates[i]-xscrolled,    leftslopes.coordinates[i+3]-yscrolled);
ctx.lineTo(leftslopes.coordinates[i+2]-xscrolled,  leftslopes.coordinates[i+3]-yscrolled);
ctx.closePath();   ctx.fill();
}

ctx.fillStyle = "pink"; //slopes
for (var i = 0; i < rightslopes.coordinates.length; i=i+4 )
{
ctx.beginPath();
ctx.moveTo(rightslopes.coordinates[i]-xscrolled,    rightslopes.coordinates[i+1]-yscrolled);
ctx.lineTo(rightslopes.coordinates[i]-xscrolled,    rightslopes.coordinates[i+3]-yscrolled);
ctx.lineTo(rightslopes.coordinates[i+2]-xscrolled,  rightslopes.coordinates[i+3]-yscrolled);
ctx.closePath();   ctx.fill();
}

ctx.globalAlpha=1;
};


// draw stats function

var drawStats = function() {

        ctx.fillStyle = "rgb(250, 250, 250)";
    ctx.font = "11px Helvetica";
    ctx.fillText("framecount: " + framecount, 232, 10);
        ctx.fillText("player X " + hero.x, 232, 20);
        ctx.fillText("player Y " + hero.y, 232, 30);
        ctx.fillText("jump frames " + hero.jumpingframe, 232, 40);
        ctx.fillText("fall frames " + hero.fallingframe, 232, 50);
        if (hero.state===0) ctx.fillText("status: Standing", 232, 60);
        if (hero.state===1) ctx.fillText("status: Jumping", 232, 60);
        if (hero.state===2) ctx.fillText("status: Falling", 232, 60);
        if (hero.state===3) ctx.fillText("status: Dead", 232, 60);
        if (hero.direction===0) ctx.fillText("direction: right", 232,70);
        if (hero.direction===1) ctx.fillText("direction: left", 232,70);
        if (hero.hasmoved===true) ctx.fillText("moving?: yes", 232,80);
        if (hero.hasmoved===false) ctx.fillText("moving?: no", 232,80);
        if (insideloadingzone===false) ctx.fillText("in warp?: no", 232,90);
        if (insideloadingzone===true) ctx.fillText("in warp?: yes", 232,90);
        ctx.fillText("current room: " + currentroom, 232, 100);
        ctx.fillText("next room: " + nextroom, 232, 110);
        ctx.fillText("player lives: " + hero.lives, 232, 120);
        ctx.fillText("deathtimer: " + deathtimer, 472, 10);
        ctx.fillText("gamestate: "+ gamestate, 472, 20);
        ctx.fillText("slope: " + hero.onleftslope + " " + hero.onrightslope, 472, 30);
        ctx.fillText("health: " + hero.health, 472, 40);
        ctx.fillText("dmgtimer: " + dmgtimer, 472, 50);
        ctx.fillText("stun: " + hero.stun, 472, 60);
        ctx.fillText("dmgImg?: " + hero.hurtImg, 472, 70);
        ctx.fillText("xspeed: " + hero.xspeed, 472, 90);
        ctx.fillText("yspeed?: " + hero.yspeed, 472, 100);
        ctx.fillText("friction: " + hero.friction, 472, 120);
        ctx.fillText("keys: " + printObject(keysDown),472, 160);
        ctx.fillText("scrolled x: " + xscrolled, 472, 180);
        ctx.fillText("scrolled y: " + yscrolled, 472, 190);
        ctx.fillText("FPS: " + FPS, 472, 200);


};

// print Object function

function printObject(o) {
  var out = '';
  for (var p in o) {
    out += p + ': ' + o[p] + '\n';
  }
  return(out);
}


// framecount to time function

var framecountToTime = function(framecount) {
 var ms = (framecount%60)*16;
 var s = framecount;
 var m = framecount;

 return m+":"+s+"."+ms;
};


// get room function (after death or after touching loading zone

var getNewroom = function(room) {

             if (room==="r1") return r1(100,200);
             else if (room==="r2") return r2(100,200); //todo change
};


// Handle keyboard controls
var keysDown = {};

addEventListener("keydown", function (e) {
    keysDown[e.keyCode] = true;
}, false);

addEventListener("keyup", function (e) {
    delete keysDown[e.keyCode];
}, false);


// reset the whole game function

var resetGame = function () {

     gamestate=0;
     framecount=0;
     hero.lives = 3;

    };


// room preset functions

var r1 = function (x,y) { //room1
    hero.x = x;
    hero.y = y;
        hero.state = 2;
        hero.direction = 0;
        leftwalls.coordinates = [0,0,70,360,  388,350,10,290 ]  ;
        rightwalls.coordinates = [480,464,10,300]  ;
        grounds.coordinates = [0,342,390,600,  490,450,500,200,  790,382,130,68]  ;
        ceilings.coordinates = [0,0,900,30];
        icegrounds.coordinates = [220,339,130,10];
        leftslopes.coordinates = [65,250,110,350];
        rightslopes.coordinates = [794,382,690,458];
        warps.coordinates = ["r2", 200,200,10,10]; // room name, xpos,ypos,xlength,ylength
        liquid.coordinates = ["water",350,280,150,170, "lava", 500,300,150,170];
        spikes.coordinates = [0];
        currentroom="r1";

};


var r2 = function (x,y,dir) { //room1
    hero.x = x;
    hero.y = y;
        hero.state = 2;
        hero.direction = 0;
        leftwalls.coordinates = [0,0,70,360,  388,350,10,290 ]  ;
        rightwalls.coordinates = [480,450,10,300,  780, 382, 10,88]  ;
        grounds.coordinates = [0,342,390,600,  490,450,500,200,  790,382,130,68]  ;
        ceilings.coordinates = [0];
        icegrounds.coordinates = [0];
        leftslopes.coordinates = [0];
        rightslopes.coordinates = [0];
        warps.coordinates = ["r2",863,290,48,90];
        liquid.coordinates = [0];
        spikes.coordinates = [0];
        currentroom="r2";
};


// Update objects function
var update = function (modif) {

    if (gamestate===2 || gamestate===3) {

hero.healthbefore = hero.health;
hero.xbefore = hero.x;
hero.ybefore = hero.y;


    if (hero.state===0) { //player stood

             if (keySettingUp in keysDown && hero.stun <1) { // player holds "up"

                hero.ascends(modif);

             }

             if (keySettingLeft in keysDown && hero.stun <1) { // Player holding left
             hero.movesLeft(modif);
         }

         if (keySettingRight in keysDown && hero.stun <1) { // Player holding right
             hero.movesRight(modif);
             }

             if (hero.xspeed !== 0
                 && !(keySettingLeft in keysDown ||keySettingRight in keysDown)
                 && hero.stun<1) {
             hero.applyMomentum(modif); //glide effekt
              }
             }

    else if (hero.state ===1) { //player was jumping

             if (keySettingUp in keysDown) { // wenn spieler "oben" drückt

                  if (hero.jumpingframe > 32 || hero.stun > 0) {  //wenn jumpframes überschritten oder stun

                    //starte das fallen
                    hero.descends(modif);

                     } else {                      //ansonsten springe weiter
                    hero.ascends(modif);
                     }
             }
             else {                    //wenn nicht "oben" gedrückt, dan falle
                 hero.descends(modif);

                    }

             if (keySettingLeft in keysDown && hero.stun <1) { // Player holding left
        hero.movesLeft(modif);
         }

         if (keySettingRight in keysDown && hero.stun <1) { // Player holding right
                hero.movesRight(modif);
             }

             if (hero.xspeed !== 0
                 && !(keySettingLeft in keysDown ||keySettingRight in keysDown)
                 && hero.stun<1) {
             hero.applyMomentum(modif); //glide effekt
              }

}

    else if (hero.state ===2) { //player was falling

            hero.descends(modif);

             if (keySettingLeft in keysDown && hero.stun <1) { // Player holding left
        hero.movesLeft(modif);
         }

         if (keySettingRight in keysDown && hero.stun <1) { // Player holding right
        hero.movesRight(modif);
             }

              if (hero.xspeed !== 0 && !(keySettingLeft in keysDown ||keySettingRight in keysDown)) {
             hero.applyMomentum(modif); //glide effekt
              }
}


// during gameover, player can press key to continue

if (gamestate===3) // if gameover
{
 if (keySettingConfirm in keysDown)
   {
     resetGame();
    }
 else
 {
     deathtimer=1;  //because it mustn restart until user action
     dmgtimer=0;
 }

}


// wall collision:


for (var i = 0; i < leftwalls.coordinates.length; i=i+4 ) //leftwalls
{
  if ( hero.x > leftwalls.coordinates[i] //if player is inside any of them...
       && hero.x <  leftwalls.coordinates[i]+leftwalls.coordinates[i+2]
       && hero.y > leftwalls.coordinates[i+1]
       && hero.y < leftwalls.coordinates[i+1]+leftwalls.coordinates[i+3])
   {
      hero.x = leftwalls.coordinates[i]+leftwalls.coordinates[i+2]; //... put player to the right of it
      hero.xspeed = 0;
   }
}


for (var i = 0; i < rightwalls.coordinates.length; i=i+4 ) //rightwalls
{
  if ( hero.x > rightwalls.coordinates[i] //if player is inside any of them...
       && hero.x <  rightwalls.coordinates[i]+rightwalls.coordinates[i+2]
       && hero.y > rightwalls.coordinates[i+1]
       && hero.y < rightwalls.coordinates[i+1]+rightwalls.coordinates[i+3])
   {
      hero.x = rightwalls.coordinates[i]; //... put player to the left of it
      hero.xspeed=0;

   }
}


for (var i = 0; i < grounds.coordinates.length; i=i+4 ) //grounds
{
  if ( hero.x > grounds.coordinates[i] //if player is inside any of them...
       && hero.x <  grounds.coordinates[i]+grounds.coordinates[i+2]
       && hero.y > grounds.coordinates[i+1]
       && hero.y < grounds.coordinates[i+1]+grounds.coordinates[i+3])
   {
      hero.y = grounds.coordinates[i+1];  //... put player on top of it

      if (hero.fallingframe > globalFallDamageFallDuration) { //wenn spieler zu lange fällt, dann tot

          hero.landsWithFallDamage(modif);

      } else {
          hero.lands(modif);
   }
}
}


for (var i = 0; i < icegrounds.coordinates.length; i=i+4 ) //ice Note: this is only to apply friction and for nothing else
{
  if ( hero.x > icegrounds.coordinates[i] //if player is inside any of them...
       && hero.x <  icegrounds.coordinates[i]+icegrounds.coordinates[i+2]
       && hero.y > icegrounds.coordinates[i+1]
       && hero.y < icegrounds.coordinates[i+1]+icegrounds.coordinates[i+3])
   {
      hero.friction = globalFrictionIce;  //increase friction
} else if (hero.state===0) hero.friction = globalFrictionGround;  //für den fall dass man sich aus dem rutschigen bereich rausbewegt

}


for (var i = 0; i < ceilings.coordinates.length; i=i+4 ) //ceilings
{
  if ( hero.x > ceilings.coordinates[i] //if player is inside any of them...
       && hero.x <  ceilings.coordinates[i]+ceilings.coordinates[i+2]
       && hero.y > ceilings.coordinates[i+1]
       && hero.y < ceilings.coordinates[i+1]+ceilings.coordinates[i+3])
   {
      hero.y = ceilings.coordinates[i+1]+ceilings.coordinates[i+3]; //... put player below it
      hero.state = 2; //state:falling
      hero.y = hero.y + 7 * modif;
   }
}

       for (var i = 0; i < leftslopes.coordinates.length; i=i+4 ) //leftslopes
{
  var m = (leftslopes.coordinates[i+3] - leftslopes.coordinates[i+1]) / (leftslopes.coordinates[i+2] - leftslopes.coordinates[i]);

  if ( hero.x > leftslopes.coordinates[i] //if player is inside any of them...
       && hero.x <  leftslopes.coordinates[i+2]
       && hero.y > leftslopes.coordinates[i+1]
       && hero.y < leftslopes.coordinates[i+3]
                           //hero is below slope:  (note: revert the equation for opposite check)
       && hero.y > m* (hero.x- leftslopes.coordinates[i]) + leftslopes.coordinates[i+1]
       )
   {        if (hero.fallingframe > globalFallDamageFallDuration) { //wenn spieler zu lange fällt, dann tot

      hero.landsWithFallDamage(modif);

      } else {
      hero.y = m* (hero.x -leftslopes.coordinates[i]) + leftslopes.coordinates[i+1];
      hero.lands(modif);
      hero.onleftslope=true; }
   }
}

for (var i = 0; i < rightslopes.coordinates.length; i=i+4 ) //rightslopes
{
  var m = (rightslopes.coordinates[i+1] - rightslopes.coordinates[i+3]) / (rightslopes.coordinates[i] - rightslopes.coordinates[i+2]);


  if ( hero.x > rightslopes.coordinates[i+2] //if player is inside any of them...
       && hero.x <  rightslopes.coordinates[i]
       && hero.y > rightslopes.coordinates[i+1]
       && hero.y < rightslopes.coordinates[i+3]

       && hero.y > m* (hero.x- rightslopes.coordinates[i]) + rightslopes.coordinates[i+1]
       )
   {   if (hero.fallingframe > 52) { //wenn spieler zu lange fällt, dann tot

           hero.landsWithFallDamage(modif);

      } else {
      hero.y = m* (hero.x- rightslopes.coordinates[i]) + rightslopes.coordinates[i+1];
      hero.lands(modif);
      hero.onrightslope=true; }
   }
}


 // If no ground below player, give him fall status:
 // i.e. when player walks off a ledge

 if (hero.state===0 && !hero.onleftslope && !hero.onrightslope) { //spieler steht und zwar nicht auf einer slope.

for (var i = 0; i < grounds.coordinates.length; i=i+4 ) //grounds
{
       if (
          hero.x > grounds.coordinates[i] //if player does not have a ground tile below him
       && hero.x <  grounds.coordinates[i]+grounds.coordinates[i+2]
       && hero.y +3 > grounds.coordinates[i+1]
       && hero.y < grounds.coordinates[i+1]+grounds.coordinates[i+3]
           )
       {
         hero.state=0;
         hero.jumpingframe=0;
         break;
       }
       else
       {
         hero.state=2; //player falls
       }
}
};


 if (hero.state===0 && hero.onleftslope) { //wenn spieler steht nicht mehr über slope -> entferne onslope attribut

for (var i = 0; i < leftslopes.coordinates.length; i=i+4 )
{
       if (
          hero.x > leftslopes.coordinates[i]
       && hero.x <  leftslopes.coordinates[i+2]
       && hero.y +1> (leftslopes.coordinates[i+3] - leftslopes.coordinates[i+1]) / (leftslopes.coordinates[i+2] - leftslopes.coordinates[i])*(hero.x - leftslopes.coordinates[i])+leftslopes.coordinates[i+1]
       && hero.y < leftslopes.coordinates[i+3]
           )
       {
         hero.state=0;
         hero.jumpingframe=0;
         break;
       }
       else
       {
         hero.state=2; //player falls
         hero.onleftslope=false;
       }
}
}

if (hero.state===0 && hero.onrightslope) { //wenn spieler steht nicht mehr über slope -> entferne onslope attribut

for (var i = 0; i < rightslopes.coordinates.length; i=i+4 )
{
       if (
          hero.x > rightslopes.coordinates[i+2]
       && hero.x <  rightslopes.coordinates[i]
       && hero.y +1> (rightslopes.coordinates[i+1] - rightslopes.coordinates[i+3]) / (rightslopes.coordinates[i] - rightslopes.coordinates[i+2])*(hero.x - rightslopes.coordinates[i])+rightslopes.coordinates[i+1]
       && hero.y < rightslopes.coordinates[i+3]
           )
       {
         hero.state=0;
         hero.jumpingframe=0;
         break;
       }
       else
       {
         hero.state=2; //player falls
         hero.onrightslope=false;
       }
}
};


//Misc:


  // camera pos: xscrolled und yscrolled berechnen
  if (hero.x > 350) {
      xscrolled = hero.x - 350;
      if (hero.x > 1050) xscrolled = 700;
  } else xscrolled=0;

 if (hero.y > 225) {
     yscrolled = hero.y - 225;
     if (hero.y > 675) yscrolled = 450;
  } else yscrolled=0;


  //keep in boundary
  if (hero.x > 1375) hero.x =1375;
  if (hero.x < 25) hero.x =25;
  if (hero.y > 925) hero.health=0; //dies
  if (hero.y < 25) hero.y =25;


  //update other things:
  framecount++;
  if (dmgtimer>0) dmgtimer--;

  //has player moved?
  if (hero.xbefore === hero.x || ! (keySettingLeft in keysDown || keySettingRight in keysDown))  hero.hasmoved=false;
  else hero.hasmoved=true;

 // has player taken damage?
  if (hero.healthbefore > hero.health)
  {
     dmgtimer=globalDamageFlashTime;

      if (Math.random()<0.5 )
      {      hero.hurtImg = 1;}
      else hero.hurtImg = 2;


  }

 if (hero.stun===0) hero.hurtImg=0;

  hero.stun--;
  if (hero.stun >60) hero.stun =60;
  else if (hero.stun <0) hero.stun=0;


  // loadingzone collision:
for (var i = 0; i < warps.coordinates.length; i=i+5 )
{
  if ( hero.x > warps.coordinates[i+1] //if player is inside any of them...
       && hero.x <  warps.coordinates[i+1]+warps.coordinates[i+3]
       && hero.y > warps.coordinates[i+2]
       && hero.y < warps.coordinates[i+2]+warps.coordinates[i+4])
   {
      insideloadingzone=true;//trigger next room
      nextroom=warps.coordinates[i];
   }
}


// maxhealth checks
if (hero.maxhealth < hero.health) hero.health = hero.maxhealth;

if (hero.maxhealth > globalMaxHealthMaximum) hero.maxhealth = globalMaxHealthMaximum;
else if (hero.maxhealth<globalMaxHealthMinimum) hero.maxhealth = globalMaxHealthMinimum;

// xspeed reduces if not moving
if (! hero.hasmoved) {

      if (hero.xspeed > 40) hero.xspeed = hero.xspeed - (40-hero.friction);
      else if ( hero.xspeed < -40) hero.xspeed = hero.xspeed + (40-hero.friction);
      else hero.xspeed = 0;
}

// health = 0 triggers death
if (hero.health <1) {
        hero.state=3;
        activecount++;
}

//poison
if (gamestate===2) {
if (hero.strongpoisoned) hero.health=hero.health -globalStrongPoison;
else if (hero.poisoned) hero.health=hero.health-globalWeakPoison;
}
   }


else if (gamestate===0) {  // LOADING SCREEN

activecount++;

  if ( help1Ready && help2Ready && help3Ready && help4Ready && configReady &&  LifeReady && titleReady && charTemplate && bg1Ready && bg2Ready && gameoverReady
       && keyReady && nothingReady && ballReady && ropeReady && plankReady && swordReady)
  {
  if (activecount>100)
    {
      gamestate=1;
      activecount=0;
    }   //wenn alle bilder geladen dann wechsle zum titlescreen
  }
}

else if (gamestate===1) {  // TITLESCREEN
  //todo zeige title screen und zeige start aufforderung
  //bei klick oder knopfdruck, change gamestate to 2

  activecount++;

  if (keySettingConfirm in keysDown && activecount > 120) { //wenn enter gedrückt = start
     getNewroom("r1");
     framecount=0;
     activecount=0;
     gamestate=2;
     hero.health=hero.maxhealth;
     hero.poisoned=false;
     hero.strongpoisoned=false;
  }

}

else if (gamestate === 4) { // config

    // todo

}

else if (gamestate === 5) { //help

    // todo

}

}; // end of "update function"


// Draw everything function
var render = function () {

        if (gamestate===2 || gamestate===3) {

        //draw level bg


            if (currentroom==="r1") { //wenn der raum "r1" ist, dann zeichne dessen grafik
                ctx.drawImage(bg1Img, xscrolled, yscrolled, 900, 600, 0, 0, 900, 600);
            }
            else if (currentroom==="r2") {
                ctx.drawImage(bg2Img,xscrolled,yscrolled, 900, 600, 0, 0, 900, 600);
            }


        //draw hero

        if (hero.stun>1 && hero.health >0)
        {                                        //sx sy     swidth sheight    dx            dy      dwidth dheight
if (hero.hurtImg === 1) ctx.drawImage(charTemplate, 0, 500,       50, 50,     hero.x-25-xscrolled, hero.y-25-yscrolled,   50,50);
else if (hero.hurtImg === 2) ctx.drawImage(charTemplate, 50, 500,  50, 50,     hero.x-25-xscrolled, hero.y-25-yscrolled,   50,50);
        }

else {

            if (hero.state===3) //if dead
            {
                if (hero.insidelaval===true) { // when dying inside of lava

                            if (activecount < 10)  ctx.drawImage(charTemplate, 0, 350, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);  //deathsprite lava 1
                            else ctx.drawImage(charTemplate, 50, 350, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);                   //deathsprite lava 2

                }

           //     else if (hero.deathcause==="spikes") { // when dying in spikes
           //     }

                else {   // when dying from fall dmg, enemy projectiles, being squeezed etc. etc.

                     if (hero.direction === 0)  {
                            if (activecount < 10)  ctx.drawImage(charTemplate, 0, 250, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); //deathsprite right normal1
                            else ctx.drawImage(charTemplate, 50, 250, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);                   //deathsprite right normal2

                     }
                     else {
                            if (activecount < 10)  ctx.drawImage(charTemplate, 0, 300, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); //deathsprite left normal1
                            else ctx.drawImage(charTemplate, 50, 300, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);                   //deathsprite left normal2
                     }

                }


            }
            else
            {
            if (hero.direction===0) //player looks right
            {
              if (hero.state===0) //stands
              {
                if (hero.hasmoved) {

                    if (framecount % 30 < 15) ctx.drawImage(charTemplate, 0, 200, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); // walking right on ground 1
                    else                      ctx.drawImage(charTemplate, 50, 200, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); // walking right on ground 2

                }
                else
                {
                   if (framecount % 160 < 40) ctx.drawImage(charTemplate, 0, 0, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);  // stand right 1
                   else if (framecount % 160 < 80) ctx.drawImage(charTemplate,50, 0, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);  // stand right 2
                   else if (framecount % 160 < 120) ctx.drawImage(charTemplate,100,0,50,50, hero.x-25-xscrolled, hero.y-25-yscrolled,50,50);  // stand right 3
                   else if (framecount % 160 < 160) ctx.drawImage(charTemplate, 50,0,50,50,hero.x-25-xscrolled, hero.y-25-yscrolled,50,50);  // stand right 4

                }
              }
              else {

                   if (hero.jumpingframe >0 && hero.fallingframe <1) { //jumping right

                   ctx.drawImage(charTemplate, 50,450, 50,50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);

                   }
                   else if (hero.fallingframe >0) { //falling right

                   if (framecount % 26 < 13) ctx.drawImage(charTemplate, 100, 400, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);
                   else                      ctx.drawImage(charTemplate, 100, 450, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);

                   }


          }


            }
            else                       //otherwiselooks left
            {
              if (hero.state===0)
              {
                if (hero.hasmoved) {

                                        if (framecount % 30 < 15) ctx.drawImage(charTemplate, 0, 150, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); // walking left on ground 1
                    else                      ctx.drawImage(charTemplate, 50, 150, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50); // walking left on ground 2

                    }
                else {
                    if (framecount % 160 < 40) ctx.drawImage(charTemplate, 0, 50, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);  // stand left 1
                    else if (framecount % 160 < 80) ctx.drawImage(charTemplate,50, 50, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);  // stand left 2
                    else if (framecount % 160 < 120) ctx.drawImage(charTemplate,100,50,50,50, hero.x-25-xscrolled, hero.y-25-yscrolled,50,50);  // stand left 3
                    else if (framecount % 160 < 160) ctx.drawImage(charTemplate, 50,50,50,50,hero.x-25-xscrolled, hero.y-25-yscrolled,50,50);  // stand left 4

                     }
              }
              else  {

                   if (hero.jumpingframe >0 && hero.fallingframe <1) { //jumping left

                   ctx.drawImage(charTemplate, 0,450, 50,50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);

                   }
                   else if (hero.fallingframe >0) { //falling left

                   if (framecount % 26 < 13) ctx.drawImage(charTemplate, 0, 400, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);
                   else                      ctx.drawImage(charTemplate, 50, 400, 50, 50, hero.x-25-xscrolled, hero.y-25-yscrolled, 50, 50);

                   }


               }
              }
            }
        }


       // draw foreground elements


         // todo


        // draw red overlay when health is low

        if (hero.health < 1) {
        ctx.fillStyle="rgba(60,0,0,0.5)";
        ctx.fillRect(0,0,canvas.width,canvas.height);
        }
        else if (hero.health <30) {
        ctx.globalAlpha =  (1 - (hero.health/30))*0.25 ;
        ctx.fillStyle="red";
        ctx.fillRect(0,0,canvas.width,canvas.height);
        }


        // draw items
       ctx.globalAlpha=1;
       ctx.drawImage(itemslotborderImg,440,canvas.height-53);

       ctx.globalAlpha = 0.8;

       for (var i = 0; i < hero.items.length; i++)
       {


           if (hero.items[i] === "nothing")
           {
              ctx.drawImage(nothingImg, 460+i*43, canvas.height-50);
           }
            if (hero.items[i] === "ball")
           {
              ctx.drawImage(ballImg, 460+i*43, canvas.height-50);
           }
           if (hero.items[i] === "rope")
           {
               ctx.drawImage(ropeImg, 460+i*43, canvas.height-50);
           }
           if (hero.items[i] === "plank")
           {
               ctx.drawImage(plankImg, 460+i*43, canvas.height-50);
           }
           if (hero.items[i] === "key")
           {
              ctx.drawImage(keyImg, 460+i*43, canvas.height-50);
           }

           //umrandung

                 if (hero.selectedslot===i) //i ist der ausgewählte slot, dann => hervorhebung
           {ctx.lineWidth=3;
            ctx.strokeStyle="#ff0";}
           else
           {ctx.strokeStyle="rgba(50,50,250,0.7)";
            ctx.lineWidth=1;}

      ctx.strokeRect(460+i*43,canvas.height-50,40,40);

       }


       // draw weapons

           if (hero.weapon === "nothing")
           {
               ctx.drawImage(nothingImg, 614, canvas.height-50);
           }
            if (hero.weapon === "sword")
           {
               ctx.drawImage(swordImg, 614, canvas.height-50);
           }

           //umrandung

                      if (hero.selectedslot===3) //i ist der ausgewählte slot, dann => hervorhebung
           {ctx.lineWidth=3;
            ctx.strokeStyle="#ff0";}
           else
           {ctx.strokeStyle="rgba(250,20,20,0.6)";
            ctx.lineWidth=1;}

      ctx.strokeRect(614,canvas.height-50,40,40);


      // draw lives

      for (var i = 0 ; i<hero.lives ; i++) {

      ctx.drawImage(LifeImg, hero.maxhealth*1.2+i*16+46, canvas.height-28);

      }


      // draw time

      if (timeattack) {
    ctx.fillStyle = "rgb(220, 220, 220)";
    ctx.font = "16px Calibri";

    ctx.fillText(framecountToTime(framecount), 20, canvas.height-36);

      }


              ctx.globalAlpha=1;


      // draw health

        ctx.fillStyle="black";
        ctx.fillRect(20,canvas.height-25,hero.maxhealth*1.2,10);  //black healthbar background

      if (hero.health >35 || (hero.health>0 && (framecount%34) > 17 ))
      {
        if (hero.poisoned || hero.strongpoisoned) ctx.fillStyle="rgba(180,30,240,0.8)"; //purple bar if poisoned
        else ctx.fillStyle="rgba(180,30,30,0.8)";
        ctx.fillRect(20,canvas.height-25,hero.health*1.2,10); //draw red bar
      }
        ctx.lineWidth=2;
        ctx.strokeStyle="rgba(180,180,180,0.5)";
        ctx.strokeRect(20,canvas.height-25,hero.maxhealth*1.2,10); //draw white stroke


       // draw gameover


       if (gamestate===3) ctx.drawImage(gameoverImg, 100,100);

       ctx.fillRect(hero.x,hero.y,1,1);


    // Debug info/stats
        if (debug) {

       drawWallboxes();
       drawStats();

            }
        }

        else if (gamestate===0) { // zeige den Loadingscreen

            ctx.fillStyle="black";
            ctx.fillRect(0,0,canvas.width,canvas.height);

        }

        else if (gamestate===1) { // zeige den titlescreen

            ctx.globalAlpha=1;

            ctx.fillStyle="black";
            ctx.fillRect(0,0,canvas.width,canvas.height);

            ctx.drawImage(titleImg, 0,0);

            if (activecount<100)  {
            ctx.globalAlpha= 1- (0.01*activecount);
            ctx.fillStyle="gba(0,0,0)";
            ctx.fillRect(0,0,canvas.width,canvas.height);
            }


        }

        else if (gamestate===4) {  //config

           ctx.drawImage(configImg,0,0);

           //todo screen 2 3 4

        }

        else if (gamestate===5) { //helpscreen

            ctx.drawImage(help1Img,0,0);

            //todo screen 2 3 4

        }

};


// The main game loop
var main = function () {


   now = Date.now();

while (now - then < 16) {
  now = Date.now();
  } // auf jedenfall warten bis so viele millisec um sind. Dies soll entgegenwirken dass schnellere PCs das spiel beschleunigen


    update( 0.7 );
    render();
        frames_rendered_this_second++;            // nach jedem update und render, increment

   if ( now - timestamp_per_second > 1000)
   {
       timestamp_per_second = now;
       FPS = frames_rendered_this_second;
       frames_rendered_this_second=0;             // und nach einer sekunde, reset to zero
   }

   then = now;

        //wenn loadingzone berührt wurde-> nextroom handler
        if (gamestate===2 && insideloadingzone)
           {
             getNewroom(nextroom);
             insideloadingzone=false;
           }

        if (gamestate===2 && hero.state===3)
        {
            deathtimer++;
            if (deathtimer > globalDeathTime)
            {
                deathtimer=0;
                hero.fallingframe=0;
                activecount=0;
                hero.health=hero.maxhealth;
                hero.strongpoisoned=false;
                hero.strongpoisoned=false;
                hero.lives--;

                if (hero.lives < 1)
                { gamestate=3;

                }
                else getNewroom(currentroom);   //else, reload room
            }
        }


    // Request to do this again ASAP
    requestAnimationFrame(main);
};


// Cross-browser support for requestAnimationFrame
var w = window;
requestAnimationFrame = w.requestAnimationFrame || w.webkitRequestAnimationFrame || w.msRequestAnimationFrame || w.mozRequestAnimationFrame;


// start the game
var now = Date.now();
var then = Date.now();
var timestamp_per_second= Date.now();
var frames_rendered_this_second=0;

resetGame();
main();


</script>
</body>
</html>