p5_sketch.js

var hit_btn, stand_btn, db_btn, split_btn, sur_btn;
var bet_input, deal_btn;
var actions = [], deal_bet = [];

function setup() {
    createCanvas(windowWidth,windowHeight);
    background('green');
    noStroke();
    noLoop();
}

function draw_button_1(){
    hit_btn = createButton('Hit');
    hit_btn.size(100,50);
    hit_btn.style('font-size', '15px');
    hit_btn.position(windowWidth/2 - 150, windowHeight/2 - 125);
    actions.push(hit_btn);

    stand_btn = createButton('Stand');
    stand_btn.size(100,50);
    stand_btn.style('font-size', '15px');
    stand_btn.position(windowWidth/2 + 50, windowHeight/2 - 125);
    actions.push(stand_btn);

}
function draw_button_2(){
    db_btn = createButton('Double');
    db_btn.size(100,50);
    db_btn.style('font-size', '15px');
    db_btn.position(windowWidth/2 - 250, windowHeight/2 - 25);
    actions.push(db_btn);

    split_btn = createButton('Split');
    split_btn.size(100,50);
    split_btn.style('font-size', '15px');
    split_btn.position(windowWidth/2 - 50, windowHeight/2 - 25);
    actions.push(split_btn);

    sur_btn = createButton('Surrender');
    sur_btn.size(100,50);
    sur_btn.style('font-size', '15px');
    sur_btn.position(windowWidth/2 + 150, windowHeight/2 - 25);
    actions.push(sur_btn);

}
function draw_buttons(){
    draw_button_1();
    draw_button_2();
}

function draw_playerBox(){
    rect(windowWidth/2 - 250,windowHeight/2 + 50, 500, 200, 10);
}
function draw_dealerBox(){
    rect(windowWidth/2 - 250, 30, 500, 200, 10);
}
function draw_box(){
    var c = color('green');
    fill(c);
    stroke('white');
    strokeWeight(5);
    draw_playerBox();
    draw_dealerBox();
    noStroke();
}

function draw_bet(){
    bet_input = createInput();
    bet_input.size(200, 50);
    bet_input.position(windowWidth/2 - 150, windowHeight/2 - 75);
    deal_bet.push(bet_input);

    deal_btn = createButton('DEAL!');
    deal_btn.size(100,bet_input.height);
    deal_btn.position(bet_input.x + bet_input.width, windowHeight/2 - 75);
    deal_bet.push(deal_btn);
}

function draw_score() {
    fill(color(255));
    textSize(30);
    text('DEALER :', windowWidth/2 - 450, 50, 150, 50);
    text('10', windowWidth/2 - 410, 100, 50, 50);
    text('PLAYER :', windowWidth/2 - 450, windowHeight/2 + 70, 150, 50);
    text('10', windowWidth/2 - 410, windowHeight/2 + 120, 50, 50);
}
function draw() {
    draw_buttons();
    draw_box();
    draw_bet();
    draw_score();
}