mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Add bangumi-subscriptions
This commit is contained in:
parent
8d9dcb0007
commit
0996cd58a0
2
@types/global/index.d.ts
vendored
2
@types/global/index.d.ts
vendored
@ -83,7 +83,7 @@ declare global {
|
||||
userInfo: number;
|
||||
messages: number;
|
||||
activities: number;
|
||||
bangumiLink: number;
|
||||
bangumi: number;
|
||||
watchlaterList: number;
|
||||
favoritesList: number;
|
||||
historyList: number;
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -163,7 +163,7 @@ const customNavbarDefaultOrders = {
|
||||
userInfo: 12,
|
||||
messages: 13,
|
||||
activities: 14,
|
||||
bangumiLink: 15,
|
||||
bangumi: 15,
|
||||
watchlaterList: 16,
|
||||
favoritesList: 17,
|
||||
historyList: 18,
|
||||
@ -255,7 +255,7 @@ const settings = {
|
||||
customNavbarBlur: true,
|
||||
customNavbarBlurOpacity: 0.7,
|
||||
customNavbarOrder: { ...customNavbarDefaultOrders },
|
||||
customNavbarHidden: ['bangumiLink'],
|
||||
customNavbarHidden: ['bangumi'],
|
||||
customNavbarBoundsPadding: 5,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
|
||||
@ -163,7 +163,7 @@ const customNavbarDefaultOrders = {
|
||||
userInfo: 12,
|
||||
messages: 13,
|
||||
activities: 14,
|
||||
bangumiLink: 15,
|
||||
bangumi: 15,
|
||||
watchlaterList: 16,
|
||||
favoritesList: 17,
|
||||
historyList: 18,
|
||||
@ -255,7 +255,7 @@ const settings = {
|
||||
customNavbarBlur: true,
|
||||
customNavbarBlurOpacity: 0.7,
|
||||
customNavbarOrder: { ...customNavbarDefaultOrders },
|
||||
customNavbarHidden: ['bangumiLink'],
|
||||
customNavbarHidden: ['bangumi'],
|
||||
customNavbarBoundsPadding: 5,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
|
||||
2
min/custom-navbar.min.css
vendored
2
min/custom-navbar.min.css
vendored
File diff suppressed because one or more lines are too long
2
min/custom-navbar.min.js
vendored
2
min/custom-navbar.min.js
vendored
File diff suppressed because one or more lines are too long
@ -14,7 +14,7 @@ export const customNavbarDefaultOrders = {
|
||||
userInfo: 12,
|
||||
messages: 13,
|
||||
activities: 14,
|
||||
bangumiLink: 15,
|
||||
bangumi: 15,
|
||||
watchlaterList: 16,
|
||||
favoritesList: 17,
|
||||
historyList: 18,
|
||||
@ -106,7 +106,7 @@ export const settings = {
|
||||
customNavbarBlur: true,
|
||||
customNavbarBlurOpacity: 0.7,
|
||||
customNavbarOrder: { ...customNavbarDefaultOrders },
|
||||
customNavbarHidden: ['bangumiLink'],
|
||||
customNavbarHidden: ['bangumi'],
|
||||
customNavbarBoundsPadding: 5,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
|
||||
@ -1207,9 +1207,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.custom-navbar .activity-tabs .view-all {
|
||||
.custom-navbar .activity-tabs .view-all,
|
||||
.custom-navbar .subscriptions-tabs .view-all {
|
||||
background-color: #8882;
|
||||
padding: 4px 10px;
|
||||
padding: 4px 6px 4px 10px;
|
||||
height: 28px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 14px;
|
||||
@ -1218,9 +1219,14 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
}
|
||||
.custom-navbar .activity-tabs .view-all i {
|
||||
font-size: 14pt;
|
||||
margin-right: 4px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.custom-navbar .activity-tabs .view-all:hover {
|
||||
.custom-navbar .subscriptions-tabs .view-all i {
|
||||
font-size: 12pt;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.custom-navbar .activity-tabs .view-all:hover,
|
||||
.custom-navbar .subscriptions-tabs .view-all:hover {
|
||||
background-color: #8884;
|
||||
}
|
||||
.custom-navbar .activity-tab {
|
||||
@ -1253,7 +1259,8 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
border-radius: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.custom-navbar .activity-tab::after {
|
||||
.custom-navbar .activity-tab::after,
|
||||
.custom-navbar .subscriptions .tab::after {
|
||||
content: "";
|
||||
width: calc(80%);
|
||||
height: 2px;
|
||||
@ -1265,7 +1272,8 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
transform: scaleX(0);
|
||||
transition: all .2s ease-out;
|
||||
}
|
||||
.custom-navbar .activity-tab.selected::after {
|
||||
.custom-navbar .activity-tab.selected::after,
|
||||
.custom-navbar .subscriptions .tab.selected::after {
|
||||
transform: scaleX(1);
|
||||
}
|
||||
.custom-navbar .activity-popup-content {
|
||||
@ -1629,7 +1637,7 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
top: 4px;
|
||||
left: 4px;
|
||||
background-color: var(--theme-color);
|
||||
color: var(--forground-color);
|
||||
color: var(--foreground-color);
|
||||
padding: 0 6px;
|
||||
height: 18px;
|
||||
border-radius: 9px;
|
||||
@ -1648,6 +1656,84 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
font-size: 12px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
.custom-navbar .subscriptions {
|
||||
width: 380px;
|
||||
font-size: 9pt;
|
||||
}
|
||||
.custom-navbar .subscriptions-tabs {
|
||||
margin: 8px 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.custom-navbar .subscriptions .tab-placeholder {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.custom-navbar .subscriptions .tab {
|
||||
opacity: 0.5;
|
||||
margin-right: 24px;
|
||||
position: relative;
|
||||
line-height: 1.4;
|
||||
cursor: pointer;
|
||||
}
|
||||
.custom-navbar .subscriptions .tab.selected {
|
||||
opacity: 1;
|
||||
font-weight: bold;
|
||||
transform: scale(1.2);
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card {
|
||||
position: relative;
|
||||
display: flex;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.round-corner .custom-navbar .bangumi-subscriptions-card {
|
||||
border-radius: var(--large-corner-radius);
|
||||
box-shadow: rgba(0,0,0,0.12) 0 2px 8px 0px;
|
||||
}
|
||||
.round-corner .custom-navbar .bangumi-subscriptions-card .cover {
|
||||
border-radius: var(--large-corner-radius) 0 0 var(--large-corner-radius);
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card .card-info {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0 12px;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card .info {
|
||||
padding: 2px;
|
||||
background-color: #8882;
|
||||
font-size: 12pt;
|
||||
border-radius: 14px;
|
||||
line-height: 1;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card .info:hover {
|
||||
background-color: #8884;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card .progress-row {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-self: stretch;
|
||||
align-items: center;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card .title {
|
||||
font-size: 11pt;
|
||||
font-weight: bold;
|
||||
padding-top: 8px;
|
||||
color: inherit;
|
||||
}
|
||||
.custom-navbar .bangumi-subscriptions-card:hover .title {
|
||||
color: var(--theme-color);
|
||||
}
|
||||
.custom-navbar .subscriptions .content {
|
||||
padding: 8px 12px;
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.round-corner .custom-navbar .column-card .cover:first-child {
|
||||
border-top-left-radius: var(--large-corner-radius);
|
||||
|
||||
@ -45,7 +45,7 @@ const attributes = {
|
||||
userInfo: "用户信息",
|
||||
messages: "消息",
|
||||
activities: "动态",
|
||||
bangumiLink: '订阅',
|
||||
bangumi: '订阅',
|
||||
watchlaterList: "稍后再看",
|
||||
favoritesList: "收藏",
|
||||
historyList: "历史",
|
||||
@ -152,7 +152,7 @@ const attributes = {
|
||||
computed: {
|
||||
orderList () {
|
||||
const orders = Object.entries(settings.customNavbarOrder);
|
||||
return orders.sort((a, b) => a[1] - b[1]).map(it => {
|
||||
return orders.filter(it => it[0] in displayNames).sort((a, b) => a[1] - b[1]).map(it => {
|
||||
return {
|
||||
displayName: displayNames[it[0]],
|
||||
name: it[0],
|
||||
@ -913,7 +913,7 @@ class Activities extends NavbarComponent {
|
||||
<transition name="activity-content" mode="out-in">
|
||||
<component :is="content"></component>
|
||||
</transition>
|
||||
<a class="view-more" target="_blank" :href="viewMoreUrl">查看更多<i class="mdi mdi-more"></i></a>
|
||||
<a class="view-more" target="_blank" :href="viewMoreUrl">查看更多<i class="mdi mdi-dots-horizontal-circle-outline"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@ -972,30 +972,6 @@ class Activities extends NavbarComponent {
|
||||
this.setNotifyCount(json.data.update_num)
|
||||
}
|
||||
async init () {
|
||||
Vue.component('dpi-img', {
|
||||
template: /*html*/`<img :width="width" :height="height" :srcset="srcset" :src="src">`,
|
||||
props: ['size', 'src'],
|
||||
computed: {
|
||||
srcset () {
|
||||
if (!this.src || !this.size) {
|
||||
return null
|
||||
}
|
||||
return getDpiSourceSet(this.src, this.size)
|
||||
},
|
||||
width () {
|
||||
if (typeof this.size === 'object' && 'width' in this.size) {
|
||||
return this.size.width
|
||||
}
|
||||
return null
|
||||
},
|
||||
height () {
|
||||
if (typeof this.size === 'object' && 'height' in this.size) {
|
||||
return this.size.height
|
||||
}
|
||||
return null
|
||||
}
|
||||
},
|
||||
})
|
||||
Vue.component('activity-loading', {
|
||||
template: /*html*/`
|
||||
<div v-if="loading" class="loading">
|
||||
@ -1056,8 +1032,8 @@ class Activities extends NavbarComponent {
|
||||
<div class="tab-name">{{item.name}}</div>
|
||||
</li>
|
||||
<a class="view-all" target="_blank" href="https://t.bilibili.com/">
|
||||
<i class="custom-navbar-iconfont-new-home custom-navbar-icon-activity"></i>
|
||||
全部动态
|
||||
<i class="custom-navbar-iconfont-new-home custom-navbar-icon-activity"></i>
|
||||
</a>
|
||||
</ul>
|
||||
`,
|
||||
@ -1449,12 +1425,137 @@ class HistoryList extends VideoList {
|
||||
this.active = document.URL.replace(/\?.*$/, "") === "https://www.bilibili.com/account/history";
|
||||
}
|
||||
}
|
||||
class Subscriptions extends NavbarComponent {
|
||||
constructor () {
|
||||
super()
|
||||
this.noPadding = true
|
||||
this.href = `https://space.bilibili.com/${userInfo.mid}/bangumi`
|
||||
this.html = '订阅'
|
||||
this.popupHtml = /*html*/`
|
||||
<div class="subscriptions">
|
||||
<ul class="subscriptions-tabs">
|
||||
<li class="tab" :class="{selected: bangumi}" @click="bangumi = true">追番</li>
|
||||
<li class="tab" :class="{selected: !bangumi}" @click="bangumi = false">追剧</li>
|
||||
<div class="tab-placeholder"></div>
|
||||
<a class="view-all" :href="'https://space.bilibili.com/${userInfo.mid}/' + (bangumi ? 'bangumi' : 'cinema')">
|
||||
查看更多
|
||||
<i class="mdi mdi-dots-horizontal-circle-outline"></i>
|
||||
</a>
|
||||
</ul>
|
||||
<div class="content">
|
||||
<transition name="subscriptions-content" mode="out-in">
|
||||
<bangumi-subscriptions v-if="bangumi"></bangumi-subscriptions>
|
||||
<cinema-subscriptions v-else></cinema-subscriptions>
|
||||
</transition>
|
||||
</div>
|
||||
</div>`
|
||||
this.initialPopup = () => { this.init() }
|
||||
}
|
||||
async init () {
|
||||
new Vue({
|
||||
el: await SpinQuery.select('.custom-navbar .subscriptions'),
|
||||
data: {
|
||||
bangumi: true,
|
||||
},
|
||||
components: {
|
||||
'bangumi-subscriptions': {
|
||||
template: /*html*/`
|
||||
<div class="bangumi-subscriptions">
|
||||
<div v-if="loading" class="loading">
|
||||
<i class="mdi mdi-18px mdi-loading mdi-spin"></i>
|
||||
加载中...
|
||||
</div>
|
||||
<a v-else v-for="card of cards" :href="card.playUrl" target="_blank" class="bangumi-subscriptions-card">
|
||||
<dpi-img class="cover" :src="card.coverUrl" :size="{height: 64}"></dpi-img>
|
||||
<div class="card-info">
|
||||
<h1 class="title">{{card.title}}</h1>
|
||||
<div class="progress-row">
|
||||
<div class="progress">{{card.progress}} | {{card.latest}}</div>
|
||||
<a class="info" :href="card.mediaUrl" target="_blank" title="详细信息">
|
||||
<i class="mdi mdi-information-outline"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
`,
|
||||
data () {
|
||||
return {
|
||||
loading: true,
|
||||
cards: [],
|
||||
}
|
||||
},
|
||||
async mounted () {
|
||||
try {
|
||||
const json = await Ajax.getJsonWithCredentials(`https://api.bilibili.com/x/space/bangumi/follow/list?type=1&pn=1&ps=16&vmid=${userInfo.mid}`)
|
||||
if (json.code !== 0) {
|
||||
logError(`加载追番信息失败: ${json.message}`)
|
||||
return
|
||||
}
|
||||
this.cards = json.data.list.map(item => {
|
||||
console.log(item)
|
||||
return {
|
||||
title: item.title,
|
||||
coverUrl: item.square_cover.replace('http:', 'https:'),
|
||||
latest: item.new_ep.index_show,
|
||||
progress: item.progress,
|
||||
playUrl: `https://www.bilibili.com/bangumi/play/ss${item.season_id}`,
|
||||
mediaUrl: `https://www.bilibili.com/bangumi/media/md${item.media_id}`,
|
||||
}
|
||||
})
|
||||
} finally {
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
},
|
||||
'cinema-subscriptions': {
|
||||
template: /*html*/``,
|
||||
data () {
|
||||
return {
|
||||
cards: []
|
||||
}
|
||||
},
|
||||
async mounted () {
|
||||
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
}
|
||||
get name () {
|
||||
return 'bangumi';
|
||||
}
|
||||
}
|
||||
|
||||
(async () => {
|
||||
const html = await import("customNavbarHtml");
|
||||
const json = await Ajax.getJsonWithCredentials("https://api.bilibili.com/x/web-interface/nav");
|
||||
userInfo = json.data;
|
||||
latestID = Activities.getLatestID()
|
||||
Vue.component('dpi-img', {
|
||||
template: /*html*/`<img :width="width" :height="height" :srcset="srcset" :src="src" :style="{filter: blur ? 'blur(' + blur + 'px)' : undefined}">`,
|
||||
props: ['size', 'src', 'blur'],
|
||||
computed: {
|
||||
srcset () {
|
||||
if (!this.src || !this.size) {
|
||||
return null
|
||||
}
|
||||
return getDpiSourceSet(this.src, this.size)
|
||||
},
|
||||
width () {
|
||||
if (typeof this.size === 'object' && 'width' in this.size) {
|
||||
return this.size.width
|
||||
}
|
||||
return null
|
||||
},
|
||||
height () {
|
||||
if (typeof this.size === 'object' && 'height' in this.size) {
|
||||
return this.size.height
|
||||
}
|
||||
return null
|
||||
}
|
||||
},
|
||||
})
|
||||
document.body.insertAdjacentHTML("beforeend", html);
|
||||
addSettingsListener("useDarkStyle", darkHandler);
|
||||
darkHandler(settings.useDarkStyle);
|
||||
@ -1504,7 +1605,8 @@ class HistoryList extends VideoList {
|
||||
if (userInfo.isLogin) {
|
||||
components.push(
|
||||
new Messages,
|
||||
new SimpleLink('订阅', `https://space.bilibili.com/${userInfo.mid}/bangumi`, 'bangumi'),
|
||||
// new SimpleLink('订阅', `https://space.bilibili.com/${userInfo.mid}/bangumi`, 'bangumi'),
|
||||
new Subscriptions,
|
||||
new Activities,
|
||||
new WatchlaterList,
|
||||
new FavoritesList,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user