Start Games

pieces
master
Paulo Vieira 2018-01-02 23:35:28 +00:00
parent 0d088abed4
commit 9dc159c4d7
3 changed files with 259 additions and 89 deletions

View File

@ -1403,9 +1403,9 @@ var user = Vue.component('user', __webpack_require__(42));
var department = Vue.component('department', __webpack_require__(58));
var singleplayerMode = Vue.component('singleplayerMode', __webpack_require__(63));
var multiplayerMode = Vue.component('multiplayerMode', __webpack_require__(64));
//const multiplayerMode = Vue.component('multiplayerMode', require('./components/multiplayerMode.vue'));
var routes = [{ path: '/', redirect: '/users' }, { path: '/users', component: user }, { path: '/departments', component: department }, { path: '/singleplayerMode', component: singleplayerMode }, { path: '/multiplayerMode', component: multiplayerMode }];
var routes = [{ path: '/', redirect: '/users' }, { path: '/users', component: user }, { path: '/departments', component: department }, { path: '/singleplayerMode', component: singleplayerMode }];
var router = new __WEBPACK_IMPORTED_MODULE_0_vue_router__["a" /* default */]({
routes: routes
@ -46657,13 +46657,13 @@ if (false) {
var disposed = false
function injectStyle (ssrContext) {
if (disposed) return
__webpack_require__(65)
__webpack_require__(64)
}
var normalizeComponent = __webpack_require__(1)
/* script */
var __vue_script__ = __webpack_require__(67)
var __vue_script__ = __webpack_require__(66)
/* template */
var __vue_template__ = __webpack_require__(68)
var __vue_template__ = __webpack_require__(67)
/* template functional */
var __vue_template_functional__ = false
/* styles */
@ -46706,41 +46706,10 @@ module.exports = Component.exports
/* 64 */
/***/ (function(module, exports, __webpack_require__) {
var normalizeComponent = __webpack_require__(1)
/* script */
var __vue_script__ = null
/* template */
var __vue_template__ = null
/* template functional */
var __vue_template_functional__ = false
/* styles */
var __vue_styles__ = null
/* scopeId */
var __vue_scopeId__ = null
/* moduleIdentifier (server only) */
var __vue_module_identifier__ = null
var Component = normalizeComponent(
__vue_script__,
__vue_template__,
__vue_template_functional__,
__vue_styles__,
__vue_scopeId__,
__vue_module_identifier__
)
Component.options.__file = "resources/assets/js/components/multiplayerMode.vue"
if (Component.esModule && Object.keys(Component.esModule).some(function (key) { return key !== "default" && key.substr(0, 2) !== "__"})) { console.error("named exports are not supported in *.vue files.")}
module.exports = Component.exports
/***/ }),
/* 65 */
/***/ (function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(66);
var content = __webpack_require__(65);
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
@ -46760,7 +46729,7 @@ if(false) {
}
/***/ }),
/* 66 */
/* 65 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(2)(undefined);
@ -46768,13 +46737,13 @@ exports = module.exports = __webpack_require__(2)(undefined);
// module
exports.push([module.i, "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n", ""]);
exports.push([module.i, "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n", ""]);
// exports
/***/ }),
/* 67 */
/* 66 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
@ -46808,36 +46777,102 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
data: function data() {
return {
title: 'Memory Game',
//showSuccess: false,
//showFailure: false,
//successMessage: '',
//failMessage: '',
showSuccess: false,
showFailure: false,
successMessage: '',
failMessage: '',
currentValue: 1,
gameEnded: false,
player1User: undefined,
board: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
board: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
numeroJogada: 0,
arrayJogadas: [],
arrayPosicoes: [],
pontuacao: 0,
boardImagens: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
};
},
created: function created() {
// populate array
var array = [1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6, 7, 7, 8, 8];
// shuffle do array array
var i = 0;
var j = 0;
var temp = null;
for (i = array.length - 1; i > 0; i--) {
j = Math.floor(Math.random() * (i + 1));
temp = array[i];
array[i] = array[j];
array[j] = temp;
}
// console.log("created " + array);
for (var i = 0; i < array.length; i++) {
this.boardImagens[i] = array[i];
}
// console.log("created imagens " + this.boardImagens);
},
methods: {
clickPiece: function clickPiece(index) {
// console.log("created clickepiece " + this.boardImagens);
this.numeroJogada++;
if (this.numeroJogada == 1) {
this.arrayJogadas.push(this.board[index]);
this.arrayPosicoes.push(index);
this.board[index] = this.boardImagens[index];
console.log("Jogada 1");
}
if (this.numeroJogada == 2) {
this.arrayJogadas.push(this.board[index]);
this.arrayPosicoes.push(index);
this.board[index] = this.boardImagens[index];
console.log("Jogada 2");
/*
if (this.arrayJogadas[0] == this.arrayJogadas[1]){ // comparar no vetor boardImagens com as posições do arrayJogadas
// bloqueio das posições selecionadas
// pontuação ++;
this.pontuacao = this.pontuacao+10;
// same player playing
console.log("imagens iguais");
} else { // quer dizer que são diferentes
// volta-se a virar as cartas para imagem limpa
for (var i = 0; i < 2; i++) {
this.board[this.arrayPosicoes[i]] = 0;
}
console.log("imagens diferentes dpoeis do ciclor for");
// jogador++;
}
*/
}
if (false) {
if (this.board[index] || this.gameEnded) return;
this.board[index] = this.currentValue;
this.successMessage = this.currentPlayer + ' has Played';
this.showSuccess = true;
this.currentValue = 1;
this.checkGameEnded();
}
},
pieceImageURL: function pieceImageURL(piece) {
var imgSrc = String(piece);
console.log(imgSrc);
return 'img/' + imgSrc + '.png';
},
clickPiece: function clickPiece(index) {
if (this.board[index] || this.gameEnded) return;
this.board[index] = this.currentValue;
//this.successMessage = this.currentPlayer+' has Played';
//this.showSuccess = true;
this.currentValue = 1;
this.checkGameEnded();
},
restartGame: function restartGame() {
console.log('restartGame');
this.board = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
//this.showSuccess= false;
//this.showFailure= false;
//this.successMessage= '';
//this.failMessage= '';
this.showSuccess = false;
this.showFailure = false;
this.successMessage = '';
this.failMessage = '';
this.currentValue = 1;
this.gameEnded = false;
},
@ -46849,8 +46884,8 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
},
checkGameEnded: function checkGameEnded() {
if (this.isBoardComplete()) {
//this.successMessage = this.playerName(1) + ', you win!';
//this.showSuccess = true;
this.successMessage = this.playerName(1) + ', you win!';
this.showSuccess = true;
this.gameEnded = true;
}
return false;
@ -46865,13 +46900,25 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
});
return returnValue;
},
// ----------------------------------------------------------------------------------------
// GAME LOGIC - END
// ----------------------------------------------------------------------------------------
playerName: function playerName(playerNumber) {
console.log(playerNumber);
if (this.player1User != undefined && playerNumber == 1) {
return this.player1User.name;
}
if (this.player2User != undefined && playerNumber == 2) {
return this.player2User.name;
}
return 'Player ' + playerNumber;
}
},
// ----------------------------------------------------------------------------------------
// GAME LOGIC - END
// ----------------------------------------------------------------------------------------
computed: {
currentPlayer: function currentPlayer() {
return this.playerName(this.currentValue);
}
},
mounted: function mounted() {
if (this.$root.$data.player1) {
@ -46881,7 +46928,7 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
});
/***/ }),
/* 68 */
/* 67 */
/***/ (function(module, exports, __webpack_require__) {
var render = function() {
@ -46894,10 +46941,54 @@ var render = function() {
_vm._v(" "),
_c("br"),
_vm._v(" "),
_c("h2", [_vm._v("Current Player : " + _vm._s(_vm.currentPlayer))]),
_vm._v(" "),
_c("br")
]),
_vm._v(" "),
_c("div", { staticClass: "game-zone-content" }, [
_vm.showSuccess
? _c("div", { staticClass: "alert alert-success" }, [
_c(
"button",
{
staticClass: "close-btn",
attrs: { type: "button" },
on: {
click: function($event) {
_vm.showSuccess = false
}
}
},
[_vm._v("×")]
),
_vm._v(" "),
_c("strong", [
_vm._v(_vm._s(_vm.successMessage) + "     "),
_c(
"a",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.gameEnded,
expression: "gameEnded"
}
],
on: {
click: function($event) {
$event.preventDefault()
_vm.restartGame($event)
}
}
},
[_vm._v("Restart")]
)
])
])
: _vm._e(),
_vm._v(" "),
_c(
"div",
{ staticClass: "board" },

View File

@ -3,15 +3,15 @@
<div>
<h3 class="text-center">{{ title }}</h3>
<br>
<!-- <h2>Current Player : {{ currentPlayer }}</h2> -->
<h2>Current Player : {{ currentPlayer }}</h2>
<br>
</div>
<div class="game-zone-content">
<!--<div class="alert alert-success" v-if="showSuccess">
<div class="alert alert-success" v-if="showSuccess">
<button type="button" class="close-btn" v-on:click="showSuccess=false">&times;</button>
<strong>{{ successMessage }} &nbsp;&nbsp;&nbsp;&nbsp;<a v-show="gameEnded" v-on:click.prevent="restartGame">Restart</a></strong>
</div>
-->
<div class="board">
<div v-for="(piece, key) of board" >
<img v-bind:src="pieceImageURL(piece)" v-on:click="clickPiece(key)">
@ -27,36 +27,103 @@
data: function(){
return {
title: 'Memory Game',
//showSuccess: false,
//showFailure: false,
//successMessage: '',
//failMessage: '',
showSuccess: false,
showFailure: false,
successMessage: '',
failMessage: '',
currentValue: 1,
gameEnded:false,
player1User: undefined,
board: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]
board: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
numeroJogada: 0,
arrayJogadas: [],
arrayPosicoes: [],
pontuacao: 0,
boardImagens: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]
}
},
created() {
// populate array
var array = [1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8];
// shuffle do array array
var i = 0;
var j = 0;
var temp = null;
for (i = array.length - 1; i > 0; i--) {
j = Math.floor(Math.random() * (i + 1));
temp = array[i];
array[i] = array[j];
array[j] = temp;
}
// console.log("created " + array);
for (var i = 0; i < array.length; i++) {
this.boardImagens[i] = array[i];
}
// console.log("created imagens " + this.boardImagens);
},
methods: {
pieceImageURL: function (piece) {
var imgSrc = String(piece);
return 'img/' + imgSrc + '.png';
},
clickPiece: function(index) {
// console.log("created clickepiece " + this.boardImagens);
this.numeroJogada++;
if (this.numeroJogada == 1) {
this.arrayJogadas.push(this.board[index]);
this.arrayPosicoes.push(index);
this.board[index] = this.boardImagens[index];
console.log("Jogada 1");
}
if (this.numeroJogada == 2) {
this.arrayJogadas.push(this.board[index]);
this.arrayPosicoes.push(index);
this.board[index] = this.boardImagens[index];
console.log("Jogada 2");
/*
if (this.arrayJogadas[0] == this.arrayJogadas[1]){ // comparar no vetor boardImagens com as posições do arrayJogadas
// bloqueio das posições selecionadas
// pontuação ++;
this.pontuacao = this.pontuacao+10;
// same player playing
console.log("imagens iguais");
} else { // quer dizer que são diferentes
// volta-se a virar as cartas para imagem limpa
for (var i = 0; i < 2; i++) {
this.board[this.arrayPosicoes[i]] = 0;
}
console.log("imagens diferentes dpoeis do ciclor for");
// jogador++;
}
*/
}
if (1==2){
if(this.board[index] || this.gameEnded) return;
this.board[index] = this.currentValue;
//this.successMessage = this.currentPlayer+' has Played';
//this.showSuccess = true;
this.successMessage = this.currentPlayer+' has Played';
this.showSuccess = true;
this.currentValue = 1;
this.checkGameEnded();
}
},
pieceImageURL: function (piece) {
var imgSrc = String(piece);
console.log(imgSrc);
return 'img/' + imgSrc + '.png';
},
restartGame:function(){
console.log('restartGame');
this.board= [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
//this.showSuccess= false;
//this.showFailure= false;
//this.successMessage= '';
//this.failMessage= '';
this.showSuccess= false;
this.showFailure= false;
this.successMessage= '';
this.failMessage= '';
this.currentValue= 1;
this.gameEnded= false;
},
@ -75,8 +142,8 @@
},
checkGameEnded: function(){
if (this.isBoardComplete()) {
//this.successMessage = this.playerName(1) + ', you win!';
//this.showSuccess = true;
this.successMessage = this.playerName(1) + ', you win!';
this.showSuccess = true;
this.gameEnded = true;
}
return false;
@ -91,12 +158,24 @@
});
return returnValue;
},
playerName: function(playerNumber){
if(this.player1User != undefined && playerNumber == 1){
return this.player1User.name;
}
if(this.player2User != undefined && playerNumber == 2){
return this.player2User.name;
}
return 'Player '+playerNumber;
}
},
// ----------------------------------------------------------------------------------------
// GAME LOGIC - END
// ----------------------------------------------------------------------------------------
playerName: function(playerNumber){
console.log(playerNumber);
return 'Player '+playerNumber;
computed:{
currentPlayer: function(){
return this.playerName(this.currentValue);
}
},
mounted(){

View File

@ -17,7 +17,7 @@ const user = Vue.component('user', require('./components/user.vue'));
const department = Vue.component('department', require('./components/departmentList.vue'));
const singleplayerMode = Vue.component('singleplayerMode', require('./components/singleplayerMode.vue'));
const multiplayerMode = Vue.component('multiplayerMode', require('./components/multiplayerMode.vue'));
//const multiplayerMode = Vue.component('multiplayerMode', require('./components/multiplayerMode.vue'));
const routes = [
{ path: '/', redirect: '/users' },
@ -25,7 +25,7 @@ const routes = [
{ path: '/departments', component: department },
{ path: '/singleplayerMode', component: singleplayerMode },
{ path: '/multiplayerMode', component: multiplayerMode }
//{ path: '/multiplayerMode', component: multiplayerMode }
];