Codinget/Snek
1
0
Fork 0
Code Issues 11 Pull requests Releases Activity

added config file

Browse source
This commit is contained in:
Nathan DECHER 2020-03-26 12:54:23 +01:00
parent 93ba24a53a
commit 95751be63e
4 changed files with 67 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
Makefile
View file

@ -6,20 +6,22 @@ WALL = public/assets/wall32.png
SNAKE = public/assets/snake.json
LEVEL_LIST = public/assets/levelList.json
CONFIG = public/assets/config.json
CSS = public/css/snek.css
JS = public/js/snek.js
OUTPUT = $(ICON) $(APPLE) $(WALL) $(SNAKE) $(LEVEL_LIST) $(CSS) $(JS)
OUTPUT = $(ICON) $(APPLE) $(WALL) $(SNAKE) $(LEVEL_LIST) $(CONFIG) $(CSS) $(JS)
all: icon apple wall snake levelList css js
all: icon apple wall snake levelList config css js
icon: $(ICON)
apple: $(APPLE)
wall: $(WALL)
snake: $(SNAKE)
levelList: $(LEVEL_LIST)
config: $(CONFIG)
css: $(CSS)

14
assets/config.json Normal file
View file

@ -0,0 +1,14 @@
{
"touchscreen": {
"mode": "joystick",
"deadzone": 10,
"buffer": false
},
"keyboard": {
"buffer": false
},
"gamepad": {
"deadzone": 0.5,
"buffer": true
}
}

3
src/js/assets.js
View file

@ -4,7 +4,8 @@ const assetSpecs=[
{ name: 'fruit', filename: 'apple32.png', type: 'image' },
{ name: 'wall', filename: 'wall32.png', type: 'image' },
{ name: 'snake', filename: 'snake.json', type: 'json' },
{ name: 'levelList', filename: 'levelList.json', type: 'json' }
{ name: 'levelList', filename: 'levelList.json', type: 'json' },
{ name: 'config', filename: 'config.json', type: 'json' }
];
const cvs=document.createElement('canvas');

62
src/js/main.js
View file

@ -8,6 +8,8 @@
const nav=main.querySelector('nav');
const canvas=main.querySelector('canvas');
const config=assets.get('config');
let currentGame=null;
let currentInputs={};
@ -61,12 +63,14 @@
const magnitude=Math.hypot(gp.axes[0], gp.axes[1]);
const angle=((Math.atan2(gp.axes[0], gp.axes[1])+2*Math.PI)%(2*Math.PI))/Math.PI;
if(magnitude>.5) {
if(magnitude>config.gamepad.deadzone) {
if(angle>.25 && angle <.75) inputs.right=true;
else if(angle>.75 && angle<1.25) inputs.up=true;
else if(angle>1.25 && angle<1.75) inputs.left=true;
else inputs.down=true;
}
if(!config.gamepad.buffer) inputs.clearBuffer=true;
};
window.addEventListener('hashchange', async () => {
@ -105,23 +109,51 @@
else if(e.key=='ArrowDown') inputs.down=true;
else if(e.key=='ArrowLeft') inputs.left=true;
else if(e.key=='ArrowRight') inputs.right=true;
if(!config.keyboard.buffer) inputs.clearBuffer=true;
});
const handleTouch=e => {
e.preventDefault();
let x=e.touches[0].clientX-window.innerWidth/2;
let y=e.touches[0].clientY-window.innerHeight/2;
const angle=((Math.atan2(x, y)+2*Math.PI)%(2*Math.PI))/Math.PI;
if(config.touchscreen.mode=='crosspad') {
const handleTouch=e => {
let x=e.touches[0].clientX-window.innerWidth/2;
let y=e.touches[0].clientY-window.innerHeight/2;
const angle=((Math.atan2(x, y)+2*Math.PI)%(2*Math.PI))/Math.PI;
let inputs=currentInputs;
if(angle>.25 && angle <.75) inputs.right=true;
else if(angle>.75 && angle<1.25) inputs.up=true;
else if(angle>1.25 && angle<1.75) inputs.left=true;
else inputs.down=true;
let inputs=currentInputs;
if(angle>.25 && angle <.75) inputs.right=true;
else if(angle>.75 && angle<1.25) inputs.up=true;
else if(angle>1.25 && angle<1.75) inputs.left=true;
else inputs.down=true;
inputs.clearBuffer=true;
};
window.addEventListener('touchstart', handleTouch);
window.addEventListener('touchmove', handleTouch);
if(!config.touchscreen.buffer) inputs.clearBuffer=true;
};
window.addEventListener('touchstart', handleTouch);
window.addEventListener('touchmove', handleTouch);
}
if(config.touchscreen.mode=='joystick') {
let center={x: 0, y: 0};
window.center=center;
window.addEventListener('touchstart', e => {
center.x=e.touches[0].clientX;
center.y=e.touches[0].clientY;
});
window.addEventListener('touchmove', e => {
let x=e.touches[0].clientX-center.x;
let y=e.touches[0].clientY-center.y;
const angle=((Math.atan2(x, y)+2*Math.PI)%(2*Math.PI))/Math.PI;
const magnitude=Math.hypot(x, y);
let inputs=currentInputs;
if(magnitude>config.touchscreen.deadzone) {
if(angle>.25 && angle <.75) inputs.right=true;
else if(angle>.75 && angle<1.25) inputs.up=true;
else if(angle>1.25 && angle<1.75) inputs.left=true;
else inputs.down=true;
}
if(!config.touchscreen.buffer) inputs.clearBuffer=true;
});
}
})();