자스스톤 응용

20.05.21 17:47 작성 조회수 140

0

초보자라 질문할 점이 참 많습니다. html파일은 깃허브에 있는 최종버전을 그대로 쓰는 상황입니다. js 파일은 카드 구성은 일단 했으나 구현 부분에 있어서는 주석으로 달아놓기는 했습니다만 function Card() 함수의 if문 부분을 어떻게 수정해야 하는지를 모르겠습니다. 일단 이 결과를 실행해보니 이런 결과가 나옵니다. 어떻게 수정해야 하나요?

function Gcard(nameatthpcost) {
    this.name = name;
    this.att = att;
    this.hp = hp;
    this.cost = cost;

}

var 알파 = new Card('알파'8351);
var 베타 = new Card('베타'90085706);
var 감마 = new Card('감마'5301);
var 오메가 = new Card('오메가'45075005);
var 제타 = new Card('제타'15702);
var 델타 = new Card('델타'74068505);
var 시그마 = new Card('시그마'6601);
var 람다 = new Card('람다'32031405);
var 라디안 = new Card('라디안'101702);
var 루트 = new Card('루트'11602);
var 엡실론 = new Card('엡실론'88091206);
var 파이 = new Card('파이'7401);
var  = new Card('로'6451);
var 타우 = new Card('타우'40030655);
var 오미크론 = new Card('오미크론'501803);
var 카파 = new Card('카파'402203);
var  = new Card('뮤'9851);
var  = new Card('뉴'1005503);
var 카이 = new Card('카이'15002562010);
var 프시 = new Card('프시'16202100010);

var 상대 = {
    영웅document.getElementById('rival-hero'),
    document.getElementById('rival-deck'),
    필드document.getElementById('rival-cards'),
    코스트document.getElementById('rival-cost'),
    덱data: [],
    영웅data: [],
    필드data: [],
    선택카드null,
    선택카드datanull,
};

var  = {
    영웅document.getElementById('my-hero'),
    document.getElementById('my-deck'),
    필드document.getElementById('my-cards'),
    코스트document.getElementById('my-cost'),
    덱data: [],
    영웅data: [],
    필드data: [],
    선택카드null,
    선택카드datanull,
};

상대.덱data.push(알파)
상대.덱data.push(시그마)
상대.덱data.push()
상대.덱data.push()
상대.덱data.push()
상대.덱data.push(파이)
상대.덱data.push(제타)
상대.덱data.push(오메가)
상대.덱data.push(엡실론)
상대.덱data.push(프시)
.덱data.push(델타)
.덱data.push(타우)
.덱data.push(람다)
.덱data.push(라디안)
.덱data.push(감마)
.덱data.push(오미크론)
.덱data.push(카파)
.덱data.push(루트)
.덱data.push(베타)
.덱data.push(카이)


var 턴버튼 = document.getElementById('turn-btn');
var  = true// true면 내턴, false면 니턴
function 덱에서필드로(데이터내턴) {
    var 객체 = 내턴 ?  : 상대// 조건 ? 참 : 거짓;
    var 현재코스트 = Number(객체.코스트.textContent);
    if (현재코스트 < 데이터.cost) {
        return 'end';
    }
    var idx = 객체.덱data.indexOf(데이터);
    객체.덱data.splice(idx1);
    객체.필드data.push(데이터);
    객체..innerHTML = '';
    필드다시그리기(객체);
    덱다시그리기(객체);
    데이터.field = true;
    객체.코스트.textContent = 현재코스트 - 데이터.cost;
}

function 필드다시그리기(객체) {
    객체.필드.innerHTML = '';
    객체.필드data.forEach(function(data) {
        카드돔연결(data, 객체.필드);
    });
}

function 덱다시그리기(객체) {
    객체..innerHTML = '';
    객체.덱data.forEach(function(data) {
        카드돔연결(data, 객체.);
    });
    데이터.field = true;
    객체.코스트.textContent = 현재코스트 - 데이터.cost;
}

function 영웅다시그리기(객체) {
    객체.영웅.innerHTML = '';
    카드돔연결(객체.영웅data, 객체.영웅true);
}

function 화면다시그리기(내화면) {
    var 객체 = 내화면 ?  : 상대// 조건 ? 참 : 거짓;
    필드다시그리기(객체);
    덱다시그리기(객체);
    영웅다시그리기(객체);
}

function 턴액션수행(카드데이터내턴) {
    // 턴이 끝난 카드면 아무일도 일어나지 않음
    var 아군 = 내턴 ?  : 상대;
    var 적군 = 내턴 ? 상대 : ;
    if (카드.classList.contains('card-turnover')) {
        return;
    }
    // 적군 카드면서 아군 카드가 선택되어 있고, 또 그게 턴이 끝난 카드가 아니면 공격
    var 적군카드 = 내턴 ? !데이터.mine : 데이터.mine;
    if (적군카드 && 아군.선택카드) {
        데이터.hp = 데이터.hp - 아군.선택카드data.att;
        if (데이터.hp <= 0) { // 카드가 죽었을 때
            var 인덱스 = 적군.필드data.indexOf(데이터);
            if (인덱스 > -1) { // 쫄병이 죽었을 때
                적군.필드data.splice(인덱스1);
            } else { // 영웅이 죽었을 때
                alert('승리하셨습니다!');
                초기세팅();
            }
        }
        화면다시그리기(!내턴);
        아군.선택카드.classList.remove('card-selected');
        아군.선택카드.classList.add('card-turnover');
        아군.선택카드 = null;
        아군.선택카드data = null;
        return;
    } else if (적군카드) { // 상대 카드면
        return;
    }
    if (데이터.field) { // 카드가 필드에 있으면
        카드.parentNode.querySelectorAll('.card').forEach(function(card) {
            card.classList.remove('card-selected');
        });
        카드.classList.add('card-selected');
        아군.선택카드 = 카드;
        아군.선택카드data = 데이터;
    } else { // 덱이 있으면
        if (덱에서필드로(데이터내턴) !== 'end') {
            내턴 ? 내덱생성(1) : 상대덱생성(1);
        }
    }
}

function 카드돔연결(데이터영웅) {
    var 카드 = document.querySelector('.card-hidden .card').cloneNode(true);
    카드.querySelector('.card-cost').textContent = 데이터.cost;
    카드.querySelector('.card-att').textContent = 데이터.att;
    카드.querySelector('.card-hp').textContent = 데이터.hp;
    if (영웅) {
        카드.querySelector('.card-cost').style.display = 'none';
        var 이름 = document.createElement('div');
        이름.textContent = '영웅';
        카드.appendChild(이름)
    }
    카드.addEventListener('click'function() {
        if () { // 내 턴이면
            if (!데이터.mine || 데이터.field) { // 상대 카드거나 카드가 필드에 있으면
                return;
            }
            if (덱에서필드로(데이터true) !== 'end') {
                내덱생성(1);
            }
        } else { // 상대 턴인데
            if (데이터.mine || 데이터.field) { // 내 카드거나 카드가 필드에 있으면
                return;
            }
            if (덱에서필드로(데이터false) !== 'end') {
                상대덱생성(1);
            }
        }
        턴액션수행(카드데이터);
    });
    .appendChild(카드);
}

function 상대덱생성(개수) {
    for (var i = 0i < 개수i++) {
        상대.덱data.push(카드공장());
    }
    상대..innerHTML = '';
    상대.덱data.forEach(function(data) {
        카드돔연결(data, 상대.);
    });
    덱다시그리기(상대);
}

function 내덱생성(개수) {
    for (var i = 0i < 개수i++) {
        .덱data.push(카드공장(falsetrue));
    }
    ..innerText = '';
    .덱data.forEach(function(data) {
        카드돔연결(data, .);
    });
    덱다시그리기();
}

function 내영웅생성() {
    .영웅data = 카드공장(truetrue);
    카드돔연결(.영웅data, .영웅true);
}

function 상대영웅생성() {
    상대.영웅data = 카드공장(true);
    카드돔연결(상대.영웅data, 상대.영웅true);
}

function Card(영웅내카드) {
    if (영웅) {
        this.att = Math.ceil(Math.random()) + 4;
        this.hp = Math.ceil(Math.random()) + 9999//영웅영역 - 값 1개만 출력되야 함(실행시 10개 나옴)-공격력 5 체력 10000의 고정값
        this.hero = true;
        this.field = true;
    } else {
        this.att = Math.ceil(Math.random() * 5);
        this.hp = Math.ceil(Math.random() * 5); //카드영역- 각 팀당 미리 셋팅 된 10개의 고유 카드 중 5개 랜덤으로 뽑히게 해야함
        this.cost = Math.floor((this.att + this.hp) / 2);
    }
    if (내카드) {
        this.mine = true;
    }
}

function 카드공장(영웅내카드) {
    return new Card(영웅내카드);
}

function 초기세팅() {
    상대덱생성(5);
    내덱생성(5);
    내영웅생성();
    상대영웅생성();
    화면다시그리기(true); // 상대화면
    화면다시그리기(false); // 내화면
}

턴버튼.addEventListener('click'function() {
     = !;
    var 객체 =  ?  : 상대;
    document.getElementById('rival').classList.toggle('turn');
    document.getElementById('my').classList.toggle('turn');
    필드다시그리기(객체);
    영웅다시그리기(객체);
     = !// 턴을 넘기는 코드
    if () {
        .코스트.textContent = 10;
    } else {
        상대.코스트.textContent = 10;
    }
    document.getElementById('rival').classList.toggle('turn');
    document.getElementById('my').classList.toggle('turn');
});

초기세팅();

답변 1

답변을 작성해보세요.

0

구현하고자 하는 바가 서로 다른 10장의 카드를 가진 두 영웅(플레이어는 공평하게 공격력 5 체력 10000으로 고정)이 덱에 랜덤하게 생성되는 자신의 10장 중 5장의 카드를 전략적으로 활용한 대결구도를 만들고 싶습니다