Newer
Older
Skillsemi2023_WEB_Otaki_Nemoto / flask / testapp / static / javascript / beautyVote.js

class Question{
    constructor(){
        this.question = 0;
        this.answer = 0;
        this.choiceA = 0;
        this.choiceB = 0;
        this.choiceC = 0;
        this.choiceD = 0;
    }
    join(question, answer, choiceA, choiceB, choiceC, choiceD){
        this.question = question;
        this.answer = answer;
        this.choiceA = choiceA;
        this.choiceB = choiceB;
        this.choiceC = choiceC;
        this.choiceD = choiceD;
    }
}

class Player{
    constructor(){
        this.points = [-1, -1, -1, -1, -1, -1, -1, -1, -1, -1];
        this.choice = 0;
        this.name = 0;
        this.number = 0;
    }
    calcScore(){
        var score = 0;
        for(var i = 0; i < MAX_ROUND; i ++){
            if(this.points[i] == CORRECT){
                score ++;
            }
        }
        return score;
    }
}


function setup(){
    canvasSize(960, 1200);
    lineW(3);
    timer = 0;
    setQuestion(round);
}


function mainloop(){
    timer ++;
    
    switch(scene){

        case START_SCENE:
            inputName();
            break;
            

        case GAME_SCENE:
            //ゲーム画面を表示
            showQuestion();

            //制限時間を過ぎた場合にはEを選択
            if(timer > TIME_LIMIT){
                player.choice = E;
                sendChoice()
                break;
            }
            
            if(tapC == 1){
                tapC ++;

                if(50 <= tapX && tapX <= 450 && 300 <= tapY && tapY <= 550){
                    player.choice = A;
                    sendChoice();
                }
                else if(500 <= tapX && tapX <= 900 && 300 <= tapY && tapY <= 550){
                    player.choice = B;
                    sendChoice();
                }   
                else if(50 <= tapX && tapX <= 450 && 600 <= tapY && tapY <= 850){
                    player.choice = C;
                    sendChoice();
                }   
                else if(500 <= tapX && tapX <= 900 && 600 <= tapY && tapY <= 850){
                    player.choice = D;
                    sendChoice();
                }
            } 
            break;

        //集計結果待ち
        case WAIT_SCENE:
            WaitOthers() // 他のプレイヤーが終わるまで待機する画面
            if(timer > 30){
                timer = 0;
                CheckOthers() // 他のプレイヤーが終わるまで待機する処理
            }
            break;
        

        //最終集計結果待ち
        case WAIT_RESULT:
            if(timer > 30){
                timer = 0; 
                CheckResult();  //順位表を受け取るための処理
            }
        //結果表示
        case RESULT_SCENE:
            showResult();
            break;
    
    }
}


function setQuestion(round){
    question[round].join(questions[round], answer[round], choices[round][A], choices[round][B], choices[round][C], choices[round][D]);
}


function checkAnswer(){
    if(player.choice == question[round].answer){
        player.points[round] = CORRECT;
    }
    else{
        player.points[round] = WRONG;
    }
    round ++;
    if(round < MAX_ROUND){
        setQuestion(round);
    }
}

//スコアと識別番号をサーバーに送信する処理
function postForm(){
    xhr.open('POST', '/form');
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    //識別番号とスコアを送信
    xhr.send('number='+player.number + '&score=' + player.calcScore()); //変更
    //WAITコードを受信
    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
            if(xhr.responseText!="Data received successfully"){
                console.log(xhr.responseText);
            }
            else{
                console.log(xhr.responseText);
            }
        }
    }
}

//選択をサーバーに送信する処理
function sendChoice(){
    timer = 0;
    scene = WAIT_SCENE;
    xhr.open('POST', '/form');
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    //選択を送信
    xhr.send('choice=' + player.choice); 
    //WAITコードを受信
    xhr.onreadystatechange = function() { 
        if (xhr.readyState === 4 && xhr.status === 200) {
            if(xhr.responseText!="Data received successfully"){
                console.log(xhr.responseText);
            }
            else{
                console.log(xhr.responseText);
            }
        }
    }
}

//ユーザーネームをサーバーに送信する処理
function sendName(){
    xhr.open('POST', '/form');
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    //ユーザーネームを送信
    xhr.send('username=' + player.name); 
    //識別番号を受信
    xhr.onreadystatechange = function() { 
        if (xhr.readyState === 4 && xhr.status === 200) {
            if(xhr.responseText!="Data received successfully"){
                console.log("識別番号:" + xhr.responseText);
                player.number = xhr.responseText;
            }
            else{
                console.log(xhr.responseText);
            }
        }
    }
}

// 集計結果待機中処理
function CheckOthers(){
    xhr.open('POST', '/form');
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    //待機コード送信
    xhr.send('checkothers=' + "check"); 
    xhr.onreadystatechange = function() { 
        if (xhr.readyState === 4 && xhr.status === 200) {
            if(xhr.responseText=="WAIT"){
                console.log(xhr.responseText);
            }
            //正解選択肢を取得
            else{
                timer = 0;
                console.log(xhr.responseText);
                question[round].answer = xhr.responseText;
                //正解判定
                checkAnswer();
                if(round < MAX_ROUND)
                    scene = GAME_SCENE
                //最終ラウンド終了時
                else{
                    scene = WAIT_RESULT
                    postForm();
                }
            }
        }
    }
}

//最終集計結果(順位表)待機処理
function CheckResult(){
    xhr.open('POST', '/form');
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    //待機コードを送信
    xhr.send('checkResult=' + "check"); 
    xhr.onreadystatechange = function() { 
        if (xhr.readyState === 4 && xhr.status === 200) {
            if(xhr.responseText=="WAIT"){
                console.log(xhr.responseText);
            }
            //順位表を受信
            else{
                orderTable = xhr.responseText;
                scene = RESULT_SCENE;
            }
        }
    }
}


var xhr = new XMLHttpRequest();


var round = 0;   //変更
var MAX_ROUND = 1;

var timer = 0;
var TIME_LIMIT = 900;

var A = 0;
var B = 1;
var C = 2;
var D = 3;
var E = 4;

var CORRECT = 1;
var WRONG = 0;

var START_SCENE = 1;
var GAME_SCENE = 2;
var RESULT_SCENE = 3;
var WAIT_SCENE = 4; // nemoto追記
var WAIT_RESULT = 5;

var scene = START_SCENE;

var orderTable = "";


var my_order = 8;
var ranking_order = ["ルフィ", "ゾロ", "ジンベエ", "サンジ", "ロビン", "ウソップ", "フランキー", "ブルック", "ナミ", "チョッパー"]
var scoreing_order = [3000000000,1110000000, 1100000000, 1032000000, 930000000, 500000000, 394000000, 383000000, 366000000, 1000]
var MAX_ORDER = 10;

var question = new Array(MAX_ROUND);
for(var i = 0; i < MAX_ROUND+1; i ++){
    question[i] = new Question();
}

var player = new Player();


var questions = ["「にっこり」の対義語は?",
                "もっとも年齢が高いのは?", 
                "中国語で「勉強」意味は?",
                "焼き肉の「テッポウ」はどこの部位?",
                "アフリカ大陸でもっとも面積が大きい国は?",
                "実在する生き物は?",
                "カスタネットの名前の由来となったものは?",
                "名前が人物に由来しているのは?", 
                "ジンベイザメは英語で何シャーク?",
                "心臓がない生き物は?"];

var answer = [C, A, B, B, C, C, C, C, B, B];

var choices = [["がっくり", "げっそり", "むっつり", "しっとり"],
                ["ドナルド・トランプ", "ボリス・ジョンソン", "ウラジーミル・プーチン", "アンゲラ・メルケル"],
                ["喧嘩っ早い", "無理やり", "細かい", "意地悪な"],
                ["食道", "直腸", "こめかみ", "胃袋"],
                ["エチオピア", "リビア", "アルジェリア", "ケニア"],
                ["キリンコウモリ", "ライオンコウモリ", "ウサギコウモリ", "オオカミコウモリ"],
                ["ハサミの刃", "貝の殻", "栗の実", "両手"],
                ["そら豆", "えんどう豆", "いんげん豆", "ひよこ豆"],
                ["エレファント", "ホエール", "ダイナソー", "メガ"],
                ["カニ", "ナマコ", "タコ", "ホタテ"]];


// 送信用
// var form = document.createElement('form');
// var request = document.createElement('input');