app.js

new Vue({
	el: '#app',
	data: {
		playerHealth: '100',
		monsterHealth: '100',
		gameIsRunning: false,
		turns: []
	},
	methods: {
		startGame() {
			this.gameIsRunning = true;
			this.playerHealth = 100;
			this.monsterHealth = 100;
			this.turns = [];
		},
		attack() {
			var damage = this.calculateDamage(3, 10);
			this.monsterHealth -= damage;
			this.turns.unshift({
				isPlayer: true,
				text: 'You hit Monster for ' + damage
			});
			if (this.checkwin()) {
				return;
			}
			this.monsterAttacks();
		},
		specialAttack() {
			var damage = this.calculateDamage(8, 20);
			this.monsterHealth -= damage;
			this.turns.unshift({
				isPlayer: true,
				text: 'You hit Monster with your special attack for ' + damage
			});
			if (this.checkwin()) {
				return;
			}
			this.monsterAttacks();
		},
		heal() {
			if(this.playerHealth <= 90) {
			this.playerHealth += 10;
		} else 	{
			this.playerHealth = 100
			}
			this.turns.unshift({
				isPlayer: true,
				text: 'You use a health potion'
			});
			this.monsterAttacks;		
		},
		giveUp() {
			this.gameIsRunning = false;
		},
		monsterAttacks() {
			var damage = this.calculateDamage(5, 12);
			this.playerHealth -= damage;
			this.checkwin();
			this.turns.unshift({
				isPlayer: false,
				text: 'Monster hits you for ' + damage
			});
		},
		calculateDamage(min, max) {
			return Math.max(Math.floor(Math.random() * max) + 1), min;
		},
		checkwin() {
			if (this.monsterHealth <= 0) {
				if(confirm('You won, new game?')) {
					this.startGame();
				} else {
					this.gameIsRunning = false;
				}
				return true;
			} else if (this.playerHealth <= 0) {
				if(confirm('You lost, new game?')) {
					this.startGame();
				} else {
					this.gameIsRunning = false;
				}
				return true;
			}
			return false;
		}
	}

});