74 lines
5.3 KiB
JavaScript
74 lines
5.3 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const COOKIE_CONSENT_KEY = 'cookie_consent';
|
|
const FURRY_CONTENT_KEY = 'furry_content_enabled';
|
|
let cookieBanner, settingsModal, openSettingsFromBannerBtn, closeModalBtn, saveSettingsBtn;
|
|
let acceptAllBtn, acceptNecessaryBtn, rejectAllBtn;
|
|
let furryCheckbox;
|
|
let furryElements;
|
|
const renderBanner = () => {
|
|
const bannerHTML = `<div id="GCookie_CookieBanner"><div class="GCookie_BannerText"><strong>我们重视您的隐私</strong><br>我们和我们的合作伙伴使用Cookie或类似技术来访问、存储和处理您的个人数据，例如您的访问信息。这能让我们根据您的兴趣和需求提供更好的体验。您可以随时更改或撤回您的同意。</div><div class="GCookie_BannerButtons"><button id="GCookie_RejectAllBtn"class="GCookie_Btn GCookie_BtnSecondary">我不同意任何Cookie</button><button id="GCookie_AcceptNecessaryBtn"class="GCookie_Btn GCookie_BtnSecondary">我同意必要Cookie</button><button id="GCookie_AcceptAllBtn"class="GCookie_Btn GCookie_BtnPrimary">我同意全部Cookie</button><button id="GCookie_OpenSettingsFromBannerBtn"class="GCookie_Btn GCookie_BtnSecondary">Cookie设置</button></div></div>`;
|
|
const modalHTML = `<div id="GCookie_CookieSettingsModal"><div class="GCookie_ModalContent"><div class="GCookie_ModalHeader"><h2>Cookie设置</h2><button class="GCookie_CloseBtn"id="GCookie_CloseModalBtn">×</button></div><div class="GCookie_ModalBody"><div class="GCookie_SettingItem"><label for="GCookie_FurryCheckbox">是否在主页中显示小众元素<div class="GCookie_Switch"><input type="checkbox"id="GCookie_FurryCheckbox"checked><span class="GCookie_Slider"></span></div></label></div></div><div class="GCookie_ModalFooter"><button id="GCookie_SaveSettingsBtn"class="GCookie_Btn GCookie_BtnPrimary">保存设置</button></div></div></div>`;
|
|
document.body.insertAdjacentHTML('beforeend', bannerHTML);
|
|
document.body.insertAdjacentHTML('beforeend', modalHTML);
|
|
cacheDOMElements()
|
|
};
|
|
const cacheDOMElements = () => {
|
|
cookieBanner = document.getElementById('GCookie_CookieBanner');
|
|
settingsModal = document.getElementById('GCookie_CookieSettingsModal');
|
|
openSettingsFromBannerBtn = document.getElementById('GCookie_OpenSettingsFromBannerBtn');
|
|
closeModalBtn = document.getElementById('GCookie_CloseModalBtn');
|
|
saveSettingsBtn = document.getElementById('GCookie_SaveSettingsBtn');
|
|
acceptAllBtn = document.getElementById('GCookie_AcceptAllBtn');
|
|
acceptNecessaryBtn = document.getElementById('GCookie_AcceptNecessaryBtn');
|
|
rejectAllBtn = document.getElementById('GCookie_RejectAllBtn');
|
|
furryCheckbox = document.getElementById('GCookie_FurryCheckbox');
|
|
furryElements = document.querySelectorAll('.c-furry')
|
|
};
|
|
const showBanner = () => {if (cookieBanner) cookieBanner.classList.add('GCookie_Show')};
|
|
const hideBanner = () => {if (cookieBanner) cookieBanner.classList.remove('GCookie_Show')};
|
|
const openSettings = () => {
|
|
if (!settingsModal || !furryCheckbox) return;
|
|
const isFurryEnabled = localStorage.getItem(FURRY_CONTENT_KEY) !== 'false';
|
|
furryCheckbox.checked = isFurryEnabled;
|
|
settingsModal.classList.add('GCookie_Show')
|
|
};
|
|
const closeSettings = () => {if (settingsModal) settingsModal.classList.remove('GCookie_Show')};
|
|
const handleConsent = (consent) => {
|
|
localStorage.setItem(COOKIE_CONSENT_KEY, consent);
|
|
hideBanner();
|
|
console.log(`Cookie同意已保存:${consent}`)
|
|
};
|
|
const applyFurrySettings = (isEnabled) => {
|
|
if (!furryElements || furryElements.length === 0) return;
|
|
furryElements.forEach(el => {
|
|
if (isEnabled) {el.classList.remove('GCookie_Hidden')} else {el.classList.add('GCookie_Hidden')}
|
|
})
|
|
};
|
|
const saveSettings = () => {
|
|
if (!furryCheckbox) return;
|
|
const isFurryEnabled = furryCheckbox.checked;
|
|
localStorage.setItem(FURRY_CONTENT_KEY, isFurryEnabled);
|
|
applyFurrySettings(isFurryEnabled);
|
|
closeSettings();
|
|
console.log(`“小众元素” 显示设置已保存:${isFurryEnabled}`)
|
|
};
|
|
const bindEvents = () => {
|
|
if (!acceptAllBtn || !acceptNecessaryBtn || !rejectAllBtn || !openSettingsFromBannerBtn || !closeModalBtn || !saveSettingsBtn || !settingsModal) return;
|
|
acceptAllBtn.addEventListener('click', () => handleConsent('all'));
|
|
acceptNecessaryBtn.addEventListener('click', () => handleConsent('necessary'));
|
|
rejectAllBtn.addEventListener('click', () => handleConsent('none'));
|
|
openSettingsFromBannerBtn.addEventListener('click', openSettings);
|
|
closeModalBtn.addEventListener('click', closeSettings);
|
|
saveSettingsBtn.addEventListener('click', saveSettings);
|
|
settingsModal.addEventListener('click', (event) => {if (event.target === settingsModal) {closeSettings()}})
|
|
};
|
|
const init = () => {
|
|
renderBanner();
|
|
const consent = localStorage.getItem(COOKIE_CONSENT_KEY);
|
|
if (!consent) {showBanner()}
|
|
const isFurryEnabled = localStorage.getItem(FURRY_CONTENT_KEY) !== 'false';
|
|
applyFurrySettings(isFurryEnabled);
|
|
bindEvents()
|
|
};
|
|
init()
|
|
}); |