【JavaScript】間取り図から部屋の寸法を算出するツールを作ってみた！

const obj_btn = document.querySelector('#btn');
obj_btn.addEventListener('click', convSunpo);
const obj_input_area = document.querySelector('#input_area');
const obj_input_area_tatami = document.querySelector('#input_area_tatami');

// 寸法変換処理
function convSunpo() {
    // 定数値
    tatami_1area = 1.82405;

    // 入力値取得
    input_width = parseFloat($("#input_width").val());
    input_height = parseFloat($("#input_height").val());
    input_area = parseFloat($("#input_area").val());
    input_area_tatami = parseFloat($("#input_area_tatami").val());
    radio = document.getElementsByName('areaChkBox');
    
    // 入力チェック
    $("#err_message").text("　");
    if (!checkItem(input_width, "横幅")) {
        return;
    }
    if (!checkItem(input_height, "縦幅")) {
        return;
    }
    if (radio[0].checked) {
        if (!checkItem(input_area, "面積")) {
            return;
        }
    } else {
        if (!checkItem(input_area_tatami, "面積")) {
            return;
        }
        // 畳からm^2に変換
        input_area = input_area_tatami * tatami_1area;
    }

    // 寸法変換処理
    ratio = input_height / input_width;
    result_width = Math.sqrt(input_area / ratio);
    result_height = result_width * ratio;

    // 変換結果を格納
    $("#result_width").text(Math.round(result_width * 100) / 100);
    $("#result_height").text(Math.round(result_height * 100) / 100);
};

// 単項目チェック
function checkItem(val, name) {
    // 必須チェック
    if (val == null || val == "") {
        $("#err_message").text(name + "を入力してください。");
        return false;
    }
    // 数値チェック
    if (!isNumber(val) || val <= 0) {
        $("#err_message").text(name + "には0以上の数字を入力してください。");
        return false;
    }
    return true;
};

// 数値チェック（符号付き・小数）
function isNumber(val){
    var regex = new RegExp(/^[-+]?[0-9]+(\.[0-9]+)?$/);
    return regex.test(val);
};

// ラジオボタン切替処理
function changeRadio() {
    radio = document.getElementsByName('areaChkBox');
    if (radio[0].checked) {
        obj_input_area.removeAttribute("disabled");
        obj_input_area_tatami.setAttribute("disabled", true);
        obj_input_area.style.color = "black";
        obj_input_area_tatami.style.color = "gray";
    } else if (radio[1].checked) {
        obj_input_area.setAttribute("disabled", true);
        obj_input_area_tatami.removeAttribute("disabled");
        obj_input_area.style.color = "gray";
        obj_input_area_tatami.style.color = "black";
    }
};

// ページ読込時
window.onload = function () {
    changeRadio();
};

function convSunpo() {

・・・略・・・

    // 寸法変換処理
    ratio = input_height / input_width;
    result_width = Math.sqrt(input_area / ratio);
    result_height = result_width * ratio;

・・・略・・・

};

// 寸法変換処理
function convSunpo() {
    // 定数値
    tatami_1area = 1.82405;

・・・略・・・

        // 畳からm^2に変換
        input_area = input_area_tatami * tatami_1area;

・・・略・・・

};