Zoraxy/web/components/rproot.html

<div class="standardContainer">
    <div class="ui basic segment">
        <h2>Set Proxy Root</h2>
        <p>The default routing point for all incoming traffics. For all routing not found in the proxy rules, request will be redirected to the proxy root server.</p>
        <div class="ui form">
            <div class="field">
                <label>Proxy Root</label>
                <input type="text" id="proxyRoot" onchange="checkRootRequireTLS(this.value);">
                <small>E.g. localhost:8080</small>
            </div>
            <div class="field">
                <div class="ui checkbox">
                    <input type="checkbox" id="rootReqTLS">
                    <label>Root require TLS connection <br><small>Check this if your proxy root URL starts with https://</small></label>
                </div>
            </div>
            <br>
            <button class="ui basic button" onclick="setProxyRoot()"><i class="teal home icon" ></i> Update Proxy Root</button>
            <div class="ui divider"></div>
            <div class="field">
                <h4>Root Routing Options</h4>
            </div>
            <div class="field">
                <div class="ui checkbox">
                    <input type="checkbox" id="unsetRedirect">
                    <label>Enable redirect for unset subdomains <br><small>Redirect subdomain that is not found to custom domain</small></label>
                </div>
            </div>
            <div class="ui basic segment" id="unsetRedirectDomain" style="background-color: #f7f7f7; border-radius: 1em; margin-left: 2em; padding-left: 2em; display:none;">
                <div style="
                    position: absolute;
                    top:0;
                    left: 1em;
                    width: 0px;
                    height: 0px;
                    margin-top: -10px;
                    border-left: 10px solid transparent;
                    border-right: 10px solid transparent;
                    border-bottom: 10px solid #f7f7f7;">

                </div>
                <div class="field">
                    <label>Redirect target domain</label>
                    <div class="ui input">
                        <input type="text" placeholder="http://example.com">
                    </div>
                    <p>Unset subdomain will be redirected to the link above. Remember to include the protocol (e.g. http:// or https://)</p>
                </div>
            </div>
            <div class="field">
                <div class="ui checkbox">
                    <input type="checkbox" id="disableRootTLS">
                    <label>Disable https on proxy root <br><small>Check this if you want your proxy root to bypass global TLS setting (Not Recommend)</small></label>
                </div>
            </div>
            <br>
            <button class="ui basic button" onclick="updateRootOptions()"><i class="blue save icon" ></i> Save Root Options</button>
        </div>
        <br>
        
    </div>
</div>
<script>
    $("#advanceRootSettings").accordion();

    function initRootInfo(){
        $.get("/api/proxy/list?type=root", function(data){
            if (data == null){

            }else{
                $("#proxyRoot").val(data.Domain);
                checkRootRequireTLS(data.Domain);
            }
        });

        
    }
    initRootInfo();

    function updateRootSettingStates(){
        $.get("/api/cert/tls", function(data){
            if (data == true){
                $("#disableRootTLS").parent().removeClass('disabled').attr("title", "");
            }else{
                $("#disableRootTLS").parent().addClass('disabled').attr("title", "TLS listener is not enabled");
            }
        });
    }
    //Bind event to tab switch
    tabSwitchEventBind["setroot"] = function(){
        //On switch over to this page, update root info
        updateRootSettingStates();
    }

    //Toggle the display status of the input box for domain setting
    function updateRedirectionDomainSettingInputBox(useRedirect){
        if(useRedirect){
            $("#unsetRedirectDomain").stop().finish().slideDown("fast");
        }else{
            $("#unsetRedirectDomain").stop().finish().slideUp("fast");
        }
    }

    function checkCustomRedirectForUnsetSubd(){
        $("#unsetRedirect").on("change", function(){
            let useRedirect = $(this)[0].checked;
            updateRedirectionDomainSettingInputBox(useRedirect);
            
        })
    }
    checkCustomRedirectForUnsetSubd();

    function checkRootRequireTLS(targetDomain){
        //Trim off the http or https from the origin
        if (targetDomain.startsWith("http://")){
            targetDomain = targetDomain.substring(7);
            $("#proxyRoot").val(targetDomain);
        }else if (targetDomain.startsWith("https://")){
            targetDomain = targetDomain.substring(8);
            $("#proxyRoot").val(targetDomain);
        }
       $.ajax({
            url: "/api/proxy/tlscheck",
            data: {url: targetDomain},
            success: function(data){
                if (data.error != undefined){

                }else if (data == "https"){
                    $("#rootReqTLS").parent().checkbox("set checked");
                }else if (data == "http"){
                    $("#rootReqTLS").parent().checkbox("set unchecked");
                }

                
            }
       })
    }


    function setProxyRoot(){
        var newpr = $("#proxyRoot").val();
        if (newpr.trim() == ""){
            $("#proxyRoot").parent().addClass('error');
            return
        }else{
            $("#proxyRoot").parent().removeClass('error');
        }

        var rootReqTls = $("#rootReqTLS")[0].checked;

        //Create the endpoint by calling add
        $.ajax({
            url: "/api/proxy/add",
            data: {"type": "root", tls: rootReqTls, ep: newpr},
            success: function(data){
                if (data.error != undefined){
                    alert(data.error);
                }else{
                    //OK
                    initRootInfo();
                    msgbox("Proxy Root Updated")
                }
            }
        });

    }

    function updateRootOptions(){
        const jsonData = {
            
        };

        $.ajax({
            type: "POST",
            url: "/api/proxy/root/updateOptions",
            contentType: "application/json",
            data: JSON.stringify(jsonData),
            success: function(response) {
                console.log("Success:", response);
            },
            error: function(error) {
                console.log("Error:", error);
            }
        });
    }
</script>