Greasy Fork

Greasy Fork is available in English.

仰晨-B站功能优化

1、《不用长按就可以3倍速啦 支持 2.5 3 3.5 4 倍速(2022.11.15》 2、《给出每集剩下的时间-----《只有教程集合才有效》 鬼畜集合的标签是不同的所以无效的,有时候集合也会加载太快导致失败,第二次有了缓存基本就行了,暂时就不改了,我要学习java 55555 js我就是个小白,算是想要优化一下看教程 又觉得自己应该可以 就百度 来完成了(2023.1.18》3、《添加按钮控制《看进度》是否打开2023.1.20》4、《增加显示总时长2023.1.20 02:15》5、《改变总时长位置,增加按钮滚到当前视频集到屏幕 样式分离开来 2023.1.25》6、《优化不是集合就不执行,添加一个提前加载按钮,修复之前倍数添加变蓝bug2023.1.30 ---.31添加过渡效果、添加非集合提示+动画效果》

目前为 2023-02-07 提交的版本。查看 最新版本

作者
cgl556
评分
0 0 0
版本
2023.2.8
创建于
2022-11-14
更新于
2023-02-07
大小
13.9 KB
许可证
AGPL License
适用于

// ==UserScript==
// @name 仰晨-B站改造计划(为了学习版)
// @description 1、《不用长按就可以3倍速啦 支持 2.5 3 3.5 4 倍速(2022.11.15》 2、《给出每集剩下的时间-----《只有教程集合才有效》 鬼畜集合的标签是不同的所以无效的,有时候集合也会加载太快导致失败,第二次有了缓存基本就行了,暂时就不改了,我要学习java 55555 js我就是个小白,算是想要优化一下看教程 又觉得自己应该可以 就百度 来完成了(2023.1.18》3、《添加按钮控制《看进度》是否打开2023.1.20》4、《增加显示总时长2023.1.20 02:15》5、《改变总时长位置,增加按钮滚到当前视频集到屏幕 样式分离开来 2023.1.25》6、《优化不是集合就不执行,添加一个提前加载按钮,修复之前倍数添加变蓝bug2023.1.30 ---.31添加过渡效果、添加非集合提示+动画效果》
// @license AGPL License
// @namespace https://mp.weixin.qq.com/s/zsVmSmd63OIxuoDbKGA-xg
// @version 2023.2.8
// @author 仰晨
// @match *://www.bilibili.com/video/*
// @icon https://bilibili.com/favicon.ico
// @grant none
// ==/UserScript==

//未解决问题 尝试按钮点太快可能会导致网页崩溃 (2023.2.8 尝试延迟2秒再出现)
var flag = true;//如果点了尝试 页面加载完成就不用再执行了

setTimeout(function (){
//创建一个“尝试”按钮
let try_button = document.createElement("div");
//设置id
try_button.setAttribute('id','setText'); //设置标签属性
try_button.setAttribute('title','只能点一次,确定加载好了再点'); //设置鼠标放置提醒文字
//设置标签内容
try_button.innerText="尝试提前加载";
//插入父标签下
document.getElementsByTagName("body")[0].appendChild(try_button);
try_button.onclick=function () {
document.getElementById("setText").remove();//成功加载把“尝试”先删了
show ();
倍速();
}
},2000)

window.onload=function() {
//可能点按钮的时候视频还没加载好所以要再判断一下
if (document.getElementsByClassName("bpx-player-ctrl-playbackrate-menu-item").length===6) {
倍速();
}
if (flag){
document.getElementById("setText").remove();//成功加载把“尝试”先删了
show ();
}

}//加载完成执行—收括号----------------------------------


function 倍速 () {
function 插入倍速 (速度){
//创建一个p元素
let para = document.createElement("li");
para.setAttribute('class','bpx-player-ctrl-playbackrate-menu-item'); //设置标签属性
para.setAttribute('data-value',速度); //设置标签属性
para.innerText=速度+"x";
//获取父标签
let div=document.getElementsByClassName("bpx-player-ctrl-playbackrate-menu")[0];
//添加标签
let one=div.firstChild;// 获取父标签的第一个子元素
div.insertBefore(para,one); // 在父标签的第一个子元素,前插入div标签
}
插入倍速(2.5);
插入倍速(3);
插入倍速(3.5);
插入倍速(4);
}

//看进度方法---看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看


//------------给出每集剩下的时间-----《只有教程集合才有效》 鬼畜集合的标签是不同的所以无效的-------------------------=======================================================
function lookJinDu(){
const element = document.getElementById("multi_page").getElementsByClassName("duration"); //每一集是时间标签

const allElement = document.getElementsByClassName("list-box")[0].children; //视频集合下的全部标签

console.log("视频列表共有"+element.length);
if(element.length===allElement.length){ //如果还没有进度就加进度
//定义一个数组放每个视频的秒数
let arr = [];
let s_all = 0;
//收集总时长-----//单纯是秒更好处理---------------------------------
for(let i=0;i=0;i--){
jindu[i].remove();
}
document.getElementById("setText").innerText="已关闭已看进度";
}
}//看进度方法结束-----------------看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看看



//页面添加元素方法+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++2023.1.30抽取出来+++++++
function show (){
//————————————————看进度按钮开关——————————————————————————————
if (flag) {//这个按钮不存在????????????????
console.log("---开始创建按钮---");
flag=false;
if (document.querySelector(".head-left h3") != null) {//视频选集存在??????????????????????
//创建一个按钮
let bt = document.createElement("div");//不用button了2023.1.30
//设置id 方便改内容
bt.setAttribute('id', 'setText'); //设置标签属性
//设置标签内容
bt.innerText = "已打开已看进度";
//设置样式和位置放下面了2023.1.25
//bt.style = "position: fixed; right: 0px;bottom: 20px;color:red;";
//插入父标签下
document.getElementById("app").appendChild(bt);

bt.onclick = function () {
lookJinDu();
};//开关按钮

lookJinDu();//默认打开

//——————————————————————————————————————————————————————
//滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚—集合中《当前在看的》 滚到屏幕可见位置—滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚

//创建一个按钮
let see = document.createElement("div");
//设置id 方便改内容
see.setAttribute('id', 'see'); //设置标签属性
see.setAttribute('title','如果正在播放的在屏幕可见处。\n是不会有效果的'); //设置鼠标放置提醒文字2023.1.30
//设置标签内容
see.innerText = "当前播放集";
//设置样式(分离了)

//插入父标签下
document.getElementsByClassName("head-con")[0].appendChild(see);

see.onclick = function () {
//有时class会变...
let on = document.getElementsByClassName("on");
if (on < 2) {
document.getElementsByClassName("watched")[0].scrollIntoView({
block: "nearest",
behavior: "smooth"
});
} else {
on[on.length - 1].scrollIntoView({block: "nearest", behavior: "smooth"});
}//平滑滚到到屏幕可见---滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚滚/滚/滚/滚/滚/
}
} else {//视频选集不存在??????????????????????2023.1.30
//创建一个提醒按钮
let tis = document.createElement("div");
//设置id
tis.setAttribute('id', 'setText'); //设置标签属性
//设置标签内容
tis.innerText = "记得好好学习";
//插入父标签下
document.getElementById("app").appendChild(tis);
//————————————————————————————————————————————————————————————
//创建一个默认隐藏的东东
let move = document.createElement("div");
//设置id
move.setAttribute('id', 'canSet'); //设置标签属性
//设置标签内容
let box_text= ` 公众号:仰晨

本脚本的作用在于学习的集合是初衷,边写边学是兴趣。

鄙人公众号:仰晨

`;//临时变量
move.innerHTML = box_text;//为了输出时标签不带双引号--直接写会带双引号会很神奇
//插入父标签下
document.getElementById("app").appendChild(move);

}
}else {
console.log("按钮已存在");}
}//页面添加元素方法结束+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++






//——————————————添加样式(分离操作)——————————————————————————————2023.1.25 begin
do{
let style=`
.jindu{
color:#d3d3d3;
}
#setText{
position: fixed;
right: 0px;
bottom: 20px;
}
#see{
position: absolute;
top: 200px;
left: 100%;
width: 20px;

}

#see,
#setText{
border: 2px #fdbaba solid;
background-color: #ffffff00;
color: #FF6699;
text-align: center;
cursor: pointer;
font-weight: 555;
border-radius: 5px;
transition: all .3s;
}

#setText:hover,
#see:hover{
background-color: #FFECF1;
}


#canSet{
display: flex;
flex-wrap: wrap;
position: fixed;
right: -250px;
transition: right .5s;
bottom: 50px;
width: 200px;
color: #9f8686;
background-color: #e9b8fa59;
border-radius: 6px;
box-shadow: 3px 6px 10px 0px #8f9ca1;
border: 2px #fff solid;

}

#setText:hover+#canSet{
right: 10px;
}
`;

//cursor:pointer;变小手 :hover碰到触发 transition: all .5s;过渡动画0.5秒 display: flex;弹性盒子


let ele=document.createElement("style");
ele.innerHTML=style;
document.getElementsByTagName('head')[0].appendChild(ele);
}while(false);
//——————————————————————————————————————————————————————————