readhame
5 years ago
parent
6b1acdf2cb
commit
516332ef0e
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$/.." vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
@ -1,18 +0,0 @@
|
||||
<?php
|
||||
|
||||
class Card {
|
||||
public $shape;
|
||||
public $color;
|
||||
public $fill;
|
||||
public $number;
|
||||
public $id;
|
||||
|
||||
public function __construct(CardAttributes $attributes, Deck $deck) {
|
||||
|
||||
foreach ($attributes as $attribute => $value) {
|
||||
$this->{$attribute} = $value;
|
||||
}
|
||||
|
||||
$deck->cards[] = $this;
|
||||
}
|
||||
}
|
||||
@ -1,17 +0,0 @@
|
||||
<?php
|
||||
|
||||
class CardAttributes {
|
||||
public $color;
|
||||
public $shape;
|
||||
public $fill;
|
||||
public $number;
|
||||
public $id;
|
||||
|
||||
function __construct($color, $shape, $fill, $number, $id) {
|
||||
$this->color = $color;
|
||||
$this->shape = $shape;
|
||||
$this->fill = $fill;
|
||||
$this->number = $number;
|
||||
$this->id = $id;
|
||||
}
|
||||
}
|
||||
@ -1,79 +0,0 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.submit {
|
||||
margin-top: 2em;
|
||||
font-size: 16px;
|
||||
padding: 1em 3em;
|
||||
background: #BADA55;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.submit:disabled {
|
||||
background: #C5DA83;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: 1080px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.card {
|
||||
display: inline-block;
|
||||
width: 245px;
|
||||
margin-right: 5px;
|
||||
height: 200px;
|
||||
border: 2px solid #ccc;
|
||||
}
|
||||
.card:hover {
|
||||
border-color: #e2e2e2;
|
||||
}
|
||||
|
||||
.selected {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.game-board {
|
||||
width: 1000px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.shape {
|
||||
display: inline-block;
|
||||
width: 70px;
|
||||
height: 200px;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
-webkit-mask-position: 15px;
|
||||
}
|
||||
.diamond {
|
||||
-webkit-mask-image: url('../images/diamond.png');
|
||||
}
|
||||
.wave {
|
||||
-webkit-mask-image: url('../images/wave.png');
|
||||
}
|
||||
.oval {
|
||||
-webkit-mask-image: url('../images/oval.png');
|
||||
}
|
||||
|
||||
.green {
|
||||
background: green;
|
||||
}
|
||||
.red {
|
||||
background: red;;
|
||||
}
|
||||
.purple {
|
||||
background: violet;
|
||||
}
|
||||
|
||||
/*solution pour avoir l'image en rainure ou vide a voir dans le css*/
|
||||
@ -1,62 +0,0 @@
|
||||
<?php
|
||||
|
||||
include_once "cardAttributes.php";
|
||||
include_once "card.php";
|
||||
include_once "functions.php";
|
||||
|
||||
class Deck {
|
||||
|
||||
public $cards = array();
|
||||
|
||||
public function __construct() {
|
||||
$this->createDeck();
|
||||
}
|
||||
|
||||
private function createDeck() {
|
||||
// need one card of each combo of color/shape/fill/number
|
||||
$colors = array('green', 'red', 'purple');
|
||||
$shapes = array('oval', 'diamond', 'wave');
|
||||
$fills = array('filled', 'shaded', 'empty');
|
||||
$numbers = array(1, 2, 3);
|
||||
|
||||
$index = 1;
|
||||
|
||||
foreach ($colors as $color) {
|
||||
foreach ($shapes as $shape) {
|
||||
foreach ($fills as $fill) {
|
||||
foreach ($numbers as $number) {
|
||||
$cardAttributes = new CardAttributes($color, $shape, $fill, $number, $index);
|
||||
$card = new Card($cardAttributes, $this);
|
||||
$index++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
public function removeSet($cards) {
|
||||
|
||||
}
|
||||
|
||||
private function shuffle() {
|
||||
shuffle($this->cards);
|
||||
}
|
||||
|
||||
|
||||
|
||||
public function deal() {
|
||||
// shuffle the deck
|
||||
$this->shuffle();
|
||||
|
||||
// remove 12 cards from the top and return them
|
||||
$dealtCards = array_chop($this->cards, 12);
|
||||
return $dealtCards;
|
||||
}
|
||||
|
||||
public function threeMore() {
|
||||
return array_chop($this->cards, 3);
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,7 +0,0 @@
|
||||
<?php
|
||||
function array_chop(&$arr, $num)
|
||||
{
|
||||
$ret = array_slice($arr, 0, $num);
|
||||
$arr = array_slice($arr, $num);
|
||||
return $ret;
|
||||
}
|
||||
@ -1,18 +0,0 @@
|
||||
<?php
|
||||
|
||||
class Game {
|
||||
|
||||
private $players;
|
||||
private $deck;
|
||||
|
||||
public function __construct(Deck $deck) {
|
||||
$this->deck = $deck;
|
||||
}
|
||||
|
||||
public function start() {
|
||||
|
||||
// call the deck's deal function and return the cards dealt
|
||||
return $this->deck->deal();
|
||||
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
@ -1,21 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="initial-scale=1">
|
||||
<title>Set</title>
|
||||
<link rel="stylesheet" href="css/style.css" />
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<h1>(TEST) Set</h1>
|
||||
<p>Find sets.</p>
|
||||
<p>Sets found: <span data-display="score" class="score">0</span></p>
|
||||
<div class="game-board" data-display="game-board"></div>
|
||||
</div>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script src="set.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,14 +0,0 @@
|
||||
<?php
|
||||
|
||||
class Player {
|
||||
|
||||
private $score;
|
||||
|
||||
public function findSet() {
|
||||
// to do
|
||||
}
|
||||
|
||||
private function incrementScore($points) {
|
||||
$this->score += $points;
|
||||
}
|
||||
}
|
||||
@ -1,202 +0,0 @@
|
||||
var Game = {
|
||||
cards: [],
|
||||
selected: [],
|
||||
score: 0,
|
||||
$board: $('[data-display="game-board"]'),
|
||||
$score: $('[data-display="score"]'),
|
||||
|
||||
deal: function() {
|
||||
var self = this;
|
||||
|
||||
// ajax request to get initial set of cards
|
||||
var dealRequest = $.ajax({
|
||||
url: 'set.php?action=deal',
|
||||
type: 'GET',
|
||||
dataType: 'json',
|
||||
success: function(data) {
|
||||
self.cards = data;
|
||||
self.displayCards.call(self);
|
||||
self.setCardListeners();
|
||||
self.setPageListeners();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
displayCards: function() {
|
||||
var self = this;
|
||||
|
||||
$.each(this.cards, function(index, card){
|
||||
var cardNode = $('<div>');
|
||||
cardNode.addClass('card');
|
||||
$(cardNode).data({
|
||||
'id': card.id,
|
||||
'shape': card.shape,
|
||||
'color': card.color,
|
||||
'number': card.number
|
||||
});
|
||||
|
||||
var shapeNode = $('<span>');
|
||||
shapeNode.addClass('shape ' + card.color + ' ' + card.shape + ' ' + card.fill);
|
||||
|
||||
|
||||
for (var i = 0; i < card.number; i++) {
|
||||
cardNode.append(shapeNode.clone());
|
||||
}
|
||||
self.$board.append(cardNode);
|
||||
|
||||
// display 4 cards per row
|
||||
if ((index+1) % 4 === 0) {
|
||||
self.$board.append($('<div>'));
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
setCardListeners: function() {
|
||||
var self = this;
|
||||
|
||||
// what happens when a card is clicked:
|
||||
this.$board.on('click', '.card', function(e) {
|
||||
e.stopImmediatePropagation();
|
||||
var card = e.currentTarget;
|
||||
|
||||
// if card is new, add it, otherwise remove it
|
||||
var ids = $.map(self.selected, function(el) { return $(el).data("id");});
|
||||
if (ids.indexOf($(card).data('id')) >= 0) {
|
||||
self.deselectCard(card);
|
||||
} else {
|
||||
self.selectCard(card);
|
||||
}
|
||||
|
||||
if (self.selected.length === 3) {
|
||||
self.silentSubmission();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
setPageListeners: function() {
|
||||
var self = this;
|
||||
|
||||
// if the user clicks on the page outside the game board, clear selected
|
||||
$(document).on('click', function() {
|
||||
self.clearSelections.call(self);
|
||||
});
|
||||
},
|
||||
|
||||
selectCard: function(card) {
|
||||
$(card).addClass('selected');
|
||||
this.selected.push(card);
|
||||
|
||||
if (this.selected.length > 3) {
|
||||
var removed = this.selected.shift();
|
||||
$(removed).removeClass('selected');
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
deselectCard: function(card) {
|
||||
var self = this;
|
||||
var index = self.selected.indexOf(card);
|
||||
if (index > -1) {
|
||||
self.selected.splice(index, 1);
|
||||
}
|
||||
$(card).removeClass('selected');
|
||||
},
|
||||
|
||||
clearSelections: function() {
|
||||
$.each(this.selected, function(index, card) {
|
||||
$(card).removeClass('selected');
|
||||
});
|
||||
this.selected = [];
|
||||
},
|
||||
|
||||
validateSet: function() {
|
||||
var self = this;
|
||||
|
||||
var colors = $.map(self.selected, function(el) { return $(el).data("color");});
|
||||
var shapes = $.map(self.selected, function(el) { return $(el).data("shape"); });
|
||||
var numbers = $.map(self.selected, function(el) { return $(el).data("number"); });
|
||||
|
||||
|
||||
return (self.isSet(colors) && self.isSet(shapes) && self.isSet(numbers));
|
||||
},
|
||||
|
||||
isSet: function(arr) {
|
||||
// a set means the attributes are either all the same or all different
|
||||
var reduced = $.unique(arr);
|
||||
return (reduced.length === 1 || reduced.length === 3);
|
||||
},
|
||||
|
||||
silentSubmission: function() {
|
||||
var valid = this.validateSet();
|
||||
if (valid) {
|
||||
this.submitSet();
|
||||
}
|
||||
},
|
||||
|
||||
submitSet: function() {
|
||||
var self = this;
|
||||
var ids = $.map(self.selected, function(el) { return $(el).data("id");});
|
||||
|
||||
// ajax request to get initial set of cards
|
||||
var newCardRequest = $.ajax({
|
||||
url: 'set.php?action=submit',
|
||||
type: 'GET',
|
||||
dataType: 'json',
|
||||
success: function(data) {
|
||||
self.clearCards(ids);
|
||||
// to do - implement game complete check on server
|
||||
if (!data.gameComplete) {
|
||||
self.updateCards(data);
|
||||
self.increaseScore();
|
||||
} else {
|
||||
self.gameWon();
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
console.log(arguments);
|
||||
}
|
||||
});
|
||||
|
||||
this.clearSelections();
|
||||
},
|
||||
|
||||
clearCards: function(ids) {
|
||||
// remove submitted cards game's card array and clear the board
|
||||
var self = this;
|
||||
this.selected = [];
|
||||
this.$board.empty();
|
||||
var cardIds = $.map(self.cards, function(card) { return card.id; });
|
||||
$.each(ids, function(idx, id) {
|
||||
var location = cardIds.indexOf(id);
|
||||
if (location > -1) {
|
||||
cardIds.splice(location, 1);
|
||||
self.cards.splice(location, 1);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
updateCards: function(newCards) {
|
||||
this.cards = this.cards.concat(newCards);
|
||||
this.displayCards();
|
||||
},
|
||||
|
||||
increaseScore: function() {
|
||||
this.$score.html(++this.score);
|
||||
},
|
||||
|
||||
startRound: function() {
|
||||
// todo
|
||||
// reset timer to 30 seconds
|
||||
},
|
||||
|
||||
gameWon: function() {
|
||||
alert("you won!");
|
||||
},
|
||||
|
||||
gameLost: function() {
|
||||
alert("you lost :(");
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$(document).ready(Game.deal());
|
||||
@ -1,18 +0,0 @@
|
||||
<?php
|
||||
|
||||
include "deck.php";
|
||||
include "game.php";
|
||||
|
||||
session_start();
|
||||
|
||||
$deck;
|
||||
|
||||
if (isset($_GET['action']) && $_GET['action'] == 'deal') {
|
||||
$_SESSION['deck'] = new Deck();
|
||||
$_SESSION['game'] = new Game($_SESSION['deck']);
|
||||
$game = $_SESSION['game'];
|
||||
echo json_encode($game->start());
|
||||
} else if (isset($_GET['action']) && $_GET['action'] == 'submit'){
|
||||
$deck = $_SESSION['deck'];
|
||||
echo json_encode($deck->threeMore());
|
||||
}
|
||||
Loading…
Reference in new issue