Commit c8bf9a3a authored by christian's avatar christian
Browse files

add config file

parent 64a0be90
<!DOCTYPE html>
<html>
<head>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="images.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.2.0/material.indigo-pink.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
<title>Hello world</title>
</head>
<body>
<div class="container">
<div class="row" style="position:relative;">
</head>
<body>
<div class="">
<div class="section" style="min-height: 500px;">
<div class="row">
<div id="dealer" class="col s4" style="position:relative;">Dealer</div>
<div id="player" class="col s8" style="position:relative;">Player</div>
</div>
</div>
<div class="divider"></div>
<div class="section">
<div class="row">
<div class="col s8 push-s4">
<div class="col s4">
<a id="deck" class="waves-effect waves-light btn full-width">Deck</a>
</div>
<div class="col s4">
<a id="hit" class="waves-effect waves-light btn full-width">Hit</a>
</div>
<div class="col s4">
<a id="deal" class="waves-effect waves-light btn full-width">Deal</a>
</div>
</div>
</div>
</div>
<button type="button" id="hit" style="margin-top:500px">Hit</button>
<script defer src="https://code.getmdl.io/1.2.0/material.min.js"></script>
</div>
</div>
<script src="scripts.js"></script>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
<script src="scripts.js"></script>
</body>
</html>
......@@ -6,68 +6,47 @@ import {EventHandler} from './EventHandler';
var $ = require('jquery');
export class Main {
/**
* This is the main class.
* @constructor config
*/
constructor(config) {
// GET ajax config
this.config = config;
this.config.cards = {offset: {top: null, left: null}};
this.ajaxInit = this.config.ajax.init;
this.ajaxInit = this.config.ajax.deck;
}
/**
* GETTER
* @returns {*}
*/
get config() {
return this._value;
}
/**
* Setter
* @param param
*/
set config(param) {
this._value = param;
}
init() {
Utils.ajax(this.ajaxInit).then(data => {
// resolve
// SET config
this.config.deckId = data.deck_id;
// this.getCard();
}, (jqXHR, textStatus, errorThrown) => {
// reject
console.log(jqXHR, textStatus, errorThrown);
}
).catch(error => {
throw error
EventHandler.addClickHandler($('#deck'), () => {
this.getDeck();
});
EventHandler.addClickHandler($('#hit'), () => {
this.getCard();
this.getCard('#dealer');
this.getCard('#player');
});
}
getCard() {
this.ajaxInit.url = 'http://deckofcardsapi.com/api/deck/' + this.config.deckId + '/draw/?count=1';
this.config.cards.offset.top = this.config.cards.offset.top || 0;
this.config.cards.offset.left = this.config.cards.offset.left || 30;
Utils.ajax(this.ajaxInit).then(data => {
$('.row').append('<img src="' + data.cards[0].image + '"/>');
getCard(user) {
let url = this.config.ajax.card.url.replace(/%\w+%/g, this.config.deckId);
this.config.cards.offset.top = user === '#dealer' ? (this.config.cards.offset.top || 20) : (this.config.cards.offset.top || 0);
this.config.cards.offset.left = user === '#dealer' ? (this.config.cards.offset.left || 0) : (this.config.cards.offset.left || 30);
Utils.ajax(url).then(data => {
$(user).append(`<img src="${data.cards[0].image}"/>`);
$('img').last().css({
'top': this.config.cards.offset.top,
'left': this.config.cards.offset.left
});
this.config.cards.offset.top += 0;
this.config.cards.offset.left += 30;
this.config.cards.offset.top += user === '#dealer' ? 20 : 0;
this.config.cards.offset.left += user === '#dealer' ? 0 : 30;
}, (jqXHR, textStatus, errorThrown) => {
console.log(jqXHR, textStatus, errorThrown);
......@@ -77,5 +56,18 @@ export class Main {
});
}
getDeck() {
Utils.ajax(this.ajaxInit).then(data => {
this.config.deckId = data.deck_id;
this.getCard('#dealer');
this.getCard('#player');
}, (jqXHR, textStatus, errorThrown) => {
console.log(jqXHR, textStatus, errorThrown);
}).catch(error => {
throw error
});
}
}
export const config = {
ajax: {
init: {
deck: {
url: 'http://deckofcardsapi.com/api/deck/new/shuffle/?deck_count=1',
type: 'get'
},
card: {
url: 'http://deckofcardsapi.com/api/deck/%deckId%/draw/?count=1',
type: 'get'
}
},
cards: {
offset: {
top: null,
left: null
}
}
};
......@@ -4,9 +4,9 @@ img
box-shadow: 0 4px 6px -6px black;
position: absolute;
body
//background: url("http://www.pix123.com/blackjackdatabase/201406/Jun04/173-04062014061745.png");
background: url("http://www.pix123.com/blackjackdatabase/201406/Jun04/173-04062014061745.png");
background-size: cover;
background: #019153;
//background: #019153;
h2.working
color: green
\ No newline at end of file
.full-width
width: 100%;
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment