wpnav-links/assets/js/admin.js
2025-06-01 18:58:35 +08:00

494 lines
18 KiB
JavaScript

jQuery(document).ready(function($) {
$('.wpnav-tab').click(function(e) {
e.preventDefault();
$('.wpnav-tab').removeClass('active');
$(this).addClass('active');
var tab = $(this).data('tab');
$('.wpnav-tab-section').hide();
$('.wpnav-tab-section[data-section="' + tab + '"]').show();
if (history.pushState) {
var newUrl = updateUrlParameter(window.location.href, 'tab', tab);
history.pushState({path: newUrl}, '', newUrl);
}
});
$('.wpnav-add-domain').click(function(e) {
e.preventDefault();
var domain = $(this).data('domain');
var $textarea = $('textarea[name="whitelist_domains"]');
var domains = $textarea.val().split('\n').filter(function(d) { return d.trim(); });
if (domains.indexOf(domain) >= 0) {
showNotice('wpnav-whitelist-status', wpnav_admin.strings.domain_exists.replace('%s', domain), 'error');
return;
}
domains.push(domain);
$textarea.val(domains.join('\n'));
showNotice('wpnav-whitelist-status', wpnav_admin.strings.domain_added.replace('%s', domain), 'success');
$(this).addClass('wpnav-loading').prop('disabled', true);
setTimeout(function() {
$(this).removeClass('wpnav-loading').prop('disabled', false);
}.bind(this), 1000);
});
$('#wpnav-select-all-domains').click(function(e) {
e.preventDefault();
var commonDomains = [
'google.com', 'facebook.com', 'youtube.com', 'twitter.com',
'instagram.com', 'linkedin.com', 'baidu.com', 'bing.com'
];
var $textarea = $('textarea[name="whitelist_domains"]');
var currentDomains = $textarea.val().split('\n').filter(function(d) { return d.trim(); });
var newDomains = [...new Set([...currentDomains, ...commonDomains])];
$textarea.val(newDomains.join('\n'));
showNotice('wpnav-whitelist-status', wpnav_admin.strings.common_domains_added, 'success');
});
$('#wpnav-clear-domains').click(function(e) {
e.preventDefault();
if (confirm(wpnav_admin.strings.confirm_clear)) {
$('textarea[name="whitelist_domains"]').val('');
showNotice('wpnav-whitelist-status', wpnav_admin.strings.whitelist_cleared, 'success');
}
});
$('#wpnav-export-whitelist').click(function(e) {
e.preventDefault();
var whitelist = $('textarea[name="whitelist_domains"]').val();
var domains = whitelist.split('\n').filter(function(d) { return d.trim(); });
if (domains.length === 0) {
showNotice('wpnav-whitelist-status', wpnav_admin.strings.whitelist_empty, 'error');
return;
}
var csv = domains.join('\n');
var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
var link = document.createElement('a');
if (link.download !== undefined) {
var url = URL.createObjectURL(blob);
link.setAttribute('href', url);
link.setAttribute('download', 'wpnav_whitelist_' + getFormattedDate() + '.csv');
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
showNotice('wpnav-whitelist-status', wpnav_admin.strings.export_success, 'success');
} else {
showNotice('wpnav-whitelist-status', wpnav_admin.strings.export_unsupported, 'error');
}
});
$('form').submit(function(e) {
var $form = $(this);
var $submitButton = $form.find('input[type="submit"], button[type="submit"]');
if ($form.attr('id') === 'sync-settings-form' || $form.attr('id') === 'sync-config-form') {
return true;
}
var formValid = validateForm($form);
if (!formValid) {
e.preventDefault();
return false;
}
if ($submitButton.length) {
var originalValue = $submitButton.val() || $submitButton.text();
$submitButton.prop('disabled', true).addClass('wpnav-loading');
if ($submitButton.is('input')) {
$submitButton.val(wpnav_admin.strings.saving);
} else {
$submitButton.text(wpnav_admin.strings.saving);
}
setTimeout(function() {
$submitButton.prop('disabled', false).removeClass('wpnav-loading');
if ($submitButton.is('input')) {
$submitButton.val(originalValue);
} else {
$submitButton.text(originalValue);
}
}, 10000);
}
});
if (window.location.search.indexOf('settings-updated=true') !== -1) {
var message = wpnav_admin.strings.settings_saved || 'Settings saved successfully!';
if (window.location.search.indexOf('imported=') !== -1) {
var match = window.location.search.match(/imported=(\d+)/);
if (match) {
message = wpnav_admin.strings.domains_imported ?
wpnav_admin.strings.domains_imported.replace('%d', match[1]) :
'Successfully imported ' + match[1] + ' domains.';
}
}
$('.wrap h1').after('<div class="notice notice-success is-dismissible"><p>' + message + '</p></div>');
setTimeout(function() {
$('.notice-success').fadeIn();
}, 100);
}
if (window.location.search.indexOf('tab=') !== -1) {
setTimeout(function() {
$('.notice-success').fadeIn();
}, 100);
}
$('.wp-list-table tbody tr').hover(
function() {
$(this).addClass('wpnav-row-hover');
},
function() {
$(this).removeClass('wpnav-row-hover');
}
);
$('#auto_redirect_enabled').change(function() {
if ($(this).is(':checked')) {
$('#redirect_delay_row').show();
} else {
$('#redirect_delay_row').hide();
}
});
// Enhanced preview functionality
$('#page_title').on('input', function() {
$('#preview-page-title').text($(this).val());
});
$('#page_subtitle').on('input', function() {
var subtitle = $(this).val();
if (subtitle) {
$('#preview-page-subtitle').text(subtitle).show();
} else {
$('#preview-page-subtitle').hide();
}
});
$('#url_label').on('input', function() {
$('#preview-url-label').text($(this).val());
});
$('#warning_text').on('input', function() {
$('#preview-warning-text').text($(this).val());
});
$('#countdown_text').on('input', function() {
var text = $(this).val().replace('{seconds}', '5');
$('#preview-countdown-text').text(text);
});
$('#button_text_continue').on('input', function() {
$('#preview-continue-btn').text($(this).val());
});
$('#button_text_back').on('input', function() {
$('#preview-back-btn').text($(this).val());
});
// Show/hide warning message functionality
$('input[name="show_warning_message"], textarea[name="warning_text"]').on('change input', function() {
var showWarning = $('input[name="show_warning_message"]').is(':checked');
var warningText = $('textarea[name="warning_text"]').val().trim();
if (showWarning && warningText !== '') {
$('#preview-warning').show();
} else {
$('#preview-warning').hide();
}
});
function setupRedirectPagePreview() {
function updatePreview() {
var colorScheme = $('select[name="color_scheme"]').val();
var template = $('input[name="template"]:checked').val();
var warningText = $('textarea[name="warning_text"]').val();
var showWarningMessage = $('input[name="show_warning_message"]').is(':checked');
var continueText = $('input[name="button_text_continue"]').val();
var backText = $('input[name="button_text_back"]').val();
var showLogo = $('input[name="show_logo"]').is(':checked');
var showUrlFull = $('input[name="show_url_full"]').is(':checked');
var showSecurityTips = $('input[name="show_security_tips"]').is(':checked');
var showBackButton = $('input[name="show_back_button"]').is(':checked');
console.log('Updating preview - Template:', template, 'Color:', colorScheme);
var $preview = $('.preview-container');
$preview.removeClass('wpnav-color-blue wpnav-color-green wpnav-color-red');
$preview.addClass('wpnav-color-' + colorScheme);
var $container = $preview.find('.wpnav-container');
$container.removeClass('wpnav-simple wpnav-minimal wpnav-default wpnav-full');
$container.addClass('wpnav-' + template);
$('#preview-warning-text').text(warningText);
$('#preview-continue-btn').text(continueText);
$('#preview-back-btn').text(backText);
$('.wpnav-site-logo').toggle(showLogo);
$('.wpnav-url-full').toggle(showUrlFull);
$('.wpnav-security-tips').toggle(showSecurityTips);
$('#preview-back-btn').toggle(showBackButton);
$('#preview-warning').toggle(showWarningMessage && warningText.trim() !== '');
updateTemplateSpecificElements(template);
}
function updateTemplateSpecificElements(template) {
var $container = $('.wpnav-container');
var $header = $('.wpnav-header');
switch(template) {
case 'simple':
$container.css({
'max-width': '480px',
'padding': '30px 25px',
'text-align': 'center'
});
$header.find('.wpnav-title').css('font-size', '22px');
break;
case 'minimal':
$container.css({
'max-width': '680px',
'padding': '30px',
'text-align': 'center'
});
$header.find('.wpnav-title').css('font-size', '24px');
break;
case 'full':
$container.css({
'max-width': '880px',
'padding': '50px',
'text-align': 'left'
});
$header.find('.wpnav-title').css('font-size', '36px');
break;
default: // default
$container.css({
'max-width': '780px',
'padding': '40px',
'text-align': 'center'
});
$header.find('.wpnav-title').css('font-size', '28px');
break;
}
}
$('select[name="color_scheme"]').on('change', updatePreview);
$('input[name="template"]').on('change', updatePreview);
$('textarea[name="warning_text"]').on('input', updatePreview);
$('input[name="show_warning_message"]').on('change', updatePreview);
$('input[name="button_text_continue"]').on('input', updatePreview);
$('input[name="button_text_back"]').on('input', updatePreview);
$('input[name="show_logo"]').on('change', updatePreview);
$('input[name="show_url_full"]').on('change', updatePreview);
$('input[name="show_security_tips"]').on('change', updatePreview);
$('input[name="show_back_button"]').on('change', updatePreview);
updatePreview();
}
if ($('.wpnav-tab[data-tab="redirect_page"]').length) {
setupRedirectPagePreview();
}
$('#redirect_delay, #cookie_duration, #stats_retention').on('input', function() {
var $this = $(this);
var val = parseInt($this.val());
var min = parseInt($this.attr('min'));
var max = parseInt($this.attr('max'));
if (val < min || val > max) {
$this.addClass('error').css('border-color', '#dc3232');
} else {
$this.removeClass('error').css('border-color', '');
}
});
var draftTimeout;
$('textarea[name="whitelist_domains"], textarea[name="warning_text"], textarea[name="custom_css"]').on('input', function() {
var $this = $(this);
clearTimeout(draftTimeout);
draftTimeout = setTimeout(function() {
var draftKey = 'wpnav_draft_' + $this.attr('name');
try {
sessionStorage.setItem(draftKey, $this.val());
if ($this.siblings('.draft-saved').length === 0) {
$this.after('<span class="draft-saved" style="font-size: 11px; color: #46b450; margin-left: 5px;">' + wpnav_admin.strings.draft_saved + '</span>');
setTimeout(function() {
$('.draft-saved').fadeOut();
}, 2000);
}
} catch (e) {
console.log('Session storage not available');
}
}, 2000);
});
$('textarea[name="whitelist_domains"], textarea[name="warning_text"], textarea[name="custom_css"]').each(function() {
var $this = $(this);
var draftKey = 'wpnav_draft_' + $this.attr('name');
try {
var draft = sessionStorage.getItem(draftKey);
if (draft && draft !== $this.val() && draft.trim() !== '') {
var restore = confirm(wpnav_admin.strings.restore_draft);
if (restore) {
$this.val(draft);
if ($this.attr('name') === 'warning_text') {
$('#preview-warning-text').text(draft);
}
}
}
} catch (e) {
console.log('Session storage not available');
}
});
$('form').on('submit', function() {
setTimeout(function() {
if (window.location.search.indexOf('settings-updated=true') !== -1) {
try {
sessionStorage.removeItem('wpnav_draft_whitelist_domains');
sessionStorage.removeItem('wpnav_draft_warning_text');
sessionStorage.removeItem('wpnav_draft_custom_css');
} catch (e) {
console.log('Session storage not available');
}
}
}, 100);
});
function validateForm($form) {
var isValid = true;
var errors = [];
var redirectDelay = $('#redirect_delay').val();
if (redirectDelay && (redirectDelay < 1 || redirectDelay > 30)) {
errors.push('Redirect delay must be between 1 and 30 seconds.');
isValid = false;
}
var cookieDuration = $('#cookie_duration').val();
if (cookieDuration && (cookieDuration < 1 || cookieDuration > 365)) {
errors.push('Cookie duration must be between 1 and 365 days.');
isValid = false;
}
var statsRetention = $('#stats_retention').val();
if (statsRetention && (statsRetention < 1 || statsRetention > 365)) {
errors.push('Stats retention must be between 1 and 365 days.');
isValid = false;
}
if (!isValid) {
var tabName = $form.closest('.wpnav-tab-section').attr('data-section');
var statusId = 'wpnav-settings-status';
if (tabName === 'whitelist') {
statusId = 'wpnav-whitelist-status';
} else if (tabName === 'redirect_page') {
statusId = 'wpnav-redirect-status';
} else if (tabName === 'logs_statistics') {
statusId = 'wpnav-logs-status';
}
showNotice(statusId, errors.join(' '), 'error');
}
return isValid;
}
function updateUrlParameter(url, param, paramVal) {
var newAdditionalURL = "";
var tempArray = url.split("?");
var baseURL = tempArray[0];
var additionalURL = tempArray[1];
var temp = "";
if (additionalURL) {
tempArray = additionalURL.split("&");
for (var i = 0; i < tempArray.length; i++) {
if (tempArray[i].split('=')[0] != param) {
newAdditionalURL += temp + tempArray[i];
temp = "&";
}
}
}
var rows_txt = temp + "" + param + "=" + paramVal;
return baseURL + "?" + newAdditionalURL + rows_txt;
}
function showNotice(elementId, message, type) {
var $notice = $('#' + elementId);
if ($notice.length === 0) {
$notice = $('<span id="' + elementId + '" class="wpnav-notice"></span>');
$('.card h2').first().after($notice);
}
$notice.removeClass('wpnav-notice-success wpnav-notice-error')
.addClass('wpnav-notice-' + type)
.text(message)
.show()
.delay(4000)
.fadeOut();
}
function getFormattedDate() {
var now = new Date();
var year = now.getFullYear();
var month = ('0' + (now.getMonth() + 1)).slice(-2);
var day = ('0' + now.getDate()).slice(-2);
return year + month + day;
}
function initColorSchemePreview() {
$('select[name="color_scheme"]').on('change', function() {
var scheme = $(this).val();
var $preview = $('.wpnav-redirect-preview');
$preview.removeClass('wpnav-color-blue wpnav-color-green wpnav-color-red wpnav-color-light');
$preview.addClass('wpnav-color-' + scheme);
});
}
if ($('.wpnav-redirect-preview').length) {
initColorSchemePreview();
}
console.log('WPNav Links Admin initialized');
var activeTab = $('.wpnav-tab.active').data('tab') || 'basic_settings';
if (activeTab) {
$('.wpnav-tab-section').hide();
$('.wpnav-tab-section[data-section="' + activeTab + '"]').show();
}
var urlParams = new URLSearchParams(window.location.search);
var tabFromUrl = urlParams.get('tab');
if (tabFromUrl) {
$('.wpnav-tab').removeClass('active');
$('.wpnav-tab[data-tab="' + tabFromUrl + '"]').addClass('active');
$('.wpnav-tab-section').hide();
$('.wpnav-tab-section[data-section="' + tabFromUrl + '"]').show();
}
});