You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
cardGame/public/js/canvas/interaction.js

126 lines
2.9 KiB
JavaScript

// Clickable checks, event listeners, etc.
function clickableCheck(cursorX,cursorY,entity = null, positions = null){
if(entity == null && positions == null){ return false; }
if(entity != null){
positions = {
'x': gameData.position[entity][0],
'y': gameData.position[entity][1],
'width': gameData.size[entity][0],
'height': gameData.size[entity][0]
}
}
// Collision detection between clicked offset and clickableItems
// https://stackoverflow.com/a/9880302
if(
cursorY > positions['y'] && cursorY < positions['y'] + positions['height']
&& cursorX > positions['x'] && cursorX < positions['x'] + positions['width']
)
{
return true;
}
return false;
}
// Left click
canvas.addEventListener('click', function(event) {
var x = event.pageX - canvasLeft,
y = event.pageY - canvasTop;
console.log('LEFT CLICK X: '+x+' Y: '+y);
// First check for interaction menu and options and interact
// with them if they exist
if(interactionMenuAvailable()){
// TODO: Maybe speed this up, pass the entity clicked and get just iMenu
// data of that entity
// Loop interaction menu positions and 'trigger' the event
for (const [key, value] of Object.entries(gameData.interactionOption)) {
// If one of the options is clicked, trigger it
// Passes x,y,w,h of the interactionOption
if(!clickableCheck(x,y,null,value)){
continue;
}
doiMenuPressed(key);
// After an interaction, clear the menu to prevent redraw
clearInteractionMenu();
// Then return true to prevent another interaction
return true;
}
}
// If ANYWHERE but an interactionOption selected, close the interactionMenu
clearInteractionMenu();
// Loop the entities that are interactable
// I.e. Have size, and positions
for (const [key, value] of Object.entries(gameData.size)) {
// Key is item here
// If there's no position data skip, can't interact
if(gameData.position === undefined){
continue;
}
// If the X/Y of cursor isn't within the shape's bounds can't interact
if(!clickableCheck(x,y,key)){
continue;
}
// TODO: Other checks, in event/animation, can be interacted with
// etc, etc.
// If it's deck
if(gameData.deck[key] !== undefined){
// If deck belongs to player
if(gameData.player[key] == gameData.playerId){
requestDrawACard();
}
return true;
}
// Card in hand
if(gameData.hand[key] !== undefined){
// If entity belongs to player (for now, will be able to use
// opponents hand at certain times in future)
if(gameData.player[key] == gameData.playerId){
console.log(key);
openInteractionMenu(key);
}
return true;
}
openInteractionMenu(key);
// TODO:If clicked anywhere but an interaction option,
// close interaction option
}
});
// Right click
canvas.addEventListener('contextmenu', function(event) {
event.preventDefault();
var x = event.pageX - canvasLeft,
y = event.pageY - canvasTop;
console.log('RIGHT CLICK X: '+x+' Y: '+y);
});