Felgenrechner

<script>
function getParameterByName(name) {
    const urlParams = new URLSearchParams(window.location.search);
    return urlParams.get(name);
}

function populateInputsFromURL() {
    var rv = getParameterByName('rv');
    var rn = getParameterByName('rn');
    var fv = getParameterByName('fv');
    var fn = getParameterByName('fn');
    var dv = getParameterByName('dv');
    var dn = getParameterByName('dn');

    if (rv) document.getElementById('rv').value = rv;
    if (rn) document.getElementById('rn').value = rn;
    if (fv) document.getElementById('fv').value = fv;
    if (fn) document.getElementById('fn').value = fn;
    if (dv) document.getElementById('dv').value = dv;
    if (dn) document.getElementById('dn').value = dn;

    check(); // To trigger the calculations and validation
}

function check() {
    var ok = 1;
    var regexr = /^([1-9][0-9][0-9])\/([1-9][0-9])[rR]([1-2][0-9])$/;
    if(regexr.test(document.getElementById('rv').value)){
        document.getElementById('rvstatus').className = 'success';
    } else {
        document.getElementById('rvstatus').className = 'error';
        ok = 0;
    }
    if(regexr.test(document.getElementById('rn').value)){
        document.getElementById('rnstatus').className = 'success';
    } else {
        document.getElementById('rnstatus').className = 'error';
        ok = 0;
    }
    var regexf = /^([1-9][0-9]?(?:\.[0-9])?)[xX]([1-2][0-9])[eE][tT](-?[0-9][0-9]?[0-9]?)$/;
    if(regexf.test(document.getElementById('fv').value)){
        document.getElementById('fvstatus').className = 'success';
    } else {
        document.getElementById('fvstatus').className = 'error';
        ok = 0;
    }
    if(regexf.test(document.getElementById('fn').value)){
        document.getElementById('fnstatus').className = 'success';
    } else {
        document.getElementById('fnstatus').className = 'error';
        ok = 0;
    }
    var regexd = /^([0-9]+)$/;
    if(regexd.test(document.getElementById('dv').value)){
        document.getElementById('dvstatus').className = 'success';
    } else {
        document.getElementById('dvstatus').className = 'error';
        ok = 0;
    }
    if(regexd.test(document.getElementById('dn').value)){
        document.getElementById('dnstatus').className = 'success';
    } else {
        document.getElementById('dnstatus').className = 'error';
        ok = 0;
    }
    if(ok==1){
        var [x, rvbreite, rvhoehe, rvzoll] = regexr.exec(document.getElementById('rv').value);
        var [x, rnbreite, rnhoehe, rnzoll] = regexr.exec(document.getElementById('rn').value);
        var [x, fvbreitezoll, fvzoll, fvet] = regexf.exec(document.getElementById('fv').value);
        var [x, fnbreitezoll, fnzoll, fnet] = regexf.exec(document.getElementById('fn').value);
        var [dv] = regexd.exec(document.getElementById('dv').value);
        var [dn] = regexd.exec(document.getElementById('dn').value);
        var rvflanke = rvbreite * rvhoehe / 1000;
        var rnflanke = rnbreite * rnhoehe / 1000;
        var rvzollcm = rvzoll * 2.54;
        var rvdurchmesser = rvzoll * 2.54 + rvflanke * 2;
        var rndurchmesser = rnzoll * 2.54 + rnflanke * 2;
        var rvumfang = (Math.PI * rvdurchmesser);
        var rnumfang = (Math.PI * rndurchmesser);
        var rdumfang = (rnumfang - rvumfang) / rvumfang * 100;
        var fvbreite = fvbreitezoll * 2.54;
        var fnbreite = fnbreitezoll * 2.54;
        var fvinnen = fvbreite / 2 + fvet / 10.0 - dv / 10.0;
        var fninnen = fnbreite / 2 + fnet / 10.0 - dn / 10.0;
        var fvaussen = fvbreite / 2 - fvet / 10.0 + dv / 10.0;
        var fnaussen = fnbreite / 2 - fnet / 10.0 + dn / 10.0;
        var rntacho = 100.0 * rvumfang / rnumfang;
        var rdtacho = (rntacho / 100 - 1) * 100;
        document.getElementById('rvdurchmesser').value = rvdurchmesser.toFixed(1);
        document.getElementById('rndurchmesser').value = rndurchmesser.toFixed(1);
        document.getElementById('rddurchmesser').value = (rndurchmesser - rvdurchmesser).toFixed(1);
        document.getElementById('rvumfang').value = rvumfang.toFixed(1);
        document.getElementById('rnumfang').value = rnumfang.toFixed(1);
        document.getElementById('rdumfang').value = rdumfang.toFixed(1);
        document.getElementById('fvbreite').value = fvbreite.toFixed(1);
        document.getElementById('fnbreite').value = fnbreite.toFixed(1);
        document.getElementById('fdbreite').value = (fnbreite- fvbreite).toFixed(1);
        document.getElementById('fvinnen').value = fvinnen.toFixed(1);
        document.getElementById('fninnen').value = fninnen.toFixed(1);
        document.getElementById('fdinnen').value = (fninnen- fvinnen).toFixed(1);
        document.getElementById('fvaussen').value = fvaussen.toFixed(1);
        document.getElementById('fnaussen').value = fnaussen.toFixed(1);
        document.getElementById('fdaussen').value = (fnaussen- fvaussen).toFixed(1);
        document.getElementById('rvtacho').value = (100.0).toFixed(1);
        document.getElementById('rntacho').value = rntacho.toFixed(1);
        document.getElementById('rdtacho').value = (rdtacho).toFixed(1);
    
        // Create URL with parameters
        document.getElementById('url').value = window.location.origin + window.location.pathname +
              "?rv=" + encodeURIComponent(document.getElementById('rv').value) +
              "&rn=" + encodeURIComponent(document.getElementById('rn').value) +
              "&fv=" + encodeURIComponent(document.getElementById('fv').value) +
              "&fn=" + encodeURIComponent(document.getElementById('fn').value) +
              "&dv=" + encodeURIComponent(document.getElementById('dv').value) +
              "&dn=" + encodeURIComponent(document.getElementById('dn').value);
    }
}
</script>

<div class="messageTableOverflow">
<table style="white-space: nowrap;">
    <thead>
        <tr>
            <th> </th>
            <th>Vorher</th>
            <th>Nachher</th>
            <th>Differenz</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Reifendimensionen <small>(z.B. 255/40R18).</small></td>
            <td><p class="success" role="status" id="rvstatus"><input type="text" id="rv" name="rv" value="245/45R18" class="" autocomplete="off" onkeyup="check()" onchange="check()"></p></td>
            <td><p class="success" role="status" id="rnstatus"><input type="text" id="rn" name="rn" value="265/40R19" class="" autocomplete="off" onkeyup="check()" onchange="check()"></p></td>
            <td> </td>
        </tr>
        <tr>
            <td>Felgendimensionen</td>
            <td><p class="success" role="status" id="fvstatus"><input type="text" id="fv" name="fv" value="8.5x18ET30" class="" autocomplete="off" onkeyup="check()" onchange="check()"></p></td>
            <td><p class="success" role="status" id="fnstatus"><input type="text" id="fn" name="fn" value="9.5x19ET30" class="" autocomplete="off" onkeyup="check()" onchange="check()"></p></td>
            <td> </td>
        </tr>
        <tr>
            <td>Distanzscheiben</td>
            <td><p class="success" role="status" id="dvstatus"><input type="text" id="dv" name="dv" value="0" class="" autocomplete="off" onkeyup="check()" onchange="check()">mm</td>
            <td><p class="success" role="status" id="dnstatus"><input type="text" id="dn" name="dn" value="0" class="" autocomplete="off" onkeyup="check()" onchange="check()">mm</td>
            <td> </td>
        </tr>
        <tr>
            <td>Reifendurchmesser</td>
            <td><input type="text" id="rvdurchmesser" name="rvdurchmesser" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="rndurchmesser" name="rndurchmesser" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="rddurchmesser" name="rddurchmesser" value="0" style="text-align:right;">cm</td>
        </tr>
        <tr>
            <td>Reifenabrollumfang</td>
            <td><input type="text" id="rvumfang" name="rvumfang" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="rnumfang" name="rnumfang" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="rdumfang" name="rdumfang" value="0" style="text-align:right;">%</td>
        </tr>
        <tr>
            <td>Felgenbreite</td>
            <td><input type="text" id="fvbreite" name="fvbreite" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fnbreite" name="fnbreite" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fdbreite" name="fdbreite" value="0" style="text-align:right;">cm</td>
        </tr>
        <tr>
            <td>Innenkante</td>
            <td><input type="text" id="fvinnen" name="fvinnen" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fninnen" name="fninnen" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fdinnen" name="fdinnen" value="0" style="text-align:right;">cm</td>
        </tr>
        <tr>
            <td>Au&szlig;enkante</td>
            <td><input type="text" id="fvaussen" name="fvaussen" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fnaussen" name="fnaussen" value="0" style="text-align:right;">cm</td>
            <td><input type="text" id="fdaussen" name="fdaussen" value="0" style="text-align:right;">cm</td>
        </tr>
        <tr>
            <td>Tachoabweichung</td>
            <td><input type="text" id="rvtacho" name="rvtacho" value="0" style="text-align:right;">km/h</td>
            <td><input type="text" id="rntacho" name="rntacho" value="0" style="text-align:right;">km/h</td>
            <td><input type="text" id="rdtacho" name="rdtacho" value="0" style="text-align:right;">%</td>
        </tr>
    </tbody>
    </table>
    <br/>
    <p>Link zum Kopieren: <input type="text" id="url" name="url" value="" style="width: 100%;"></p>
</div>
<script>window.onload = populateInputsFromURL;</script>