conflict index.html ok
continuous-integration/drone/push Build is passing Details

pull/84/head
remrem 2 years ago
commit 8c99f9408b

@ -0,0 +1,18 @@
# Class diagram
```mermaid
---
title: Diagramme de classe final (ne prenant en compte que les "cards")
---
classDiagram
class Card{
attributes
+getAttributes()
+isEqual()
}
```

@ -0,0 +1,62 @@
# Class diagram
```mermaid
---
title: Diagramme de classe initial (ne prenant en compte que les "cards")
---
classDiagram
Card <|-- Card4WithNoOutline
Card <|-- Card4WithNoShape
Card <|-- Card4WithNoNumber
Card <|-- Card4WithNoColor
Card <|-- Card4WithNoFilling
class Card{
+getAttributes()
+isEqual()
}
class Card4WithNoOutline{
-string color
-string shape
-string number
-string filling
+getAttributes()
+isEqual()
}
class Card4WithNoShape{
-string color
-string outline
-string number
-string filling
+getAttributes()
+isEqual()
}
class Card4WithNoColor{
-string outline
-string shape
-string number
-string filling
+getAttributes()
+isEqual()
}
class Card4WithNoNumber{
-string color
-string shape
-string outline
-string filling
+getAttributes()
+isEqual()
}
class Card4WithNoFilling{
-string color
-string shape
-string number
-string outline
+getAttributes()
+isEqual()
}
```

@ -10,6 +10,7 @@
</head>
<body>
<header>
<ul id="nav-bar">
<li><a href="./index.html">Home</a></li> <!-- maybe put a logo -->
@ -36,9 +37,9 @@
</div>
<div id="right" class="column">
<button class="action-button">Join Public Game</button>
<button class="action-button"><a href="/views/room.html">New Public Game</a></button>
<button class="action-button">New Private Game</button>
<button class="action-button">Create solo game</button>
<button class="action-button">Join game</button>
<button class="action-button">New Game</button>
</div>
</div>

@ -0,0 +1,23 @@
{
"name": "hyperset",
"version": "1.0.0",
"description": "Web version of the famous card game \"SET\"",
"main": "index.js",
"directories": {
"test": "test"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://codefirst.iut.uca.fr/git/HyperSet/HyperSet.git"
},
"keywords": [
"Set!",
"game",
"logic"
],
"author": "Raphaël Lacote, Aurian Jault, Rémi Arnal, Bastien Jacquelin",
"license": "ISC"
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

@ -19,7 +19,8 @@
<script src="../Model/Factory.js"></script>
<script src="../Model/Deck.js"></script>
<script src="../../test/testsIsHyperset.js"></script>
<script src="main.js"></script>
<script src="../../test/testsNumberHyperset.js"></script>
<!--<script src="main.js"></script>-->
</body>
</html>

@ -26,22 +26,22 @@ console.group('Deck');
let deck = new Deck([0,1,2,3],3);
console.log("deck.outputCards",deck.outputCards)
console.log("deck.outputCards length",deck.outputCards.length)
console.log("deck.remainingCards",deck.remainingCards)
//console.log("deck.remainingCards",deck.remainingCards)
console.log("deck.remainingCards length",deck.remainingCards.length)
console.log("check set");
deck.checkSet([deck.outputCards[0],deck.outputCards[1],deck.outputCards[2]])
console.log("deck.outputCards",deck.outputCards)
console.log("deck.outputCards length",deck.outputCards.length)
console.log("deck.remainingCards",deck.remainingCards)
//console.log("deck.remainingCards",deck.remainingCards)
console.log("deck.remainingCards length",deck.remainingCards.length)
console.groupEnd();
let tab=[]
tab.push("yeyee")
console.log(tab)
tab.push("gngngn")
console.log(tab)
// let tab=[]
// tab.push("yeyee")
// console.log(tab)
// tab.push("gngngn")
// console.log(tab)
// CREATE HYPERSET
function checkList(list) {

@ -1,8 +1,8 @@
const TAB_COLOR = ['red', 'purple', 'green', 'blue', 'orange'];
const TAB_NUMBER = [1, 2, 3, 4, 5];
const TAB_SHAPE = ['diamond', 'oval', 'squiggle', 'star', 'triangle'];
const TAB_FILLING = ['empty', 'stripped', 'fullO', 'pointed', 'squared'];
const TAB_OUTLINE = ['full', 'dot', 'rect', 'spade', 'sharp'];
const TAB_FILLING = ['empty', 'stripped', 'full', 'pointed', 'squared'];
const TAB_OUTLINE = ['continuous', 'dot', 'rect', 'spade', 'sharp'];
const ATTRIBUTES = [TAB_COLOR, TAB_NUMBER, TAB_SHAPE, TAB_FILLING, TAB_OUTLINE];
const IDX_ATTRIBUTES = ["color", "number", "shape", "filling", "outline"];

@ -27,24 +27,30 @@ class Deck {
* @brief creation of the deck : 12 random cards lay in front of the playe and remove card from the remainingCard array
* @author Bastien Jacquelin
*/
createDeck(nbCards) {//toTest⌛
createDeck(nbCards) {//toTest⌛when more than 12c to d't add other cards
if (this.remainingCards.length < this.nbCards) {// no more cards
console.log("PLUS DE CARTES");
return;
}
else {
for (let i = 0; i < nbCards; i++) {
const rand = this.getRandCard();
this.outputCards.push(this.remainingCards[rand]);
this.remainingCards.splice(rand, 1);
}
let nbSets = setsCounter(this.outputCards, this.nbCards);
console.log("nbSets", nbSets);
console.log("outputCards.length", this.outputCards.length);
console.log("remainingCards.length", this.remainingCards.length);
if (nbSets == 0) {
this.createDeck(this.nbCards)
}
let nbSets = setsCounter(this.outputCards, this.nbCards);
if(this.outputCards.length>=12 && nbSets!=0){
return
}
else{
for (let i = 0; i < nbCards; i++) {
const rand = this.getRandCard();
this.outputCards.push(this.remainingCards[rand]);
this.remainingCards.splice(rand, 1);
}
nbSets = setsCounter(this.outputCards, this.nbCards);
console.log("nbSets", nbSets);
// console.log("outputCards.length", this.outputCards.length);
// console.log("remainingCards.length", this.remainingCards.length);
if (nbSets == 0) {
this.createDeck(this.nbCards)
}
}
}
}

@ -152,33 +152,33 @@ function trouveElements(attributsCartes) {
let x;
tabColor.forEach(element => {
TAB_COLOR.forEach(element => {
if (element == attributsCartes[0]) {
x = createElements(attributsCartes, tabColor);
x = createElements(attributsCartes, TAB_COLOR);
}
});
tabNumber.forEach(element => {
TAB_NUMBER.forEach(element => {
if (element == attributsCartes[0]) {
x = createElements(attributsCartes, tabNumber);
x = createElements(attributsCartes, TAB_NUMBER);
}
});
tabShape.forEach(element => {
TAB_SHAPE.forEach(element => {
if (element == attributsCartes[0]) {
x = createElements(attributsCartes, tabShape);
x = createElements(attributsCartes, TAB_SHAPE);
}
});
tabFilling.forEach(element => {
TAB_FILLING.forEach(element => {
if (element == attributsCartes[0]) {
x = createElements(attributsCartes, tabFilling);
x = createElements(attributsCartes, TAB_FILLING);
}
});
tabOutline.forEach(element => {
TAB_OUTLINE.forEach(element => {
if (element == attributsCartes[0]) {
x = createElements(attributsCartes, tabOutline);
x = createElements(attributsCartes, TAB_OUTLINE);
}
});
@ -191,6 +191,7 @@ function createCard(cards) {
let carteFinale = [];
let listeInter = [];
cards.forEach(element => {
attributesMatrix.push(element.getAttributes());
});
@ -201,6 +202,7 @@ function createCard(cards) {
listeInter.push(element[i]);
});
//S'ils sont tous égaux
if (listeInter.every(element => element === listeInter[0])) {
l = []
@ -218,8 +220,6 @@ function createCard(cards) {
}
}
}
console.log(carteFinale);
return carteFinale;
}
@ -244,3 +244,46 @@ function isHyperset(cardsLeft, cardsRight) {
}
return true;
}
function numberOfHyperset2(deck) {
let res = 0
for (i = 0; i < deck.length - 3; i++) {
for (j = i + 1; j < deck.length - 2; j++) {
for (k = j + 1; k < deck.length - 1; k++) {
for (lapin = k + 1; lapin < deck.length; lapin++) {
console.log(" i,j,k,l :", i, j, k, lapin)
if (isHyperset([deck[i], deck[j]], [deck[k], deck[lapin]])) {
console.log(deck[i],deck[j],deck[k],deck[lapin])
res += 1
}
}
}
}
}
return res
}
function numberOfHyperset3(deck) {
let res = 0
for (i = 0; i < deck.length - 5; i = i + 1) {
for (j = i + 1; j < deck.length - 4; j = j + 1) {
for (k = j + 1; k < deck.length - 3; k = k + 1) {
for (lolita = k + 1; lolita < deck.length - 2; lolita = lolita + 1) {
for (m = lolita + 1; m < deck.length - 1; m = m + 1) {
for (n = m + 1; n < deck.length; n = n + 1) {
//console.log(i, j, k, lolita, m, n)
if (isHyperset([deck[i], deck[j], deck[k]], [deck[lolita], deck[m], deck[n]])) {
res += 1
}
}
}
}
}
}
}
return res
}

@ -0,0 +1,11 @@
.description{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 2rem 4rem 2rem 4rem;
}
h2{
font-size: 28px;
}

@ -107,4 +107,34 @@ h1 {
display: flex;
flex-direction: column;
margin-top: auto;
}
}
#tuto-block {
height: 86.7vh;
background-color: white;
border: 0.5rem solid black;
}
#p-block {
height: 75%;
width: 75%;
position: absolute;
top: 55%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
#picture-logo {
display: block;
margin: 0 auto;
}
#phrase-finale{
font-size:18pt;
color:red;
font-family:'Comic Sans MS';
}

@ -1,9 +1,8 @@
let card1 = new Card4WithoutOutline('red', 3, 'wave', 'full');
let card2 = new Card4WithoutOutline('red', 3, 'oval', 'empty');
let card3 = new Card4WithoutOutline('blue', 2, 'oval', 'full');
let card4 = new Card4WithoutOutline('green', 1, 'wave', 'pointed');
let card5 = new Card4WithoutOutline('green', 1, 'wave', 'full');
let card1 = new Card({ 'color': 'red', 'number': 3, 'shape':'squiggle','filling':'full'});
let card2 = new Card({'color':'red', 'number':3, 'shape':'oval','filling':'empty'});
let card3 = new Card({'color':'blue', 'number':2, 'shape':'oval', 'fillin':'full'});
let card4 = new Card({ 'color': 'green', 'number': 1, 'shape':'squiggle', 'fillin':'pointed'});
let card5 = new Card({ 'color': 'green', 'number': 1, 'shape':'squiggle', 'fillin':'full'});
deckA = [];
deckB = [];
deckC = [];
@ -15,16 +14,17 @@ deckC.push(card3, card5);
console.assert(isHyperset(deckA, deckB) == true);
console.assert(isHyperset(deckA, deckC) == false);
let BcardG1 = new Card5('red', 4, 'oval', 'empty', 'fullO');
let BcardG2 = new Card5('red', 3, 'oval', 'full', 'fullO');
let BcardG3 = new Card5('red', 2, 'oval', 'squared', 'fullO');
let BcardG4 = new Card5('red', 1, 'oval', 'pointed', 'fullO');
let BcardG1 = new Card({ 'color': 'red', 'number': 4, 'shape':'diamond','filling':'empty','outline':'continuous'});
let BcardG2 = new Card({ 'color': 'red', 'number': 3, 'shape':'squiggle','filling':'full','outline':'continuous'});
let BcardG3 = new Card({ 'color': 'red', 'number': 2, 'shape':'star','filling':'squared','outline':'continuous'});
let BcardG4 = new Card({ 'color': 'red', 'number': 1, 'shape':'triangle','filling':'pointed','outline':'continuous'});
let BcardD1 = new Card({'color':'green', 'number':3, 'shape':'oval','filling':'pointed','outline':'dot'});
let BcardD2 = new Card({'color':'blue', 'number':2, 'shape':'oval','filling':'squared','outline':'rect'});
let BcardD3 = new Card({'color':'purple', 'number':4, 'shape':'oval','filling':'full','outline':'spade'});
let BcardD4 = new Card({'color':'orange', 'number':1, 'shape':'oval','filling':'empty','outline':'sharp'});
let BcardD5 = new Card({'color':'purple', 'number':4, 'shape':'oval','filling':'stripped','outline':'spade'});
let BcardD1 = new Card5('green', 3, 'oval', 'pointed', 'cloudy');
let BcardD2 = new Card5('blue', 2, 'oval', 'squared', 'sharpy');
let BcardD3 = new Card5('purple', 4, 'oval', 'full', 'hyphen');
let BcardD4 = new Card5('orange', 1, 'oval', 'empty', 'dotted');
let BcardD5 = new Card5('purple', 4, 'oval', 'stripped', 'hyphen');
BdeckA = [];
BdeckB = [];
@ -41,21 +41,4 @@ BdeckE.push(BcardD1, BcardD2, BcardD3, BcardD4);
console.assert(isHyperset(BdeckA, BdeckB) == true);
console.assert(isHyperset(BdeckA, BdeckC) == false);
console.assert(isHyperset(BdeckD, BdeckE) == true);
let Ccard1 = new Card4WithoutShape('blue', 3, 'empty', 'cloudy');
let Ccard2 = new Card4WithoutShape('red', 3, 'empty', 'cloudy');
let Ccard3 = new Card4WithoutShape('green', 3, 'empty', 'cloudy');
let Ccard4 = new Card4WithoutShape('purple', 3, 'empty', 'sharpy');
let Ccard5 = new Card4WithoutShape('purple', 3, 'empty', 'sharpy');
let Ccard6 = new Card4WithoutShape('purple', 3, 'empty', 'sharpy');
CdeckA = [];
CdeckB = [];
CdeckA.push(Ccard1, Ccard2, Ccard3);
CdeckB.push(Ccard4, Ccard5, Ccard6);
console.assert(isHyperset(CdeckA, CdeckB) == false);
console.assert(isHyperset(BdeckD, BdeckE) == true);

@ -0,0 +1,9 @@
// CREATE DECK
let deck = new Deck([0, 1, 2, 3], 4);
// CHECK HYPERSET
console.log(deck.outputCards)
console.log(numberOfHyperset3(deck.outputCards))

@ -0,0 +1,20 @@
export default{
emits:['selected'],
props: ['card','id'],
data: function(){
return{
idUsed:"id"+this.id,
isClicked:false,
}
},
methods:{
clicked() {
this.$emit('selected',this.id);
}
},
template:`
<div v-bind:id="idUsed" v-bind:style="{border: '2px solid black', color: 'red', fontSize: '20px', cursor: 'pointer',width:'100%',height:'100%' }" v-on:click="clicked">
{{card.attributes}}
</div>
`
}

@ -0,0 +1,69 @@
export default{
emits:[],
props:{
deckR:Deck,
idRoom:String,
mode:String//true for chrono
},
data: function(){
return{
card:new Card({"filling":"empty"}),
id:0,
deck : new Deck([0,1,2,3],3),
selectedCards:[],
nbCardsSelected:0,
connected:'7/8',
timer:'10.51',
}
},
methods:{
selected(id){
if(this.nbCardsSelected>=this.deck.nbCards){
this.set();
console.log("deb")
}
else{
if(this.selectedCards[id]!=null){
console.log("deselec")
document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid black; color: red; fontSize: 20px; cursor: pointer; width:100%; height:100%");
this.nbCardsSelected-=1
this.selectedCards[id]=null
}
else{
console.log("Selec")
this.selectedCards[id]=this.deck.outputCards[id-1]
document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid red; color: red; fontSize: 20px; cursor: pointer; width:100%; height:100%");
this.nbCardsSelected+=1
if(this.nbCardsSelected==this.deck.nbCards){
console.log("this.selectedCards.length",this.selectedCards.length)
this.set();
}
}
}
},
set(){
console.log("Check Set")
let checkSet=true;
if(checkSet){
console.log("this.selectedCards.length",this.selectedCards.length)
this.deck.checkSet(this.selectedCards);
this.nbCardsSelected=0;
this.selectedCards.splice(0,this.selectedCards.length+1)
}
},
},
template:`
<div class="description">
<h2>Room: {{idRoom}}</h2>
<h2 v-if="mode">{{timer}}</h2>
<h2 v-else="!mode"> Remaining cards: {{deck.remainingCards.length}}/{{deck.allCards.length}}</h2>
<h2>Players: {{connected}}</h2>
</div>
<div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', 'flex-wrap':'wrap',margin:'1rem 25rem 20px 20px'}">
<div class="Cardframe" v-bind:style="{ width:'12%', height:'15rem', margin:'2% 2% 2% 2%'}" v-for="n in deck.outputCards.length">
<card-module @selected='selected' :id=n :card=this.deck.outputCards[n-1]></card-module>
</div>
</div>
`
}

@ -0,0 +1,56 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Game</title>
<!-- <base href="https://codefirst.iut.uca.fr/containers/HyperSet-hyperset/"> -->
<link rel="stylesheet" type="text/css" href="/styles/style.css">
<link rel="stylesheet" type="text/css" href="/styles/index.css">
<link rel="stylesheet" type="text/css" href="/styles/game.css">
</head>
<header>
<ul id="nav-bar">
<li><a href="/index.html">Home</a></li> <!-- maybe put a logo -->
<li><a href="/views/cards-test.html">Card Test</a></li>
<li><a href="/views/tutorial.html">Tutorial</a></li>
<li><a href="/views/leaderboard.html">Leaderboard</a></li>
<li><a href="/views/about.html">About</a></li>
</ul>
</header>
<body>
<div id="app">
<deck-module id-room="00000" :mode=false></deck-module>
</div>
<section>
</section>
<script src="/src/Model/Exceptions.js"></script>
<script src="/src/Model/Card.js"></script>
<script src="/src/algo.js"></script>
<script src="/src/Model/Const.js"></script>
<script src="/src/Model/Factory.js"></script>
<script src="/src/Model/Deck.js"></script>
<script type="module">
import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
import CardModule from '/views/card-module.js';
import DeckModule from '/views/deck-module.js';
const app = createApp({
created(){},
data(){
return{}
},
methods:{
myFun:function(){}
}
});
app.component('CardModule', CardModule);
app.component('DeckModule', DeckModule);
app.mount('#app');
</script>
</body>
</html>

@ -0,0 +1,24 @@
<!DOCTYPE html>
<!--
Si vous rrouvez une unitilité à ce truc, n'hésitez pas.'
-->
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="../styles/style.css">
<link rel="stylesheet" type="text/css" href="../styles/index.css">
</head>
<header>
<ul id="nav-bar">
<li><a href="./index.html">Home</a></li>
<li><a href="./views/cards-test.html">Card Test</a></li>
<li><a href="./tutorial.html">Tutorial</a></li>
<li><a href="./views/leaderboard.html">Leaderboard</a></li>
<li><a href="./views/about.html">About</a></li>
</ul>
</header>
</html>

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Tutorial</title>
<!-- <base href="https://codefirst.iut.uca.fr/containers/HyperSet-hyperset/"> -->
<link rel="stylesheet" type="text/css" href="../styles/style.css">
<link rel="stylesheet" type="text/css" href="../styles/index.css">
</head>
<header>
<ul id="nav-bar">
<li><a href="../index.html">Home</a></li>
<li><a href="./cards-test.html">Card Test</a></li>
<li><a href="./tutorial.html">Tutorial</a></li>
<li><a href="./leaderboard.html">Leaderboard</a></li>
<li><a href="./about.html">About</a></li>
</ul>
</header>
<body>
<div id="tuto-block">
<div id="p-block">
<img src="../resources/logo.png"
id="picture-logo"
width="200"
height=auto
alt="Picture not found" /><br /><br />
<p>
Cette application web vous permet de joueur au célèbre jeu Set.<br />
Votre but est d'engendrer un maximum de points avant la fin du temps imparti,
pour cela, vous devez réunir des ensembles de 3 cartes.<br />
Un ensemble est constitué de trois cartes où chaque caractéristique est soit identique, soit différente pour chacune des cartes.<br />
Par exemple, un ensemble pourrait être composé d'une carte rouge pleine en forme de losange avec un remplissage rayé,<br />
une carte verte vide en forme d'ovale avec un remplissage plein et une carte violette pleine en forme de vague avec un remplissage vide.<br />
Vous pourrez jouer en solo ou en multijoueur ou vous devez être plus rapide que vos adversaire<br />
De nombreuses variantes sont disponibles et vous pourrez modifier vos attributs, le nombre de cartes...<br />
Pour une première partie nous vous conseillons la version du jeu Set en 3*4<br /><br />
</p>
<p id="phrase-finale">
A vous de jouer !!!
</p>
</div>
</div>
</body>
</html>
Loading…
Cancel
Save