Moved to neutrino
This commit is contained in:
Fredrik Jensen
parent
1342949fc5
commit
20d7cbb83f
13
.babelrc
13
.babelrc
@ -1,13 +0,0 @@
|
||||
{
|
||||
"presets": [
|
||||
[
|
||||
"es2015",
|
||||
{
|
||||
"modules": false
|
||||
}
|
||||
]
|
||||
],
|
||||
"plugins": [
|
||||
"external-helpers"
|
||||
]
|
||||
}
|
||||
25
package.json
25
package.json
@ -3,26 +3,17 @@
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"dev": "rollup -c -w"
|
||||
},
|
||||
"author": "",
|
||||
"author": "Fredrik Jensen",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"babel-core": "^6.25.0",
|
||||
"babel-plugin-external-helpers": "^6.22.0",
|
||||
"babel-preset-es2015": "^6.24.1",
|
||||
"lodash": "^4.17.4",
|
||||
"rollup": "^0.45.2",
|
||||
"rollup-plugin-babel": "^3.0.1",
|
||||
"rollup-plugin-commonjs": "^8.1.0",
|
||||
"rollup-plugin-livereload": "^0.4.0",
|
||||
"rollup-plugin-node-resolve": "^3.0.0",
|
||||
"rollup-plugin-serve": "^0.4.0",
|
||||
"rollup-watch": "^4.3.1"
|
||||
"lodash": "^4.17.4"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "neutrino start --use neutrino-preset-web",
|
||||
"build": "neutrino build --use neutrino-preset-web"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-preset-env": "^1.6.0"
|
||||
"neutrino": "^6.1.5",
|
||||
"neutrino-preset-web": "^6.1.5"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,22 +0,0 @@
|
||||
import babel from 'rollup-plugin-babel';
|
||||
import serve from 'rollup-plugin-serve';
|
||||
import livereload from 'rollup-plugin-livereload';
|
||||
import resolve from 'rollup-plugin-node-resolve';
|
||||
import commonjs from 'rollup-plugin-commonjs';
|
||||
|
||||
export default {
|
||||
entry: 'src/index.js',
|
||||
format: 'cjs',
|
||||
plugins: [
|
||||
babel({
|
||||
exclude: 'node_modules/**',
|
||||
}),
|
||||
serve(),
|
||||
resolve(),
|
||||
livereload('build'),
|
||||
commonjs({
|
||||
include: 'node_modules/**',
|
||||
}),
|
||||
],
|
||||
dest: 'build/bundle.js',
|
||||
};
|
||||
98
src/index.js
98
src/index.js
@ -1,11 +1,12 @@
|
||||
import _ from 'lodash';
|
||||
import { random, find } from 'lodash';
|
||||
import config from './config';
|
||||
|
||||
import { createDivElement } from './utils/create-div-element';
|
||||
import { createDivElement, setDivColor, drawLetter } from './utils/div';
|
||||
import { S, N, A, K, E } from './utils/letters';
|
||||
|
||||
const { dimensions, unit, snake, food } = config;
|
||||
|
||||
let GAME_STARTED = false;
|
||||
let GAME_RUNNING;
|
||||
|
||||
/**
|
||||
* Draw the board
|
||||
@ -36,15 +37,11 @@ for (let i = 0; i < dimensions.height; i++) {
|
||||
* Draw the snake
|
||||
*/
|
||||
|
||||
const setBrickColor = (color, x, y) => {
|
||||
((document.getElementById(`${x}.${y}`) || {}).style || {}).background = color;
|
||||
};
|
||||
|
||||
const showSnake = () => {
|
||||
for(var i = 0; i < snake.body; i++) {
|
||||
const logEvent = snake.log[snake.log.length - (1 + i)];
|
||||
|
||||
setBrickColor(
|
||||
setDivCOlor(
|
||||
'yellow',
|
||||
(logEvent || {}).x,
|
||||
(logEvent || {}).y,
|
||||
@ -56,7 +53,7 @@ const hideSnake = () => {
|
||||
for(var i = 0; i < snake.body; i++) {
|
||||
const logEvent = snake.log[snake.log.length - (1 + snake.body + i)];
|
||||
|
||||
setBrickColor(
|
||||
setDivCOlor(
|
||||
'#000',
|
||||
(logEvent || {}).x,
|
||||
(logEvent || {}).y,
|
||||
@ -148,19 +145,16 @@ document.onkeydown = function(e) {
|
||||
*/
|
||||
|
||||
const makeFood = () => {
|
||||
const x = _.random(1, config.dimensions.width);
|
||||
const y = _.random(1, config.dimensions.height);
|
||||
const x = random(1, config.dimensions.width);
|
||||
const y = random(1, config.dimensions.height);
|
||||
|
||||
if (_.find(snakeBody, { x, y })) {
|
||||
if (find(snakeBody, { x, y })) {
|
||||
console.log('food placed under the snake...');
|
||||
|
||||
/**
|
||||
* Food was placed under the snake
|
||||
*/
|
||||
return makeFood();
|
||||
/**
|
||||
* So we made food again... yolo
|
||||
*/
|
||||
|
||||
return makeFood();
|
||||
}
|
||||
|
||||
food.x = x;
|
||||
@ -169,18 +163,26 @@ const makeFood = () => {
|
||||
const snakeLength = snake.log.length - 1;
|
||||
const snakeBody = snake.log.slice((snakeLength - snake.body), snakeLength);
|
||||
|
||||
setBrickColor('red', x, y);
|
||||
setDivCOlor('red', x, y);
|
||||
};
|
||||
|
||||
/**
|
||||
* Check if snake is eating
|
||||
*/
|
||||
|
||||
const checkIfSnakeIsEating = () => {
|
||||
const checkIfSnakeIsEating = (snake, food) => {
|
||||
if (snake.x === food.x && snake.y === food.y) {
|
||||
makeFood();
|
||||
|
||||
/**
|
||||
* Make snake larger and go faster
|
||||
*/
|
||||
snake.body = snake.body + 1;
|
||||
snake.speed = snake.speed + 23;
|
||||
snake.speed = snake.speed + 100;
|
||||
|
||||
/**
|
||||
* Put out new food
|
||||
*/
|
||||
makeFood();
|
||||
}
|
||||
};
|
||||
|
||||
@ -188,24 +190,34 @@ const checkIfSnakeIsEating = () => {
|
||||
* Check collision
|
||||
*/
|
||||
|
||||
let GAME_RUNNING;
|
||||
|
||||
const checkCollision = () => {
|
||||
const checkCollision = ({ x, y }) => {
|
||||
const snakeLength = snake.log.length - 2;
|
||||
const snakeBody = snake.log.slice((snakeLength - snake.body), snakeLength);
|
||||
const snakeHead = { x: snake.x, y: snake.y };
|
||||
|
||||
if (_.find(snakeBody, snakeHead)) {
|
||||
if (find(snakeBody, { x, y })) {
|
||||
GAME_STARTED = false;
|
||||
clearInterval(GAME_RUNNING);
|
||||
startScreen();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Start screen
|
||||
*/
|
||||
|
||||
const startScreen = () => {
|
||||
S.forEach(drawLetter);
|
||||
N.forEach(drawLetter);
|
||||
A.forEach(drawLetter);
|
||||
K.forEach(drawLetter);
|
||||
E.forEach(drawLetter);
|
||||
}
|
||||
|
||||
/**
|
||||
* Run game
|
||||
*/
|
||||
|
||||
|
||||
const startGame = () => {
|
||||
GAME_STARTED = true;
|
||||
makeFood();
|
||||
@ -213,41 +225,11 @@ const startGame = () => {
|
||||
|
||||
GAME_RUNNING = setInterval(() => {
|
||||
console.log('running');
|
||||
checkCollision();
|
||||
checkCollision(snake);
|
||||
moveSnake(snake.direction);
|
||||
checkIfSnakeIsEating();
|
||||
checkIfSnakeIsEating(snake, food);
|
||||
}, snake.speed);
|
||||
};
|
||||
|
||||
const drawLetter = (letter) => {
|
||||
setBrickColor('#333', letter.toString().split('.')[0], letter.toString().split('.')[1]);
|
||||
};
|
||||
|
||||
const startScreen = () => {
|
||||
// S
|
||||
[2.2, 2.3, 2.4, 2.5, 3.2, 4.3, 5.4, 6.5, 7.5, 7.4, 7.3, 7.2]
|
||||
.forEach(drawLetter);
|
||||
|
||||
// N
|
||||
[2.7, 3.7, 4.7, 5.7, 6.7, 7.7, 3.8, 4.9, 5.9, 6.11, 7.11, 6.11, 5.11, 4.11, 3.11, 2.11]
|
||||
.forEach(drawLetter);
|
||||
setBrickColor('#333', 6, 10);
|
||||
|
||||
// A
|
||||
[2.13, 3.13, 4.13, 5.13, 6.13, 7.13, 2.14, 2.15, 2.16, 2.17, 3.17, 4.17, 5.17, 6.17, 7.17, 5.16, 5.15, 5.14]
|
||||
.forEach(drawLetter);
|
||||
|
||||
// K
|
||||
[2.19, 3.19, 4.19, 5.19, 6.19, 7.19, 6.21, 7.22, 3.21, 2.22]
|
||||
.forEach(drawLetter);
|
||||
setBrickColor('#333', 5, 20);
|
||||
setBrickColor('#333', 4, 20);
|
||||
|
||||
// E
|
||||
[2.24, 3.24, 4.24, 5.24, 6.24, 7.24, 2.25, 2.26, 2.27, 2.28, 7.25, 7.26, 7.27, 7.28, 4.25]
|
||||
.forEach(drawLetter);
|
||||
|
||||
}
|
||||
|
||||
startScreen();
|
||||
|
||||
|
||||
@ -13,3 +13,19 @@ export const createDivElement = (name, styles, target) => {
|
||||
|
||||
return document.getElementById(target).appendChild(window[name]);
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the color of a div in the Grid
|
||||
*/
|
||||
|
||||
export const setDivColor = (color, x, y) => {
|
||||
((document.getElementById(`${x}.${y}`) || {}).style || {}).background = color;
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw charchter
|
||||
*/
|
||||
|
||||
export const drawLetter = (char) => {
|
||||
setDivColor('#333', char.toString().split('.')[0], char.toString().split('.')[1]);
|
||||
};
|
||||
9
src/utils/letters.js
Normal file
9
src/utils/letters.js
Normal file
@ -0,0 +1,9 @@
|
||||
/**
|
||||
* Letters
|
||||
*/
|
||||
|
||||
export const S = [2.2, 2.3, 2.4, 2.5, 3.2, 4.3, 5.4, 6.5, 7.5, 7.4, 7.3, 7.2];
|
||||
export const N = [2.7, 3.7, 4.7, 5.7, 6.7, 7.7, 3.8, 4.9, 5.9, 6.10, 6.11, 7.11, 6.11, 5.11, 4.11, 3.11, 2.11];
|
||||
export const A = [2.13, 3.13, 4.13, 5.13, 6.13, 7.13, 2.14, 2.15, 2.16, 2.17, 3.17, 4.17, 5.17, 6.17, 7.17, 5.16, 5.15, 5.14];
|
||||
export const K = [2.19, 3.19, 4.19, 4.20, 5.19, 5.20, 6.19, 7.19, 6.21, 7.22, 3.21, 2.22];
|
||||
export const E = [2.24, 3.24, 4.24, 5.24, 6.24, 7.24, 2.25, 2.26, 2.27, 2.28, 7.25, 7.26, 7.27, 7.28, 4.25];
|
||||
Loading…
x
Reference in New Issue
Block a user