bivashy/Blitz-Proxy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add NormalSub subpath configuration to settings UI

Browse Source 
Adds a 'Configure' tab to the Normal Subscriptions section in Settings.
This tab allows users to view and edit the subpath for the NormalSub service.

- Modified settings.html:
  - Added new tab link and pane for NormalSub subpath configuration.
  - Tab is only visible and accessible if NormalSub service is active.
- Extended JavaScript:
  - `sendRequest` function now accepts an optional `postSuccessCallback`.
  - Added `isValidSubPath` for client-side validation.
  - `updateServiceUI` now manages visibility of the 'Configure' tab and fetches current subpath.
  - Implemented `fetchNormalSubPath` to get subpath via API.
  - Implemented `editNormalSubPath` to save subpath via API.
  - Integrated new input into `validateForm` and added real-time validation.
- Updated `updateDecoyStatusUI` and its calls from `setupDecoy`/`stopDecoy` to use the new `postSuccessCallback` pattern for consistency.
- Standardized form IDs (e.g., `telegram_form`, `port_form`) for better targeting in `validateForm` and `updateServiceUI`.
This commit is contained in:
Whispering Wind
2025-05-18 11:25:29 +03:30
committed by GitHub
parent 3cb8022c7c
commit ec6610571d
1 changed files with 188 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

226
core/scripts/webpanel/templates/settings.html
View File

@ -71,14 +71,18 @@
<ul class='nav nav-tabs' id='subs-tabs' role='tablist'>
<li class='nav-item'>
<a class='nav-link active' id='normal-tab' data-toggle='tab' href='#normal' role='tab'
aria-controls='normal' aria-selected='false'><strong>Normal</strong></a>
aria-controls='normal' aria-selected='true'><strong>Normal</strong></a>
</li>
<li class='nav-item normal-sub-config-tab-li' style="display: none;"> <!-- Initially hidden -->
<a class='nav-link' id='normal-sub-config-link-tab' data-toggle='tab' href='#normal-sub-config-content' role='tab'
aria-controls='normal-sub-config-content' aria-selected='false'><strong>Configure</strong></a>
</li>
</ul>
<div class='tab-content' id='subs-tabs-content'>
<br>
<!-- Normal Sub Tab -->
<!-- Normal Sub Service Control Tab -->
<div class='tab-pane fade show active' id='normal' role='tabpanel' aria-labelledby='normal-tab'>
<form id="normal">
<form id="normal_sub_service_form">
<div class='form-group'>
<label for='normal_domain'>Domain:</label>
<input type='text' class='form-control' id='normal_domain'
@ -101,7 +105,23 @@
</button>
<button id="normal_stop" type='button' class='btn btn-danger'
style="display: none;">Stop</button>
</form>
</div>
<!-- Normal Sub Configuration Tab -->
<div class='tab-pane fade' id='normal-sub-config-content' role='tabpanel' aria-labelledby='normal-sub-config-link-tab'>
<form id="normal_sub_config_form">
<div class='form-group'>
<label for='normal_subpath_input'>Subpath:</label>
<input type='text' class='form-control' id='normal_subpath_input'
placeholder='Enter subpath (e.g., mysub)'>
<div class="invalid-feedback">
Please enter a valid subpath (alphanumeric characters only, e.g., mysub).
</div>
</div>
<button id="normal_subpath_save_btn" type='button' class='btn btn-primary'>
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" style="display: none;"></span>
Save Subpath
</button>
</form>
</div>
</div>
@ -109,7 +129,7 @@
<!-- Telegram Bot Tab -->
<div class='tab-pane fade' id='telegram' role='tabpanel' aria-labelledby='telegram-tab'>
<form id="telegram">
<form id="telegram_form">
<div class='form-group'>
<label for='telegram_api_token'>API Token:</label>
<input type='text' class='form-control' id='telegram_api_token'
@ -135,7 +155,7 @@
<!-- Port Tab -->
<div class='tab-pane fade' id='port' role='tabpanel' aria-labelledby='port-tab'>
<form id="port">
<form id="port_form">
<div class='form-group'>
<label for='hysteria_port'>Port:</label>
<input type='text' class='form-control' id='hysteria_port'
@ -150,7 +170,7 @@
<!-- SNI Tab -->
<div class='tab-pane fade' id='sni' role='tabpanel' aria-labelledby='sni-tab'>
<form id="sni">
<form id="sni_form">
<div class='form-group'>
<label for='sni_domain'>Domain:</label>
<input type='text' class='form-control' id='sni_domain'
@ -165,7 +185,7 @@
<!-- Change IP Tab -->
<div class='tab-pane fade' id='change_ip' role='tabpanel' aria-labelledby='ip-tab'>
<form id="change_ip">
<form id="change_ip_form">
<div class='form-group'>
<label for='ipv4'>IPv4:</label>
<input type='text' class='form-control' id='ipv4' placeholder='Enter IPv4 or Domain'
@ -231,7 +251,7 @@
<!-- IP Limit Configuration Sub Tab -->
<div class='tab-pane fade' id='ip-limit-config-content' role='tabpanel' aria-labelledby='ip-limit-config-tab'>
<form id="ip_limit_config">
<form id="ip_limit_config_form">
<div class='form-group'>
<label for='block_duration'>Block Duration (seconds):</label>
<input type='text' class='form-control' id='block_duration'
@ -253,7 +273,6 @@
</div>
</div>
</div>
<!-- Decoy Site Tab -->
<div class='tab-pane fade' id='decoy' role='tabpanel' aria-labelledby='decoy-tab'>
<form id="decoy_form">
@ -328,6 +347,12 @@
return /^[0-9]+$/.test(port) && parseInt(port) > 0 && parseInt(port) <= 65535;
}
function isValidSubPath(subpath) {
if (!subpath) return false;
return /^[a-zA-Z0-9]+$/.test(subpath);
}
function isValidIPorDomain(input) {
if (!input) return true;
@ -365,7 +390,7 @@
});
}
function sendRequest(url, type, data, successMessage, buttonSelector, showReload = true) {
function sendRequest(url, type, data, successMessage, buttonSelector, showReload = true, postSuccessCallback = null) {
$.ajax({
url: url,
type: type,
@ -378,13 +403,15 @@
}
},
success: function (response) {
if (showReload) {
Swal.fire("Success!", successMessage, "success").then(() => {
if (showReload) {
location.reload();
});
} else {
Swal.fire("Success!", successMessage, "success");
if (postSuccessCallback) {
postSuccessCallback(response);
}
}
});
console.log("Success Response:", response);
},
error: function (xhr, status, error) {
@ -411,10 +438,12 @@
const id = input.attr('id');
let fieldValid = true;
if (id.includes('domain')) {
if (id === 'normal_domain' || id === 'sni_domain' || id === 'decoy_domain') {
fieldValid = isValidDomain(input.val());
} else if (id.includes('port')) {
} else if (id === 'normal_port' || id === 'hysteria_port') {
fieldValid = isValidPort(input.val());
} else if (id === 'normal_subpath_input') {
fieldValid = isValidSubPath(input.val());
} else if (id === 'ipv4' || id === 'ipv6') {
fieldValid = (input.val().trim() === '') ? true : isValidIPorDomain(input.val());
} else if (id === 'block_duration' || id === 'max_ips') {
@ -435,6 +464,7 @@
return isValid;
}
function initUI() {
$.ajax({
url: "{{ url_for('server_services_status_api') }}",
@ -481,50 +511,113 @@
console.error("Failed to fetch SNI domain:", error, xhr.responseText);
}
});
}
function updateServiceUI(data) {
const servicesMap = {
"hysteria_telegram_bot": "#telegram",
"hysteria_normal_sub": "#normal",
"hysteria_telegram_bot": "#telegram_form",
"hysteria_normal_sub": "#normal_sub_service_form",
"hysteria_iplimit": "#ip-limit-service"
};
Object.keys(servicesMap).forEach(service => {
let selector = servicesMap[service];
let formSelector = servicesMap[service];
let isRunning = data[service];
if (isRunning) {
$(selector + " .form-group").hide();
$(selector + " .btn-success").hide();
$(selector + " .btn-danger").show();
if ($(selector + " .alert-info").length === 0) {
$(selector).prepend(`<div class='alert alert-info'>Service is running. You can stop it if needed.</div>`);
}
if (service === "hysteria_normal_sub") {
const $normalFormGroups = $("#normal_sub_service_form .form-group");
const $normalStartBtn = $("#normal_start");
const $normalStopBtn = $("#normal_stop");
const $normalAlert = $("#normal_sub_service_form .alert-info");
const $normalSubConfigTabLi = $(".normal-sub-config-tab-li");
if(service === "hysteria_iplimit"){
if (isRunning) {
$normalFormGroups.hide();
$normalStartBtn.hide();
$normalStopBtn.show();
if ($normalAlert.length === 0) {
$("#normal_sub_service_form").prepend(`<div class='alert alert-info'>NormalSub service is running. You can stop it or configure its subpath.</div>`);
}
$normalSubConfigTabLi.show();
fetchNormalSubPath();
} else {
$normalFormGroups.show();
$normalStartBtn.show();
$normalStopBtn.hide();
$("#normal_sub_service_form .alert-info").remove();
$normalSubConfigTabLi.hide();
if ($('#normal-sub-config-link-tab').hasClass('active')) {
$('#normal-tab').tab('show');
}
$("#normal_subpath_input").val("");
$("#normal_subpath_input").removeClass('is-invalid');
}
} else if (service === "hysteria_iplimit") {
if (isRunning) {
$("#ip_limit_start").hide();
$("#ip_limit_stop").show();
$(".ip-limit-config-tab-li").show();
}
// TODO: Fetch IP Limit Config and populate fields
} else {
$(selector + " .form-group").show();
$(selector + " .btn-success").show();
$(selector + " .btn-danger").hide();
$(selector + " .alert-info").remove();
if(service === "hysteria_iplimit"){
$("#ip_limit_start").show();
$("#ip_limit_stop").hide();
$(".ip-limit-config-tab-li").hide();
$('#ip-limit-service-tab').tab('show');
// TODO: Clear IP Limit Config fields
}
} else {
if (isRunning) {
$(formSelector + " .form-group").hide();
$(formSelector + " .btn-success").hide();
$(formSelector + " .btn-danger").show();
if ($(formSelector + " .alert-info").length === 0) {
$(formSelector).prepend(`<div class='alert alert-info'>Service is running. You can stop it if needed.</div>`);
}
} else {
$(formSelector + " .form-group").show();
$(formSelector + " .btn-success").show();
$(formSelector + " .btn-danger").hide();
$(formSelector + " .alert-info").remove();
}
}
});
}
function fetchNormalSubPath() {
$.ajax({
url: "{{ url_for('normal_sub_get_subpath_api') }}",
type: "GET",
success: function (data) {
$("#normal_subpath_input").val(data.subpath || "");
if (data.subpath) {
$("#normal_subpath_input").removeClass('is-invalid');
}
},
error: function (xhr, status, error) {
console.error("Failed to fetch NormalSub subpath:", error, xhr.responseText);
$("#normal_subpath_input").val("");
// Swal.fire("Error!", "Could not fetch NormalSub subpath.", "error"); // Avoid too many popups during init
}
});
}
function editNormalSubPath() {
if (!validateForm('normal_sub_config_form')) return;
const subpath = $("#normal_subpath_input").val();
confirmAction("change the NormalSub subpath to '" + subpath + "'", function () {
sendRequest(
"{{ url_for('normal_sub_edit_subpath_api') }}",
"PUT",
{ subpath: subpath },
"NormalSub subpath updated successfully!",
"#normal_subpath_save_btn",
false,
fetchNormalSubPath
);
});
}
function setupDecoy() {
if (!validateForm('decoy_form')) return;
@ -537,9 +630,9 @@
{ domain: domain, decoy_path: path },
"Decoy site setup initiated successfully!",
"#decoy_setup",
false
false,
function() { setTimeout(fetchDecoyStatus, 1000); }
);
setTimeout(fetchDecoyStatus, 2000);
});
}
@ -551,9 +644,9 @@
null,
"Decoy site stop initiated successfully!",
"#decoy_stop",
false
false,
function() { setTimeout(fetchDecoyStatus, 1000); }
);
setTimeout(fetchDecoyStatus, 2000);
});
}
@ -572,30 +665,37 @@
}
function updateDecoyStatusUI(data) {
const $form = $("#decoy_form");
const $formGroups = $form.find(".form-group");
const $setupBtn = $("#decoy_setup");
const $stopBtn = $("#decoy_stop");
const $alertInfo = $form.find(".alert-info");
if (data.active) {
$("#decoy_form .form-group").hide();
$("#decoy_setup").hide();
$("#decoy_stop").show();
$("#decoy_form .alert-info").remove();
if ($("#decoy_form .alert-info").length === 0) {
$("#decoy_form").prepend(`<div class='alert alert-info'>Decoy site is running. You can stop it if needed.</div>`);
$formGroups.hide();
$setupBtn.hide();
$stopBtn.show();
if ($alertInfo.length === 0) {
$form.prepend(`<div class='alert alert-info'>Decoy site is running. You can stop it if needed.</div>`);
} else {
$alertInfo.text('Decoy site is running. You can stop it if needed.');
}
$("#decoy_status_message").html(`
<strong>Status:</strong> <span class="text-success">Active</span><br>
<strong>Path:</strong> ${data.path || 'N/A'}
`);
} else {
$("#decoy_form .form-group").show();
$("#decoy_setup").show();
$("#decoy_stop").hide();
$("#decoy_form .alert-info").remove();
$formGroups.show();
$setupBtn.show();
$stopBtn.hide();
$alertInfo.remove();
$("#decoy_status_message").html('<strong>Status:</strong> <span class="text-danger">Not Active</span>');
}
}
function startTelegram() {
if (!validateForm('telegram')) return;
if (!validateForm('telegram_form')) return;
const apiToken = $("#telegram_api_token").val();
const adminId = $("#telegram_admin_id").val();
confirmAction("start the Telegram bot", function () {
@ -622,7 +722,7 @@
}
function startNormal() {
if (!validateForm('normal')) return;
if (!validateForm('normal_sub_service_form')) return;
const domain = $("#normal_domain").val();
const port = $("#normal_port").val();
confirmAction("start the normal subscription", function () {
@ -649,7 +749,7 @@
}
function changePort() {
if (!validateForm('port')) return;
if (!validateForm('port_form')) return;
const port = $("#hysteria_port").val();
const baseUrl = "{{ url_for('set_port_api', port='PORT_PLACEHOLDER') }}";
const url = baseUrl.replace("PORT_PLACEHOLDER", port);
@ -659,7 +759,7 @@
}
function changeSNI() {
if (!validateForm('sni')) return;
if (!validateForm('sni_form')) return;
const domain = $("#sni_domain").val();
const baseUrl = "{{ url_for('set_sni_api', sni='SNI_PLACEHOLDER') }}";
const url = baseUrl.replace("SNI_PLACEHOLDER", domain);
@ -669,7 +769,7 @@
}
function saveIP() {
if (!validateForm('change_ip')) return;
if (!validateForm('change_ip_form')) return;
const ipv4 = $("#ipv4").val().trim() || null;
const ipv6 = $("#ipv6").val().trim() || null;
confirmAction("save the new IP settings", function () {
@ -783,7 +883,7 @@
}
function configIPLimit() {
if (!validateForm('ip_limit_config')) return;
if (!validateForm('ip_limit_config_form')) return; // Ensure correct form ID
const blockDuration = $("#block_duration").val();
const maxIps = $("#max_ips").val();
confirmAction("save the IP Limit configuration", function () {
@ -804,6 +904,7 @@
$("#telegram_stop").on("click", stopTelegram);
$("#normal_start").on("click", startNormal);
$("#normal_stop").on("click", stopNormal);
$("#normal_subpath_save_btn").on("click", editNormalSubPath);
$("#port_change").on("click", changePort);
$("#sni_change").on("click", changeSNI);
$("#ip_change").on("click", saveIP);
@ -816,7 +917,6 @@
$("#decoy_stop").on("click", stopDecoy);
$('#normal_domain, #sni_domain, #decoy_domain').on('input', function () {
if (isValidDomain($(this).val())) {
$(this).removeClass('is-invalid');
@ -837,6 +937,16 @@
}
});
$('#normal_subpath_input').on('input', function () {
if (isValidSubPath($(this).val())) {
$(this).removeClass('is-invalid');
} else if ($(this).val().trim() !== "") {
$(this).addClass('is-invalid');
} else {
$(this).removeClass('is-invalid');
}
});
$('#ipv4, #ipv6').on('input', function () {
if (isValidIPorDomain($(this).val()) || $(this).val().trim() === '') {
$(this).removeClass('is-invalid');
@ -852,7 +962,6 @@
$(this).addClass('is-invalid');
}
});
$('#block_duration, #max_ips').on('input', function () {
if (isValidPositiveNumber($(this).val())) {
$(this).removeClass('is-invalid');
@ -873,7 +982,6 @@
}
});
});
</script>
{% endblock %}