import React, { Component } from 'react';
import Card from './card';

import { shuffledDeckURL } from '../constants/constants';
import DealerDeck from '../images/deck.png';

class Deck extends Component {
    constructor(props) {
        super(props);

        this.state = {
            success: false,
            deck_id: '',
            shuffled: false,
            remaining: 0
          };
    }

    fetchShuffledDeck() {
        fetch(shuffledDeckURL)
        .then(response => response.json())
        .then(response => {
            //console.log(response)
            this.setState({
                ...this.state,
                success: response.success,
                deck_id: response.deck_id,
                shuffled: response.shuffled,
                remainingCards: response.remaining,
            });
        });
    }

    componentWillMount() {
        this.fetchShuffledDeck();
    }

    render() {
        const { success, remainingCards, deck_id } = this.state;
        return (
            <>
            <div className="comp-cards">
                <div className="row">
                    <div className="col-8 col-lg-6">
                        <div className="row">
                    {success && (
                        <Card deck_id={deck_id} />
                    )}</div></div>
                    <div className='deck col-4 col-lg-2 offset-lg-2'>
                        <img className='deck__card' src={DealerDeck} alt='Dealer deck'/>
                        <div className='deck__remainingCards'>
                            Cards: {remainingCards}
                        </div>
                    </div>
                </div>
            </div>
            <div className="row">
                <div className="col-10 col-lg-8">
                    <div className="row">
                        {success && (
                            <Card deck_id={deck_id} />
                        )}
                    </div>
                </div>
            </div>
            </>
        )
    }
}

export default Deck;