Compare commits

...

3 Commits

  1. 111
      game.js
  2. 24
      gameTimer.js
  3. 28
      index.html

@ -16,29 +16,92 @@ const updatePlayer = () => {
document.getElementById('player').style.bottom = `${player.y}px`
}
gamewindow.addEventListener('keydown', (e) => {
console.log(e)
if(e.key == "d")
player.x += 10
else if(e.key == "a" && !(player.x <= 0))
player.x -= 10
else if(e.key == "w")
gamewindow.addEventListener('tick', (e) => {
// THIS IS WHERE POSITION UPDATES AND COLLISIONS ARE HANDELED
})
// gamewindow.addEventListener('keydown', (e) => {
// if(e.key == "d")
// player.x += 10
// else if(e.key == "a" && !(player.x <= 0))
// player.x -= 10
// else if(e.key == "w")
// player.y += 10
// else if(e.key == "s"&& !(player.y <= 0))
// player.y -= 10
// // if (!e.repeat)
// // logMessage(`Key "${e.key}" pressed [event: keydown]`);
// // else
// // logMessage(`Key "${e.key}" repeating [event: keydown]`);
// updatePlayer()
// });
// https://stackoverflow.com/questions/3691461/remove-key-press-delay-in-javascript
// Set 0 or null for no repeat at repeat arg
var KeyControl = (keys, repeat) => {
// this object holds the timers for each key on keydown - ex. timers[key] is an interval
var timers = {}
// When key is pressed and we don't already think it's pressed, call the
// key action callback and set a timer to generate another one after a delay
document.onkeydown = (event) => {
var key = (event || window.event).keyCode
if (!(key in keys))
return true
if (!(key in timers)) {
timers[key] = null
keys[key]()
if (repeat != 0)
timers[key] = setInterval(keys[key], repeat)
}
return false
};
// Cancel timeout and mark key as released on keyup
//
document.onkeyup = (event) => {
var key = (event || window.event).keyCode
if (key in timers) {
if (timers[key] != null)
clearInterval(timers[key])
delete timers[key]
}
};
// Case for unfocused windows, prevent keys from getting "stuck down" if user leaves windows
//
window.onblur = () => {
for (key in timers)
if (timers[key] != null)
clearInterval(timers[key])
timers = {}
};
};
// WASD table
// https://zeamedia.info/helper/javascript-key-codes-char-codes.php
KeyControl({
// W
87: () => {
player.y += 10
else if(e.key == "s"&& !(player.y <= 0))
updatePlayer()
},
// A
65: () => {
player.x -= 10
updatePlayer()
},
// S
83: () => {
player.y -= 10
// if (!e.repeat)
// logMessage(`Key "${e.key}" pressed [event: keydown]`);
// else
// logMessage(`Key "${e.key}" repeating [event: keydown]`);
updatePlayer()
console.log(document.getElementById('test-target').getBoundingClientRect())
});
btnReset.addEventListener('click', (e) => {
let child = consoleLog.firstChild;
while (child) {
consoleLog.removeChild(child);
child = consoleLog.firstChild;
}
textarea.value = ''
});
updatePlayer()
},
// D
68: () => {
player.x += 10
updatePlayer()
},
// Spacebar
32: () => { console.log("pressed key SPACE") }
}, 1)

@ -0,0 +1,24 @@
var gameTimer = () => {
var myTimer
const tickEvent = new Event('tick')
var start = () => {
// This functions as an in game timer which ticks every 100ms - used for move objects / check collision - caught in game.js
myTimer = setInterval(myClock, 100);
function myClock() {
//console.log("a game tick just happend")
gamewindow.dispatchEvent(tickEvent);
//TODO currently no base case for clearInterval other than calling gameTimer.stop
}
}
// Use this function on game end (Win / Loss / Pause)
var stop = () => {
clearInterval(myTimer)
}
return {start:start, stop:stop}
}

@ -9,34 +9,22 @@
<body>
<div id="topBar" class="hBar">
top bar things go here
</div>
<div id="centerRow">
<div id="leftBar" class="vBar">
<button>@</button>
<button>&</button>
<button>!</button>
</div>
<gamewindow id="test-target">
<player id="player"></player>
<hr style="width:100%;height:4px;background:black">
<hr style="width:100%;height:4px;background:black">
<hr style="width:100%;height:4px;background:black">
<hr style="width:100%;height:4px;background:black">
<hr style="width:100%;height:4px;background:black">
<button onclick="gameTimer().start()"> start game </button>
</gamewindow>
<div id="rightBar" class="vBar">
<button>#</button>
<button>$</button>
<button>%</button>
</div>
</div>
<div id="botBar" class="hBar">
<a href="https://git.andrewzah.com/dolsen/chordia/" target="_blank">© 2021 chordia.io</a>
<a href="https://itch.io/jam/top-jam-1" target="_blank">TOP Jam-1</a>
<a href="about.html">About</a>
<a href="index.html" class="currentPage">Chordia</a>
</div>
</body>
<script src="gameTimer.js"></script>
<script src="game.js"></script>
</html>

Loading…
Cancel
Save