Compare commits
41 Commits
version-2.
...
version-2.
| Author | SHA1 | Date | |
|---|---|---|---|
|
532cbafd8e | ||
|
|
30e13e5bde | ||
|
|
41184ad1d8 | ||
|
|
bff0b529d2 | ||
|
|
b179431aaa | ||
|
|
569ad36db1 | ||
|
|
d0cd750e22 | ||
|
|
ccda6074be | ||
|
|
1b94b8bf93 | ||
|
|
9a73273c34 | ||
|
|
ea04260290 | ||
|
|
9c8a1f035f | ||
|
|
a4cd5d6535 | ||
|
|
c2585ea504 | ||
|
|
3589df9032 | ||
|
|
99d5420024 | ||
|
|
f66c17095b | ||
|
|
86468a9f77 | ||
|
|
0c55a90662 | ||
|
|
0eac618a71 | ||
|
|
200da80262 | ||
|
|
753f12e5d9 | ||
|
|
50fcc7454d | ||
|
|
747021c259 | ||
|
|
9f0d3d0a2a | ||
|
|
ac6c85a490 | ||
|
|
7f959b1b34 | ||
|
|
d3cd2b69fe | ||
|
|
eec6778f8d | ||
|
|
0fbfd7b6dd | ||
|
|
ace68a0bad | ||
|
|
01e55e6d82 | ||
|
|
f9a1587587 | ||
|
|
cea62b1c77 | ||
|
|
c293d31969 | ||
|
|
20b46b9fd2 | ||
|
|
b606b54d9b | ||
|
|
ff78d2c8b4 | ||
|
|
14e669178e | ||
|
|
d8290974b5 | ||
|
|
56d260e0d6 |
@@ -139,7 +139,7 @@ Home/
|
||||
|
||||
## 🚀 快速开始
|
||||
|
||||
``shell
|
||||
```shell
|
||||
# 克隆项目
|
||||
git clone https://github.com/listener-He/Home.git
|
||||
|
||||
@@ -181,7 +181,7 @@ open about.html
|
||||
- [x] 添加骨架屏加载效果
|
||||
- [x] 实现数据缓存机制，提升页面加载速度
|
||||
- [x] 添加淡入动画效果，提升用户体验
|
||||
- [x] 实现 PWA 支持，支持离线访问
|
||||
|
||||
|
||||
### 待完成
|
||||
- [ ] 添加更多数据源（如 Twitter、知乎等）
|
||||
@@ -193,6 +193,7 @@ open about.html
|
||||
- [ ] 添加更多主题选项（如高对比度模式等）
|
||||
- [ ] 实现深色模式下的图片优化处理
|
||||
- [ ] 添加无障碍访问支持（ARIA 属性完善）
|
||||
- [ ] 实现 PWA 支持，支持离线访问
|
||||
|
||||
## 🙏 鸣谢与致敬
|
||||
|
||||
|
||||
161
about.html
161
about.html
@@ -1,19 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<html lang="zh-CN" data-lang="zh">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<title>关于我 - Honesty</title>
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<!-- PWA相关配置 -->
|
||||
<meta name="theme-color" content="#6c5ce7">
|
||||
<link rel="manifest" href="./manifest.json">
|
||||
|
||||
|
||||
|
||||
<!--SEO信息 -->
|
||||
<meta name="description" content="关于Honesty,关于HeHouHui,关于HeHui,关于明厚, About Me Honesty, About Me HeHouHui, About Me HeHui">
|
||||
<meta name="keywords" content="Honesty,HeHouHui,HeHui,明厚">
|
||||
<link rel="canonical" href="https://www.hehouhui.cn/about.html">
|
||||
<meta name="author" content="Honesty">
|
||||
|
||||
|
||||
<!-- 社交平台分享优化 -->
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
@@ -22,7 +21,8 @@
|
||||
<meta property="og:description" content="我是一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。">
|
||||
<meta property="og:image" content="https://www.hehouhui.cn/images/avatar.jpeg">
|
||||
<meta property="og:site_name" content="Honesty的个人主页">
|
||||
|
||||
<meta property="og:locale" content="zh_CN">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta property="twitter:url" content="https://www.hehouhui.cn/about.html">
|
||||
@@ -30,23 +30,25 @@
|
||||
<meta property="twitter:description" content="我是一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。">
|
||||
<meta property="twitter:image" content="https://www.hehouhui.cn/images/avatar.jpeg">
|
||||
<meta property="twitter:site" content="@Honesty861024">
|
||||
|
||||
<link rel="alternate" hreflang="zh-cn" href="https://www.hehouhui.cn/about.html">
|
||||
<link rel="alternate" hreflang="en" href="https://www.hehouhui.cn/about.html?lang=en">
|
||||
<link rel="alternate" hreflang="x-default" href="https://www.hehouhui.cn/about.html">
|
||||
|
||||
<!-- 微信小程序/朋友圈分享 -->
|
||||
<meta property="wechat:image" content="https://www.hehouhui.cn/images/avatar.jpeg">
|
||||
<meta property="wechat:title" content="关于我 - Honesty的个人主页">
|
||||
<meta property="wechat:description" content="我是一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。">
|
||||
|
||||
|
||||
<!-- 核心资源：使用 BootCDN 加速 -->
|
||||
<link href="https://cdn.bootcdn.net/ajax/libs/normalize/8.0.1/normalize.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.bootcdn.net/ajax/libs/remixicon/3.5.0/remixicon.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="css/style.css?version=20251125">
|
||||
<link rel="stylesheet" href="css/about.css?version=20251125">
|
||||
<!-- Artalk 评论样式 -->
|
||||
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/artalk/2.9.1/Artalk.css">
|
||||
<link rel="stylesheet" href="css/artalk.css?version=20251125">
|
||||
<link rel="icon" href="favicon.ico">
|
||||
<link rel="apple-touch-icon" href="./images/logo.png">
|
||||
|
||||
|
||||
<!--IE淘汰计划-->
|
||||
<script>
|
||||
if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) window.location.href = "https://imsyy.top/upgrade-your-browser/index.html?referrer=" + encodeURIComponent(window.location.href);
|
||||
@@ -87,11 +89,11 @@
|
||||
<div class="nav-divider"></div>
|
||||
|
||||
<!-- 功能按钮 -->
|
||||
<button id="lang-btn" class="action-btn" aria-label="Switch Language">
|
||||
<button id="lang-btn" class="action-btn" aria-label="Switch Language" tabindex="0">
|
||||
<i class="ri-translate-2"></i>
|
||||
<span class="btn-text">CN/EN</span>
|
||||
</button>
|
||||
<button id="theme-btn" class="action-btn" aria-label="Toggle Theme">
|
||||
<button id="theme-btn" class="action-btn" aria-label="Toggle Theme" tabindex="0">
|
||||
<i class="ri-sun-line icon-sun"></i>
|
||||
<i class="ri-moon-line icon-moon"></i>
|
||||
</button>
|
||||
@@ -108,7 +110,7 @@
|
||||
<div class="bento-card area-profile">
|
||||
<div class="profile-content">
|
||||
<div class="avatar-ring">
|
||||
<img src="images/avatar.jpeg" alt="Honesty" class="avatar-img">
|
||||
<img src="images/avatar.jpeg" alt="Honesty" class="avatar-img" loading="lazy">
|
||||
<div class="status-dot" data-i18n="status.online">Online</div>
|
||||
</div>
|
||||
<div class="profile-info">
|
||||
@@ -120,12 +122,12 @@
|
||||
</div>
|
||||
<!-- 6个社交链接 (PC端显示) -->
|
||||
<div class="social-dock desktop-social">
|
||||
<a href="https://github.com/listener-He" target="_blank" class="s-icon"><i class="ri-github-fill"></i></a>
|
||||
<a href="mailto:hehouhui@foxmail.com" class="s-icon"><i class="ri-mail-send-fill"></i></a>
|
||||
<a href="https://blog.hehouhui.cn" target="_blank" class="s-icon"><i class="ri-pages-line"></i></a>
|
||||
<a href="https://www.zhihu.com/people/wen-xin-92-2-57" target="_blank" class="s-icon"><i class="ri-zhihu-line"></i></a>
|
||||
<a href="javascript:void(0);" onclick="toggleWechat()" class="s-icon"><i class="ri-wechat-fill"></i></a>
|
||||
<a href="https://juejin.cn/user/3659591622878503" target="_blank" class="s-icon"><i class="ri-code-box-line"></i></a>
|
||||
<a href="https://github.com/listener-He" target="_blank" class="s-icon" aria-label="GitHub profile" tabindex="0"><i class="ri-github-fill"></i></a>
|
||||
<a href="mailto:hehouhui@foxmail.com" class="s-icon" aria-label="Email contact" tabindex="0"><i class="ri-mail-send-fill"></i></a>
|
||||
<a href="https://twitter.com/Honesty861024" target="_blank" class="s-icon" aria-label="Twitter profile" tabindex="0"><i class="ri-twitter-line"></i></a>
|
||||
<a href="https://www.zhihu.com/people/wen-xin-92-2-57" target="_blank" class="s-icon" aria-label="Zhihu profile" tabindex="0"><i class="ri-zhihu-line"></i></a>
|
||||
<a href="javascript:void(0);" onclick="toggleWechat()" class="s-icon" aria-label="WeChat QR code" tabindex="0"><i class="ri-wechat-fill"></i></a>
|
||||
<a href="https://juejin.cn/user/3659591622878503" target="_blank" class="s-icon" aria-label="Juejin profile" tabindex="0"><i class="ri-code-box-line"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -157,11 +159,11 @@
|
||||
<span class="stat-key" data-i18n="stats.followers">Followers</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-val neon-font" id="busuanzi_value_site_pv">0</span>
|
||||
<span class="stat-val neon-font" id="busuanzi_site_pv">0</span>
|
||||
<span class="stat-key" data-i18n="stats.visitNum">Visit num</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-val neon-font" id="busuanzi_value_site_uv">0</span>
|
||||
<span class="stat-val neon-font" id="busuanzi_site_uv">0</span>
|
||||
<span class="stat-key" data-i18n="stats.visitors">Visitors</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -173,7 +175,7 @@
|
||||
<span class="mbti-code gradient-text">INFJ</span>
|
||||
<span class="mbti-name" data-i18n="mbti.name">Advocate</span>
|
||||
<span class="mbti-icon">
|
||||
<img src="images/INFJ.png" alt="INFJ" style="width:32px;height:32px;border-radius:50%;border:2px solid rgba(255,255,255,0.4)"/>
|
||||
<img src="images/INFJ.webp" alt="INFJ" style="width:32px;height:32px;border-radius:50%;border:2px solid rgba(255,255,255,0.4)" loading="lazy"/>
|
||||
</span>
|
||||
</div>
|
||||
<p class="mbti-desc" data-i18n="mbti.desc">"理想主义与道德感，果断决绝的行动力。深度洞察与创意，关怀与同理心。"</p>
|
||||
@@ -238,12 +240,12 @@
|
||||
|
||||
<!-- 移动端显示的社交栏 (6个链接) -->
|
||||
<div class="bento-card area-social-mobile mobile-social">
|
||||
<a href="https://github.com/listener-He" class="ms-btn"><i class="ri-github-fill"></i></a>
|
||||
<a href="mailto:hehouhui@foxmail.com" class="ms-btn"><i class="ri-mail-send-fill"></i></a>
|
||||
<a href="https://blog.hehouhui.cn" class="ms-btn"><i class="ri-pages-line"></i></a>
|
||||
<a href="https://www.zhihu.com/people/wen-xin-92-2-57" class="ms-btn"><i class="ri-zhihu-line"></i></a>
|
||||
<a href="javascript:void(0);" onclick="toggleWechat()" class="ms-btn"><i class="ri-wechat-fill"></i></a>
|
||||
<a href="https://juejin.cn/user/3659591622878503" class="ms-btn"><i class="ri-code-box-line"></i></a>
|
||||
<a href="https://github.com/listener-He" class="ms-btn" aria-label="GitHub profile" tabindex="0"><i class="ri-github-fill"></i></a>
|
||||
<a href="mailto:hehouhui@foxmail.com" class="ms-btn" aria-label="Email contact" tabindex="0"><i class="ri-mail-send-fill"></i></a>
|
||||
<a href="https://twitter.com/Honesty861024" class="ms-btn" aria-label="Twitter profile" tabindex="0"><i class="ri-twitter-line"></i></a>
|
||||
<a href="https://www.zhihu.com/people/wen-xin-92-2-57" class="ms-btn" aria-label="Zhihu profile" tabindex="0"><i class="ri-zhihu-line"></i></a>
|
||||
<a href="javascript:void(0);" onclick="toggleWechat()" class="ms-btn" aria-label="WeChat QR code" tabindex="0"><i class="ri-wechat-fill"></i></a>
|
||||
<a href="https://juejin.cn/user/3659591622878503" class="ms-btn" aria-label="Juejin profile" tabindex="0"><i class="ri-code-box-line"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -264,7 +266,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 第三部分：最新文章 -->
|
||||
<div class="content-section">
|
||||
<div class="content-col">
|
||||
@@ -292,14 +294,15 @@
|
||||
|
||||
<!-- 移动端悬浮功能按钮 -->
|
||||
<div class="mobile-fab">
|
||||
<button id="fab-main" class="fab-main" aria-label="Actions"><i class="ri-magic-line"></i><span class="fab-label">Tools</span></button>
|
||||
<button id="fab-main" class="fab-main" aria-label="Actions" tabindex="0"><i class="ri-magic-line"></i><span class="fab-label">Tools</span></button>
|
||||
<div class="fab-menu" id="fab-menu">
|
||||
<button id="fab-lang" class="fab-item"><i class="ri-translate-2"></i><span class="fab-text">Lang</span></button>
|
||||
<button id="fab-theme" class="fab-item"><i class="ri-moon-line"></i><span class="fab-text">Theme</span></button>
|
||||
<button id="fab-music" class="fab-item"><i class="ri-music-2-line"></i><span class="fab-text">Play</span></button>
|
||||
<button id="fab-lang" class="fab-item" tabindex="0"><i class="ri-translate-2"></i><span class="fab-text">Lang</span></button>
|
||||
<button id="fab-theme" class="fab-item" tabindex="0"><i class="ri-moon-line"></i><span class="fab-text">Theme</span></button>
|
||||
<button id="fab-music" class="fab-item" tabindex="0"><i class="ri-music-2-line"></i><span class="fab-text">Play</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<audio id="site-audio" class="site-audio" src="data/至少做一件离谱的事-Kiri T.mp3" autoplay loop preload="auto"></audio>
|
||||
<!-- 隐藏的音频播放iframe -->
|
||||
<iframe id="audio-player-iframe" src="audio-player.html" style="display: none;"></iframe>
|
||||
</main>
|
||||
|
||||
<!-- 微信弹窗 -->
|
||||
@@ -308,7 +311,7 @@
|
||||
<button class="modal-close" onclick="toggleWechat()"><i class="ri-close-line"></i></button>
|
||||
<h3 data-i18n="modal.wechat">Official Account</h3>
|
||||
<div class="qr-box">
|
||||
<img src="https://blog-file.hehouhui.cn/wechat/mp-honesy.jpg" alt="WeChat QR" onerror="this.style.display='none';this.nextElementSibling.style.display='block'">
|
||||
<img src="./images/mp-honesy.jpg" alt="WeChat QR" onerror="this.style.display='none';this.nextElementSibling.style.display='block'" loading="lazy">
|
||||
<!-- <div class="qr-fallback">QR Load Failed</div>-->
|
||||
</div>
|
||||
<p data-i18n="modal.desc">Scan to follow Tech Share</p>
|
||||
@@ -316,7 +319,7 @@
|
||||
</div>
|
||||
|
||||
<footer class="site-footer">
|
||||
<p>© 2018 <span id="currentYear"></span> Honesty. All rights reserved. <a class="icp" href="https://beian.miit.gov.cn/" target="_blank">湘ICP备20014902号</a> Powered By <a href="https://pages.edgeone.ai/" target="_blank"> Tencent EdgeOne </a></p>
|
||||
<p>Copyright © 2018 <span id="currentYear"></span> Honesty. All rights reserved. <a class="icp" href="https://beian.miit.gov.cn/" target="_blank">湘ICP备20014902号</a> Powered By <a href="https://pages.edgeone.ai/" target="_blank"> Tencent EdgeOne </a></p>
|
||||
<script>
|
||||
document.getElementById("currentYear").textContent = ' - ' + new Date().getFullYear();
|
||||
</script>
|
||||
@@ -324,12 +327,9 @@
|
||||
</div>
|
||||
|
||||
<!-- 脚本：BootCDN jQuery / Artalk -->
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
||||
<script src="js/jquery.min.js"></script>
|
||||
<script src="js/config.js?version=20251125"></script>
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/artalk/2.9.1/Artalk.js"></script>
|
||||
<!-- 引入多语言包（按需） -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/artalk@latest/dist/i18n/zh-cn.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/artalk@latest/dist/i18n/en.js"></script>
|
||||
<script src="js/about.js?version=20251125"></script>
|
||||
|
||||
<!-- 不蒜子统计 -->
|
||||
@@ -368,53 +368,24 @@
|
||||
|
||||
<!-- 自动格式化脚本 -->
|
||||
<script>
|
||||
// 核心格式化函数：支持 K / W / M，保留最多两位小数，去除尾随零
|
||||
function formatWithUnit(num) {
|
||||
num = Number(num);
|
||||
if (isNaN(num) || num < 0) return '0';
|
||||
|
||||
// 小于 1000：直接显示
|
||||
if (num < 1_000) {
|
||||
return Math.floor(num).toString();
|
||||
}
|
||||
|
||||
// 1K ~ 9.99K
|
||||
if (num < 10_000) {
|
||||
let val = (num / 1_000).toFixed(2);
|
||||
return parseFloat(val) + 'K';
|
||||
}
|
||||
|
||||
// 1W ~ 99.99W （1W = 10,000）
|
||||
if (num < 1_000_000) {
|
||||
let val = (num / 10_000).toFixed(2);
|
||||
return parseFloat(val) + 'W';
|
||||
}
|
||||
|
||||
// ≥ 1M
|
||||
let val = (num / 1_000_000).toFixed(2);
|
||||
return parseFloat(val) + 'M';
|
||||
}
|
||||
|
||||
// 监听不蒜子数据更新并格式化
|
||||
// 监听不蒜子数据的错误兜底
|
||||
function initFormatter() {
|
||||
const pvEl = document.getElementById(SiteConfig.analytics.busuanzi.site_pv_id);
|
||||
const uvEl = document.getElementById(SiteConfig.analytics.busuanzi.site_uv_id);
|
||||
|
||||
if (!pvEl && !uvEl) return;
|
||||
|
||||
console.log('[Busuanzi]', 'Formatting... Listener observer');
|
||||
const observer = new MutationObserver(() => {
|
||||
if (pvEl?.textContent) {
|
||||
const raw = pvEl.textContent.trim().replace(/[,，]/g, '');
|
||||
const num = parseFloat(raw);
|
||||
if (!isNaN(num)) {
|
||||
pvEl.textContent = formatWithUnit(num);
|
||||
if (pvEl.textContent.includes('禁用')) {
|
||||
pvEl.textContent = '-';
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (uvEl?.textContent) {
|
||||
const raw = uvEl.textContent.trim().replace(/[,，]/g, '');
|
||||
const num = parseFloat(raw);
|
||||
if (!isNaN(num)) {
|
||||
uvEl.textContent = formatWithUnit(num);
|
||||
if (uvEl.textContent.includes('禁用')) {
|
||||
uvEl.textContent = '-';
|
||||
return;
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -430,37 +401,5 @@
|
||||
initFormatter();
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- PWA注册 -->
|
||||
<script>
|
||||
if ('serviceWorker' in navigator) {
|
||||
window.addEventListener('load', function() {
|
||||
setTimeout(() => {
|
||||
navigator.serviceWorker.register('./js/sw.js')
|
||||
.then(function(registration) {
|
||||
console.log('SW registered: ', registration);
|
||||
})
|
||||
.catch(function(registrationError) {
|
||||
console.log('SW registration failed: ', registrationError);
|
||||
});
|
||||
}, 3000); // 页面稳定后再注册
|
||||
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Apple PWA支持 -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<meta name="apple-mobile-web-app-title" content="Honesty">
|
||||
<link rel="apple-touch-icon" href="./images/avatar.jpeg">
|
||||
|
||||
<!-- Windows PWA支持 -->
|
||||
<meta name="msapplication-TileImage" content="./images/avatar.jpeg">
|
||||
<meta name="msapplication-TileColor" content="#6c5ce7">
|
||||
<meta name="msapplication-tap-highlight" content="no">
|
||||
|
||||
<!-- 其他PWA相关meta标签 -->
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
208
audio-player.html
Normal file
208
audio-player.html
Normal file
@@ -0,0 +1,208 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Audio Player</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<audio id="audio-player" controls autoplay style="display: none;"></audio>
|
||||
|
||||
<script>
|
||||
const audio = document.getElementById('audio-player');
|
||||
let currentSrc = '';
|
||||
let isStateBroadcasting = false;
|
||||
|
||||
// 监听来自主页面的消息
|
||||
window.addEventListener('message', function(event) {
|
||||
// 允许来自同域的所有窗口的消息
|
||||
if (event.origin !== window.location.origin) return;
|
||||
|
||||
const data = event.data;
|
||||
|
||||
switch (data.action) {
|
||||
case 'play':
|
||||
// 如果当前正在播放，则暂停；否则播放
|
||||
if (audio.paused) {
|
||||
audio.play().catch(e => console.error('播放失败:', e));
|
||||
} else {
|
||||
audio.pause();
|
||||
}
|
||||
// 发送状态更新回所有可能的窗口
|
||||
broadcastState();
|
||||
break;
|
||||
|
||||
case 'pause':
|
||||
if (!audio.paused) {
|
||||
audio.pause();
|
||||
}
|
||||
broadcastState();
|
||||
break;
|
||||
|
||||
case 'setTrack':
|
||||
if (currentSrc !== data.src) {
|
||||
currentSrc = data.src;
|
||||
audio.src = data.src;
|
||||
audio.load();
|
||||
// 自动播放新曲目
|
||||
setTimeout(() => {
|
||||
audio.play().catch(e => console.error('播放失败:', e));
|
||||
broadcastState();
|
||||
}, 100);
|
||||
}
|
||||
break;
|
||||
|
||||
case 'setVolume':
|
||||
audio.volume = data.volume;
|
||||
broadcastState();
|
||||
break;
|
||||
|
||||
case 'getCurrentState':
|
||||
// 向请求方发送当前状态
|
||||
event.source.postMessage({
|
||||
action: 'currentState',
|
||||
playing: !audio.paused,
|
||||
src: audio.src,
|
||||
volume: audio.volume,
|
||||
currentTime: audio.currentTime,
|
||||
duration: audio.duration || 0
|
||||
}, event.origin);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
// 广播状态到所有可能监听的窗口
|
||||
function broadcastState() {
|
||||
if (isStateBroadcasting) return; // 防止状态广播循环
|
||||
|
||||
isStateBroadcasting = true;
|
||||
window.parent.postMessage({
|
||||
action: 'stateChange',
|
||||
playing: !audio.paused,
|
||||
src: audio.src,
|
||||
volume: audio.volume,
|
||||
currentTime: audio.currentTime,
|
||||
duration: audio.duration || 0
|
||||
}, '*');
|
||||
|
||||
// 保存播放状态
|
||||
savePlaybackState();
|
||||
|
||||
setTimeout(() => {
|
||||
isStateBroadcasting = false;
|
||||
}, 10);
|
||||
}
|
||||
|
||||
// 监听音频事件并通知主页面
|
||||
audio.addEventListener('play', function() {
|
||||
broadcastState();
|
||||
});
|
||||
|
||||
audio.addEventListener('pause', function() {
|
||||
broadcastState();
|
||||
});
|
||||
|
||||
audio.addEventListener('ended', function() {
|
||||
window.parent.postMessage({
|
||||
action: 'trackEnded'
|
||||
}, '*');
|
||||
});
|
||||
|
||||
// 页面加载完成后通知主页面
|
||||
window.addEventListener('load', function() {
|
||||
// 恢复之前保存的播放状态
|
||||
restorePlaybackState();
|
||||
|
||||
window.parent.postMessage({
|
||||
action: 'playerReady'
|
||||
}, '*');
|
||||
});
|
||||
|
||||
// 页面可见性变化时处理
|
||||
document.addEventListener('visibilitychange', function() {
|
||||
if (!document.hidden) {
|
||||
// 页面变为可见时，广播当前状态
|
||||
setTimeout(broadcastState, 100);
|
||||
}
|
||||
});
|
||||
|
||||
// 页面即将卸载时保存播放状态
|
||||
window.addEventListener('beforeunload', function() {
|
||||
savePlaybackState();
|
||||
});
|
||||
|
||||
// 保存播放状态到 sessionStorage
|
||||
function savePlaybackState() {
|
||||
try {
|
||||
sessionStorage.setItem('audioState', JSON.stringify({
|
||||
src: audio.src,
|
||||
currentTime: audio.currentTime,
|
||||
playing: !audio.paused,
|
||||
volume: audio.volume,
|
||||
timestamp: Date.now()
|
||||
}));
|
||||
} catch (e) {
|
||||
console.error('保存音频状态失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 从 sessionStorage 恢复播放状态
|
||||
function restorePlaybackState() {
|
||||
try {
|
||||
const savedState = sessionStorage.getItem('audioState');
|
||||
if (savedState) {
|
||||
const state = JSON.parse(savedState);
|
||||
// 如果状态保存时间不超过1小时，则恢复播放
|
||||
if (Date.now() - state.timestamp < 3600000) {
|
||||
currentSrc = state.src;
|
||||
audio.src = state.src;
|
||||
audio.volume = state.volume !== undefined ? state.volume : 1.0;
|
||||
audio.currentTime = state.currentTime || 0;
|
||||
|
||||
// 确保在用户交互后才尝试播放
|
||||
if (state.playing) {
|
||||
// 检查是否已经有用户交互
|
||||
if (document.hasFocus()) {
|
||||
// 稍微延迟播放，确保一切准备就绪
|
||||
setTimeout(() => {
|
||||
audio.play().catch(e => {
|
||||
console.error('恢复播放失败:', e);
|
||||
// 如果自动播放失败，等待用户交互后再播放
|
||||
const tryPlayOnInteraction = () => {
|
||||
audio.play().catch(console.error);
|
||||
document.removeEventListener('click', tryPlayOnInteraction);
|
||||
document.removeEventListener('touchstart', tryPlayOnInteraction);
|
||||
};
|
||||
|
||||
document.addEventListener('click', tryPlayOnInteraction, { once: true });
|
||||
document.addEventListener('touchstart', tryPlayOnInteraction, { once: true });
|
||||
});
|
||||
}, 300);
|
||||
} else {
|
||||
// 等待用户交互后再播放
|
||||
const tryPlayOnInteraction = () => {
|
||||
audio.play().catch(console.error);
|
||||
document.removeEventListener('click', tryPlayOnInteraction);
|
||||
document.removeEventListener('touchstart', tryPlayOnInteraction);
|
||||
};
|
||||
|
||||
document.addEventListener('click', tryPlayOnInteraction, { once: true });
|
||||
document.addEventListener('touchstart', tryPlayOnInteraction, { once: true });
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('恢复音频状态失败:', e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
3931
css/about.css
3931
css/about.css
File diff suppressed because it is too large
Load Diff
461
css/artalk.css
461
css/artalk.css
@@ -3,6 +3,7 @@
|
||||
/* Base Artalk container styles */
|
||||
#artalk-container {
|
||||
border-radius: 12px;
|
||||
contain: layout style;
|
||||
}
|
||||
|
||||
/* 确保评论区域适配白天/黑夜模式 */
|
||||
@@ -31,7 +32,7 @@
|
||||
background: rgba(128, 128, 128, 0.08);
|
||||
}
|
||||
|
||||
#artalk-container .atk-dialog,
|
||||
#artalk-container .atk-dialog,
|
||||
#artalk-container .atk-layer .atk-dialog {
|
||||
background: var(--glass-bg);
|
||||
color: var(--text-primary);
|
||||
@@ -44,7 +45,6 @@
|
||||
|
||||
/* Light theme styles */
|
||||
.atk-main-editor {
|
||||
background: rgba(255, 255, 255, 0.85) !important;
|
||||
backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
-webkit-backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
border: 1px solid rgba(108, 92, 231, 0.2) !important;
|
||||
@@ -208,118 +208,7 @@
|
||||
color: #6c5ce7 !important;
|
||||
}
|
||||
|
||||
/* Night theme styles */
|
||||
[data-theme="night"] .atk-main-editor {
|
||||
background: rgba(30, 30, 35, 0.75) !important;
|
||||
backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
-webkit-backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12) !important;
|
||||
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.8) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
border: none !important;
|
||||
border-radius: 20px !important;
|
||||
padding: 8px 20px !important;
|
||||
font-weight: 500 !important;
|
||||
transition: all 0.3s ease !important;
|
||||
box-shadow: 0 4px 15px rgba(0, 206, 201, 0.4);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:hover {
|
||||
background: linear-gradient(135deg, #00b3ae, #009690) !important;
|
||||
transform: translateY(-2px) !important;
|
||||
box-shadow: 0 6px 20px rgba(0, 206, 201, 0.6) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:active {
|
||||
transform: translateY(0) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor,
|
||||
[data-theme="night"] .atk-editor textarea,
|
||||
[data-theme="night"] .atk-editor input {
|
||||
background: rgba(30, 30, 35, 0.75);
|
||||
color: #dfe6e9;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap {
|
||||
background: rgba(40, 40, 45, 0.85); /* 提高背景不透明度以增强可读性 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap:hover {
|
||||
background: rgba(45, 45, 50, 0.95); /* 提高悬停时的背景不透明度 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.18);
|
||||
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dialog,
|
||||
[data-theme="night"] .atk-layer .atk-dialog {
|
||||
background: rgba(30, 30, 35, 0.85);
|
||||
color: #dfe6e9;
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-header-item {
|
||||
color: #dfe6e9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-textarea {
|
||||
color: #dfe6e9 !important;
|
||||
background: rgba(40, 40, 45, 0.5) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-bottom .atk-item {
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-list-header .atk-comment-count {
|
||||
color: #dfe6e9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-sort-select {
|
||||
background: rgba(255, 255, 255, 0.08) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.15) !important;
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-nick {
|
||||
color: #ffffff !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-date {
|
||||
color: #a0aec0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content {
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content a {
|
||||
color: #00cec9 !important;
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content pre {
|
||||
background: rgba(20, 20, 25, 0.7) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action {
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action:hover {
|
||||
color: #00cec9 !important;
|
||||
}
|
||||
|
||||
/* Mobile specific styles */
|
||||
.atk-mobile .atk-main-editor {
|
||||
@@ -456,30 +345,7 @@
|
||||
box-shadow: 0 6px 15px rgba(108, 92, 231, 0.25) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item {
|
||||
background: rgba(255, 255, 255, 0.08) !important;
|
||||
color: #b2bec3 !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
|
||||
backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
-webkit-backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item:hover {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
color: white !important;
|
||||
border: 1px solid rgba(0, 206, 201, 0.3) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 206, 201, 0.3) !important;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item.atk-active {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
color: white !important;
|
||||
border: 1px solid rgba(0, 206, 201, 0.4) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 206, 201, 0.4) !important;
|
||||
}
|
||||
|
||||
/* Loading spinner */
|
||||
.atk-loading {
|
||||
@@ -516,6 +382,11 @@
|
||||
margin: 2px !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-toolbar .atk-btn {
|
||||
color: #b2bec3 !important;
|
||||
filter: brightness(1.3);
|
||||
}
|
||||
|
||||
/* 暗色模式下聚焦边框 */
|
||||
.atk-dark .atk-editor-textarea:focus {
|
||||
box-shadow: 0 0 0 2px rgba(66, 153, 225, 0.5) !important;
|
||||
@@ -526,42 +397,42 @@
|
||||
.atk-header {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-editor-plug-wrap {
|
||||
padding: 0 15px 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-editor-textarea {
|
||||
padding: 12px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-editor-bottom {
|
||||
padding: 0 15px 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-list-header {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-comment-wrap {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-pagination {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-pagination .atk-page-item {
|
||||
padding: 6px 12px !important;
|
||||
margin: 0 3px !important;
|
||||
font-size: 0.9rem !important;
|
||||
}
|
||||
|
||||
|
||||
/* 移动端增强样式 */
|
||||
.atk-main-editor {
|
||||
border-radius: 16px !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-comment-wrap {
|
||||
padding: 12px 0 !important;
|
||||
font-size: 0.95rem !important;
|
||||
@@ -573,24 +444,24 @@
|
||||
border-top: none !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
|
||||
.atk-avatar {
|
||||
width: 28px !important;
|
||||
height: 28px !important;
|
||||
object-fit: cover; /* 修复移动端头像拉伸问题 */
|
||||
}
|
||||
|
||||
|
||||
.atk-meta {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
|
||||
/* 修复移动端输入框底色问题 */
|
||||
[data-theme="night"] .atk-editor-textarea {
|
||||
background: rgba(40, 40, 45, 0.5) !important;
|
||||
color: #dfe6e9 !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
|
||||
/* 完全移除评论区域的容器样式以节省宽度 */
|
||||
#artalk-container {
|
||||
border-radius: 0 !important;
|
||||
@@ -599,13 +470,299 @@
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
|
||||
/* 黑夜模式下移动端评论背景色优化 */
|
||||
[data-theme="night"] .atk-comment-wrap {
|
||||
background: rgba(40, 40, 45, 0.9) !important; /* 提高移动端黑夜模式下的背景不透明度 */
|
||||
}
|
||||
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap:hover {
|
||||
background: rgba(45, 45, 50, 0.95) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Night theme styles */
|
||||
[data-theme="night"] .atk-main-editor {
|
||||
background: rgba(30, 30, 35, 0.75) !important;
|
||||
backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
-webkit-backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12) !important;
|
||||
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.8) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
border: none !important;
|
||||
border-radius: 20px !important;
|
||||
padding: 8px 20px !important;
|
||||
font-weight: 500 !important;
|
||||
transition: all 0.3s ease !important;
|
||||
box-shadow: 0 4px 15px rgba(0, 206, 201, 0.4);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:hover {
|
||||
background: linear-gradient(135deg, #00b3ae, #009690) !important;
|
||||
transform: translateY(-2px) !important;
|
||||
box-shadow: 0 6px 20px rgba(0, 206, 201, 0.6) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:active {
|
||||
transform: translateY(0) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor,
|
||||
[data-theme="night"] .atk-editor textarea,
|
||||
[data-theme="night"] .atk-editor input {
|
||||
background: rgba(30, 30, 35, 0.75)!important;
|
||||
color: #dfe6e9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap {
|
||||
background: rgba(40, 40, 45, 0.85) !important; /* 提高背景不透明度以增强可读性 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.12) !important;
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap:hover {
|
||||
background: rgba(45, 45, 50, 0.95) !important; /* 提高悬停时的背景不透明度 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.18) !important;
|
||||
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dialog,
|
||||
[data-theme="night"] .atk-layer .atk-dialog {
|
||||
background: rgba(30, 30, 35, 0.85) !important;
|
||||
color: #dfe6e9 !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.15) !important;
|
||||
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.8) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-header-item {
|
||||
color: #dfe6e9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-textarea {
|
||||
color: #1f2937 !important;
|
||||
background: rgba(40, 40, 45, 0.5) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-bottom .atk-item {
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-list-header .atk-comment-count {
|
||||
color: #dfe6e9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-sort-select {
|
||||
background: rgba(255, 255, 255, 0.08) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.15) !important;
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-nick {
|
||||
color: #ffffff !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-date {
|
||||
color: #a0aec0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content {
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content a {
|
||||
color: #00cec9 !important;
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content pre {
|
||||
background: rgba(20, 20, 25, 0.7) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action {
|
||||
color: #b2bec3 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action:hover {
|
||||
color: #00cec9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item {
|
||||
background: rgba(255, 255, 255, 0.08) !important;
|
||||
color: #b2bec3 !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
|
||||
backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
-webkit-backdrop-filter: blur(28px) saturate(180%) !important;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item:hover {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
color: white !important;
|
||||
border: 1px solid rgba(0, 206, 201, 0.3) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 206, 201, 0.3) !important;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-pagination .atk-page-item.atk-active {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
color: white !important;
|
||||
border: 1px solid rgba(0, 206, 201, 0.4) !important;
|
||||
box-shadow: 0 8px 25px rgba(0, 206, 201, 0.4) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* PC端黑夜模式下的输入框颜色和列表样式修正 - 全面优化版 */
|
||||
[data-theme="night"] .atk-editor-textarea {
|
||||
background: rgba(30, 30, 35, 0.95) !important; /* 提高背景不透明度增强可读性 */
|
||||
color: #ffffff !important; /* 使用更亮的文字颜色 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.2) !important; /* 增强边框可见性 */
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-textarea:focus {
|
||||
border: 1px solid #00cec9 !important;
|
||||
box-shadow: 0 0 0 3px rgba(0, 206, 201, 0.4) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap {
|
||||
background: rgba(30, 30, 35, 0.95) !important; /* 提高背景不透明度增强可读性 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.15) !important;
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment-wrap:hover {
|
||||
background: rgba(40, 40, 45, 0.98) !important; /* 进一步提高背景不透明度 */
|
||||
border: 1px solid rgba(0, 206, 201, 0.5) !important; /* 增强边框可见性 */
|
||||
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-list-header {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-header {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
/* 修复黑夜模式下插件面板的背景色问题 */
|
||||
[data-theme="night"] .atk-editor-plug-wrap,
|
||||
[data-theme="night"] .atk-plug-panel-wrap,
|
||||
[data-theme="night"] .atk-editor-plug-emoticons,
|
||||
[data-theme="night"] .atk-editor-plug-preview {
|
||||
background: rgba(30, 30, 35, 0.95) !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-plug-panel-wrap {
|
||||
border: 1px solid rgba(255, 255, 255, 0.15) !important;
|
||||
border-radius: 12px !important;
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-plug-emoticons {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
/* 优化评论底部工具栏在黑夜模式下的样式 */
|
||||
[data-theme="night"] .atk-editor-bottom {
|
||||
background: rgba(40, 40, 45, 0.7) !important;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
|
||||
padding: 12px 20px !important;
|
||||
border-radius: 0 0 12px 12px !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-editor-bottom .atk-item {
|
||||
color: #b2bec3 !important;
|
||||
margin-right: 12px !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn {
|
||||
background: linear-gradient(135deg, #00cec9, #00b3ae) !important;
|
||||
border: none !important;
|
||||
border-radius: 20px !important;
|
||||
padding: 8px 20px !important;
|
||||
font-weight: 500 !important;
|
||||
transition: all 0.3s ease !important;
|
||||
box-shadow: 0 4px 15px rgba(0, 206, 201, 0.4);
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:hover {
|
||||
background: linear-gradient(135deg, #00b3ae, #009690) !important;
|
||||
transform: translateY(-2px) !important;
|
||||
box-shadow: 0 6px 20px rgba(0, 206, 201, 0.6) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-send-btn:active {
|
||||
transform: translateY(0) !important;
|
||||
}
|
||||
|
||||
/* 优化评论列表项在黑夜模式下的样式 */
|
||||
[data-theme="night"] .atk-comment {
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-nick {
|
||||
color: #ffffff !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-date {
|
||||
color: #a0aec0 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content {
|
||||
color: #ffffff !important; /* 使用更亮的文字颜色提高可读性 */
|
||||
line-height: 1.6 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-comment .atk-content a {
|
||||
color: #00cec9 !important;
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action {
|
||||
color: #b2bec3 !important;
|
||||
transition: all 0.2s ease !important;
|
||||
margin-right: 15px; /* 增加回复评论组件的边距 */
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-actions .atk-action:hover {
|
||||
color: #00cec9 !important;
|
||||
}
|
||||
|
||||
/* 修复黑夜模式下评论计数和下拉菜单的可见性 */
|
||||
[data-theme="night"] .atk-comment-count {
|
||||
color: #ffffff !important;
|
||||
font-weight: 600 !important;
|
||||
text-shadow: 0 0 8px rgba(255, 255, 255, 0.3) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dropdown-wrap {
|
||||
background: rgba(30, 30, 35, 0.95) !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dropdown-item {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dropdown-item:hover {
|
||||
background: rgba(0, 206, 201, 0.2) !important;
|
||||
color: #00cec9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-dropdown-item.active {
|
||||
background: rgba(0, 206, 201, 0.3) !important;
|
||||
color: #00cec9 !important;
|
||||
}
|
||||
|
||||
[data-theme="night"] .atk-arrow-down-icon {
|
||||
filter: brightness(2) !important;
|
||||
}
|
||||
|
||||
@@ -262,7 +262,7 @@ pre code { padding: 0; background: none; border: none; word-wrap: normal; }
|
||||
font-size: 1.3em;
|
||||
font-weight: normal;
|
||||
letter-spacing: 2px;
|
||||
color: #f0f0f0;
|
||||
color: #ffffff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
@@ -275,7 +275,7 @@ pre code { padding: 0; background: none; border: none; word-wrap: normal; }
|
||||
line-height: 2;
|
||||
letter-spacing: 2px;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 1px 2px rgba(141, 114, 114, 0.2) !important;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-feature-settings: 'kern' 1;
|
||||
@@ -872,7 +872,7 @@ nav {
|
||||
|
||||
.weixin-qrcode-desc {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
color: #555;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
@@ -986,12 +986,12 @@ nav {
|
||||
display: inline-block;
|
||||
margin: 0 5px;
|
||||
font-size: 0.5em;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.power a {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
font-size: 0.5em;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
@@ -1006,8 +1006,7 @@ nav {
|
||||
.remark .power:not(:last-child):after {
|
||||
content: "|";
|
||||
margin-left: 8px;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -1,32 +1,58 @@
|
||||
[
|
||||
{
|
||||
"id": 1011713435,
|
||||
"name": "spring-ai-example",
|
||||
"stargazers_count": 13,
|
||||
"forks_count": 0,
|
||||
"description": "本项目是一个基于 Spring AI 框架构建的检索增强生成（RAG）应用，旨在通过向量检索技术增强大模型的生成能力，使 AI 回答既智能又有依据。 项目采用现代化 Java 技术栈，核心框架为 Spring Boot 3.3 与 Spring AI 1.0，集成 OpenAI 模型（deepseek-r1、doubao-embedding）主打白嫖，支持 PostgreSQL+pgvector、Elasticsearch 等多种向量存储方案，并利用 Redis 实现缓存加速、Elasticsearch 管理对话记忆。",
|
||||
"html_url": "https://github.com/listener-He/spring-ai-example"
|
||||
},
|
||||
{
|
||||
"name": "yunxiao-LLM-reviewer",
|
||||
"html_url": "https://github.com/listener-He/yunxiao-LLM-reviewer",
|
||||
"description": "一款专为阿里云云效 Flow 平台设计的自动化代码审查工具。通过集成 Qwen、DeepSeek 等先进大模型，该工具能够实时分析 Git 合并请求（MR）中的代码变更，智能识别潜在问题并自动生成结构化评审意见。",
|
||||
"stargazers_count": 9,
|
||||
"stargazers_count": 10,
|
||||
"forks_count": 3,
|
||||
"language": "TypeScript",
|
||||
"updated_at": "2025-10-10T11:06:34Z"
|
||||
"description": "一款专为阿里云云效 Flow 平台设计的自动化代码审查工具。通过集成 Qwen、DeepSeek 等先进大模型，该工具能够实时分析 Git 合并请求（MR）中的代码变更，智能识别潜在问题并自动生成结构化评审意见。 工具支持多维度代码检测，包括逻辑错误、安全漏洞，有效提升团队代码质量与开发效率。 作为云效 Flow 的自定义步骤，该工具可无缝集成到 CI/CD 流水线中，实现 MR 提交时的自动化代码审查，大幅减少人工评审工作量，加速代码交付流程。",
|
||||
"html_url": "https://github.com/listener-He/yunxiao-LLM-reviewer"
|
||||
},
|
||||
{
|
||||
"id": 1064414600,
|
||||
"name": "hexo-theme-stellar",
|
||||
"html_url": "https://github.com/listener-He/hexo-theme-stellar",
|
||||
"description": "综合型hexo主题：博客+知识库+专栏+笔记，内置海量的标签组件和动态数据组件。",
|
||||
"stargazers_count": 0,
|
||||
"name": "Home",
|
||||
"stargazers_count": 2,
|
||||
"forks_count": 0,
|
||||
"language": null,
|
||||
"updated_at": "2025-09-26T02:12:18Z"
|
||||
"description": "现代化个人主页，融合科技感与个性化元素，展示个人技术栈、开源项目和博客文章。",
|
||||
"html_url": "https://github.com/listener-He/Home"
|
||||
},
|
||||
{
|
||||
"id": 1060085476,
|
||||
"name": "Universal-IoT-Java",
|
||||
"html_url": "https://github.com/listener-He/Universal-IoT-Java",
|
||||
"description": "通用 IoT Java 平台（示例）",
|
||||
"stargazers_count": 0,
|
||||
"name": "collection-complete",
|
||||
"stargazers_count": 2,
|
||||
"forks_count": 2,
|
||||
"description": "collection-complete 是一个用于处理集合数据并补充相关信息的Java库。它提供了链式调用的功能，可以方便地对集合中的元素进行批量操作和属性补充。全程函数式 均衡了易用性与扩展性的设计",
|
||||
"html_url": "https://github.com/listener-He/collection-complete"
|
||||
},
|
||||
{
|
||||
"name": "keycloak-services-social-weixin",
|
||||
"stargazers_count": 2,
|
||||
"forks_count": 3,
|
||||
"description": "",
|
||||
"html_url": "https://github.com/listener-He/keycloak-services-social-weixin"
|
||||
},
|
||||
{
|
||||
"name": "Notion-Wechat-Blog",
|
||||
"stargazers_count": 1,
|
||||
"forks_count": 0,
|
||||
"language": null,
|
||||
"updated_at": "2025-10-13T02:30:28Z"
|
||||
"description": "基于NotionNext作为后端的微信小程序",
|
||||
"html_url": "https://github.com/listener-He/Notion-Wechat-Blog"
|
||||
},
|
||||
{
|
||||
"name": "social-auth",
|
||||
"stargazers_count": 1,
|
||||
"forks_count": 0,
|
||||
"description": "",
|
||||
"html_url": "https://github.com/listener-He/social-auth"
|
||||
},
|
||||
{
|
||||
"name": "hp-lite",
|
||||
"stargazers_count": 0,
|
||||
"forks_count": 1,
|
||||
"description": "内网穿透 轻量版 支持 https http tcp udp 支持云端动态控制穿透配置，支持免费SSL证书和续签、支持限流和IP黑白名单，多账户、统计、http、socks代理、反向代理、多设备管理等功能。",
|
||||
"html_url": "https://github.com/listener-He/hp-lite"
|
||||
}
|
||||
]
|
||||
]
|
||||
|
||||
BIN
data/至少做一件离谱的事-Kiri T_compressed.mp3
Normal file
BIN
data/至少做一件离谱的事-Kiri T_compressed.mp3
Normal file
Binary file not shown.
BIN
images/INFJ.webp
Normal file
BIN
images/INFJ.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
images/bj/1.webp
Normal file
BIN
images/bj/1.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 691 KiB |
BIN
images/bj/10.jpg
BIN
images/bj/10.jpg
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
BIN
images/bj/2.webp
Normal file
BIN
images/bj/2.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 415 KiB |
BIN
images/bj/3.webp
Normal file
BIN
images/bj/3.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 488 KiB |
BIN
images/bj/4.webp
Normal file
BIN
images/bj/4.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
images/bj/5.webp
Normal file
BIN
images/bj/5.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 168 KiB |
BIN
images/bj/6.webp
Normal file
BIN
images/bj/6.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
BIN
images/bj/7.webp
Normal file
BIN
images/bj/7.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 786 KiB |
BIN
images/bj/8.webp
Normal file
BIN
images/bj/8.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
images/bj/9.jpg
BIN
images/bj/9.jpg
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 MiB |
BIN
images/mp-honesy.jpg
Normal file
BIN
images/mp-honesy.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
73
index.html
73
index.html
@@ -13,9 +13,6 @@
|
||||
<meta name="keywords" content="Honesty,HeHouHui,HeHui,明厚">
|
||||
<meta name="author" content="Honesty">
|
||||
|
||||
<!-- PWA相关配置 -->
|
||||
<meta name="theme-color" content="#6c5ce7">
|
||||
<link rel="manifest" href="./manifest.json">
|
||||
|
||||
<!-- 社交平台分享优化 -->
|
||||
<!-- Open Graph / Facebook -->
|
||||
@@ -67,7 +64,7 @@
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body oncontextmenu=self.event.returnValue=false onselectstart="return false">
|
||||
<body>
|
||||
<header id="panel" class="panel-cover">
|
||||
<script>
|
||||
WIDGET = {
|
||||
@@ -107,7 +104,7 @@
|
||||
<div class="info iUp">
|
||||
<div class="info-back">
|
||||
<img alt="img" src="images/kl.gif"
|
||||
class="js-avatar profilepic">
|
||||
class="js-avatar profilepic" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@@ -266,9 +263,9 @@
|
||||
<div class="weixin-qrcode-container">
|
||||
<div class="weixin-qrcode-title">扫描二维码</div>
|
||||
<div class="weixin-qrcode-desc">请使用微信扫一扫添加关注</div>
|
||||
<img src="https://blog-file.hehouhui.cn/wechat/mp-honesy.jpg" alt="微信二维码"
|
||||
<img src="./images/mp-honesy.jpg" alt="微信二维码"
|
||||
class="weixin-qrcode-image"
|
||||
onerror="this.src='https://cdn.jsdmirror.com/gh/listener-He/Home/images/logo.png'; this.alt='二维码加载失败'">
|
||||
onerror="this.src='https://cdn.jsdmirror.com/gh/listener-He/Home/images/logo.png'; this.alt='二维码加载失败'" loading="lazy">
|
||||
<button class="weixin-qrcode-close" onclick="closeWeixin()">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -280,7 +277,7 @@
|
||||
// 防止滚动穿透
|
||||
document.body.style.overflow = 'hidden';
|
||||
// 添加ESC键关闭
|
||||
document.addEventListener('keydown', closeOnEsc);
|
||||
document.addEventListener('keydown', closeOnEsc, { passive: false });
|
||||
}
|
||||
|
||||
function closeWeixin() {
|
||||
@@ -289,7 +286,7 @@
|
||||
// 恢复滚动
|
||||
document.body.style.overflow = '';
|
||||
// 移除ESC键监听
|
||||
document.removeEventListener('keydown', closeOnEsc);
|
||||
document.removeEventListener('keydown', closeOnEsc, { passive: false });
|
||||
}
|
||||
|
||||
function closeOnEsc(e) {
|
||||
@@ -303,12 +300,12 @@
|
||||
if (e.target === this) {
|
||||
closeWeixin();
|
||||
}
|
||||
});
|
||||
}, { passive: false });
|
||||
|
||||
// 阻止点击弹框内容时关闭
|
||||
document.querySelector('.weixin-qrcode-container').addEventListener('click', function (e) {
|
||||
e.stopPropagation();
|
||||
});
|
||||
}, { passive: false });
|
||||
</script>
|
||||
</div>
|
||||
<div class="remark iUp">
|
||||
@@ -395,7 +392,7 @@
|
||||
<!-- 可选：继续调用 config -->
|
||||
<script type="text/javascript">
|
||||
try {
|
||||
gtag('config', 'G-DYWDEVKDP0');
|
||||
gtag('config', SiteConfig.analytics.google.id);
|
||||
} catch (e) {
|
||||
console.error("Google Analytics config 失败", e);
|
||||
}
|
||||
@@ -414,38 +411,28 @@
|
||||
};
|
||||
s.LA ? s.LA.ids && o() : (s.LA = p, s.LA.ids = [], o()), r.parentNode.insertBefore(n, r)
|
||||
}()
|
||||
}({id: "3OBGjwDdEIRS7XZ1", ck: "3OBGjwDdEIRS7XZ1"});
|
||||
}({id: SiteConfig.analytics.tencent.id, ck: SiteConfig.analytics.tencent.ck});
|
||||
</script>
|
||||
|
||||
<!-- PWA注册 -->
|
||||
<script>
|
||||
if ('serviceWorker' in navigator) {
|
||||
window.addEventListener('load', function () {
|
||||
setTimeout(() => {
|
||||
navigator.serviceWorker.register('./js/sw.js')
|
||||
.then(function(registration) {
|
||||
console.log('SW registered: ', registration);
|
||||
})
|
||||
.catch(function(registrationError) {
|
||||
console.log('SW registration failed: ', registrationError);
|
||||
});
|
||||
}, 3000); // 页面稳定后再注册
|
||||
<!-- 隐藏的音频播放iframe -->
|
||||
<iframe id="audio-player-iframe" src="audio-player.html" style="display: none;"></iframe>
|
||||
|
||||
<script>
|
||||
// 音频控制逻辑
|
||||
let audioIframe = document.getElementById('audio-player-iframe');
|
||||
// 监听来自iframe的消息
|
||||
window.addEventListener('message', function(event) {
|
||||
// 确保消息来自我们的iframe
|
||||
if (event.source !== audioIframe.contentWindow) return;
|
||||
const data = event.data;
|
||||
if (data.playing && data.action === 'playerReady') {
|
||||
// iframe准备就绪，设置初始音频
|
||||
audioIframe.contentWindow.postMessage({
|
||||
action: 'setTrack',
|
||||
src: 'data/至少做一件离谱的事-Kiri T_compressed.mp3'
|
||||
}, '*');
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Apple PWA支持 -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<meta name="apple-mobile-web-app-title" content="Honesty">
|
||||
<link rel="apple-touch-icon" href="./images/logo.png">
|
||||
|
||||
<!-- Windows PWA支持 -->
|
||||
<meta name="msapplication-TileImage" content="./images/avatar.jpeg">
|
||||
<meta name="msapplication-TileColor" content="#6c5ce7">
|
||||
<meta name="msapplication-tap-highlight" content="no">
|
||||
|
||||
<!-- 其他PWA相关meta标签 -->
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -84,7 +84,7 @@ const StarrySky = function () {
|
||||
}
|
||||
}
|
||||
starCount = Math.ceil(canvasWidth * starCountLevel);
|
||||
}, 200));
|
||||
}, 200), { passive: true });
|
||||
} else {
|
||||
console.error('初始化失败，必须传入Canvas元素');
|
||||
}
|
||||
@@ -160,7 +160,7 @@ const StarrySky = function () {
|
||||
canvasContext.shadowOffsetX = 0;
|
||||
canvasContext.shadowOffsetY = 0;
|
||||
canvasContext.shadowColor = "rgb(" + star["color"] + ")";
|
||||
canvasContext.shadowBlur = 10;
|
||||
canvasContext.shadowBlur = 5;
|
||||
canvasContext.beginPath();
|
||||
canvasContext.arc(star_x, star_y, star_radius, 0, 2 * Math.PI);
|
||||
canvasContext.fill();
|
||||
|
||||
810
js/about.js
810
js/about.js
File diff suppressed because it is too large
Load Diff
42
js/audio-service-worker.js
Normal file
42
js/audio-service-worker.js
Normal file
@@ -0,0 +1,42 @@
|
||||
// audio-service-worker.js
|
||||
// Service Worker for background audio playback
|
||||
|
||||
self.addEventListener('install', event => {
|
||||
self.skipWaiting();
|
||||
});
|
||||
|
||||
self.addEventListener('activate', event => {
|
||||
event.waitUntil(self.clients.claim());
|
||||
});
|
||||
|
||||
// 监听来自主页面的消息
|
||||
self.addEventListener('message', async event => {
|
||||
const client = event.source;
|
||||
const data = event.data;
|
||||
|
||||
switch (data.action) {
|
||||
case 'play':
|
||||
// 这里只是示例，实际上Service Worker无法直接播放音频
|
||||
// 我们需要采用另一种方式实现
|
||||
break;
|
||||
|
||||
case 'pause':
|
||||
break;
|
||||
|
||||
case 'setTrack':
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
// 使用 Broadcast Channel API 在页面间通信
|
||||
const broadcastChannel = new BroadcastChannel('audio-control');
|
||||
|
||||
broadcastChannel.addEventListener('message', event => {
|
||||
const data = event.data;
|
||||
// 将消息转发给所有客户端
|
||||
self.clients.matchAll().then(clients => {
|
||||
clients.forEach(client => {
|
||||
client.postMessage(data);
|
||||
});
|
||||
});
|
||||
});
|
||||
63
js/config.js
63
js/config.js
@@ -15,19 +15,19 @@ const SiteConfig = {
|
||||
increment: 150
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
background: {
|
||||
imagePaths: [
|
||||
"/images/bj/1.jpg",
|
||||
"/images/bj/2.jpg",
|
||||
"/images/bj/3.jpg",
|
||||
"/images/bj/4.jpg",
|
||||
"/images/bj/5.jpg",
|
||||
"/images/bj/6.jpg",
|
||||
"/images/bj/7.jpg"
|
||||
"/images/bj/1.webp",
|
||||
"/images/bj/2.webp",
|
||||
"/images/bj/3.webp",
|
||||
"/images/bj/4.webp",
|
||||
"/images/bj/5.webp",
|
||||
"/images/bj/6.webp",
|
||||
"/images/bj/7.webp"
|
||||
]
|
||||
},
|
||||
|
||||
|
||||
hitokoto: {
|
||||
apiUrl: 'https://v1.hitokoto.cn?c=c&c=d&c=i&c=k'
|
||||
},
|
||||
@@ -36,7 +36,7 @@ const SiteConfig = {
|
||||
github: {
|
||||
username: 'listener-He'
|
||||
},
|
||||
|
||||
|
||||
blog: {
|
||||
rssUrl: 'https://blog.hehouhui.cn/api/rss'
|
||||
},
|
||||
@@ -47,7 +47,7 @@ const SiteConfig = {
|
||||
blog: { key: 'blog_data_v2', ttlMs: 3600000 },
|
||||
theme: { key: 'theme_v2', ttlMs: 3600000 }
|
||||
},
|
||||
|
||||
|
||||
techStack: [
|
||||
{ name: 'Java', category: 'core', weight: 5 },
|
||||
{ name: 'Spring Boot', category: 'backend', weight: 5 },
|
||||
@@ -115,13 +115,13 @@ const SiteConfig = {
|
||||
],
|
||||
user: { repos: 165, followers: 6, created: "2018-05-14" }
|
||||
},
|
||||
|
||||
|
||||
socialCards: {
|
||||
rings: [130, 180, 230],
|
||||
goldenAngle: 137.5,
|
||||
baseSpeed: 16
|
||||
},
|
||||
|
||||
|
||||
artalk: {
|
||||
server: 'https://artalk.hehouhui.cn',
|
||||
site: 'Honesty的主页',
|
||||
@@ -129,13 +129,13 @@ const SiteConfig = {
|
||||
noComment: '暂无评论',
|
||||
sendBtn: '发送'
|
||||
},
|
||||
|
||||
|
||||
// 站点统计配置
|
||||
analytics: {
|
||||
busuanzi: {
|
||||
src: 'https://events.vercount.one/js',
|
||||
site_pv_id: 'busuanzi_value_site_pv',
|
||||
site_uv_id: 'busuanzi_value_site_uv',
|
||||
src: '//cdn.busuanzi.cc/busuanzi/3.6.9/busuanzi.abbr.min.js',
|
||||
site_pv_id: 'busuanzi_site_pv',
|
||||
site_uv_id: 'busuanzi_site_uv',
|
||||
formatter: true
|
||||
},
|
||||
baidu: {
|
||||
@@ -152,7 +152,7 @@ const SiteConfig = {
|
||||
ck: '3OBGjwDdEIRS7XZ1'
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
animationSettings: {
|
||||
observerOptions: {
|
||||
threshold: 0.1,
|
||||
@@ -163,40 +163,17 @@ const SiteConfig = {
|
||||
rootMargin: '0px 0px -20px 0px'
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
// 开发环境配置
|
||||
dev: {
|
||||
isLocal: (typeof location !== 'undefined') ? (location.hostname.indexOf('localhost') > -1 || location.hostname.indexOf('127.0.0.1') > -1) : false
|
||||
}
|
||||
};
|
||||
|
||||
if (Array.isArray(SiteConfig.techStack)) {
|
||||
const categoryGradientMap = {
|
||||
core: 7,
|
||||
backend: 4,
|
||||
data: 9,
|
||||
ops: 10,
|
||||
ai: 3
|
||||
};
|
||||
const vividSet = [1, 4, 7, 8];
|
||||
|
||||
SiteConfig.techStack = SiteConfig.techStack.map((item) => {
|
||||
const name = item.name || '';
|
||||
const hash = Array.from(name).reduce((a, c) => a + c.charCodeAt(0), 0);
|
||||
if (item.gradientId && Number.isFinite(Number(item.gradientId))) {
|
||||
return { ...item, gradientId: Math.max(1, Math.min(10, Number(item.gradientId))) };
|
||||
}
|
||||
let base = categoryGradientMap[item.category] || ((hash % 10) + 1);
|
||||
if (Number(item.weight) >= 5) {
|
||||
base = vividSet[hash % vividSet.length];
|
||||
}
|
||||
return { ...item, gradientId: base };
|
||||
});
|
||||
}
|
||||
|
||||
// 导出配置
|
||||
if (typeof module !== 'undefined' && module.exports) {
|
||||
module.exports = SiteConfig;
|
||||
} else if (typeof window !== 'undefined') {
|
||||
window.SiteConfig = SiteConfig;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,18 +49,16 @@ $(document).ready(function () {
|
||||
/**
|
||||
* 自定义壁纸
|
||||
*/
|
||||
var imgUrls = JSON.parse(sessionStorage.getItem("imgUrls"));
|
||||
var index = sessionStorage.getItem("index");
|
||||
var imgUrls = null; //JSON.parse(sessionStorage.getItem("imgUrls"));
|
||||
var $panel = $('#panel');
|
||||
var date = new Date();
|
||||
var dayOfWeek = date.getDay();
|
||||
if (imgUrls == null) {
|
||||
imgUrls = [];
|
||||
index = 0;
|
||||
SiteConfig.background.imagePaths.forEach(path => {
|
||||
imgUrls.push(path);
|
||||
});
|
||||
sessionStorage.setItem("imgUrls", JSON.stringify(imgUrls));
|
||||
//sessionStorage.setItem("imgUrls", JSON.stringify(imgUrls));
|
||||
// sessionStorage.setItem("index", index);
|
||||
} else {
|
||||
// if (index == imgUrls.length)
|
||||
|
||||
87
js/sw.js
87
js/sw.js
@@ -1,87 +0,0 @@
|
||||
const CACHE_NAME = 'honesty-home-v1.1.0';
|
||||
const urlsToCache = [
|
||||
'./index.html',
|
||||
'./about.html',
|
||||
'./css/style.css',
|
||||
'./css/about.css',
|
||||
'./css/artalk.css',
|
||||
'./js/config.js',
|
||||
'./js/about.js',
|
||||
'./images/avatar.jpeg',
|
||||
'./images/favicon.ico',
|
||||
'./images/favicon.png',
|
||||
'./images/logo.png',
|
||||
'./images/INFJ.png'
|
||||
];
|
||||
|
||||
self.addEventListener('install', event => {
|
||||
event.waitUntil(
|
||||
caches.open(CACHE_NAME)
|
||||
.then(cache => {
|
||||
return cache.addAll(urlsToCache);
|
||||
})
|
||||
.catch(() => Promise.resolve())
|
||||
);
|
||||
self.skipWaiting();
|
||||
});
|
||||
|
||||
self.addEventListener('fetch', event => {
|
||||
if (event.request.method !== 'GET' || !event.request.url.startsWith(self.location.origin)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const url = new URL(event.request.url);
|
||||
const isHTML = event.request.mode === 'navigate' || url.pathname.endsWith('.html');
|
||||
const isVersioned = url.search && /version=/.test(url.search);
|
||||
const isAudio = url.pathname.endsWith('.mp3') || url.pathname.endsWith('.wav') || url.pathname.endsWith('.ogg');
|
||||
const isImage = /\.(png|jpg|jpeg|gif|webp|svg)$/i.test(url.pathname);
|
||||
const isStaticAsset = /\.(css|js|json)$/i.test(url.pathname);
|
||||
|
||||
if (isHTML || isVersioned || isAudio) {
|
||||
event.respondWith(
|
||||
fetch(event.request)
|
||||
.then(resp => {
|
||||
if (resp && resp.status === 200 && resp.type === 'basic' && !isAudio) {
|
||||
const copy = resp.clone();
|
||||
caches.open(CACHE_NAME).then(cache => cache.put(event.request, copy)).catch(() => {});
|
||||
}
|
||||
return resp;
|
||||
})
|
||||
.catch(() => {
|
||||
return caches.match(event.request, { ignoreSearch: true })
|
||||
.then(m => m || caches.match(event.request))
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
event.respondWith(
|
||||
caches.match(event.request, { ignoreSearch: true })
|
||||
.then(cached => {
|
||||
if (cached) return cached;
|
||||
return fetch(event.request).then(resp => {
|
||||
if (resp && resp.status === 200 && resp.type === 'basic' && (isImage || isStaticAsset)) {
|
||||
const copy = resp.clone();
|
||||
caches.open(CACHE_NAME).then(cache => cache.put(event.request, copy)).catch(() => {});
|
||||
}
|
||||
return resp;
|
||||
});
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
self.addEventListener('activate', event => {
|
||||
const cacheWhitelist = [CACHE_NAME];
|
||||
event.waitUntil(
|
||||
caches.keys().then(cacheNames => {
|
||||
return Promise.all(
|
||||
cacheNames.map(cacheName => {
|
||||
if (!cacheWhitelist.includes(cacheName)) {
|
||||
return caches.delete(cacheName);
|
||||
}
|
||||
})
|
||||
);
|
||||
})
|
||||
);
|
||||
self.clients.claim();
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user