From d22c329264818da2d858114caa520ee484b525ff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BA=95=E5=B1=82=E7=94=A8=E6=88=B7?= Date: Tue, 2 Aug 2022 10:25:29 +0800 Subject: [PATCH] =?UTF-8?q?=E9=9F=B3=E4=B9=90=E6=8E=A7=E4=BB=B6=E4=BC=98?= =?UTF-8?q?=E5=8C=96=20&=20JS=20=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 9 ++--- README_EN.md | 10 +++--- css/firefox.css | 18 ---------- js/lantern.js | 6 ++-- js/main.js | 91 ++++++++++++++++++++----------------------------- js/music.js | 10 +++--- js/set.js | 58 +++++++------------------------ 7 files changed, 68 insertions(+), 134 deletions(-) delete mode 100644 css/firefox.css diff --git a/README.md b/README.md index 32c218c..d233aba 100644 --- a/README.md +++ b/README.md @@ -25,8 +25,9 @@ - [x] 时光进度条 - [x] 音乐播放器 - [x] 移动端适配 -* [ ] 还没想好呢 +* [ ] 去除 jQuery 依赖 +* [ ] VUE 重构 ### 天气 @@ -98,9 +99,9 @@ 更改 `music.js` 的参数即可实现自定义歌单列表 ```js -var server = "netease"; //netease: 网易云音乐; tencent: QQ音乐; kugou: 酷狗音乐; xiami: 虾米; kuwo: 酷我 -var type = "playlist"; //song: 单曲; playlist: 歌单; album: 唱片 -var id = "7452421335"; //封面 ID / 单曲 ID / 歌单 ID +let server = "netease"; //netease: 网易云音乐; tencent: QQ音乐; kugou: 酷狗音乐; xiami: 虾米; kuwo: 酷我 +let type = "playlist"; //song: 单曲; playlist: 歌单; album: 唱片 +let id = "7452421335"; //封面 ID / 单曲 ID / 歌单 ID ``` ### 字体 diff --git a/README_EN.md b/README_EN.md index 9ffac06..5be11aa 100644 --- a/README_EN.md +++ b/README_EN.md @@ -25,7 +25,9 @@ Simple little homepage, had enough of the original one and made a new one - [x] Time progress bar - [x] Music player - [x] Mobile adaptation -* [ ] Haven't thought about it yet + +* [ ] Remove jQuery dependency +* [ ] VUE refactoring ### Weather @@ -98,9 +100,9 @@ This project uses `json` file to configure the site content, the configuration i Change the parameters of `music.js` to achieve a custom song list ```js -var server = "netease"; //netease; tencent; kugou; xiami; kuwo; -var type = "playlist"; //song; playlist; album; -var id = "7452421335"; //album ID; song ID; playlist ID; +let server = "netease"; //netease; tencent; kugou; xiami; kuwo; +let type = "playlist"; //song; playlist; album; +let id = "7452421335"; //album ID; song ID; playlist ID; ``` ### Fonts diff --git a/css/firefox.css b/css/firefox.css deleted file mode 100644 index 33c0d2a..0000000 --- a/css/firefox.css +++ /dev/null @@ -1,18 +0,0 @@ -.message, -.time, -.hitokoto, -.music, -.link-card, -.more, -.box-wrapper, -footer { - background: rgba(0, 0, 0, 0.3); -} - -.link-card:hover { - background: rgb(0, 0, 0, 0.4); -} - -.progress { - background: rgba(0, 0, 0, 0.2) !important; -} diff --git a/js/lantern.js b/js/lantern.js index 0fe77a6..f79a99f 100644 --- a/js/lantern.js +++ b/js/lantern.js @@ -9,13 +9,13 @@ "use strict"; ! function (t, e) { void 0 === e && (e = {}); - var n = e.insertAt; + let n = e.insertAt; if (t && "undefined" != typeof document) { - var r = document.head || document.getElementsByTagName("head")[0], + let r = document.head || document.getElementsByTagName("head")[0], a = document.createElement("style"); a.type = "text/css", "top" === n && r.firstChild ? r.insertBefore(a, r.firstChild) : r.appendChild(a), a.styleSheet ? a.styleSheet.cssText = t : a.appendChild(document.createTextNode(t)) } }; - var t; + let t; (t = document.createElement("div")).className = "j-china-lantern", t.innerHTML = '
新
年
', document.body.appendChild(t) })); \ No newline at end of file diff --git a/js/main.js b/js/main.js index c8e536e..cd6d4dd 100644 --- a/js/main.js +++ b/js/main.js @@ -66,7 +66,7 @@ window.addEventListener('load', function () { }, 800); //延迟加载音乐播放器 - var element = document.createElement("script"); + let element = document.createElement("script"); element.src = "./js/music.js"; document.body.appendChild(element); @@ -97,25 +97,6 @@ setTimeout(function () { // new_element.setAttribute("src","./js/lantern.js"); // document.body.appendChild(new_element); -//火狐浏览器独立样式 -if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) { - var head = document.getElementsByTagName('head')[0]; - var link = document.createElement('link'); - link.href = './css/firefox.css'; - link.rel = 'stylesheet'; - link.type = 'text/css'; - head.appendChild(link); - window.addEventListener('load', function () { - setTimeout(function () { - iziToast.show({ - timeout: 8000, - icon: "fa-solid fa-circle-exclamation", - message: '您正在使用火狐浏览器，部分功能可能不支持' - }); - }, 3800); - }, false) -} - //获取一言 fetch('https://v1.hitokoto.cn?max_length=24') .then(response => response.json()) @@ -125,11 +106,11 @@ fetch('https://v1.hitokoto.cn?max_length=24') }) .catch(console.error) -var times = 0; +let times = 0; $('#hitokoto').click(function () { if (times == 0) { times = 1; - var index = setInterval(function () { + let index = setInterval(function () { times--; if (times == 0) { clearInterval(index); @@ -183,11 +164,11 @@ function getWeather() { getWeather(); -var wea = 0; +let wea = 0; $('#upWeather').click(function () { if (wea == 0) { wea = 1; - var index = setInterval(function () { + let index = setInterval(function () { wea--; if (wea == 0) { clearInterval(index); @@ -209,20 +190,20 @@ $('#upWeather').click(function () { }); //获取时间 -var t = null; +let t = null; t = setTimeout(time, 1000); function time() { clearTimeout(t); dt = new Date(); - var y = dt.getYear() + 1900; - var mm = dt.getMonth() + 1; - var d = dt.getDate(); - var weekday = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; - var day = dt.getDay(); - var h = dt.getHours(); - var m = dt.getMinutes(); - var s = dt.getSeconds(); + let y = dt.getYear() + 1900; + let mm = dt.getMonth() + 1; + let d = dt.getDate(); + let weekday = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; + let day = dt.getDay(); + let h = dt.getHours(); + let m = dt.getMinutes(); + let s = dt.getSeconds(); if (h < 10) { h = "0" + h; } @@ -284,30 +265,32 @@ $("#telegram").mouseover(function () { }); //自动变灰 -var myDate = new Date; -var mon = myDate.getMonth() + 1; -var date = myDate.getDate(); -var days = ['4.4', '5.12', '7.7', '9.9', '9.18', '12.13']; -for (var day of days) { - var d = day.split('.'); +let myDate = new Date; +let mon = myDate.getMonth() + 1; +let date = myDate.getDate(); +let days = ['4.4', '5.12', '7.7', '9.9', '9.18', '12.13']; +for (let day of days) { + let d = day.split('.'); if (mon == d[0] && date == d[1]) { document.write( '' - ) + ); $("#change").html("Silence in silence"); $("#change1").html("今天是中国国家纪念日，全站已切换为黑白模式"); window.addEventListener('load', function () { - iziToast.show({ - timeout: 14000, - icon: "fa-solid fa-clock", - message: '今天是中国国家纪念日' - }); + setTimeout(function () { + iziToast.show({ + timeout: 14000, + icon: "fa-solid fa-clock", + message: '今天是中国国家纪念日' + }); + }, 3800); }, false); } } //更多页面切换 -var shoemore = false; +let shoemore = false; $('#switchmore').on('click', function () { shoemore = !shoemore; if (shoemore && $(document).width() >= 990) { @@ -327,7 +310,7 @@ $('#close').on('click', function () { }); //移动端菜单栏切换 -var switchmenu = false; +let switchmenu = false; $('#switchmenu').on('click', function () { switchmenu = !switchmenu; if (switchmenu) { @@ -377,7 +360,7 @@ window.addEventListener('load', function () { }) //移动端切换功能区 -var changemore = false; +let changemore = false; $('#changemore').on('click', function () { changemore = !changemore; if (changemore) { @@ -406,20 +389,20 @@ document.oncontextmenu = function () { //控制台输出 console.clear(); -var styleTitle1 = ` +let styleTitle1 = ` font-size: 20px; font-weight: 600; color: rgb(244,167,89); ` -var styleTitle2 = ` +let styleTitle2 = ` font-size:12px; color: rgb(244,167,89); ` -var styleContent = ` +let styleContent = ` color: rgb(30,152,255); ` -var title1 = '無名の主页' -var title2 = ` +let title1 = '無名の主页' +let title2 = ` _____ __ __ _______ ____ __ |_ _| \\/ |/ ____\\ \\ / /\\ \\ / / | | | \\ / | (___ \\ \\_/ / \\ \\_/ / @@ -427,7 +410,7 @@ var title2 = ` _| |_| | | |____) | | | | | |_____|_| |_|_____/ |_| |_| ` -var content = ` +let content = ` 版 本 号：3.4 更新日期：2022-07-24 diff --git a/js/music.js b/js/music.js index 618b2a7..80e4136 100644 --- a/js/music.js +++ b/js/music.js @@ -9,9 +9,9 @@ https://api.wuenci.com/meting/api/ GitHub：https://github.com/imsyy/home 版权所有，请勿删除 */ -var server = "netease"; //netease: 网易云音乐; tencent: QQ音乐; kugou: 酷狗音乐; xiami: 虾米; kuwo: 酷我 -var type = "playlist"; //song: 单曲; playlist: 歌单; album: 唱片 -var id = "7452421335"; //封面 ID / 单曲 ID / 歌单 ID +let server = "netease"; //netease: 网易云音乐; tencent: QQ音乐; kugou: 酷狗音乐; xiami: 虾米; kuwo: 酷我 +let type = "playlist"; //song: 单曲; playlist: 歌单; album: 唱片 +let id = "7452421335"; //封面 ID / 单曲 ID / 歌单 ID $.ajax({ url: "https://api.wuenci.com/meting/api/?server=" + server + "&type=" + type + "&id=" + id, @@ -125,8 +125,8 @@ $.ajax({ }); //音量调节 - $("#volume").on('click touchend', function () { - var x = $("#volume").val(); + $("#volume").on('input propertychange touchend', function () { + let x = $("#volume").val(); ap.volume(x, true); if (x == 0) { $("#volume-ico").html(""); diff --git a/js/set.js b/js/set.js index 31dc70f..3344d44 100644 --- a/js/set.js +++ b/js/set.js @@ -8,7 +8,7 @@ GitHub：https://github.com/imsyy/home /* 自定义配置 */ /* 尚未完善 */ $(function () { - var url = "../setting.json" + let url = "../setting.json" $.getJSON( url, function (data) { @@ -70,7 +70,7 @@ function setBgImg(bg_img) { // 获取背景图片 Cookies function getBgImg() { - var bg_img_local = Cookies.get('bg_img'); + let bg_img_local = Cookies.get('bg_img'); if (bg_img_local && bg_img_local !== "{}") { return JSON.parse(bg_img_local); } else { @@ -79,7 +79,7 @@ function getBgImg() { } } -var bg_img_preinstall = { +let bg_img_preinstall = { "type": "1", // 1:默认背景 2:每日一图 3:随机风景 4:随机动漫 "2": "https://api.dujin.org/bing/1920.php", // 每日一图 "3": "https://api.ixiaowai.cn/gqapi/gqapi.php", // 随机风景 @@ -88,7 +88,7 @@ var bg_img_preinstall = { // 更改背景图片 function setBgImgInit() { - var bg_img = getBgImg(); + let bg_img = getBgImg(); $("input[name='wallpaper-type'][value=" + bg_img["type"] + "]").click(); switch (bg_img["type"]) { @@ -112,48 +112,14 @@ $(document).ready(function () { setBgImgInit(); // 设置背景图片 $("#wallpaper").on("click", ".set-wallpaper", function () { - var type = $(this).val(); - var bg_img = getBgImg(); + let type = $(this).val(); + let bg_img = getBgImg(); bg_img["type"] = type; - - if (type === "1") { - setBgImg(bg_img); - $('#bg').attr('src', `./img/background${1 + ~~(Math.random() * 10)}.webp`) //随机默认壁纸 - iziToast.show({ - icon: "fa-solid fa-image", - timeout: 2500, - message: '壁纸设置成功', - }); - }; - - if (type === "2") { - setBgImg(bg_img); - $('#bg').attr('src', bg_img_preinstall[2]); //必应每日 - iziToast.show({ - icon: "fa-solid fa-image", - timeout: 2500, - message: '壁纸设置成功', - }); - }; - - if (type === "3") { - setBgImg(bg_img); - $('#bg').attr('src', bg_img_preinstall[3]); //随机风景 - iziToast.show({ - icon: "fa-solid fa-image", - timeout: 2500, - message: '壁纸设置成功', - }); - }; - - if (type === "4") { - setBgImg(bg_img); - $('#bg').attr('src', bg_img_preinstall[4]); //随机动漫 - iziToast.show({ - icon: "fa-solid fa-image", - timeout: 2500, - message: '壁纸设置成功', - }); - }; + iziToast.show({ + icon: "fa-solid fa-image", + timeout: 2500, + message: '壁纸设置成功，刷新后生效', + }); + setBgImg(bg_img); }); }); \ No newline at end of file