<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Ultimate convert too</title>
	<style type="text/css">	
    	body {background-color: #404040; color: #bfbfbf}
        .maininput {background-color: #606060; color: #dedede; border: 2px solid #ffffff; width: 25%; transition-duration: 0.4s; border-radius: 0px; text-align: center;}
   		.maininput:hover {background-color: #ffffff; color: #000000; border: 2px solid #000000;}
        .output {border: 2px solid #ffffff; width: 80%; margin: auto; padding: 0px 1ch; cursor: copy;}
        button {background-color: #606060; color: #dedede; border: 2px solid #ffff00; width: 20%; transition-duration: 0.4s; border-radius: 0px; text-align: center;}
        button:hover {background-color: #ffffff; color: #000000; border: 2px solid #000000;}
        button:active {background-color: #ffff00; color: #000000; border: 2px solid #000000;}
    </style>
</head>

<body>

<div style="margin: auto; width: 80%; text-align: center;">
    <input id="in0" type="number" class="maininput" placeholder="Decimal num" inputmode="numeric" min="0" >
    <br>
    <br>
    <button onclick="thetable()">Caclulate</button>
    <br>
    <br>
    <script type="text/javascript">
        const version = "0.1";
        //this is just alternative version of ultimate convert

        function thetable() {
            if (document.getElementById("in0").value == "") {
                alert("The input is empty!");
            }
            else if(parseInt(document.getElementById("in0").value, 10) < 0) {
                alert("The input is out of range!");
                }
            else {        
                const decNumber = parseInt(document.getElementById("in0").value, 10);
                
                document.write("<table><tr><td>Numeral sys</td><td>Output num</td></tr>");
                for (let system = 2; system <= 40; system++) {             
                    let outputString = "";

                    let TempString = "";
                    let Temp0 = decNumber;
                    let Temp1 = 0;

                    document.write("<tr>");
                    document.write("<td>"+system+"</td>");
                    
                    while(Temp0 >= 1) {
                    Temp1 = Math.floor(Temp0%system);
                    Temp0 = Temp0/system;
                    if (Temp1 >= 10) {
                        TempString+=String.fromCharCode(87+Temp1);
                    }
                    else {
                        TempString+=Temp1;
                    }
                    }
                    for(let x = TempString.length-1;x >= 0;x--) {
                    outputString+=TempString[x];
                    }
                    document.write("<td>"+outputString+"</td>");
                    document.write("</tr>");
                }
                document.write("</table>");
            }
        }
    </script>

    <br>
    <p style="text-align: center;">Click on the box to copy.</p>
    <br>
    <br>
    <br>
    <h1 style="color: #ffff80;">This is still in development!</h1>
</div>

</body>


<script type="text/javascript">
/*
    function calculate() {
        if (document.getElementById("in0").value == "" || document.getElementById("in1").value == "") {
            alert("One of the inputs is empty!");
        }
        else if(parseInt(document.getElementById("in0").value, 10) < 0 || parseInt(document.getElementById("in1").value, 10) < 2) {
            alert("One of the inputs is out of range!");
        }
        else {
            const decNumber = parseInt(document.getElementById("in0").value, 10);
            const system = parseInt(document.getElementById("in1").value, 10);
            let outputString = "";

            let TempString = "";
            let Temp0 = decNumber;
            let Temp1 = 0;

            if(Temp0 == 0) {
                TempString+=0;
            }
            else {
                while(Temp0 >= 1) {
                    Temp1 = Math.floor(Temp0%system);
                    Temp0 = Temp0/system;
                    if (Temp1 >= 10) {
                        TempString+=String.fromCharCode(87+Temp1);
                    }
                    else {
                        TempString+=Temp1;
                    }
                }
            }

            for(let x = TempString.length-1;x >= 0;x--) {
                outputString+=TempString[x];
            }

            document.getElementById("out0").innerHTML = outputString;
        }
    }*/

    //copy output fce
    function copy(data) {
		navigator.clipboard.writeText(data);
    }

</script>
</html>