<!DOCTYPE html>
<html>
<head>
<!-- Notes: This should be open in its original path-->
<meta charset="utf-8">
<meta name="zoraxy.csrf.Token" content="{{.csrfToken}}">
<link rel="stylesheet" href="../script/semantic/semantic.min.css">
<script src="../script/jquery-3.6.0.min.js"></script>
<script src="../script/semantic/semantic.min.js"></script>
<script src="../script/utils.js"></script>
</head>
<body>
<link rel="stylesheet" href="../darktheme.css">
<script src="../script/darktheme.js"></script>
<br>
<div class="ui container">
<div class="ui header">
<div class="content">
Alias Hostname
<div class="sub header epname"></div>
</div>
</div>
<div class="ui divider"></div>
<div class="scrolling content ui form">
<div id="inlineEditBasicAuthCredentials" class="field">
<p>Enter alias hostname or wildcard matching keywords for <code class="epname"></code></p>
<table class="ui very basic compacted unstackable celled table">
<thead>
<tr>
<th>Alias Hostname</th>
<th>Remove</th>
</tr></thead>
<tbody id="inlineEditTable">
<tr>
<td colspan="2"><i class="ui green circle check icon"></i> No Alias Hostname</td>
</tr>
</tbody>
</table>
<div class="ui divider"></div>
<div class="three small fields">
<div class="field">
<label>Alias Hostname</label>
<input id="aliasHostname" type="text" placeholder="alias.mydomain.com" autocomplete="off">
<small>Support wildcards e.g. alias.mydomain.com or *.alias.mydomain.com</small>
</div>
<div class="field" >
<button class="ui basic button" onclick="addAliasToRoutingRule();"><i class="green add icon"></i> Add Alias</button>
</div>
<div class="ui divider"></div>
</div>
</div>
</div>
<div class="ui divider"></div>
<div class="field" >
<button class="ui basic button" style="float: right;" onclick="closeThisWrapper();">Close</button>
</div>
</div>
<br><br><br><br>
</div>
<script>
let aliasList = [];
let editingEndpoint = {};
if (window.location.hash.length > 1){
let payloadHash = window.location.hash.substr(1);
try{
payloadHash = JSON.parse(decodeURIComponent(payloadHash));
$(".epname").text(payloadHash.ep);
editingEndpoint = payloadHash;
}catch(ex){
console.log("Unable to load endpoint data from hash")
}
}
function initAliasNames(){
$.cjax({
url: "/api/proxy/detail",
method: "POST",
data: {
"type":"host",
"epname": editingEndpoint.ep
},
success: function(data){
if (data.error != undefined){
//This endpoint not exists?
alert(data.error);
return;
}else{
$("#inlineEditTable").html("");
if (data.MatchingDomainAlias != undefined){
aliasList = data.MatchingDomainAlias;
renderAliasList();
}else{
//Assume no alias
$("#inlineEditTable").html(`<tr>
<td colspan="2"><i class="ui green circle check icon"></i> No Alias Hostname</td>
</tr>`);
}
}
}
})
}
initAliasNames();
function removeAliasDomain(targetDomain){
aliasList.splice(aliasList.indexOf(targetDomain), 1);
saveCurrentAliasList(function(data){
if (data.error != undefined){
parent.msgbox(data.error);
}else{
initAliasNames();
parent.msgbox("Alias hostname removed")
}
});
}
function addAliasToRoutingRule(){
let newAliasHostname = $("#aliasHostname").val().trim();
aliasList.push(newAliasHostname);
$("#aliasHostname").val("");
saveCurrentAliasList(function(data){
if (data.error != undefined){
parent.msgbox(data.error);
}else{
parent.msgbox("New alias hostname added")
initAliasNames();
}
});
}
function saveCurrentAliasList(callback=undefined){
$.cjax({
url: "/api/proxy/setAlias",
method: "POST",
data:{
"ep":editingEndpoint.ep,
"alias": JSON.stringify(aliasList)
},
success: function(data){
if (callback != undefined){
callback(data);
}
if (data.error == undefined && parent != undefined && parent.document != undefined){
//Try to update the parent object's rules if exists
parent.updateAliasListForEndpoint(editingEndpoint.ep, aliasList);
}
}
})
}
function renderAliasList(){
$("#inlineEditTable").html("");
aliasList.forEach(aliasDomain => {
let domainLink = `<a href="//${aliasDomain}" target="_blank">${aliasDomain}</a>`
if (aliasDomain.includes("*")){
//This is a wildcard hostname
domainLink = aliasDomain;
}
$("#inlineEditTable").append(`<tr>
<td>${domainLink}</td>
<td><button class="ui basic button" onclick="removeAliasDomain('${aliasDomain}');"><i class="red remove icon"></i> Remove</button></td>
</tr>`);
});
if (aliasList.length == 0){
$("#inlineEditTable").html(`<tr>
<td colspan="2"><i class="ui green circle check icon"></i> No Alias Hostname</td>
</tr>`);
}
}
function closeThisWrapper(){
parent.hideSideWrapper(true);
}
</script>
</body>
</html>