diff --git a/HyperSet/.idea/dataSources.local.xml b/HyperSet/.idea/dataSources.local.xml new file mode 100644 index 0000000..38b01fd --- /dev/null +++ b/HyperSet/.idea/dataSources.local.xml @@ -0,0 +1,10 @@ + + + + + + false + + + + \ No newline at end of file diff --git a/HyperSet/.idea/dataSources.xml b/HyperSet/.idea/dataSources.xml new file mode 100644 index 0000000..5f88cba --- /dev/null +++ b/HyperSet/.idea/dataSources.xml @@ -0,0 +1,11 @@ + + + + + sqlite.xerial + true + org.sqlite.JDBC + jdbc:sqlite:C:\wamp64\www\HyperSet\bdd\hyperset.db + + + \ No newline at end of file diff --git a/HyperSet/.idea/workspace.xml b/HyperSet/.idea/workspace.xml index e99d458..fee62e4 100644 --- a/HyperSet/.idea/workspace.xml +++ b/HyperSet/.idea/workspace.xml @@ -12,6 +12,28 @@ + + + + + + + + + + +
+

(TEST) Set

+

Find sets.

+

Sets found: 0

+
+
+ + + + + + + + + + + + diff --git a/HyperSet/site/set.php b/HyperSet/site/set.php new file mode 100644 index 0000000..a7fc3cd --- /dev/null +++ b/HyperSet/site/set.php @@ -0,0 +1,24 @@ +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()); +} diff --git a/HyperSet/site/vues/VoirScore.php b/HyperSet/site/vues/VoirScore.php new file mode 100644 index 0000000..b3d9bbc --- /dev/null +++ b/HyperSet/site/vues/VoirScore.php @@ -0,0 +1 @@ +'; + 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; +} diff --git a/HyperSet/site/vues/css/style.css b/HyperSet/site/vues/css/style.css new file mode 100644 index 0000000..392c428 --- /dev/null +++ b/HyperSet/site/vues/css/style.css @@ -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*/ \ No newline at end of file diff --git a/HyperSet/site/vues/js/Settings.js b/HyperSet/site/vues/js/Settings.js new file mode 100644 index 0000000..4f994a8 --- /dev/null +++ b/HyperSet/site/vues/js/Settings.js @@ -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

+ 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

+ if (index != null){ + nb= index; + } + +}) + + + + */ \ No newline at end of file diff --git a/HyperSet/site/vues/js/set.js b/HyperSet/site/vues/js/set.js new file mode 100644 index 0000000..0277083 --- /dev/null +++ b/HyperSet/site/vues/js/set.js @@ -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 = $('

'); + cardNode.addClass('card'); + $(cardNode).data({ + 'id': card.id, + 'shape': card.shape, + 'color': card.color, + 'number': card.number + }); + + var shapeNode = $(''); + 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($('
')); + } + }); + }, + + 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()); + diff --git a/HyperSet/site/vues/settings.php b/HyperSet/site/vues/settings.php new file mode 100644 index 0000000..0c1d4fc --- /dev/null +++ b/HyperSet/site/vues/settings.php @@ -0,0 +1,33 @@ + + + +
+
+

PARAMÈTRES

+
+
+
+

LANGUE

+ +
+
+
+

RÉGLAGES COULEURS 0

+ +
+ +
+ Jouer + + + + +
+