252 lines
9.3 KiB
JavaScript
252 lines
9.3 KiB
JavaScript
/**
|
|
* On-site wallet tipping content for the shared modal runtime.
|
|
*
|
|
* @package AKSRT
|
|
*/
|
|
;(function (window, document) {
|
|
'use strict';
|
|
|
|
var cfg = window.aksrtData || {};
|
|
var titleSequence = 0;
|
|
var toastId = 'aksrt-reward-toast';
|
|
|
|
function escapeHtml(value) {
|
|
return String(value == null ? '' : value).replace(/[&<>"']/g, function (character) {
|
|
return {
|
|
'&': '&',
|
|
'<': '<',
|
|
'>': '>',
|
|
'"': '"',
|
|
"'": ''',
|
|
}[character];
|
|
});
|
|
}
|
|
|
|
function notify(message, type, time) {
|
|
if (typeof window.notyf === 'function') {
|
|
window.notyf(escapeHtml(message), type || 'info', time, toastId);
|
|
}
|
|
}
|
|
|
|
function rewardModal(target) {
|
|
return target.closest('.aksrt-modal-runtime.aksrt-reward-modal');
|
|
}
|
|
|
|
function rewardTemplate(modal) {
|
|
return modal ? document.getElementById(modal.dataset.templateId || '') : null;
|
|
}
|
|
|
|
function operationKey(template) {
|
|
if (!template.dataset.aksrtOperationKey) {
|
|
template.dataset.aksrtOperationKey = window.AksrtRequest.createIdempotencyKey();
|
|
}
|
|
return template.dataset.aksrtOperationKey;
|
|
}
|
|
|
|
function runCaptcha(modal) {
|
|
var mount = modal.querySelector('[data-aksrt-captcha-config][data-scene="tip_user"]');
|
|
if (!mount) return Promise.resolve({});
|
|
if (!window.AKSRTCaptcha || typeof window.AKSRTCaptcha.run !== 'function') {
|
|
return Promise.reject(new Error('人机验证正在加载，请稍后重试'));
|
|
}
|
|
|
|
return window.AKSRTCaptcha.run('tip_user', modal).then(function (payload) {
|
|
if (!payload) return null;
|
|
if (!payload.aksrt_captcha_proof) throw new Error('人机验证凭证未就绪，请重试');
|
|
return payload;
|
|
});
|
|
}
|
|
|
|
function setSubmitting(modal, submit, submitting, succeeded) {
|
|
submit.disabled = submitting || succeeded;
|
|
submit.textContent = submitting ? '验证中…' : '余额赞赏';
|
|
modal.querySelectorAll('[data-reward-amount], [data-aksrt-reward-custom]').forEach(function (control) {
|
|
control.disabled = submitting || succeeded;
|
|
});
|
|
}
|
|
|
|
function openReward(trigger) {
|
|
var runtime = window.AksrtModalRuntime;
|
|
if (!runtime || !window.AksrtRequest) {
|
|
if (trigger.dataset.aksrtRewardWaiting !== '1') {
|
|
trigger.dataset.aksrtRewardWaiting = '1';
|
|
document.addEventListener('aksrt:modal-runtime:ready', function () {
|
|
delete trigger.dataset.aksrtRewardWaiting;
|
|
if (document.contains(trigger)) openReward(trigger);
|
|
}, { once: true });
|
|
}
|
|
return;
|
|
}
|
|
|
|
var templateId = trigger.getAttribute('data-template-id') || '';
|
|
var template = document.getElementById(templateId);
|
|
if (!template || !template.content) return;
|
|
|
|
var shell = runtime.open({
|
|
html: template.innerHTML,
|
|
className: 'aksrt-reward-modal modal-mini full-sm',
|
|
mobileBottom: true,
|
|
kind: 'generic',
|
|
});
|
|
shell.dataset.templateId = template.id;
|
|
shell.dataset.userId = trigger.getAttribute('data-user-id') || template.dataset.userId || '';
|
|
shell.dataset.postId = trigger.getAttribute('data-post-id') || template.dataset.postId || '0';
|
|
var title = shell.querySelector('.aksrt-reward__title');
|
|
if (title) {
|
|
title.id = 'aksrt-reward-title-' + (++titleSequence);
|
|
shell.setAttribute('aria-labelledby', title.id);
|
|
}
|
|
|
|
var initialFocus = shell.querySelector('[data-reward-amount].is-active, [data-aksrt-reward-custom]');
|
|
if (initialFocus) initialFocus.focus();
|
|
}
|
|
|
|
document.addEventListener('click', function (event) {
|
|
var opener = event.target.closest('[data-aksrt-reward-open]');
|
|
if (opener) {
|
|
event.preventDefault();
|
|
openReward(opener);
|
|
return;
|
|
}
|
|
|
|
var amountButton = event.target.closest('[data-reward-amount]');
|
|
if (amountButton) {
|
|
var amountModal = rewardModal(amountButton);
|
|
if (!amountModal) return;
|
|
var amountTemplate = rewardTemplate(amountModal);
|
|
if (amountTemplate) delete amountTemplate.dataset.aksrtOperationKey;
|
|
amountModal.querySelectorAll('[data-reward-amount]').forEach(function (button) {
|
|
var isActive = button === amountButton;
|
|
button.classList.toggle('is-active', isActive);
|
|
button.setAttribute('aria-pressed', isActive ? 'true' : 'false');
|
|
});
|
|
var customInput = amountModal.querySelector('[data-aksrt-reward-custom]');
|
|
if (customInput) customInput.value = '';
|
|
return;
|
|
}
|
|
|
|
var submit = event.target.closest('[data-aksrt-reward-submit]');
|
|
if (!submit || submit.disabled) return;
|
|
|
|
var modal = rewardModal(submit);
|
|
var template = rewardTemplate(modal);
|
|
var runtime = window.AksrtModalRuntime;
|
|
if (!modal || !template || !runtime) return;
|
|
|
|
var message = modal.querySelector('[data-aksrt-reward-message]');
|
|
var custom = modal.querySelector('[data-aksrt-reward-custom]');
|
|
var selected = modal.querySelector('[data-reward-amount].is-active');
|
|
var amount = custom && custom.value ? custom.value : (selected ? selected.dataset.rewardAmount : '');
|
|
if (!amount) {
|
|
if (message) message.textContent = '请选择或输入赞赏金额';
|
|
notify('请选择或输入赞赏金额', 'warning');
|
|
return;
|
|
}
|
|
if (custom && custom.value && !custom.checkValidity()) {
|
|
custom.reportValidity();
|
|
return;
|
|
}
|
|
var key;
|
|
try {
|
|
key = operationKey(template);
|
|
} catch (error) {
|
|
if (message) message.textContent = error.message || '无法创建安全请求，请稍后重试';
|
|
notify(error.message || '无法创建安全请求，请稍后重试', 'danger');
|
|
return;
|
|
}
|
|
|
|
setSubmitting(modal, submit, true, false);
|
|
if (message) message.textContent = '正在进行人机验证…';
|
|
|
|
var body = new URLSearchParams();
|
|
body.set('action', 'aksrt_submit_tip');
|
|
body.set('nonce', cfg.nonce || '');
|
|
body.set('recipient_id', modal.dataset.userId || '');
|
|
body.set('post_id', modal.dataset.postId || '0');
|
|
body.set('amount', amount);
|
|
var succeeded = false;
|
|
|
|
runCaptcha(modal).then(function (captchaPayload) {
|
|
if (!captchaPayload) {
|
|
if (window.AKSRTCaptcha && typeof window.AKSRTCaptcha.reset === 'function') {
|
|
window.AKSRTCaptcha.reset('tip_user', modal);
|
|
}
|
|
return { cancelled: true };
|
|
}
|
|
if (runtime.getActive() !== modal) {
|
|
if (window.AKSRTCaptcha && typeof window.AKSRTCaptcha.reset === 'function') {
|
|
window.AKSRTCaptcha.reset('tip_user', modal);
|
|
}
|
|
return { cancelled: true };
|
|
}
|
|
Object.keys(captchaPayload).forEach(function (name) {
|
|
var value = captchaPayload[name];
|
|
if (value != null && typeof value !== 'object') body.set(name, String(value));
|
|
});
|
|
submit.textContent = '赞赏中…';
|
|
if (message) message.textContent = '正在提交赞赏…';
|
|
notify('正在提交赞赏…', 'load', '');
|
|
return window.fetch(cfg.ajaxUrl || '/wp-admin/admin-ajax.php', {
|
|
method: 'POST',
|
|
credentials: 'same-origin',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
|
|
'Idempotency-Key': key,
|
|
},
|
|
body: body.toString(),
|
|
}).then(function (response) {
|
|
return response.json();
|
|
});
|
|
}).then(function (response) {
|
|
if (runtime.getActive() !== modal) return;
|
|
if (response && response.cancelled) {
|
|
if (message) message.textContent = '请完成人机验证后再试';
|
|
notify('请完成人机验证后再试', 'warning', 5);
|
|
return;
|
|
}
|
|
var text = response && response.data && response.data.message ? response.data.message : '赞赏失败';
|
|
if (response && response.success) {
|
|
succeeded = true;
|
|
delete template.dataset.aksrtOperationKey;
|
|
if (message) message.textContent = text;
|
|
notify(text, 'success', 5);
|
|
window.setTimeout(function () {
|
|
if (runtime.getActive() === modal) runtime.close('success');
|
|
}, 900);
|
|
} else {
|
|
if (message) message.textContent = text;
|
|
notify(text, 'danger', 5);
|
|
if (window.AKSRTCaptcha && typeof window.AKSRTCaptcha.reset === 'function') {
|
|
window.AKSRTCaptcha.reset('tip_user', modal);
|
|
}
|
|
}
|
|
}).catch(function (error) {
|
|
if (runtime.getActive() !== modal) return;
|
|
var errorMessage = error && error.message ? error.message : '网络错误，请稍后重试';
|
|
if (message) message.textContent = errorMessage;
|
|
notify(errorMessage, 'danger', 5);
|
|
if (window.AKSRTCaptcha && typeof window.AKSRTCaptcha.reset === 'function') {
|
|
window.AKSRTCaptcha.reset('tip_user', modal);
|
|
}
|
|
}).finally(function () {
|
|
setSubmitting(modal, submit, false, succeeded);
|
|
});
|
|
});
|
|
|
|
document.addEventListener('input', function (event) {
|
|
if (!event.target.matches('[data-aksrt-reward-custom]')) return;
|
|
var modal = rewardModal(event.target);
|
|
var template = rewardTemplate(modal);
|
|
if (template) delete template.dataset.aksrtOperationKey;
|
|
if (!modal) return;
|
|
|
|
var hasCustomAmount = event.target.value !== '';
|
|
var firstAmount = modal.querySelector('[data-reward-amount]');
|
|
modal.querySelectorAll('[data-reward-amount]').forEach(function (button) {
|
|
var isActive = hasCustomAmount ? false : button === firstAmount;
|
|
button.classList.toggle('is-active', isActive);
|
|
button.setAttribute('aria-pressed', isActive ? 'true' : 'false');
|
|
});
|
|
});
|
|
})(window, document);
|