Merge branch 'game-view' of https://codefirst.iut.uca.fr/git/HyperSet/hyper-set into game-view
continuous-integration/drone/push Build is passing Details

game-view
Bastien JACQUELIN 2 years ago
commit caf579da09

@ -1,16 +1,29 @@
export default{ export default{
emits:[], emits:['unSelected','selected'],
props: ['card'], props: ['card','id'],
data: function(){ data: function(){
return{ return{
idUsed:"id"+this.id,
isClicked:false,
} }
}, },
methods:{ methods:{
clicked:function () { clicked() {
if(!this.isClicked){
this.isClicked=true
document.querySelector(`#${this.idUsed}`).setAttribute("style","border: 2px solid red; margin: 20px; color: red; fontSize: 20px; cursor: pointer");
this.$emit('selected',this.id);
}
else{
this.isClicked=false
document.querySelector(`#${this.idUsed}`).setAttribute("style","border: 2px solid black; margin: 20px; color: red; fontSize: 20px; cursor: pointer");
this.$emit('unSelected',this.id);
}
} }
}, },
template:` template:`
<div v-bind:style="{margin:'20px', border: '2px solid black', color: 'red', fontSize: '20px' }">{{card}}</div> <div v-bind:id="idUsed" v-bind:style="{border: '2px solid black',margin:'20px', color: 'red', fontSize: '20px', cursor: 'pointer' }" v-on:click="clicked">
{{card.attributes}}
</div>
` `
} }

@ -2,19 +2,26 @@ export default{
emits:[], emits:[],
data: function(){ data: function(){
return{ return{
card:new Card({"filling":"empty"}) card:new Card({"filling":"empty"}),
deck : new Deck([0,1,2,3],3),
id:0,
selectedCards:[]
} }
}, },
methods:{ methods:{
clicked:function () { selected(id){
console.log("selected",id);
} this.selectedCards[id]=this.deck.outputCards[id-1]
},
unSelected(id){
console.log("unSelected",id);
},
}, },
template:` template:`
<div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', margin:'20px 10em 20px 20px'}"> <div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', margin:'20px 10em 20px 20px'}">
<div v-for="n in 10"> <div v-for="n in deck.outputCards.length">
{{ n }} {{ n }}
<card-module :card={card}></card-module> <card-module @selected='selected' @un-selected='unSelected' :id=n :card=this.deck.outputCards[n-1]></card-module>
</div> </div>
</div> </div>
` `

Loading…
Cancel
Save