|
|
|
|
<!doctype html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
|
|
|
<title>BlackJack ♠</title>
|
|
|
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/alertify.min.css"/>
|
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/bootstrap.min.css"/>
|
|
|
|
|
<link rel="stylesheet" href="css/app.css">
|
|
|
|
|
<link rel="icon" href="favicon.ico">
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="root">
|
|
|
|
|
<nav class="navbar navbar-expand-lg">
|
|
|
|
|
<a class="navbar-brand" href="#">
|
|
|
|
|
<img src="img/Chips/chipBlueWhite.png" alt="logo">
|
|
|
|
|
BlackJack
|
|
|
|
|
</a>
|
|
|
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
|
|
|
|
<span class="navbar-toggler-icon"></span>
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
|
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|
|
|
|
<ul class="navbar-nav mr-auto">
|
|
|
|
|
<li class="nav-item" v-if="!roundActive">
|
|
|
|
|
<a class="nav-link" href="javascript:" @click="startRound">
|
|
|
|
|
New round <i class="fas fa-play"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item" v-if="roundActive">
|
|
|
|
|
<a class="nav-link" href="javascript:" @click="drawAnotherCard">
|
|
|
|
|
Draw a card <i class="fas fa-hand-pointer"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item" v-if="roundActive">
|
|
|
|
|
<a class="nav-link" href="javascript:" @click="pass">
|
|
|
|
|
Stand <i class="fas fa-hand-paper"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item" v-if="roundActive">
|
|
|
|
|
<a class="nav-link" href="javascript:" @click="endRound">
|
|
|
|
|
Cancel round <i class="fas fa-stop"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item" v-if="bankIsActive">
|
|
|
|
|
<a class="nav-link" href="javascript:" data-toggle="modal" data-target="#bankModal">
|
|
|
|
|
Bank <i class="fas fa-piggy-bank"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item" v-else>
|
|
|
|
|
<a class="nav-link" href="/login" target="_blank">
|
|
|
|
|
Login <i class="fas fa-key"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
<a class="nav-link" href="https://git.luna-development.net/neroignis/farm" target="_blank">
|
|
|
|
|
Development <i class="fas fa-laptop-code"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</nav>
|
|
|
|
|
|
|
|
|
|
<div class="container">
|
|
|
|
|
<!-- <div class="row">-->
|
|
|
|
|
<!-- <div class="col-md-12">-->
|
|
|
|
|
<!-- <button v-if="!roundActive">Start round</button>-->
|
|
|
|
|
<!-- <button @click="drawAnotherCard" v-if="roundActive">Draw</button>-->
|
|
|
|
|
<!-- <button @click="pass" v-if="roundActive">Pass</button>-->
|
|
|
|
|
<!-- <button @click="endRound" v-if="roundActive">End round</button>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<h4>Dealer
|
|
|
|
|
<template v-if="!roundActive">({{ dealerScore }})</template>
|
|
|
|
|
</h4>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-4" v-for="(card, index) in dealersHand">
|
|
|
|
|
<img :src="index > 0 ? card.asset : roundActive ? cardBack : card.asset" :alt="card.symbol + '_' + card.points" class="playing-card">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<h4>Hand ({{ handScore === 21 && usersHand.count < 2 ? 'BlackJack' : handScore > 21 ? 'Plus! ' + handScore : handScore }})</h4>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-4" v-for="card in usersHand">
|
|
|
|
|
<img :src="card.asset" :alt="card.symbol + '_' + card.points" class="playing-card">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="modal fade" id="bankModal" tabindex="-1" role="dialog" aria-labelledby="bankModalLabel" aria-hidden="true">
|
|
|
|
|
<div class="modal-dialog" role="document">
|
|
|
|
|
<div class="modal-content bank-modal steel-border">
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
<h5 class="modal-title" id="bankModalLabel">Welcome to Luna Bank <i class="fas fa-piggy-bank"></i></h5>
|
|
|
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
|
|
|
<img src="assets/gui/close.png" alt="">
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-12 user-info">
|
|
|
|
|
<img v-if="avatar" :src="avatar" class="float-right bank-avatar">
|
|
|
|
|
<p>
|
|
|
|
|
Welcome, {{ username }}. <br/>
|
|
|
|
|
<a href="/account" target="_blank">
|
|
|
|
|
<i class="fas fa-money-check-alt"></i> Kontoauszug
|
|
|
|
|
</a>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-12">
|
|
|
|
|
<h4>
|
|
|
|
|
Account:
|
|
|
|
|
<span class="float-right">{{ isMoney(bank) }} $</span>
|
|
|
|
|
</h4>
|
|
|
|
|
<h4>
|
|
|
|
|
Money:
|
|
|
|
|
<span class="float-right">{{ isMoney(money) }} $</span>
|
|
|
|
|
</h4>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<hr/>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-6">
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label class="label">Deposit</label>
|
|
|
|
|
<div class="input-group mb-2">
|
|
|
|
|
<input type="number"
|
|
|
|
|
class="form-control"
|
|
|
|
|
v-model="toBank"
|
|
|
|
|
:placeholder="'max. ' + isMoney(money)"
|
|
|
|
|
@keyup.enter="bankButtonEnter('withdraw', 'to');">
|
|
|
|
|
<div class="input-group-append">
|
|
|
|
|
<div class="input-group-text">$</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-6">
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label class="label">Withdraw</label>
|
|
|
|
|
<div class="input-group mb-2">
|
|
|
|
|
<input type="number"
|
|
|
|
|
class="form-control"
|
|
|
|
|
v-model="toMoney"
|
|
|
|
|
:placeholder="'max. ' + isMoney(bank)"
|
|
|
|
|
@keyup.enter="bankButtonEnter('deposit', 'from');">
|
|
|
|
|
<div class="input-group-append">
|
|
|
|
|
<div class="input-group-text">$</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-6">
|
|
|
|
|
<button class="btn-pixel-border" @click="transferToBank" data-dismiss="modal" id="deposit">
|
|
|
|
|
✔
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-6">
|
|
|
|
|
<button class="btn-pixel-border" @click="transferFromBank" data-dismiss="modal" id="withdraw">
|
|
|
|
|
✔
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
<script type="text/javascript" id="cookieinfo" src="https://cookieinfoscript.com/js/cookieinfo.min.js"></script>
|
|
|
|
|
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/alertify.min.js"></script>
|
|
|
|
|
<script src="https://kit.fontawesome.com/b54a4cceff.js" crossorigin="anonymous"></script>
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
|
|
|
|
|
<script src="js/vue.js"></script>
|
|
|
|
|
<script src="js/app.js"></script>
|
|
|
|
|
</html>
|
