let elements = { radioA: document.getElementById('radioButtonA'), radioB: document.getElementById('radioButtonB'), fieldsetA: document.getElementById('inputTypeFieldsetA'), fieldsetB: document.getElementById('inputTypeFieldsetB'), imageA: document.getElementById('schemeImageA'), imageB: document.getElementById('schemeImageB'), inputsForm: document.getElementById('inputsForm'), equalSideLength: document.getElementById('equalSideLength'), equalSideLengthErr: document.getElementById('equalSideLengthErr'), baseAngle: document.getElementById('baseAngle'), baseAngleErr: document.getElementById('baseAngleErr'), baseSideLength: document.getElementById('baseSideLength'), baseSideLengthErr: document.getElementById('baseSideLengthErr'), baseAdjacentAngle: document.getElementById('baseAdjacentAngle'), baseAdjacentAngleErr: document.getElementById('baseAdjacentAngleErr'), outputsFieldset: document.getElementById('outputsFieldset'), outputR: document.getElementById('outputValuesR'), outputH: document.getElementById('outputValuesH'), outputL: document.getElementById('outputValuesL'), calculateButton: document.getElementById('calculateButton'), clearButton: document.getElementById('clearButton'), outputsTable: document.getElementById('outputsTable') } console.log("loaded js!"); let currentModeIsA = true; let outputFields = {}; let inputsA = { l: null, angle: null }; let inputsB = { l: null, angle: null }; function deg2rad(degrees) { return degrees * (Math.PI / 180); } function getCalculations() { let heights = [];//base related, side realted let lengths = [];// base side let radius = 0; let baseAngle=0; let sideAngle=0; if (currentModeIsA) { lengths[0]=2*Math.sin(deg2rad(inputsA.angle)/2)*inputsA.l; lengths[1]=inputsA.l; baseAngle=inputsA.angle; sideAngle=(180-baseAngle)/2; } else { lengths[0]=inputsB.l; lengths[1]=inputsB.l/(2*Math.cos(deg2rad(inputsB.angle))); sideAngle=inputsB.angle; baseAngle=180-2*sideAngle; } radius = Math.sqrt(((2 * lengths[1]) - lengths[0]) / ((2 * lengths[1]) - lengths[0])) * lengths[0] / 2; heights[0] = lengths[1] * Math.sin(deg2rad(sideAngle)); heights[1] = lengths[0] * Math.sin(deg2rad(baseAngle)); return { radius: radius, heights: heights, lengths: lengths }; } function updateCheckboxes() { outputFields["radius"] = elements.outputR.checked; outputFields["heights"] = elements.outputH.checked; outputFields["lengths"] = elements.outputL.checked; console.log("output fields:", outputFields) } function updateCalculateButton() { let ret = false; if (currentModeIsA) { ret = inputsA["l"] !== null && inputsA["angle"] !== null } else { ret = inputsB["l"] !== null && inputsB["angle"] !== null } console.log(inputsA, inputsB, ret); elements.calculateButton.disabled = !ret; } function switchAppearance(selectA) { if (selectA) { elements.imageA.classList.remove("hidden"); elements.imageB.classList.add("hidden"); elements.fieldsetA.classList.remove("hidden"); elements.fieldsetB.classList.add("hidden"); } else { elements.imageA.classList.add("hidden"); elements.imageB.classList.remove("hidden"); elements.fieldsetA.classList.add("hidden"); elements.fieldsetB.classList.remove("hidden"); } updateCalculateButton(); } function clearInputs() { if (currentModeIsA) { elements.equalSideLength.value = null; elements.baseAngle.value = null; inputsA = { l: null, angle: null }; } else { inputsB = { l: null, angle: null }; elements.baseSideLength.value = null; elements.baseAdjacentAngle.value = null; } elements.outputsTable.classList.add("hidden"); } elements.outputsFieldset.addEventListener('change', function (event) { if (event.target.type === 'checkbox') { updateCheckboxes(); } }); elements.inputsForm.addEventListener('change', function (event) { if (event.target.type === 'radio') { if (event.target.id[event.target.id.length - 1].toLowerCase() == "a") { currentModeIsA = true; switchAppearance(true); console.log("Switching inputs to A"); } else { currentModeIsA = false switchAppearance(false); console.log("Switching inputs to B"); } } else if (event.target.type === 'number') { switch (event.target.id) { case "equalSideLength": inputsA.l = parseFloat(event.target.value) || 0; break; case "baseAngle": inputsA.angle = parseFloat(event.target.value) || 0; break; case "baseSideLength": inputsB.l = parseFloat(event.target.value) || 0; break; case "baseAdjacentAngle": inputsB.angle = parseFloat(event.target.value) || 0; break; default: console.log(event.target.id) break; } updateCalculateButton(); } }); elements.clearButton.addEventListener('click', (event) => { event.preventDefault(); clearInputs() }); elements.calculateButton.addEventListener('click', (event) => { event.preventDefault(); console.log(getCalculations()); }); // чтобы не сконфузило updateCheckboxes(); switchAppearance(elements.radioA.checked);