new one

main.js

var deck = [2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5,6,6,6,6,7,7,7,7,8,8,8,8,9,9,9,9,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,11,11,11,11];
// Creates a Call To Action div
// Add button class to create basic button style
// @params c - the class
// @params i - the id e.g. ctaHit, ctaStand etc
// @params t - the text
// @params f - the function to call onclick
function ctaGenerator(c, i, t) {
	var cta = document.createElement('div');
	cta.setAttribute('class', c);
	cta.setAttribute('id', i);
	var textNode = document.createTextNode(t);
	cta.appendChild(textNode);
	return cta;
}

// Generates one card
// @appendCardTo - append card to id dealerHand or playerHand
// @value - number value of the card 
function cardGenerator(appendCardTo, value) {
	var theCard = document.createElement('div');
	theCard.setAttribute('class', 'card');
	var theCardValue = document.createTextNode(value);
	theCard.appendChild(theCardValue);

	// Append it to player or dealer
	var parentEle = document.getElementById(appendCardTo);
	parentEle.appendChild(theCard);
	
}

function hit() {
	var card = deck[Math.floor(Math.random()*deck.length)];
	// Ace check
	if (card === 11) {
		var hand = evaluateHand('playersHand')
		var result = card + hand;
		if (result > 21) {
			card = 1;
		}
	}
    cardGenerator('playersHand',card);
	evaluateHand('playersHand');
}

function dealerHit() {
	var card = deck[Math.floor(Math.random()*deck.length)];
    cardGenerator('dealersHand',card);
	evaluateHand('dealersHand');	
}

function stand() {
	evaluateHand('dealersHand');
}

function doubleBet() {
	alert('you doubled!!');
}

function deal(name) {
	// Dealer gets two cards
	for ( i = 0; i < 2; i++ ) {
        var card = deck[Math.floor(Math.random()*deck.length)];
        cardGenerator('dealersHand',card);
	}

	// Player gets two cards
	for ( j = 0; j < 2; j++ ) {
        var card = deck[Math.floor(Math.random()*deck.length)];
        cardGenerator('playersHand',card);
	}
	evaluateHand('playersHand');
}

// Evaluates a hand
// @params theHand - the id of the hand we want to evaluate
var evaluateHand = function(theHand) {
	var handToEvaluate = document.getElementById(theHand);
	var cardsInHand = handToEvaluate.getElementsByTagName('div');
	var handValue = 0;
	// Get player action buttons 
	var hitButton = document.getElementById('hit');
	var standButton = document.getElementById('stand');
	var doubleButton = document.getElementById('double');

	for ( i = 0; i < cardsInHand.length; i++) {
		handValue += parseInt(cardsInHand[i].firstChild.nodeValue);
	}
    
    var theAttr = handToEvaluate.getAttribute('id');
    // Player flow
    if (theAttr === 'playersHand') {
	updateHandValue('playerScore', handValue);

		// If the player has 21
		if (handValue === 21) {
			evaluateHand('dealersHand');
			hitButton.className = 'hide';
			standButton.className = 'hide';
			doubleButton.className = 'hide';
		}

		// If the player bustssss
		if (handValue > 21 && theAttr === 'playersHand') {
    		// You have busteeedddddd....
    		// The dealer wins!
    		// Add 1 to dealer score
    		// Show new game button
    		hitButton.className = 'hide';
			standButton.className = 'hide';
			doubleButton.className = 'hide';
    	}     	
    }

    // Dealer flow
    if (theAttr === 'dealersHand') {
	updateHandValue('dealerScore', handValue);

		if (handValue > 21) {
			console.log('Dealer busted with ' + handValue);
		} else if (handValue >= 17 && handValue <= 21) {
    		console.log('dealer stays with ' + handValue);
    	} else {
    		dealerHit();
    	}     	
    }

    return handValue;
}

var updateHandValue = function(handValueToUpdate, score) {
	var theDiv = document.getElementById(handValueToUpdate);
	var theScore = document.createTextNode(score);
	theDiv.appendChild(theScore);

}

window.onload = function () {

	// Attach events to static buttons 
	// Hit
	var hitButton = document.getElementById('hit');
	hitButton.addEventListener('click', hit, false);
	// Stand
	var standButton = document.getElementById('stand');
	standButton.addEventListener('click', stand, false);
	// Double
	var doubleButton = document.getElementById('double');
	doubleButton.addEventListener('click', doubleBet, false)
	// Then hide the buttons
	hitButton.className = 'hide';
	standButton.className = 'hide';
	doubleButton.className = 'hide';

	// Parent div
	var parentElement = document.getElementById('buttonWrapper');
	// Create button
	var startButton = ctaGenerator('button', 'ctaStart', 'Start');
	parentElement.appendChild(startButton);

	// Show the name input element
	startButton.onclick = function() {
		// Hide the start button
		startButton.style.display = 'none';
		// Create input element
		var inputEle = document.createElement('input');
		inputEle.setAttribute('class', 'player-name');
		// append it
		parentElement.appendChild(inputEle);

		var submitName = ctaGenerator('button', 'ctaSubmit', 'Enter');
		parentElement.appendChild(submitName);

	
		submitName.onclick = function() {
			var playerName = inputEle.value;

			submitName.style.display = 'none';
			inputEle.style.display = 'none';

			hitButton.className = 'button';
			standButton.className = 'button';
			doubleButton.className = 'button';

			deal(playerName);	
		}
	}
}