\n \n ",data:()=>initialData(),components:{Card:Card},methods:{reset(){Object.assign(this.$data,initialData())},hit(){this.usersCards.push(randomCard())},stand(){this.isUsersTurn=!1,this.message="You stand"},addDealerCard(){this.dealerMessage="I hit...",setTimeout(()=>{this.dealerMessage="",this.dealersCards[1].hidden&&this.dealersCards.splice(1,1);let e=randomCard();this.dealersCards.push(e),this.dealersScore<17?setTimeout(()=>{this.addDealerCard()},500):this.dealersScore<21&&(this.dealerMessage="I stand")},1e3)}},computed:{usersScore(){return this.calculateScore(this.usersCards)},dealersScore(){return this.calculateScore(this.dealersCards)}},watch:{usersScore(e){e>21?(this.isUsersTurn=!1,this.userLost=!0,this.result="Bust! You lose"):21===e?(this.isUsersTurn=!1,this.message="You got 21",this.result="",this.userLost=!1):(this.isUsersTurn=!0,this.userLost=!1,this.message="",this.result="")},dealersScore(e){e>21?this.result="I Bust! You win":e>=17&&(this.result=e>this.usersScore?`I win: ${e} vs ${this.usersScore}`:e===this.usersScore?"Tie, but since I am dealer, I win":`You win: ${this.usersScore} vs ${e}`)},isUsersTurn(e){e||this.userLost||this.addDealerCard()}}};Vue.mixin({methods:{calculateScore:e=>e.map(e=>e.value).reduce((e,s)=>e+s)}}),new Vue({render:e=>e(App),components:{App:App}}).$mount("#blackjack")