mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Allow click date to scroll
This commit is contained in:
parent
52cb0db920
commit
9a587be3bb
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
min/bangumi-timeline.vue.min.js
vendored
2
min/bangumi-timeline.vue.min.js
vendored
File diff suppressed because one or more lines are too long
@ -11,7 +11,7 @@
|
||||
"auto-continue.min.js": "96CD47C367D7397CE1467A69764409BAEFF16E8F535BC8E15523CD0B8A86687E",
|
||||
"auto-draw.min.js": "AE72CF2623DF2D15AD4AF82D125FFAF7EF5B1E6B36D9E9AC646AC98AA6AA8698",
|
||||
"auto-play.min.js": "DC9938AC15DADDC9D88DCA0C9BE64BE142C37D32CB85E42E23DAB2A7378531E5",
|
||||
"bangumi-timeline.vue.min.js": "64F7BE8C7B54B02E2C6ADB854A2B700D48CD6CA64BE0CE9D67EA5A874DD692C7",
|
||||
"bangumi-timeline.vue.min.js": "469257B7618D7F6637931F11A90AFC2AA96205C26A6374265C1352E54B17F3B7",
|
||||
"batch-download.min.js": "B7ADE150F26243B9529C2F0E2EC06695ACD27678E07902A8E6EABA767BBE3DD0",
|
||||
"biliplus-redirect.min.js": "9882D14DAC5C103212A101A5168883C41B4B3B2737FD5F222DC343D0304FF8AF",
|
||||
"blackboard.min.js": "8BB9CCDE72302AE7DE39D66F9231EFB82BA27DDA799BA4AAAC06F6DE802661BF",
|
||||
@ -165,7 +165,7 @@
|
||||
"settings-tooltip.zh-CN.min.js": "45E62A78438504F561A8746B6BB7E2665FF1E88CC1D5AE3EF433E7EFD018268B",
|
||||
"show-dead-video-title.min.js": "8D591930421EBA43A1BDF50DC8B645C1BD1A17E109FB1CFBCD6B78E6C74E1D68",
|
||||
"simple-home.vue.min.js": "BB936D1E635E21B72A81F448F86AE2E6773ADABC204BFE4BF78A02BB604E16C0",
|
||||
"simple-home-bangumi-category.vue.min.js": "AB57DC1E835BEF31A582A35675D5BD380D0C10051AC95895B2D6226DAC852617",
|
||||
"simple-home-bangumi-category.vue.min.js": "3CE2077EAA17E33FC3B0003E528658D34F0BBC34259FF5E47E8D2025A11D47AB",
|
||||
"simple-home-categories.vue.min.js": "DFF18335FC187158B907F996417CEE9D582182D00B4D5D312E10DEACFA31E0BA",
|
||||
"simple-home-feeds.vue.min.js": "BFBE14AEE13D9ACC38BEB0F673ACA8FD2F99944B1189AE77F3BBBB253B248A3A",
|
||||
"simple-home-normal-category.vue.min.js": "F3C1541942DC2C56D495662166FDAE7491F71666625E40E6A7A3465BF7922441",
|
||||
|
||||
BIN
min/bundle.zip
BIN
min/bundle.zip
Binary file not shown.
2
min/simple-home-bangumi-category.vue.min.js
vendored
2
min/simple-home-bangumi-category.vue.min.js
vendored
@ -1 +1 @@
|
||||
(()=>{return(i,e)=>{const a=`<div class=bangumi-category :class="{'rank-loading': rank.loading, 'timeline-loading': timeline.loading}"><bangumi-timeline class=timeline :type=timelineType @load="timeline.loading = false"@error="timeline.error = true"></bangumi-timeline><rank-list :videos=rank.videos view-mode=bangumi></rank-list><div class="timeline loading"></div><div class="rank loading"></div></div>`;e.applyStyleFromText(`.simple-home .bangumi-category{display:grid;--rank-width:350px;--rank-height:calc(var(--rank-width) / 16 * 10);grid-template:"timeline rank" 1fr/1fr var(--rank-width);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}@media screen and (min-width:1800px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1500px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1200px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1700px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1400px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1100px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1600px){.simple-home .bangumi-category{--rank-width:395px}}@media screen and (min-width:1300px){.simple-home .bangumi-category{--rank-width:395px}}@media screen and (min-width:1000px){.simple-home .bangumi-category{--rank-width:395px}}.simple-home .bangumi-category,.simple-home .bangumi-category *,.simple-home .bangumi-category ::after,.simple-home .bangumi-category ::before{transition:.2s ease-out}.simple-home .bangumi-category .loading{opacity:0;pointer-events:none;border-radius:16px;position:absolute}.simple-home .bangumi-category .timeline{grid-area:timeline}.simple-home .bangumi-category.timeline-loading .timeline.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.simple-home .bangumi-category.timeline-loading .timeline:not(.loading){opacity:0;pointer-events:none}.simple-home .bangumi-category .rank{height:700px;grid-area:rank}.simple-home .bangumi-category.rank-loading .rank.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.simple-home .bangumi-category.rank-loading .rank:not(.loading){opacity:0;pointer-events:none}`,"simple-home-bangumi-category-style");return{export:Object.assign({template:a},{components:{BangumiTimeline:()=>e.importAsync("bangumi-timeline.vue"),RankList:()=>e.importAsync("rank-list.vue")},props:["rid"],data(){return{timeline:{error:false,loading:true},rank:{error:false,loading:true,videos:[]}}},computed:{timelineType(){return this.rid===13?"global":"chinese"}},watch:{rid(){this.loadRankList()}},methods:{async loadRankList(){const{RegionCodes:i}=await e.importAsync("category-regions");const a=this.rid===i.bangumi?`https://api.bilibili.com/pgc/web/rank/list?season_type=1&day=3`:`https://api.bilibili.com/pgc/web/rank/list?season_type=4&day=3`;try{const i=await Ajax.getJson(a);if(i.code!==0){throw new Error(i.message)}const e=i.result.list.map(i=>{return{id:i.season_id,href:i.url,coverUrl:i.new_ep.cover.replace("http:","https:"),title:i.title,points:i.pts,epTitle:i.new_ep.index_show,playCount:i.stat.view,danmakuCount:i.stat.danmaku,watchlater:null}});this.rank.videos=e.slice(0,10)}catch(i){logError(i);this.rank.error=true}finally{this.rank.loading=false}}},mounted(){this.loadRankList()}})}}})();
|
||||
(()=>{return(i,e)=>{const a=`<div class=bangumi-category :class="{'rank-loading': rank.loading, 'timeline-loading': timeline.loading}"><bangumi-timeline class=timeline :type=timelineType @load="timeline.loading = false"@error="timeline.error = true"></bangumi-timeline><rank-list :videos=rank.videos view-mode=bangumi></rank-list><div class="timeline loading"></div><div class="rank loading"></div></div>`;e.applyStyleFromText(`.simple-home .bangumi-category{display:grid;--total-height:1010px;--rank-width:350px;--rank-height:calc(var(--rank-width) / 16 * 10);grid-template:"timeline rank" 1fr/1fr var(--rank-width);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}@media screen and (min-width:1800px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1500px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1200px){.simple-home .bangumi-category{--rank-width:365px}}@media screen and (min-width:1700px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1400px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1100px){.simple-home .bangumi-category{--rank-width:380px}}@media screen and (min-width:1600px){.simple-home .bangumi-category{--rank-width:395px}}@media screen and (min-width:1300px){.simple-home .bangumi-category{--rank-width:395px}}@media screen and (min-width:1000px){.simple-home .bangumi-category{--rank-width:395px}}.simple-home .bangumi-category,.simple-home .bangumi-category *,.simple-home .bangumi-category ::after,.simple-home .bangumi-category ::before{transition:.2s ease-out}.simple-home .bangumi-category .loading{opacity:0;pointer-events:none;border-radius:16px;position:absolute}.simple-home .bangumi-category .timeline{grid-area:timeline}.simple-home .bangumi-category.timeline-loading .timeline.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.simple-home .bangumi-category.timeline-loading .timeline:not(.loading){opacity:0;pointer-events:none}.simple-home .bangumi-category .rank{height:var(--total-height);grid-area:rank}.simple-home .bangumi-category.rank-loading .rank.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.simple-home .bangumi-category.rank-loading .rank:not(.loading){opacity:0;pointer-events:none}`,"simple-home-bangumi-category-style");return{export:Object.assign({template:a},{components:{BangumiTimeline:()=>e.importAsync("bangumi-timeline.vue"),RankList:()=>e.importAsync("rank-list.vue")},props:["rid"],data(){return{timeline:{error:false,loading:true},rank:{error:false,loading:true,videos:[]}}},computed:{timelineType(){return this.rid===13?"global":"chinese"}},watch:{rid(){this.loadRankList()}},methods:{async loadRankList(){const{RegionCodes:i}=await e.importAsync("category-regions");const a=this.rid===i.bangumi?`https://api.bilibili.com/pgc/web/rank/list?season_type=1&day=3`:`https://api.bilibili.com/pgc/web/rank/list?season_type=4&day=3`;try{const i=await Ajax.getJson(a);if(i.code!==0){throw new Error(i.message)}const e=i.result.list.map(i=>{return{id:i.season_id,href:i.url,coverUrl:i.new_ep.cover.replace("http:","https:"),title:i.title,points:i.pts,epTitle:i.new_ep.index_show,playCount:i.stat.view,danmakuCount:i.stat.danmaku,watchlater:null}});this.rank.videos=e.slice(0,10)}catch(i){logError(i);this.rank.error=true}finally{this.rank.loading=false}}},mounted(){this.loadRankList()}})}}})();
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="area-header">时间表</div>
|
||||
<div class="bangumi-timeline">
|
||||
<div class="timeline-day" v-for="t of timeline" :key="t.date">
|
||||
<div class="date-container" :class="{today: t.isToday}">
|
||||
<div class="date-container" :class="{today: t.isToday}" @click="moveTimeline">
|
||||
<div class="icon" :class="['day-of-week-' + t.dayOfWeek]"></div>
|
||||
<div class="date">{{t.date}}</div>
|
||||
<div class="day-of-week">{{t.dayOfWeekText}}</div>
|
||||
@ -111,6 +111,23 @@ export default {
|
||||
}
|
||||
// console.log(this.recentTime)
|
||||
},
|
||||
moveTimeline(e: MouseEvent) {
|
||||
const dateElement = e.currentTarget as HTMLElement
|
||||
const dayElement = dateElement.parentElement!
|
||||
const timelineElement = dayElement.parentElement!
|
||||
const style = getComputedStyle(timelineElement)
|
||||
const width =
|
||||
parseInt(style.getPropertyValue('--column-width').match(/(.+)px/)![1]) +
|
||||
parseInt(style.getPropertyValue('--column-gap').match(/(.+)px/)![1])
|
||||
const offset = dayElement.offsetLeft - timelineElement.scrollLeft
|
||||
if (offset < width) {
|
||||
timelineElement.scrollLeft -= width
|
||||
} else if (offset >= width * 2) {
|
||||
timelineElement.scrollLeft += width
|
||||
}
|
||||
console.log(e, dateElement, dayElement, timelineElement)
|
||||
console.log(width, width * 2, dayElement.offsetLeft, timelineElement.scrollLeft, offset)
|
||||
},
|
||||
async updateTimeline() {
|
||||
try {
|
||||
const json = await Ajax.getJsonWithCredentials(this.apiUrl)
|
||||
@ -179,10 +196,10 @@ export default {
|
||||
// timeline.style.setProperty('--column-width', `${width}px`)
|
||||
timeline.scrollLeft = 5 * (oldWidth + gap) // 第7个是今日
|
||||
// console.log(width, count, gap, 5 * (width + gap))
|
||||
const recentBangumi = timeline.querySelector(
|
||||
'.time.recent'
|
||||
) as HTMLElement
|
||||
recentBangumi.scrollIntoView()
|
||||
// const recentBangumi = timeline.querySelector(
|
||||
// '.time.recent'
|
||||
// ) as HTMLElement
|
||||
// recentBangumi.scrollIntoView()
|
||||
} catch (error) {
|
||||
logError(error)
|
||||
this.$emit('error')
|
||||
@ -225,7 +242,7 @@ export default {
|
||||
.timeline-day {
|
||||
scroll-snap-align: start;
|
||||
width: var(--column-width);
|
||||
max-height: 668px;
|
||||
max-height: calc(var(--total-height) - 32px);
|
||||
overflow: auto;
|
||||
flex: 0 0 auto;
|
||||
padding-bottom: 16px;
|
||||
@ -241,6 +258,7 @@ export default {
|
||||
column-gap: 8px;
|
||||
height: 60px;
|
||||
padding-bottom: 12px;
|
||||
cursor: pointer;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
|
||||
@ -96,6 +96,7 @@ export default {
|
||||
<style lang="scss">
|
||||
.simple-home .bangumi-category {
|
||||
display: grid;
|
||||
--total-height: 1010px;
|
||||
--rank-width: 350px;
|
||||
--rank-height: calc(var(--rank-width) / 16 * 10);
|
||||
grid-template: 'timeline rank' 1fr / 1fr var(--rank-width);
|
||||
@ -129,7 +130,7 @@ export default {
|
||||
position: absolute;
|
||||
}
|
||||
.rank {
|
||||
height: 700px;
|
||||
height: var(--total-height);
|
||||
}
|
||||
// .timeline {
|
||||
// justify-self: center;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user