-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathindex.html
More file actions
252 lines (252 loc) · 22.9 KB
/
Copy pathindex.html
File metadata and controls
252 lines (252 loc) · 22.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>起始页</title>
<link rel="stylesheet" href="css/start.base.css">
<link rel="stylesheet" href="css/start.time.css">
<link rel="stylesheet" href="css/start.search.css">
<link rel="stylesheet" href="css/start.engine.css">
<link rel="stylesheet" href="css/start.footer.css">
<link rel="stylesheet" href="css/start.settings.css">
<link rel="stylesheet" href="css/start.night.css">
<link rel="stylesheet" href="css/start.responsive.css">
<link rel="stylesheet" href="css/ai-chat.css">
<link rel="icon" href="favicon.ico">
</head>
<body>
<div id="glass-bg"></div>
<div class="container">
<div class="time-section">
<div id="time" class="time" data-zh-TW=""></div>
<div class="date-weather-group">
<div id="date" class="date" data-zh-TW=""></div>
</div>
<div id="weather" class="weather" data-zh-TW=""></div>
</div>
<div class="search-section">
<div class="search-bar-glass">
<button id="engine-btn" class="engine-btn"><img id="engine-icon" src="icons/bing.png" alt="搜索引擎"></button>
<input id="search-input" class="search-input" type="text" placeholder="搜索..." autocomplete="off" data-zh="搜索..." data-en="Search..." data-zh-TW="搜尋..." data-ja="検索..." data-es="Buscar..." data-ar="بحث..." data-fr="Recherche...">
<button id="search-btn" class="search-btn">🔍</button>
<div id="engine-list" class="engine-list hidden"></div>
<div id="search-history-list" style="position:absolute;left:0;top:110%;width:100%;z-index:99;"></div>
</div>
</div>
</div>
<div class="footer">
<div class="footer-info">
<div class="footer-row">
<span id="footer-start" data-zh="起始页" data-en="Start Page" data-zh-TW="起始頁" data-ja="スタートページ" data-ru="Стартовая страница" data-es="Página de inicio" data-ar="الصفحة الرئيسية" data-fr="Page d'accueil">起始页</span>🔍2025
</div>
<div class="footer-row">
@ <a href="https://space.bilibili.com/515626972" target="_blank" id="footer-author" data-zh="天空天堂鸟" data-en="tkttn0714" data-zh-TW="天空天堂鳥" data-ja="tkttn0714" data-ru="tkttn0714" data-fr="tkttn0714" data-es="tkttn0714" data-ar="tkttn0714">天空天堂鸟</a> |
<a href="https://home.071400.xyz" target="_blank" id="footer-home" data-zh="主页" data-en="Home" data-zh-TW="主頁" data-ja="ホーム" data-ru="Главная" data-es="Inicio" data-ar="الرئيسية" data-fr="Accueil">主页</a> |
<a href="https://071400.xyz" target="_blank" id="footer-blog" data-zh="博客" data-en="Blog" data-zh-TW="博客" data-ja="ブログ" data-ru="Блог" data-es="Blog" data-ar="مدونة" data-fr="Blog">博客</a>
</div>
</div>
</div>
<button id="settings-btn" class="settings-btn" title="设置">
<img src="icons/setting.svg" alt="设置" />
</button>
<div id="settings-panel" class="settings-panel">
<div class="settings-header">
<span id="settings-title" data-zh="设置" data-en="Settings" data-zh-TW="設定" data-ja="設定" data-fr="Paramètres" data-ru="Настройки" data-es="Configuración" data-ar="الإعدادات">设置</span>
<button id="settings-close-btn" class="settings-close-apple" title="关闭" aria-label="关闭"></button>
</div>
<div class="settings-content">
<div>
<label id="label-theme-color" data-zh="主题色：" data-en="Theme Color:" data-zh-TW="主題色：" data-ja="テーマカラー：" data-fr="Couleur du thème :" data-ru="Цвет темы:" data-es="Color del tema:" data-ar="لون السمة:">主题色：</label>
<input type="color" id="theme-color-picker" value="#0099ff" />
</div>
<div style="margin-top:1em;">
<label id="label-lang" data-zh="语言：" data-en="Language:" data-zh-TW="語言：" data-ja="言語：" data-fr="Langue :" data-ru="Язык:" data-es="Idioma:" data-ar="اللغة:">语言：</label>
<div class="lang-select-custom" id="lang-select-custom">
<div class="lang-current" id="lang-current">
<img src="icons/flag/cn.png" class="lang-flag" id="lang-flag">
<span id="lang-current-name">简体中文</span>
<span class="lang-arrow">▼</span>
</div>
<div class="lang-list" id="lang-list"></div>
</div>
</div>
<div style="margin-top:1em;display:flex;align-items:center;gap:1em;">
<label id="label-night-mode" for="mode-mode-select" data-zh="昼夜切换" data-en="Theme Mode" data-zh-TW="晝夜切換" data-ja="昼夜切替" data-fr="Mode jour/nuit" data-ru="День/Ночь" data-es="Modo día/noche" data-ar="وضع النهار/الليل">昼夜切换</label>
<div class="mode-select-custom" id="mode-select-custom">
<div class="mode-current" id="mode-current">
<img id="mode-current-icon" src="icons/follow_system.png" class="mode-flag">
<span id="mode-current-name">跟随时间</span>
<span class="mode-arrow">▼</span>
</div>
<div class="mode-list" id="mode-list"></div>
</div>
</div>
<div style="margin-top:1em;display:flex;align-items:center;gap:1em;">
<label id="label-12h" for="clock-12h-switch" data-zh="12小时制" data-en="12-Hour Clock" data-zh-TW="12小時制" data-ja="12時間制" data-fr="Format 12h" data-ru="12-часовой формат" data-es="Formato 12h" data-ar="نظام 12 ساعة">12小时制</label>
<label class="switch">
<input type="checkbox" id="clock-12h-switch">
<span class="slider"></span>
</label>
</div>
<div style="margin-top:1em;display:flex;align-items:center;gap:1em;">
<label id="label-show-seconds" for="show-seconds-switch" data-zh="秒钟显示" data-en="Show Seconds" data-zh-TW="顯示秒數" data-ja="秒を表示" data-fr="Afficher les secondes" data-ru="Показывать секунды" data-es="Mostrar segundos" data-ar="عرض الثواني">秒钟显示</label>
<label class="switch">
<input type="checkbox" id="show-seconds-switch" checked>
<span class="slider"></span>
</label>
</div>
<div style="margin-top:1em;">
<label id="label-suggest" for="suggest-switch" data-zh="搜索建议" data-en="Search Suggestions" data-zh-TW="搜尋建議" data-ja="検索候補" data-fr="Suggestions de recherche" data-ru="Поисковые подсказки" data-es="Sugerencias de búsqueda" data-ar="اقتراحات البحث">搜索建议</label>
<label class="switch">
<input type="checkbox" id="suggest-switch">
<span class="slider"></span>
</label>
</div>
<div style="margin-top:1em;display:flex;align-items:center;gap:1em;">
<label id="label-new-tab" for="new-tab-switch" data-zh="新标签页打开" data-en="Open in New Tab" data-zh-TW="在新分頁開啟" data-ja="新しいタブで開く" data-fr="Ouvrir dans un nouvel onglet" data-ru="Открыть в новой вкладке" data-es="Abrir en nueva pestaña" data-ar="فتح في علامة تبويب جديدة">新标签页打开</label>
<label class="switch">
<input type="checkbox" id="new-tab-switch" checked>
<span class="slider"></span>
</label>
</div>
<div style="margin-top:1em;">
<label id="label-wallpaper" data-zh="壁纸样式" data-en="Wallpaper Style" data-zh-TW="壁紙樣式" data-ja="壁紙スタイル" data-fr="Style de fond d'écran" data-ru="Стиль обоев" data-es="Estilo de fondo" data-ar="نمط الخلفية">壁纸样式</label>
<div class="wallpaper-select-custom" id="wallpaper-select-custom">
<div class="wallpaper-current" id="wallpaper-current">
<span id="wallpaper-current-name">必应每日一图</span>
<span class="wallpaper-arrow">▼</span>
</div>
<div class="wallpaper-list" id="wallpaper-list"></div>
</div>
</div>
<div style="margin-top:1em;">
<label id="label-clock-font" data-zh="时钟字体" data-en="Clock Font" data-zh-TW="時鐘字體" data-ja="時計フォント" data-fr="Police de l'horloge" data-ru="Шрифт часов" data-es="Fuente del reloj" data-ar="خط الساعة">时钟字体</label>
<div class="clockfont-select-custom" id="clockfont-select-custom">
<div class="clockfont-current" id="clockfont-current">
<span id="clockfont-current-name">默认</span>
<span class="clockfont-arrow">▼</span>
</div>
<div class="clockfont-list" id="clockfont-list"></div>
</div>
</div>
<div style="text-align:center;margin-top:1.2em;display:flex;gap:1em;justify-content:center;">
<a id="footer-changelog" href="https://071400.xyz/2025/04/startpage/" target="_blank" class="footer-btn" data-zh="更新日志与介绍" data-en="Changelog & Intro" data-zh-TW="更新日誌與介紹" data-ja="更新履歴と紹介" data-fr="Journal & Intro" data-ru="Изменения и инфо" data-es="Registro de cambios e introducción" data-ar="سجل التحديثات والمقدمة">更新日志与介绍</a>
<button id="reset-settings-btn" class="footer-btn" data-zh="恢复默认设置" data-en="Reset Settings" data-zh-TW="恢復預設設定" data-ja="デフォルトに戻す" data-fr="Réinitialiser" data-ru="Сбросить настройки" data-es="Restablecer" data-ar="استعادة الإعدادات الافتراضية">恢复默认设置</button>
<button id="clear-history-btn" class="footer-btn" data-zh="清空历史记录" data-en="Clear History" data-zh-TW="清空歷史記錄" data-ja="履歴を消去" data-fr="Effacer l'historique" data-ru="Очистить историю" data-es="Borrar historial" data-ar="مسح السجل">清空历史记录</button>
</div>
<div id="about-text" style="font-size:0.95em;color:#888;white-space:pre-line;"
data-zh="v1.12 2025-05-29 made by 天空天堂鸟"
data-en="v1.12 2025-05-29 made by tkttn0714"
data-zh-TW="v1.12 2025-05-29 由 tkttn0714 製作"
data-ja="v1.12 2025-05-29 tkttn0714 作成"
data-fr="v1.12 2025-05-29 par tkttn0714"
data-ru="v1.12 2025-05-29 автор: tkttn0714"
data-es="v1.12 2025-05-29 hecho por tkttn0714"
data-ar="v1.12 2025-05-29 صنعه tkttn0714"
>v1.12 2025-05-29 made by 天空天堂鸟</div>
</div>
</div>
<button id="blur-btn" style="position:fixed;right:2em;bottom:2em;z-index:2000;width:2.5em;height:2.5em;border-radius:50%;background:rgba(255,255,255,0.18);border:none;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;display:flex;align-items:center;justify-content:center;">
<img id="blur-btn-icon" src="icons/focus.png" alt="专注" style="width:1.4em;height:1.4em;display:block;" />
</button>
<button id="download-btn" style="position:fixed;left:2em;bottom:2em;z-index:2000;width:2.5em;height:2.5em;border-radius:50%;background:rgba(255,255,255,0.18);border:none;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;display:flex;align-items:center;justify-content:center;">
<img id="download-btn-icon" src="icons/download.png" alt="下载" style="width:1.4em;height:1.4em;display:block;" />
</button>
<div id="settings-bg-mask"></div>
<div id="top-toast" class="top-toast">
<img src="icons/exclamation.png" class="toast-icon" alt="!">
<span id="top-toast-text"></span>
</div>
<div id="custom-confirm-mask" class="custom-confirm-mask" style="display:none;">
<div class="custom-confirm-dialog">
<div class="custom-confirm-message" id="custom-confirm-message"></div>
<div class="custom-confirm-actions">
<button id="custom-confirm-ok">确定</button>
<button id="custom-confirm-cancel">取消</button>
</div>
</div>
</div>
<div id="time-fullscreen-mask" style="display:none;position:fixed;z-index:3000;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.82);align-items:center;justify-content:center;flex-direction:column;transition:background 0.6s cubic-bezier(0.4,0,0.2,1), opacity 0.6s cubic-bezier(0.4,0,0.2,1);opacity:0;">
<div id="time-fullscreen" style="color:#fff;font-size:8vw;font-weight:700;text-shadow:0 4px 32px rgba(0,0,0,0.28);margin-bottom:0.7em;transition:color 0.6s cubic-bezier(0.4,0,0.2,1);"></div>
<div id="date-fullscreen" style="font-size:2.2vw;margin-bottom:1.5em;color:#fff;transition:color 0.6s cubic-bezier(0.4,0,0.2,1);text-shadow:0 2px 10px rgba(0,0,0,0.10);"></div>
<div style="display:flex;flex-direction:row;align-items:center;justify-content:center;gap:1.2em;width:12vw;max-width:90vw;margin-bottom:0.5em;">
<button class="fullscreen-btn-common" id="time-bg-toggle">
<img src="icons/time_bg_change.png" alt="切换背景" style="width:1.8em;height:1.8em;display:block;" />
</button>
<button class="fullscreen-btn-common" id="time-fullscreen-btn">
<img src="icons/full_screen.png" alt="全屏" style="width:1.8em;height:1.8em;display:block;" />
</button>
<button class="fullscreen-btn-common" id="countdown-btn">
<img src="icons/countdown.png" alt="倒计时" style="width:1.8em;height:1.8em;display:block;" />
</button>
<button class="fullscreen-btn-common" id="stopwatch-btn">
<img src="icons/stopwatch.png" alt="秒表" style="width:1.8em;height:1.8em;display:block;" />
</button>
</div>
</div>
<div id="download-dialog-mask" style="display:none;position:fixed;z-index:4000;top:0;left:0;width:100vw;height:100vh;background:rgba(255,255,255,0.32);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);align-items:center;justify-content:center;transition:opacity 0.4s;opacity:0;">
<div id="download-dialog" style="background:rgba(255,255,255,0.85);border-radius:1.5em;box-shadow:0 8px 32px rgba(0,0,0,0.18);padding:2.2em 2.2em 1.5em 2.2em;min-width:320px;max-width:90vw;display:flex;flex-direction:column;align-items:center;">
<div id="download-dialog-title" style="font-size:1.35em;font-weight:700;margin-bottom:0.7em;color:#222;text-align:center;"></div>
<div id="download-dialog-tip" style="font-size:0.98em;color:#888;margin-bottom:1.2em;white-space:pre-line;text-align:center;"></div>
<div style="display:flex;align-items:center;width:100%;gap:0.7em;">
<input id="download-dialog-input" type="text" style="flex:1;font-size:1.1em;padding:0.5em 1em;border-radius:1em;border:1px solid #ccc;outline:none;transition:border 0.2s;" placeholder="请输入文件链接..." />
<button id="download-dialog-btn" style="padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#0099ff;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">✈️</button>
</div>
</div>
</div>
<div id="countdown-mask" style="display:none;position:fixed;z-index:4000;top:0;left:0;width:100vw;height:100vh;align-items:center;justify-content:center;flex-direction:column;transition:background 0.6s, opacity 0.6s;opacity:0;">
<div id="countdown-dialog" style="background:rgba(255,255,255,0.85);border-radius:1.5em;box-shadow:0 8px 32px rgba(0,0,0,0.18);padding:2.2em 2.2em 1.5em 2.2em;min-width:320px;max-width:90vw;display:flex;flex-direction:column;align-items:center;position:relative;">
<button id="countdown-back-btn" style="position:absolute;left:1.2em;top:1.2em;background:transparent;border:none;outline:none;cursor:pointer;padding:0;"><img src="icons/back.png" alt="返回" style="width:2em;height:2em;display:block;" /></button>
<div id="countdown-title" style="font-size:1.35em;font-weight:700;margin-bottom:0.7em;text-align:center;">倒计时</div>
<div id="countdown-input-group" style="display:flex;align-items:center;gap:0.5em;margin-bottom:1.2em;">
<input id="countdown-hour" type="number" min="0" max="23" value="0" style="width:3em;font-size:1.2em;text-align:center;border-radius:0.7em;border:1px solid #ccc;outline:none;"> :
<input id="countdown-minute" type="number" min="0" max="59" value="0" style="width:3em;font-size:1.2em;text-align:center;border-radius:0.7em;border:1px solid #ccc;outline:none;"> :
<input id="countdown-second" type="number" min="0" max="59" value="0" style="width:3em;font-size:1.2em;text-align:center;border-radius:0.7em;border:1px solid #ccc;outline:none;">
</div>
<div id="countdown-bell-row" style="display:flex;align-items:center;gap:0.5em;margin-bottom:1.2em;">
<input type="checkbox" id="countdown-bell" checked style="width:1.2em;height:1.2em;">
<label for="countdown-bell" id="countdown-bell-label" style="font-size:1em;cursor:pointer;">倒计时结束响铃</label>
</div>
<div id="countdown-btn-group" style="display:flex;gap:1em;align-items:center;justify-content:center;margin-bottom:0.5em;">
<button id="countdown-start-btn" style="padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#0099ff;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">开始</button>
<button id="countdown-pause-btn" style="display:none;padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#ffaa00;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">暂停</button>
<button id="countdown-reset-btn" style="display:none;padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#888;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">复位</button>
</div>
<div id="countdown-display" style="margin-top:1.5em;font-size:2em;font-weight:700;display:none;"></div>
</div>
</div>
<div id="stopwatch-mask" style="display:none;position:fixed;z-index:4000;top:0;left:0;width:100vw;height:100vh;align-items:center;justify-content:center;flex-direction:column;transition:background 0.6s, opacity 0.6s;opacity:0;">
<div id="stopwatch-dialog" style="background:rgba(255,255,255,0.85);border-radius:1.5em;box-shadow:0 8px 32px rgba(0,0,0,0.18);padding:2.2em 2.2em 1.5em 2.2em;min-width:320px;max-width:90vw;display:flex;flex-direction:column;align-items:center;position:relative;">
<button id="stopwatch-back-btn" style="position:absolute;left:1.2em;top:1.2em;background:transparent;border:none;outline:none;cursor:pointer;padding:0;"><img src="icons/back.png" alt="返回" style="width:2em;height:2em;display:block;" /></button>
<div id="stopwatch-title" style="font-size:1.35em;font-weight:700;margin-bottom:0.7em;text-align:center;">秒表</div>
<div id="stopwatch-display" style="margin-top:1.5em;font-size:2.5em;font-weight:700;letter-spacing:0.1em;color:#0099ff;user-select:text;">00:00:00.000</div>
<div id="stopwatch-btn-group" style="display:flex;gap:1em;align-items:center;justify-content:center;margin-top:1.5em;">
<button id="stopwatch-start-btn" style="padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#0099ff;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">开始</button>
<button id="stopwatch-pause-btn" style="display:none;padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#ffaa00;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">暂停</button>
<button id="stopwatch-reset-btn" style="display:none;padding:0.5em 1.3em;font-size:1.1em;border:none;border-radius:1em;background:#888;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;">复位</button>
</div>
</div>
</div>
<button id="ai-chat-btn" style="position:fixed;top:2em;right:2em;z-index:2100;width:2.5em;height:2.5em;border-radius:50%;background:rgba(255,255,255,0.18);border:none;box-shadow:0 2px 8px rgba(0,0,0,0.10);cursor:pointer;display:flex;align-items:center;justify-content:center;">
<img src="icons/chat.png" alt="AI" style="width:1.4em;height:1.4em;display:block;" />
</button>
<div id="ai-chat-mask" style="display:none;position:fixed;z-index:3000;top:0;left:0;width:100vw;height:100vh;align-items:center;justify-content:center;flex-direction:column;transition:background 0.4s, opacity 0.4s;opacity:0;background:rgba(0,0,0,0.18);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);">
<div id="ai-chat-dialog" class="ai-chat-dialog">
<div class="ai-chat-header">
<span id="ai-chat-title" data-zh="AI对话" data-en="AI Chat" data-zh-TW="AI對話" data-ja="AIチャット" data-fr="Chat IA" data-ru="AI чат" data-es="Chat IA" data-ar="دردشة الذكاء الاصطناعي">AI对话</span>
<button id="ai-chat-clear-btn" class="ai-chat-clear-btn" title="清空" aria-label="清空" data-zh="清空" data-en="Clear" data-zh-TW="清空" data-ja="クリア" data-fr="Vider" data-ru="Очистить" data-es="Limpiar" data-ar="مسح">清空</button>
<button id="ai-chat-close" class="ai-chat-close" title="关闭" aria-label="关闭"><img src="icons/cross.png" alt="关闭" style="width:1.2em;height:1.2em;" /></button>
</div>
<div id="ai-chat-content" class="ai-chat-content"></div>
<div class="ai-chat-input-row">
<img src="icons/user.png" class="ai-chat-user-avatar" alt="User" />
<input id="ai-chat-input" class="ai-chat-input" type="text" maxlength="200" autocomplete="off" placeholder="" />
<button id="ai-chat-send" class="ai-chat-send">发送</button>
</div>
</div>
</div>
<script src="start.js"></script>
<script src="src/ai-chat.js"></script>
</body>
</html>