iiiypuk/config
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add editorconfig checker and fix files

Browse Source
This commit is contained in:
Alexander Popov
2021-08-29 12:59:18 +03:00
parent 5de70d2cf0
commit c750bf0989
11 changed files with 394 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
JavaScript/GameLoop/game.js
View File

@@ -1,5 +1,3 @@
'use strict';
// Main variables
let DEBUG = true;
let canvas;
@@ -15,83 +13,101 @@ let fps;
let dragging = false;
function mMove(e) {
if (dragging) {
point.pX = e.offsetX * cW / canvas.clientWidth | 0;
point.pY = e.offsetY * cH / canvas.clientHeight | 0;
};
'use strict';
if (dragging) {
point.pX = e.offsetX * cW / canvas.clientWidth | 0;
point.pY = e.offsetY * cH / canvas.clientHeight | 0;
};
}
function mDown(e) {
dragging = true;
'use strict';
dragging = true;
}
function mUp(e) {
dragging = false;
'use strict';
dragging = false;
}
function clearContext() {
context.fillStyle = '#b27e56';
context.fillRect(0, 0, cW, cH);
'use strict';
context.fillStyle = '#b27e56';
context.fillRect(0, 0, cW, cH);
}
// Init
window.onload = function() {
canvas = document.getElementById('game');
context = canvas.getContext('2d');
cW = canvas.width;
cH = canvas.height;
'use strict';
canvas.style.height = window.innerHeight + "px";
if (DEBUG) {
console.log('Canvas set size to ' + window.innerHeight + 'px');
console.log(canvas.getBoundingClientRect());
};
canvas = document.getElementById('game');
context = canvas.getContext('2d');
cW = canvas.width;
cH = canvas.height;
canvas.addEventListener('mousedown', mDown, false);
canvas.addEventListener('mouseup', mUp, false);
canvas.addEventListener('mousemove', mMove, false);
canvas.style.height = window.innerHeight + "px";
if (DEBUG) {
console.log('Canvas set size to ' + window.innerHeight + 'px');
console.log(canvas.getBoundingClientRect());
};
canvas.addEventListener('touchstart', mDown, false);
canvas.addEventListener('touchend', mUp, false);
canvas.addEventListener('touchmove', mMove, false);
canvas.addEventListener('mousedown', mDown, false);
canvas.addEventListener('mouseup', mUp, false);
canvas.addEventListener('mousemove', mMove, false);
window.requestAnimationFrame(gameLoop);
canvas.addEventListener('touchstart', mDown, false);
canvas.addEventListener('touchend', mUp, false);
canvas.addEventListener('touchmove', mMove, false);
window.requestAnimationFrame(gameLoop);
};
window.addEventListener('resize', function() {
let canvas = document.getElementById('game');
canvas.style.height = window.innerHeight + "px";
'use strict';
if (DEBUG) {
console.log('Canvas resized to ' + window.innerHeight + 'px');
console.log(canvas.getBoundingClientRect());
};
let canvas = document.getElementById('game');
canvas.style.height = window.innerHeight + "px";
if (DEBUG) {
console.log('Canvas resized to ' + window.innerHeight + 'px');
console.log(canvas.getBoundingClientRect());
};
}, true);
// GameLoop
function gameLoop(timeStamp) {
// fps counter
secondsPassed = (timeStamp - oldTimeStamp) / 1000;
oldTimeStamp = timeStamp;
fps = Math.round(1 / secondsPassed);
// end fps counter
'use strict';
update();
draw();
// fps counter
secondsPassed = (timeStamp - oldTimeStamp) / 1000;
oldTimeStamp = timeStamp;
fps = Math.round(1 / secondsPassed);
// end fps counter
if (DEBUG) {
context.font = '15px Arial';
context.fillStyle = '#101024';
context.fillText('FPS: ' + fps, 10, 20);
};
update();
draw();
window.requestAnimationFrame(gameLoop);
if (DEBUG) {
context.font = '15px Arial';
context.fillStyle = '#101024';
context.fillText('FPS: ' + fps, 10, 20);
};
window.requestAnimationFrame(gameLoop);
}
function update() {
'use strict';
//
}
function draw() {
clearContext();
'use strict';
clearContext();
}

16
JavaScript/GameLoop/index.html
View File

@@ -1,15 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en-us">
<head>
<meta charset="utf-8">
<title>JS Game</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<meta charset="utf-8">
<title>JS Game</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="wrap">
<canvas id="game" width="768" height="1366"></canvas>
</div>
<div class="wrap">
<canvas id="game" width="768" height="1366"></canvas>
</div>
<script type="text/javascript" src="game.js"></script>
<script type="text/javascript" src="game.js"></script>
</body>
</html>

20
JavaScript/GameLoop/styles.css
View File

@@ -1,20 +1,20 @@
html { height: 100%; }
body {
background-color: #101024;
padding: 0;
margin: 0;
height: 100%;
background-color: #101024;
padding: 0;
margin: 0;
height: 100%;
}
div.wrap {
display: flex;
height: 100%;
align-items: center;
justify-content: center;
display: flex;
height: 100%;
align-items: center;
justify-content: center;
}
canvas#game {
border: 2px solid #ec8a4b;
display: block;
border: 2px solid #ec8a4b;
display: block;
}

30
JavaScript/README.md
View File

@@ -7,15 +7,15 @@ canvas { image-rendering: crisp-edges; image-rendering: pixelated; }
`packages.json`
```json
"scripts": {
"serve": "webpack serve",
"serve": "webpack serve",
"html": "html-minifier --collapse-whitespace --remove-comments src/index.html --output dist/index.html",
"css": "csso src/styles.css --output dist/styles.css",
"build": "npm run html && npm run css && webpack --mode=production"
},
"devDependencies": {
"webpack": "^5.42.0",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2"
"webpack": "^5.42.0",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2"
}
```
`webpack.config.js`
@@ -23,16 +23,16 @@ canvas { image-rendering: crisp-edges; image-rendering: pixelated; }
const path = require('path');
module.exports = {
mode: 'development',
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'engine.js',
},
devServer: {
contentBase: path.join(__dirname, 'src'),
compress: false,
port: 55555,
},
mode: 'development',
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'engine.js',
},
devServer: {
contentBase: path.join(__dirname, 'src'),
compress: false,
port: 55555,
},
};
```