SplendidBear-Websites/MineSeeker
Private
Public Access
1
0
Fork 0
Code Pull Requests 1 Releases Activity

refact && remove sound and logging && bugfix BIGBUG - handleGridField and showAppropriateFields sort order...

Browse Source
This commit is contained in:
Root
2016-10-28 16:16:27 +02:00
parent 5b4fdd088c
commit 0a22968e56
6 changed files with 113 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

142
src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js
View File

@@ -1,5 +1,4 @@
import React from 'react';
import Sound from 'react-sound';
import GridField from './grid-field';
import UserControl from '../user/user-control';
@@ -9,16 +8,12 @@ class GridControl extends React.Component {
this.state = {
env: props.env,
log: props.log,
session: null,
channel: null,
webPlayer: null,
grid: null,
updatedFieldCache: [],
bombFieldCache: [],
foundUserMineCache: 0,
playBomb: false,
sound: null,
lastClicked: {
red: null,
blue: null
@@ -30,8 +25,8 @@ class GridControl extends React.Component {
return 'gridField_' + row + '_' + col;
}
checkMine(field, i, j) {
return typeof field[i] !== 'undefined' && typeof field[i][j] !== 'undefined' && field[i][j] !== 'm';
checkMine(row, col) {
return typeof this.state.grid[row] !== 'undefined' && typeof this.state.grid[row][col] !== 'undefined' && this.state.grid[row][col] !== 'm';
}
getBombRadius(row, col) {
@@ -66,7 +61,7 @@ class GridControl extends React.Component {
}
checkNeighbourItem(row, col) {
if (this.checkMine(this.state.grid, row, col)) {
if (this.checkMine(row, col)) {
var currentField = this.refs[this.refString(row, col)];
currentField.setState({
@@ -175,18 +170,18 @@ class GridControl extends React.Component {
activePlayer = userControl.state.activePlayer ? 'blue' : 'red',
inactivePlayer = userControl.state.activePlayer ? 'red' : 'blue';
/** update last cliked grid field */
if (!justOnFirstIteration) {
if (this.state.lastClicked[activePlayer] !== null) {
this.refs[this.refString(this.state.lastClicked[activePlayer][0], this.state.lastClicked[activePlayer][1])].setState({
lastClickedRed: false,
lastClickedBlue: false
});
}
}
/** if the clicked field is NEVER CLICKED */
if (!gridFieldControl.state.active) {
/** update LAST CLICKED grid field */
if (!justOnFirstIteration) {
if (this.state.lastClicked[activePlayer] !== null) {
this.refs[this.refString(this.state.lastClicked[activePlayer][0], this.state.lastClicked[activePlayer][1])].setState({
lastClickedRed: false,
lastClickedBlue: false
});
}
}
this.state.lastClicked[activePlayer] = [x, y];
/** if you found mine */
@@ -194,8 +189,6 @@ class GridControl extends React.Component {
this.state.foundUserMineCache++;
if (!justOnFirstIteration) {
this.playingSound('mine');
/** set last clicked field w/ color */
this.state.lastClicked[activePlayer] = [x, y];
}
@@ -206,8 +199,6 @@ class GridControl extends React.Component {
});
} else {
if (!justOnFirstIteration) {
this.playingSound('click');
/** set __ACTIVE__ player in the UserControl !!!! */
userControl.setState({
activePlayer: userControl.state.activePlayer ? 0 : 1
@@ -252,74 +243,68 @@ class GridControl extends React.Component {
}
}
stepEvent(coords, isOpponentStepped) {
stepEvent(coords) {
var activePlayer = this.refs.userControl.state.activePlayer ? 'blue' : 'red';
this.state.foundUserMineCache = 0;
this.state.playBomb = true;
/** Step automatically when not this user stepped */
if (!isOpponentStepped) {
this.state.session
.publish(this.state.channel, {
'coords': coords,
'player': activePlayer
});
}
/** Field selected w/ BOMB */
if (this.refs.userControl.state.bombSelected) {
var radius = this.getBombRadius(coords[0], coords[1]);
for (var i = 0, j = radius.length; i < j; i++) {
this.showAppropriateFields(
this.refs[this.refString(radius[i][0], radius[i][1])],
radius[i][0],
radius[i][1]
);
this.handleGridField(
this.state.grid[radius[i][0]][radius[i][1]],
radius[i][0],
radius[i][1],
i
);
this.showAppropriateFields(
this.refs[this.refString(radius[i][0], radius[i][1])],
radius[i][0],
radius[i][1]
);
}
/** remove BOMB from activePlayer */
this.refs.userControl.refs[activePlayer].setState({
haveBomb: false
});
} else {
this.showAppropriateFields(
this.refs[this.refString(coords[0], coords[1])],
coords[0],
coords[1]
);
this.handleGridField(
this.state.grid[coords[0]][coords[1]],
coords[0],
coords[1],
0
);
this.showAppropriateFields(
this.refs[this.refString(coords[0], coords[1])],
coords[0],
coords[1]
);
}
/** Reset mine caches */
if (this.state.foundUserMineCache) {
/** remove the found mines from global */
this.refs.userControl.setState({
mines: this.refs.userControl.state.mines - this.state.foundUserMineCache,
foundMines: true
});
}, () => {
this.refs.userControl.setState({foundMines: false});
setTimeout(function () {
this.refs.userControl.setState({foundMines: false})
}.bind(this), 500);
/** add the found mines to the active Player */
this.refs.userControl.refs[activePlayer].setState({
mines: this.refs.userControl.refs[activePlayer].state.mines + this.state.foundUserMineCache
/** add the found mines to the active Player */
this.refs.userControl.refs[activePlayer].setState({
mines: this.refs.userControl.refs[activePlayer].state.mines + this.state.foundUserMineCache
});
});
}
/** Reset BOMB status */
if (this.refs.userControl.state.bombSelected) {
/** reset bomb selected status */
this.refs.userControl.setState({bombSelected: false});
@@ -329,19 +314,6 @@ class GridControl extends React.Component {
}
}
/**
* Most important event!!
* Click only when the active player is the current client.
* @param coords
*/
onClick(coords) {
var activePlayer = this.refs.userControl.state.activePlayer ? 'blue' : 'red';
if (activePlayer === this.state.webPlayer) {
this.stepEvent(coords, false);
}
}
/**
* On Hover when you want to drop BOMB
* @param coords
@@ -356,33 +328,10 @@ class GridControl extends React.Component {
}
}
/**
* Play sound effets
* @param type
* @returns {*}
*/
playingSound(type) {
this.state.log.i('Sound playing type: ' + type);
render() {
var grid = [];
return type !== null
? <Sound url={"sound/" + type + ".mp3"} playStatus={Sound.status.PLAYING}/>
: '';
}
/** after rendering */
componentDidMount() {
/** disable console of soundmanager */
soundManager.setup({
debugMode: this.state.env,
useConsole: this.state.env
});
}
renderGridFields() {
/** If the app.js filled the this.state.grid var, START the grid render */
if (this.state.grid) {
var grid = [];
for (var i = 0, j = this.state.grid.length; i < j; i++) {
for (var k = 0, l = this.state.grid[i].length; k < l; k++) {
grid.push(
@@ -391,18 +340,12 @@ class GridControl extends React.Component {
ref={this.refString(i, k)}
key={i + k * Math.random() * 0.5}
handleHoverOn={this.onHoverWithBomb.bind(this, [i, k])}
onClick={this.onClick.bind(this, [i, k])}/>
onClick={this.props.onClick.bind(null, [i, k])}/>
);
}
}
return grid;
}
return "";
}
render() {
return (
<div className="game-wrapper">
<UserControl ref="userControl"
@@ -410,9 +353,10 @@ class GridControl extends React.Component {
red="Eszet Lenke"
bombClear={this.bombClear.bind(this)}/>
<div className="grid">
{this.renderGridFields()}
{/*{this.renderGridFields()}*/}
{grid}
</div>
{this.playingSound(this.state.sound)}
{/*{this.playingSound()}*/}
</div>
);
}