readhame
5 years ago
parent
e7d2fb25a8
commit
91bb8ccc89
@ -0,0 +1,10 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="dataSourceStorageLocal">
|
||||||
|
<data-source name="hyperset" uuid="f3ad65b0-7e35-4de2-b55e-7ccc655bac2b">
|
||||||
|
<database-info product="" version="" jdbc-version="" driver-name="" driver-version="" dbms="SQLITE" exact-version="0" />
|
||||||
|
<auth-required>false</auth-required>
|
||||||
|
<schema-mapping />
|
||||||
|
</data-source>
|
||||||
|
</component>
|
||||||
|
</project>
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="DataSourceManagerImpl" format="xml" multifile-model="true">
|
||||||
|
<data-source source="LOCAL" name="hyperset" uuid="f3ad65b0-7e35-4de2-b55e-7ccc655bac2b">
|
||||||
|
<driver-ref>sqlite.xerial</driver-ref>
|
||||||
|
<synchronize>true</synchronize>
|
||||||
|
<jdbc-driver>org.sqlite.JDBC</jdbc-driver>
|
||||||
|
<jdbc-url>jdbc:sqlite:C:\wamp64\www\HyperSet\bdd\hyperset.db</jdbc-url>
|
||||||
|
</data-source>
|
||||||
|
</component>
|
||||||
|
</project>
|
||||||
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
|
After Width: | Height: | Size: 176 KiB |
@ -0,0 +1,6 @@
|
|||||||
|
PRAGMA foreign_keys=OFF;
|
||||||
|
BEGIN TRANSACTION;
|
||||||
|
CREATE TABLE HighScore ( id int PRIMARY KEY, pseudo varchar2(50) NOT NULL, score int NOT NULL);
|
||||||
|
INSERT INTO HighScore VALUES(2,'Jack',80);
|
||||||
|
INSERT INTO HighScore VALUES(1,'redko',100);
|
||||||
|
COMMIT;
|
||||||
Binary file not shown.
@ -0,0 +1,51 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
class Autoload
|
||||||
|
{
|
||||||
|
private static $_instance = null;
|
||||||
|
|
||||||
|
public static function charger()
|
||||||
|
{
|
||||||
|
if(null !== self::$_instance) {
|
||||||
|
throw new RuntimeException(sprintf('%s is already started', __CLASS__));
|
||||||
|
}
|
||||||
|
|
||||||
|
self::$_instance = new self();
|
||||||
|
|
||||||
|
|
||||||
|
if(!spl_autoload_register(array(self::$_instance, '_autoload'), false)) {
|
||||||
|
throw RuntimeException(sprintf('%s : Could not start the autoload', __CLASS__));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public static function shutDown()
|
||||||
|
{
|
||||||
|
if(null !== self::$_instance) {
|
||||||
|
|
||||||
|
if(!spl_autoload_unregister(array(self::$_instance, '_autoload'))) {
|
||||||
|
throw new RuntimeException('Could not stop the autoload');
|
||||||
|
}
|
||||||
|
|
||||||
|
self::$_instance = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private static function _autoload($class)
|
||||||
|
{
|
||||||
|
global $rep;
|
||||||
|
$filename = $class.'.php';
|
||||||
|
$dir =array('modeles/','./','config/','controllers/','metiers/','DAL/');
|
||||||
|
foreach ($dir as $d){
|
||||||
|
$file=$rep.$d.$filename;
|
||||||
|
//echo $file;
|
||||||
|
if (file_exists($file))
|
||||||
|
{
|
||||||
|
include $file;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
?>
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
//gen
|
||||||
|
$rep=__DIR__.'/../';
|
||||||
|
|
||||||
|
/*
|
||||||
|
$bdd["dsn"] = "mysql:host=localhost;dbname=blogphp";
|
||||||
|
$bdd["username"] = "root";
|
||||||
|
$bdd["password"] = "";
|
||||||
|
|
||||||
|
$layout['head'] = 'vues/includes/head.php';
|
||||||
|
$layout['footer'] = 'vues/includes/footer.php';
|
||||||
|
|
||||||
|
$vues['homePage'] = 'vues/homePage.php';
|
||||||
|
$vues['error'] = 'vues/error.php';
|
||||||
|
$vues['score'] = 'vues/score.php';
|
||||||
|
*/
|
||||||
|
$vues['homePage'] = 'vues/homePage.php';
|
||||||
|
$vues['jeu'] = '../set.html';
|
||||||
|
|
||||||
|
?>
|
||||||
@ -0,0 +1,89 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
|
||||||
|
class Controlleur
|
||||||
|
{
|
||||||
|
public function __construct() {
|
||||||
|
global $rep,$vues;
|
||||||
|
|
||||||
|
try{
|
||||||
|
$action=$_REQUEST['action'];
|
||||||
|
switch($action){
|
||||||
|
case NULL:
|
||||||
|
$this->homePage();
|
||||||
|
break;
|
||||||
|
case "deal":
|
||||||
|
$this->game();
|
||||||
|
break;
|
||||||
|
case "VoirScore":
|
||||||
|
$this->afficherScore();
|
||||||
|
break;
|
||||||
|
case "Option":
|
||||||
|
$this->optionDeJeu();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
$dVueEreur[] = "Erreur d'appel php";
|
||||||
|
require ($rep.$vues['error']);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
} catch (PDOException $e)
|
||||||
|
{
|
||||||
|
echo $e->getMessage();
|
||||||
|
$dVueEreur[] = "Erreur inattendue PDO!!! ";
|
||||||
|
require ($rep.$vues['error']);
|
||||||
|
|
||||||
|
}
|
||||||
|
catch (Exception $e2)
|
||||||
|
{
|
||||||
|
$dVueEreur[] = "Erreur inattendue!!! ";
|
||||||
|
require ($rep.$vues['error']);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public function homePage(){
|
||||||
|
global $vues, $rep;
|
||||||
|
|
||||||
|
require($rep . $vues['homePage']);
|
||||||
|
}
|
||||||
|
|
||||||
|
public function game(){
|
||||||
|
global $vues, $rep;
|
||||||
|
|
||||||
|
|
||||||
|
if (isset($_GET['action']) && $_GET['action'] == 'deal') {
|
||||||
|
|
||||||
|
$_SESSION['deck'] = new Deck($_GET['action']);
|
||||||
|
$_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());
|
||||||
|
}
|
||||||
|
require ($rep.$vues['jeu']);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
public function afficherScore()
|
||||||
|
{
|
||||||
|
global $vues, $rep;
|
||||||
|
$listPlayer = new ModelPlayer();
|
||||||
|
try {
|
||||||
|
|
||||||
|
//$listP = $listPlayer->getScores();
|
||||||
|
|
||||||
|
} catch (Exception $e)
|
||||||
|
{
|
||||||
|
$listP = array("error" => $e->getMessage());
|
||||||
|
}
|
||||||
|
|
||||||
|
require($rep . $vues['score']);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<link rel="stylesheet" href="vues/css/style-page.css">
|
||||||
|
<title>Set</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<H1>HyperSet</H1>
|
||||||
|
|
||||||
|
<div class="menu box">
|
||||||
|
<a href="#" class="logo">HyperSet</a>
|
||||||
|
<a href="set.html">Jouer</a>
|
||||||
|
<a href="index.html?action=VoirScore">Voir Les Scores</a>
|
||||||
|
<a href="vues/settings.php">Options</a>
|
||||||
|
<a href="#">Règles</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
<?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;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
<?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;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,69 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
include_once "cardAttributes.php";
|
||||||
|
include_once "card.php";
|
||||||
|
include_once "functions.php";
|
||||||
|
|
||||||
|
class Deck {
|
||||||
|
|
||||||
|
public $cards = array();
|
||||||
|
|
||||||
|
public function __construct($changes) {
|
||||||
|
$this->createDeck($changes);
|
||||||
|
}
|
||||||
|
|
||||||
|
private function createDeck($changes)
|
||||||
|
{
|
||||||
|
$colors = [];
|
||||||
|
|
||||||
|
if ($changes === 'deal') {
|
||||||
|
$colors = array('green', 'red', 'purple');
|
||||||
|
}elseif ($changes === 'deal1') {
|
||||||
|
$colors = array('yellow', 'blue', 'gray');
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$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);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
<?php
|
||||||
|
function array_chop(&$arr, $num)
|
||||||
|
{
|
||||||
|
$ret = array_slice($arr, 0, $num);
|
||||||
|
$arr = array_slice($arr, $num);
|
||||||
|
return $ret;
|
||||||
|
}
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
<?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();
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,14 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
class Player {
|
||||||
|
|
||||||
|
private $score;
|
||||||
|
|
||||||
|
public function findSet() {
|
||||||
|
// to do
|
||||||
|
}
|
||||||
|
|
||||||
|
private function incrementScore($points) {
|
||||||
|
$this->score += $points;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,37 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="initial-scale=1">
|
||||||
|
<title>Set</title>
|
||||||
|
<link rel="stylesheet" href="vues/css/style.css" />
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="custom-select ">
|
||||||
|
<h2 id="daltoSettings">RÉGLAGES COULEURS 0</h2>
|
||||||
|
<select id="color-selector">
|
||||||
|
<option class="text" id="normal" value="normal" onclick="changeColorMode()">Normale</option>
|
||||||
|
<option class="text" id="Daltonien" value="Daltonien" onclick="changeColorMode()">Daltonien</option>
|
||||||
|
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||||
|
<script type="text/javascript" src="vues/js/Settings.js"></script>
|
||||||
|
<script src="vues/js/set.js"></script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
include "metiers/deck.php";
|
||||||
|
include "metiers/game.php";
|
||||||
|
|
||||||
|
session_start();
|
||||||
|
|
||||||
|
$deck;
|
||||||
|
|
||||||
|
if (isset($_GET['action']) && $_GET['action'] == 'deal') {
|
||||||
|
$_SESSION['deck'] = new Deck($_GET['action']);
|
||||||
|
$_SESSION['game'] = new Game($_SESSION['deck']);
|
||||||
|
$game = $_SESSION['game'];
|
||||||
|
echo json_encode($game->start());
|
||||||
|
} else if (isset($_GET['action']) && $_GET['action'] == 'deal1') {
|
||||||
|
$_SESSION['deck'] = new Deck($_GET['action']);
|
||||||
|
$_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());
|
||||||
|
}
|
||||||
@ -0,0 +1 @@
|
|||||||
|
<?php
|
||||||
@ -0,0 +1,123 @@
|
|||||||
|
html,body{
|
||||||
|
position: relative;
|
||||||
|
font-size: 1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.menu{
|
||||||
|
height: 400px;
|
||||||
|
background-color: #2c3e50;
|
||||||
|
width: 500px;
|
||||||
|
margin-left: 38% ;
|
||||||
|
margin-right: 35%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu a{
|
||||||
|
color: #ffffff;
|
||||||
|
font-family: sans-serif;
|
||||||
|
display: block;
|
||||||
|
font-size: 40px;
|
||||||
|
margin: 20%;
|
||||||
|
margin-bottom: 0%;
|
||||||
|
margin-top: 3%;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/*.menu a:hover{
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}*/
|
||||||
|
|
||||||
|
.logo{
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box{
|
||||||
|
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
h1{
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-family: Palatino;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.popup-header {
|
||||||
|
margin-top: 1%;
|
||||||
|
margin-right: 3%;
|
||||||
|
color: #393939;
|
||||||
|
border-bottom-color: #393939;
|
||||||
|
border-bottom: 10px ;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-title{
|
||||||
|
margin-top: 2%;
|
||||||
|
margin-left: 3%;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hr-settings{
|
||||||
|
margin-left: 3%;
|
||||||
|
width: 97%;
|
||||||
|
height: 4px;
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hr-settings-lang{
|
||||||
|
margin-left: 15%;
|
||||||
|
margin-top: 2%;
|
||||||
|
width: 70%;
|
||||||
|
height: 3px;
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-settings{
|
||||||
|
color: white;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 25px;
|
||||||
|
margin-top: 16%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-dalt-settings{
|
||||||
|
color: white;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 25px;
|
||||||
|
margin-top: 14%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-select {
|
||||||
|
width: 70%;
|
||||||
|
margin: 0 auto;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
select::-ms-expand {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-select:after {
|
||||||
|
content: '<>';
|
||||||
|
font: 17px "Consolas", monospace;
|
||||||
|
color: #393939;
|
||||||
|
-webkit-transform: rotate(90deg);
|
||||||
|
-moz-transform: rotate(90deg);
|
||||||
|
-ms-transform: rotate(90deg);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
right: 11px;
|
||||||
|
margin-top: 14%;
|
||||||
|
padding: 0 0 2px;
|
||||||
|
border-bottom: 1px solid #999;
|
||||||
|
position: absolute;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
@ -0,0 +1,100 @@
|
|||||||
|
* {
|
||||||
|
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 {
|
||||||
|
clip-path: polygon(50% 15%, 100% 50%, 50% 85%, 0% 50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.wave {
|
||||||
|
/*clip-path: polygon(5% 34%, 5% 20%, 79% 21%, 66% 61%, 98% 60%, 97% 73%, 19% 74%, 37% 34%);*/
|
||||||
|
-moz-transform: skew(-30deg, 0deg);
|
||||||
|
-webkit-transform: skew(-30deg, 0deg);
|
||||||
|
-o-transform: skew(-30deg, 0deg);
|
||||||
|
-ms-transform: skew(-30deg, 0deg);
|
||||||
|
transform: skew(-30deg, 0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.oval {
|
||||||
|
clip-path: ellipse(40% 30% at 50% 50%);}
|
||||||
|
|
||||||
|
.green {
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.yellow {
|
||||||
|
background: yellow;
|
||||||
|
}
|
||||||
|
.gray {
|
||||||
|
background: gray;
|
||||||
|
}
|
||||||
|
.blue {
|
||||||
|
background: blue;
|
||||||
|
}
|
||||||
|
.red {
|
||||||
|
background: red;
|
||||||
|
}
|
||||||
|
.purple {
|
||||||
|
background: violet;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*solution pour avoir l'image en rainure ou vide a voir dans le css*/
|
||||||
@ -0,0 +1,38 @@
|
|||||||
|
var color = 'normal';
|
||||||
|
var nb = 0;
|
||||||
|
|
||||||
|
function changeColorMode() {
|
||||||
|
let selectColor = document.getElementById('color-selector');
|
||||||
|
selectColor.addEventListener('change', function() {
|
||||||
|
var index = selectColor.selectedIndex;
|
||||||
|
// Rapporter cette donnée au <p>
|
||||||
|
if (index != null){
|
||||||
|
nb= index;
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
/* if(color !== selectColor.value){
|
||||||
|
color = selectColor.value;
|
||||||
|
}*/
|
||||||
|
return nb;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
console.log(nb);
|
||||||
|
/*var nb = 0;
|
||||||
|
|
||||||
|
let selectColor = document.getElementById('color-selector');
|
||||||
|
|
||||||
|
selectColor.addEventListener('change', function() {
|
||||||
|
var index = selectColor.selectedIndex;
|
||||||
|
// Rapporter cette donnée au <p>
|
||||||
|
if (index != null){
|
||||||
|
nb= index;
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
*/
|
||||||
@ -0,0 +1,228 @@
|
|||||||
|
var colorr = changeColorMode();
|
||||||
|
|
||||||
|
|
||||||
|
var Game = {
|
||||||
|
cards: [],
|
||||||
|
selected: [],
|
||||||
|
score: 0,
|
||||||
|
$board: $('[data-display="game-board"]'),
|
||||||
|
$score: $('[data-display="score"]'),
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
deal: function() {
|
||||||
|
var self = this;
|
||||||
|
if (colorr === 0 || colorr === null) {
|
||||||
|
// 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();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}else if (colorr === 1){
|
||||||
|
var dealRequest1 = $.ajax({
|
||||||
|
url: 'set.php?action=deal1',
|
||||||
|
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());
|
||||||
|
|
||||||
@ -0,0 +1,33 @@
|
|||||||
|
<link rel="stylesheet" media="screen" href="css/style.css">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="popup-content">
|
||||||
|
<div class="popup-header">
|
||||||
|
<h1 class="settings-title text" id="settings">PARAMÈTRES</h1>
|
||||||
|
<hr class="hr-settings">
|
||||||
|
</div>
|
||||||
|
<div class="custom-select">
|
||||||
|
<h2 class="text-settings text" id="langTitle">LANGUE</h2>
|
||||||
|
<select id="lang-selector">
|
||||||
|
<option value="fr" onclick="changeLangToFR()">Français</option>
|
||||||
|
<option value="en" onclick="changeLangToEN()">English</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<hr class="hr-settings-lang">
|
||||||
|
<div class="custom-select ">
|
||||||
|
<h2 id="daltoSettings">RÉGLAGES COULEURS 0</h2>
|
||||||
|
<select id="color-selector">
|
||||||
|
<option class="text" id="normal" value="normal" onclick="changeColorMode()">Normale</option>
|
||||||
|
<option class="text" id="Daltonien" value="Daltonien" onclick="changeColorMode()">Daltonien</option>
|
||||||
|
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr class="hr-settings-color">
|
||||||
|
<a href="../set.html">Jouer</a>
|
||||||
|
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
Loading…
Reference in new issue