From 502b98c734555d37bd98c75146ec8dfff80b3e4c Mon Sep 17 00:00:00 2001 From: Trrrrw Date: Tue, 30 Jan 2024 23:19:00 +0800 Subject: [PATCH] bili 0.1.5 --- Bilibili-Search-Beautification.md | 26 +++-- Bilibili-Search-Beautification.user.js | 138 ++++++++++++++++++++----- HUPU-BBS-Beautification.md | 4 +- 3 files changed, 132 insertions(+), 36 deletions(-) diff --git a/Bilibili-Search-Beautification.md b/Bilibili-Search-Beautification.md index 3a6a9ed..0c232dd 100644 --- a/Bilibili-Search-Beautification.md +++ b/Bilibili-Search-Beautification.md @@ -3,16 +3,16 @@ ## 安装 👉👉[点击此处安装](https://greasyfork.org/zh-CN/scripts/458903-b%E7%AB%99%E6%90%9C%E7%B4%A2%E9%A1%B5%E7%BE%8E%E5%8C%96)👈👈 -> 确保您的浏览器安装有 **Tampermonkey 脚本管理器扩展（[Chrome](https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=zh)** / **[Firefox](https://addons.mozilla.org/zh-CN/firefox/addon/tampermonkey/)** / **[Edge](https://microsoftedge.microsoft.com/addons/detail/tampermonkey/iikmkjmpaadaobahmlepeloendndfphd)）。** +> 确保您的浏览器安装有 **Tampermonkey 脚本管理器扩展（[Chrome](https://chromewebstore.google.com/detail/%E7%AF%A1%E6%94%B9%E7%8C%B4/dhdgffkkebhmkfjojejmpbldmpobfkfo)** / **[Firefox](https://addons.mozilla.org/zh-CN/firefox/addon/tampermonkey/)** / **[Edge](https://microsoftedge.microsoft.com/addons/detail/tampermonkey/iikmkjmpaadaobahmlepeloendndfphd)）。** ## 功能 - 美化页面 - 左上角图标点击链接替换为`https://search.bilibili.com/all`，首页移至悬浮窗内 - 背景图片是`bgimg`，修改其链接即可修改背景图片。 - 效果图： -![homepage](https://cdn.staticaly.com/gh/Trrrrw/UserScript/main/docs/src/.vuepress/public/assets/image/bili-homepage.webp) -![searching](https://cdn.staticaly.com/gh/Trrrrw/UserScript/main/docs/src/.vuepress/public/assets/image/bili-searching.webp) -![searchresult](https://cdn.staticaly.com/gh/Trrrrw/UserScript/main/docs/src/.vuepress/public/assets/image/bili-searchresult.webp) +![homepage](https://cdn.jsdelivr.net/gh/Trrrrw/UserScript@main/docs/src/.vuepress/public/assets/image/bili-homepage.webp) +![searching](https://cdn.jsdelivr.net/gh/Trrrrw/UserScript@main/docs/src/.vuepress/public/assets/image/bili-searching.webp) +![searchresult](https://cdn.jsdelivr.net/gh/Trrrrw/UserScript@main/docs/src/.vuepress/public/assets/image/bili-searchresult.webp) ## 适配网站 | | 网站链接 |PC|Pad|Phone| @@ -20,12 +20,18 @@ | ![icon](https://www.bilibili.com/favicon.ico?v=1) | search.bilibili.com/all |✔️|✔️| ✖️ | ## To Do -- [x] 使用本地图片 -- [ ] 背景模糊动画 -- [x] 搜索结果页面 -- [x] 搜索结果页返回 - -

更新

 +- [ ] 搜索结果滚动时卡顿 +- [ ] 搜索结果退回搜索主页后页面状态没完全恢复 +- [ ] 搜索结果滚动条状态 + +## 0.1.5 +- 去除了右侧滚动条 +- 修复搜索结果页面刷新后背景显示为图片的问题 +- 将搜索结果顶栏中的logo链接从主页改为搜索页 +- 优化设置页面逻辑 +- 新增可以将视频设置为背景（暂时只支持视频直连） + +

更新历史

 ### 0.1.4 - 修复收藏按钮 diff --git a/Bilibili-Search-Beautification.user.js b/Bilibili-Search-Beautification.user.js index e337a98..fe0c5be 100644 --- a/Bilibili-Search-Beautification.user.js +++ b/Bilibili-Search-Beautification.user.js @@ -2,7 +2,7 @@ // @name B站搜索页美化 // @namespace http://tampermonkey.net/ // @homepage https://github.com/Trrrrw/UserScript -// @version 0.1.4 +// @version 0.1.5 // @description 美化search.bilibili.com页面 // @author Trrrrw // @match https://search.bilibili.com/* @@ -36,25 +36,48 @@ },{ name: 'imgFile', value: '' + },{ + name: 'videoUrl', + value: '' + },{ + name: 'videoFile', + value: '' }, { name: 'upBtnSwitch', value: true }, { - name: 'isUrl', - value: true + name: 'bgType', + value: 1 }]; value.forEach((v) => { GM_getValue(v.name) === undefined && GM_setValue(v.name, v.value); }); + + GM_registerMenuCommand("⚙️设置",() => { Swal.fire({ title:'⚙️设置', - html:`是否显示投稿按钮是否使用网络图片`+ - ``+ - ``+ - ``+ - `` + html:``+ + `
`+ + `是否显示投稿按钮
`+ + `
+ +
`+ + `
+ +
`+ + `
+ +
`+ + `
+ +
` }).then((res)=>{ if (res.isConfirmed) { history.go(0) @@ -63,9 +86,6 @@ document.getElementById('up-button-checkbox').addEventListener('change', (e) => { GM_setValue('upBtnSwitch', e.currentTarget.checked); }) - document.getElementById('is-url-checkbox').addEventListener('change', (e) => { - GM_setValue('isUrl', e.currentTarget.checked); - }) document.getElementById('bgimg-url').addEventListener('change', (e) => { if(e.currentTarget.value){ GM_setValue('imgUrl', e.currentTarget.value); @@ -81,6 +101,23 @@ reader.readAsDataURL(selectedFile); } }) + document.getElementById('bgvideo-url').addEventListener('change', (e) => { + if(e.currentTarget.value){ + GM_setValue('videoUrl', e.currentTarget.value); + } + }) + document.getElementById('bgvideo-file').addEventListener('change', (e) => { + if(e.isTrusted){ + const selectedFile = e.target.files[0]; + var url = URL.createObjectURL(selectedFile); + GM_setValue('videoFile',url); + } + }) + document.getElementById('bgType').addEventListener('change', (e) => { + GM_addStyle(`#setting${e.target.value}{display: unset !important}`); + GM_addStyle(`#setting${GM_getValue('bgType')}{display: none !important}`); + GM_setValue('bgType',e.target.value); + }) }); //删除元素 @@ -92,7 +129,8 @@ '.center-title-text',//搜索栏上方文字“搜索” '.left-entry > .v-popover-wrap:nth-of-type(n+2)',//左上元素 '.mini-header__title',//左上bilibili图标右侧“首页” - '.search-panel:last-child' + '.search-panel:last-child', + 'html::-webkit-scrollbar'//滚动条 ]; if (!GM_getValue('upBtnSwitch')) { del_dom.push('.right-entry-item--upload')//投稿按钮 @@ -105,11 +143,49 @@ //更改样式 //添加背景 - if(GM_getValue('isUrl')){ - GM_addStyle(`body{background: url( ${GM_getValue('imgUrl')} );}`) - }else{ - GM_addStyle(`body{background: url( ${GM_getValue('imgFile')} );}`) + switch(GM_getValue('bgType')){ + case '1': + GM_addStyle(`body{background: url( ${GM_getValue('imgUrl')} );}`) + break; + case '2': + GM_addStyle(`body{background: url( ${GM_getValue('imgFile')} );}`) + break; + case '3':{ + const sourceTag = document.createElement("source"); + sourceTag.src = GM_getValue('videoUrl'); + sourceTag.type="video/mp4"; + const videoTag = document.createElement("video"); + videoTag.id="bg-video"; + videoTag.muted=true; + videoTag.autoplay=true; + videoTag.loop=true; + videoTag.style.cssText=`position: absolute;object-fit: cover;height: 100%;width: 100%;top: 0;left: 0;`; + videoTag.appendChild(sourceTag); + document.body.appendChild(videoTag); + break; + } + case '4':{ + const sourceTag = document.createElement("source"); + sourceTag.src = GM_getValue('videoFile'); + sourceTag.type="video/mp4"; + const videoTag = document.createElement("video"); + videoTag.id="bg-video"; + videoTag.muted=true; + videoTag.autoplay=true; + videoTag.loop=true; + videoTag.style.cssText=`position: absolute;object-fit: cover;height: 100%;width: 100%;top: 0;left: 0;`; + videoTag.appendChild(sourceTag); + document.body.appendChild(videoTag); + break; + } + default: + GM_setValue('bgType','1'); } + // if(GM_getValue('isUrl')){ + // GM_addStyle(`body{background: url( ${GM_getValue('imgUrl')} );}`) + // }else{ + // GM_addStyle(`body{background: url( ${GM_getValue('imgFile')} );}`) + // } GM_addStyle('#i_cecream{background: transparent;}') GM_addStyle('body{background-attachment: fixed;background-size: cover;}') //header模糊效果 @@ -130,27 +206,41 @@ GM_addStyle('.v-popover{padding-top: 25px !important;}') //右上图标颜色 GM_addStyle('.right-entry-icon{color: #00aeec !important;}') + + function searchResult(){ + const newUrl = event.state ? event.state.url : window.location.href; + if (newUrl.includes('keyword')) { + GM_addStyle('.left-entry{display:block !important}') + GM_addStyle('#i_cecream{background: #ffffff !important;}')//移除背景模糊 + document.getElementsByClassName('left-entry__title')[0].href = 'https://search.bilibili.com/all'//设置顶栏图标返回链接 + GM_addStyle('#bg-video{display:none !important}')//移除背景视频 + GM_addStyle('#bili-header-container{background: var(--bg1) !important;}')//恢复顶栏颜色 + GM_addStyle('html::-webkit-scrollbar{display:unset !important;}') + } else { + //背景模糊 + GM_addStyle('#i_cecream{background: transparent !important;}') + GM_addStyle('#bg-video{display:unset !important}')//恢复背景视频 + GM_addStyle('#bili-header-container{background: transparent !important;}')//移除顶栏颜色 + } + } + window.onload = function () { + searchResult(); //搜索框预览文字 document.getElementsByClassName('search-input-el')[0].placeholder = '' //搜索结果 window.addEventListener('urlchange', function (event) { - const newUrl = event.state ? event.state.url : window.location.href; - if (newUrl.includes('keyword')) { - GM_addStyle('.left-entry{display:block !important}') - GM_addStyle('#i_cecream{background: #ffffff !important;}')//移除背景模糊 - } else { - //背景模糊 - GM_addStyle('#i_cecream{background: transparent !important;}') - } + searchResult(); }); //搜索栏选中模糊 document.onmouseup = function (e) { if (e.button == 0) { if (e.srcElement.className == 'search-input-el' && document.body.style.backdropFilter == '') { document.body.style.backdropFilter = 'blur(10px)'; + if(GM_getValue('bgType')=='3'||GM_getValue('bgType')=='4'){GM_addStyle('#bg-video{filter: blur(5px);}')} } else if (e.srcElement.className != 'search-input-el' && document.body.style.backdropFilter == 'blur(10px)') { document.body.style.backdropFilter = ''; + if(GM_getValue('bgType')=='3'||GM_getValue('bgType')=='4'){GM_addStyle('#bg-video{filter: unset;}')} } } }; diff --git a/HUPU-BBS-Beautification.md b/HUPU-BBS-Beautification.md index 8828892..0ca9634 100644 --- a/HUPU-BBS-Beautification.md +++ b/HUPU-BBS-Beautification.md @@ -3,7 +3,7 @@ ## 安装 👉👉[点击此处安装](https://greasyfork.org/zh-CN/scripts/459013-%E8%99%8E%E6%89%91%E7%BD%91%E9%A1%B5%E7%AB%AF%E4%BC%98%E5%8C%96)👈👈 -> 确保您的浏览器安装有 **Tampermonkey 脚本管理器扩展（[Chrome](https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=zh)** / **[Firefox](https://addons.mozilla.org/zh-CN/firefox/addon/tampermonkey/)** / **[Edge](https://microsoftedge.microsoft.com/addons/detail/tampermonkey/iikmkjmpaadaobahmlepeloendndfphd)）。** +> 确保您的浏览器安装有 **Tampermonkey 脚本管理器扩展（[Chrome](https://chromewebstore.google.com/detail/%E7%AF%A1%E6%94%B9%E7%8C%B4/dhdgffkkebhmkfjojejmpbldmpobfkfo)** / **[Firefox](https://addons.mozilla.org/zh-CN/firefox/addon/tampermonkey/)** / **[Edge](https://microsoftedge.microsoft.com/addons/detail/tampermonkey/iikmkjmpaadaobahmlepeloendndfphd)）。** ## 功能 - 优化使用体验 @@ -15,7 +15,7 @@ |--------------------------------------------------------------|----------------------|--|---|-----| |![icon](https://w1.hoopchina.com.cn/images/pc/old/favicon.ico)|https://bbs.hupu.com/*|✔️|✔️| ✖️ | -

更新

 +

更新历史

 ### 0.1.2