QB狩りスコア計算機

by ethertank

HTML

<h1>スコア計算機</h1>
<form id="calculater" onsubmit="return false">
<div>
    <label for="wave">Wave</label>:
    <input id="wave" type="number" value="60" min="1" max="1000" />
</div>
<div>
    <label for="luck">幸運</label>:
    <input id="luck" type="number" value="200" min="10" max="250" autocomplete="on" list="luckpreset" />
</div>
<div>
    <label for="wave">撃退数</label>:
    <input id="qb" type="number" value="550" min="0" />
</div>
<div>
    <output id="result">スコア :</output>
</div>
</form>

<datalist id="luckpreset">
    <option value="100">デフォルト</option>
    <option value="120">まどっちデフォルト</option>
    <option value="134">概ピス</option>
    <option value="136">概ピス</option>
    <option value="138">概ピス</option>
    <option value="140">概ピス</option>
    <option value="154">まどっち概ピス</option>
    <option value="156">まどっち概ピス</option>
    <option value="158">まどっち概ピス</option>
    <option value="160">まどっち概ピス</option>
    <option value="170">マミ50%武器確クリ</option>
    <option value="178">マミ48%武器確クリ</option>
    <option value="189">マミ45%武器確クリ</option>
    <option value="194">マミ44%武器確クリ</option>
    <option value="198">マミ43%武器確クリ</option>
    <option value="200">50%武器確クリ</option>
    <option value="209">まど神48%武器確クリ</option>
    <option value="223">まど神45%武器確クリ</option>
    <option value="228">まど神44%武器確クリ</option>
    <option value="233">まど神43%武器確クリ</option>
    <option value="239">まど神42%武器確クリ</option>
    <option value="244">まど神41%武器確クリ</option>
    <option value="250">まど神40%武器確クリ</option>
</datalist>

CSS

html {
    font-family:
        "hiragino kaku gothic pro w3",
        meiryo,
        sans-serif;
}
h1 {
    font-size: 1.125em;
}

label {
    display: inline-block;
    width: 3em;
    text-align: right;
}
input[type=number] {
    width: 6em;
}

input:-webkit-autofill {
    box-shadow: inset 0 0 0 1000px #fff;
}

JavaScript

/*
スコアの計算式
(到達Wave × 20 + QB撃退数) × 幸運 / 100

撃退数が到達Waveより低い場合、強制的にスコアは0になり(ボンクラ不可避)、
撃退数が到達Wave×5より低い場合、その分だけスコアは下方修正される

スコアペナルティ
(スコア計算式のスコア × QB撃退数 / (到達Wave × 5) )
*/

var d = document;
var calculater = d.getElementById("calculater");
var output = d.getElementById("result");

function calc() {
    var wave = d.getElementById("wave").value - 0;
    var luck = d.getElementById("luck").value - 0;
    var qb = d.getElementById("qb").value - 0;
    var score = 0;

    if (wave < qb) {
        score = (wave * 20 + qb) * luck / 100;
        if (qb < (wave * 5)) {
            score = score * qb / (wave * 5);
        }
    }

    output.textContent = "スコア:" + Math.floor(score);
}

calc();
calculater.oninput = calc;