cards 01

function solve() {
    // <section class="cards"> - това е parenta в нашия template
    let workingDiv = document.getElementById("exercise");
    const elTagSearched="IMG";
    const playerOneDiv="player1Div";
    const playerTwoDiv="player2Div";
    workingDiv.addEventListener("click",(e)=>ClickOnCard(e));
    let cardHand=[];
        function ClickOnCard(event)
        {
            let card=event.target;
            let cardElementTag=card.tagName;
            let parent=card.parentNode.id;
            card.src="images/whiteCard.jpg";
            cardHand.push(card);
            if(cardElementTag==elTagSearched){
                let value=Number(card.name);
                let round= SetCardValueInResult(value,parent);
                SetTimeOutFinishRoundSetBorders(round);
            }
        }
        function SetCardValueInResult(value,parent){
            let resultDiv=document.getElementById("result");
            let resultSpans=resultDiv.children;
            if(parent==playerOneDiv){
                resultSpans[0].innerText=value;
            }
            if(parent==playerTwoDiv){
                resultSpans[2].innerText=value;
            }
            if(resultSpans[0].innerText!=="" && resultSpans[2].innerText!==""){
                return true;
            }
            return false;
        }
        function SetTimeOutFinishRoundSetBorders(round){
            if(round==false){return;}
            let resultDiv=document.getElementById("result");
            let resultSpans=resultDiv.children;
            let resultPlayerOne=Number(resultSpans[0].innerText);
            let resultPlayerTwo=Number(resultSpans[2].innerText);
            // честно тук не тримваме очаквания резутат и трябва да добавям space в стринга
            let result=`[${resultPlayerOne} vs ${resultPlayerTwo}] `;
            // border case you hit equal cards and only loser get colored so changed to >=
            let winner=resultPlayerOne>=resultPlayerTwo;
            SetCardBorders(winner,cardHand);
            //[x vs y]
            let historyDiv=document.getElementById("history");
            let newHistoryDiv=document.createElement("span");
            newHistoryDiv.innerText=result;
            //тук се оказа че просто добавяме стринга,не деца та да и това беше забавно.
           //historyDiv.appendChild(newHistoryDiv);
            historyDiv.innerHTML+=result;
            let clearHand=clearResult();
            setTimeout(clearHand,2000);

        }
        function clearResult(){
            let resultDiv=document.getElementById("result");
            let resultSpans=resultDiv.children;
            resultSpans[0].innerText="";
            resultSpans[2].innerText="";
        }
        function SetCardBorders(winner,cardHand){

            if(winner){
                cardHand[0].style.border="2px solid green";
                cardHand[1].style.border="2px solid darkred";
            }
            else{
                cardHand[1].style.border="2px solid green";
                cardHand[0].style.border="2px solid darkred";
            }
            cardHand.length=0;
        }
}