Add bangumi timeline

This commit is contained in:
the1812 2020-01-16 23:29:36 +08:00
parent e8bbc1b5e0
commit 8e0dd0b327
16 changed files with 325 additions and 51 deletions

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

File diff suppressed because one or more lines are too long

View File

@ -11,7 +11,7 @@
"auto-continue.min.js": "96CD47C367D7397CE1467A69764409BAEFF16E8F535BC8E15523CD0B8A86687E",
"auto-draw.min.js": "AE72CF2623DF2D15AD4AF82D125FFAF7EF5B1E6B36D9E9AC646AC98AA6AA8698",
"auto-play.min.js": "DC9938AC15DADDC9D88DCA0C9BE64BE142C37D32CB85E42E23DAB2A7378531E5",
"bangumi-timeline.vue.min.js": "3FD9F4AD2288978976113CF075E5D1E9B97D2083C24C9971BD8200F31946EAAB",
"bangumi-timeline.vue.min.js": "1798356259C7AF0202A491545D4EA48EE01BE551CA9EC01E27ED21F24A2B09F5",
"batch-download.min.js": "B7ADE150F26243B9529C2F0E2EC06695ACD27678E07902A8E6EABA767BBE3DD0",
"biliplus-redirect.min.js": "9882D14DAC5C103212A101A5168883C41B4B3B2737FD5F222DC343D0304FF8AF",
"blackboard.min.js": "8BB9CCDE72302AE7DE39D66F9231EFB82BA27DDA799BA4AAAC06F6DE802661BF",
@ -143,7 +143,7 @@
"override-navbar.min.js": "E55F4EF066461D98ADB1C1582A716C8E179DC78DED8E71D3E9757B25444C2C5E",
"player-focus.min.js": "2C849315D6FE5968908ACC2F0CD6252C8D5988485B10C1FD09C96D2E397FD30D",
"player-shadow.min.js": "918D2127907BC2C164CB86BF7F9C2501CF3B9CD236FEEDE5155B9B5D932F3415",
"rank-list.vue.min.js": "F5EB721B1D60C58E25FA5CF18EDED9AF65BDB4A9C74A6AADC7C60102B4247D65",
"rank-list.vue.min.js": "6A92119B6E7A3F0970A923D5FD204D216521219CF901F8709C63A51E66C16233",
"remove-promotions.min.css": "A5C7A22113A8E470F386CC0FFEBEB5FA62C5AA905B7CBC2683E8B610B6903A44",
"remove-promotions.min.js": "A24F613643F11D06B2E0BF3CD0BA0B952062C34A4F6A46470F94EF23661D4319",
"remove-top-mask.min.js": "A15C1EC10D2E1A61845B1ADAE51860553F96427059E10443B1E53FAF48F45304",
@ -165,10 +165,10 @@
"settings-tooltip.zh-CN.min.js": "04C49DE52A62EF5C4BEF100E35FC9B16CEDEE1B26FBD817DB7FFE7F9DD545816",
"show-dead-video-title.min.js": "8D591930421EBA43A1BDF50DC8B645C1BD1A17E109FB1CFBCD6B78E6C74E1D68",
"simple-home.vue.min.js": "BB936D1E635E21B72A81F448F86AE2E6773ADABC204BFE4BF78A02BB604E16C0",
"simple-home-bangumi-category.vue.min.js": "A0498748887C61B08EBC13E43CFB35AEAC8ADDD232D15EAB0DA895A3221B1A08",
"simple-home-categories.vue.min.js": "1690195B013A3E53A7FDBF356273D00DDB315CA450835EF02A6111A918FA4FA6",
"simple-home-bangumi-category.vue.min.js": "704E825C2670CC769706598F911D610F7AE5301F156A5AD355F407D706056CCE",
"simple-home-categories.vue.min.js": "8CEF070A6E28ACB5DDF5581EF9E81BCBBFE8C0D001FDA59D8CFB28531E10BF93",
"simple-home-feeds.vue.min.js": "BFBE14AEE13D9ACC38BEB0F673ACA8FD2F99944B1189AE77F3BBBB253B248A3A",
"simple-home-normal-category.vue.min.js": "9B17815F68C20C66D3064EBCAADA3203CAA433C8145CD6237E31459B883598F4",
"simple-home-normal-category.vue.min.js": "F3C1541942DC2C56D495662166FDAE7491F71666625E40E6A7A3465BF7922441",
"simplify-home.min.css": "50F0FA046D61ECE5183409CF97C8DBECB4CF64918DF813CD2B39BF9FBD314B42",
"simplify-home.min.js": "F6D7F8E0D45847C3E056711AECE3832785603E7EF85A4B995C028F5CBE539C94",
"simplify-home.vue.min.js": "62F246FD5C9172676A077DD1DFB1F5ACE0E018952D13E1AAD89B3EA2FD00F961",

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
(()=>{return(i,e)=>{const a=`<div class=bangumi-category :class="{'rank-loading': rank.loading}"><bangumi-timeline class=timeline @load="timeline.loading = false"@error="timeline.error = true"></bangumi-timeline><rank-list :videos=rank.videos></rank-list><div class="timeline loading"></div><div class="rank loading"></div></div>`;e.applyStyleFromText(`.simple-home .bangumi-category{display:grid;grid-template:"timeline rank" 1fr/1fr calc(1.5 * var(--rank-width) + 10px);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}.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 .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{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")},data(){return{timeline:{error:false,loading:true},rank:{error:false,loading:true,videos:[]}}},computed:{},methods:{async loadRankList(){const i=`https://api.bilibili.com/pgc/web/rank/list?season_type=1&day=3`;try{const e=await Ajax.getJson(i);if(e.code!==0){throw new Error(e.message)}const a=e.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=a.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 @load="timeline.loading = false"@error="timeline.error = true"></bangumi-timeline><rank-list :videos=rank.videos></rank-list><div class="timeline loading"></div><div class="rank loading"></div></div>`;e.applyStyleFromText(`.simple-home .bangumi-category{display:grid;grid-template:"timeline rank" 1fr/1fr calc(1.5 * var(--rank-width) + 10px);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}.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")},data(){return{timeline:{error:false,loading:true},rank:{error:false,loading:true,videos:[]}}},computed:{},methods:{async loadRankList(){const i=`https://api.bilibili.com/pgc/web/rank/list?season_type=1&day=3`;try{const e=await Ajax.getJson(i);if(e.code!==0){throw new Error(e.message)}const a=e.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=a.slice(0,10)}catch(i){logError(i);this.rank.error=true}finally{this.rank.loading=false}}},mounted(){this.loadRankList()}})}}})();

View File

@ -1 +1 @@
(()=>{return(e,t)=>{const r=`<div class=categories><div class=header><div class=title>分区</div><div class=tabs ref=reorderContainer><div class=tab v-for="t of tabs":key=t.key :data-key=t.key :style="{order: getOrder(t.key)}":class="{active: selectedTab === t.key}"@click="selectedTab = t.key"><div class=tab-name>{{t.name}}</div></div></div><div class=buttons><div class=toggle-reorder @click="reordering = !reordering; reorder.toggle()"><icon type=mdi :icon="reordering ? 'check' : 'swap-horizontal'"></icon>{{reordering ? '完成' : '排序'}}</div></div></div><transition><component class=category-content :is=content :rid=rid></component></transition></div>`;t.applyStyleFromText(`.simple-home .categories{--loading-from:#d4d4d4;--loading-to:#ddd;--slideshow-ratio:0.6;--rank-width:370px;--rank-height:calc(var(--rank-width) / 16 * 9);--card-height:280px;--card-width:calc(var(--card-height) * (42 / 25));display:flex;flex-direction:column}@keyframes category-loading{from{background-color:var(--loading-from)}to{background-color:var(--loading-to)}}@media screen and (max-width:1800px){.simple-home .categories{--card-height:272px;--rank-width:350px}}@media screen and (max-width:1700px){.simple-home .categories{--card-height:264px;--rank-width:330px}}@media screen and (max-width:1600px){.simple-home .categories{--card-height:256px;--rank-width:310px}}@media screen and (max-width:1500px){.simple-home .categories{--card-height:248px;--rank-width:290px}}@media screen and (max-width:1400px){.simple-home .categories{--card-height:240px;--rank-width:270px}}@media screen and (max-width:1300px){.simple-home .categories{--card-height:232px;--rank-width:250px}}@media screen and (max-width:1200px){.simple-home .categories{--card-height:224px;--rank-width:230px}}@media screen and (max-width:1100px){.simple-home .categories{--card-height:216px;--rank-width:210px}}@media screen and (max-width:1000px){.simple-home .categories{--card-height:208px;--rank-width:190px}}@media screen and (max-width:900px){.simple-home .categories{--card-height:200px;--rank-width:170px}}@media screen and (max-width:800px){.simple-home .categories{--card-height:192px;--rank-width:150px}}@media screen and (max-width:700px){.simple-home .categories{--card-height:184px;--rank-width:130px}}.simple-home .categories,.simple-home .categories *,.simple-home .categories ::after,.simple-home .categories ::before{transition:.2s ease-out}.simple-home .categories .header .tabs{display:flex;flex:1 1 0;margin:0 32px;justify-content:flex-start;overflow:auto;width:0;height:42px;scrollbar-width:none!important}.simple-home .categories .header .tabs::-webkit-scrollbar{height:0!important;width:0!important}.simple-home .categories .header .tabs .tab{transition:none;margin-right:24px}.simple-home .categories .area-header{grid-area:header;display:flex;align-items:center;justify-content:flex-start;font-weight:700;font-size:11pt;margin-bottom:12px}.simple-home .categories .area-header::before{content:"";display:inline-flex;height:10px;width:10px;background-color:var(--theme-color);border-radius:50%;margin-right:8px}.simple-home .categories .category-content{margin-top:12px;margin-bottom:36px}.simple-home .categories .category-content-enter,.simple-home .categories .category-content-leave-to{opacity:0}`,"simple-home-categories-style");const i={anime:"动画",bangumi:"番剧",china:"国创",manga:"漫画",music:"音乐",dance:"舞蹈",game:"游戏",tech:"科技",digital:"数码",life:"生活",kichiku:"鬼畜",fashion:"时尚",ads:"广告",entertainment:"娱乐",column:"专栏",movie:"电影",tv:"TV剧",film:"影视",documentary:"纪录片"};return{export:Object.assign({template:r},{components:{Icon:()=>t.importAsync("icon.vue"),NormalCategory:()=>t.importAsync("simple-home-normal-category.vue"),BangumiCategory:()=>t.importAsync("simple-home-bangumi-category.vue")},data(){return{tabs:Object.entries(i).map(([e,t])=>{return{key:e,name:t}}),selectedTab:Object.entries(e.simpleHomeCategoryOrders).sort((e,t)=>e[1]-t[1])[0][0],reordering:false,reorder:null,regionCodes:null}},async mounted(){const r=this.$refs.reorderContainer;const{RegionCodes:i}=await t.importAsync("category-regions");this.regionCodes=i;const{Reorder:a}=await t.importAsync("reorder");const o=new a(r);this.reorder=o;o.addEventListener("reorder",t=>{const r=t.detail;for(const t of r){const{element:r,order:i}=t;e.simpleHomeCategoryOrders[r.getAttribute("data-key")]=i}e.simpleHomeCategoryOrders=e.simpleHomeCategoryOrders})},methods:{getOrder(t){return e.simpleHomeCategoryOrders[t]}},computed:{content(){if(["bangumi","china"].includes(this.selectedTab)){return"BangumiCategory"}else if(this.selectedTab==="manga"){return null}else if(this.selectedTab==="column"){return null}else{return"NormalCategory"}},rid(){if(!this.regionCodes){return-1}else{return this.regionCodes[this.selectedTab]}}}})}}})();
(()=>{return(e,t)=>{const r=`<div class=categories><div class=header><div class=title>分区</div><div class=tabs ref=reorderContainer><div class=tab v-for="t of tabs":key=t.key :data-key=t.key :style="{order: getOrder(t.key)}":class="{active: selectedTab === t.key}"@click="selectedTab = t.key"><div class=tab-name>{{t.name}}</div></div></div><div class=buttons><div class=toggle-reorder @click="reordering = !reordering; reorder.toggle()"><icon type=mdi :icon="reordering ? 'check' : 'swap-horizontal'"></icon>{{reordering ? '完成' : '排序'}}</div></div></div><transition mode=out-in><component class=category-content :is=content :rid=rid></component></transition></div>`;t.applyStyleFromText(`.simple-home .categories{--loading-from:#d4d4d4;--loading-to:#ddd;--slideshow-ratio:0.6;--rank-width:370px;--rank-height:calc(var(--rank-width) / 16 * 9);--card-height:280px;--card-width:calc(var(--card-height) * (42 / 25));display:flex;flex-direction:column}body.dark .simple-home .categories{--loading-from:#333;--loading-to:#262626}@keyframes category-loading{from{background-color:var(--loading-from)}to{background-color:var(--loading-to)}}@media screen and (max-width:1800px){.simple-home .categories{--card-height:272px;--rank-width:350px}}@media screen and (max-width:1700px){.simple-home .categories{--card-height:264px;--rank-width:330px}}@media screen and (max-width:1600px){.simple-home .categories{--card-height:256px;--rank-width:310px}}@media screen and (max-width:1500px){.simple-home .categories{--card-height:248px;--rank-width:290px}}@media screen and (max-width:1400px){.simple-home .categories{--card-height:240px;--rank-width:270px}}@media screen and (max-width:1300px){.simple-home .categories{--card-height:232px;--rank-width:250px}}@media screen and (max-width:1200px){.simple-home .categories{--card-height:224px;--rank-width:230px}}@media screen and (max-width:1100px){.simple-home .categories{--card-height:216px;--rank-width:210px}}@media screen and (max-width:1000px){.simple-home .categories{--card-height:208px;--rank-width:190px}}@media screen and (max-width:900px){.simple-home .categories{--card-height:200px;--rank-width:170px}}@media screen and (max-width:800px){.simple-home .categories{--card-height:192px;--rank-width:150px}}@media screen and (max-width:700px){.simple-home .categories{--card-height:184px;--rank-width:130px}}.simple-home .categories,.simple-home .categories *,.simple-home .categories ::after,.simple-home .categories ::before{transition:.2s ease-out}.simple-home .categories .header .tabs{display:flex;flex:1 1 0;margin:0 32px;justify-content:flex-start;overflow:auto;width:0;height:42px;scrollbar-width:none!important}.simple-home .categories .header .tabs::-webkit-scrollbar{height:0!important;width:0!important}.simple-home .categories .header .tabs .tab{transition:none;margin-right:24px}.simple-home .categories .area-header{grid-area:header;display:flex;align-items:center;justify-content:flex-start;font-weight:700;font-size:11pt;padding-bottom:12px}.simple-home .categories .area-header::before{content:"";display:inline-flex;height:10px;width:10px;background-color:var(--theme-color);border-radius:50%;margin-right:8px}.simple-home .categories .category-content{margin-top:12px;margin-bottom:36px}.simple-home .categories .category-content-enter,.simple-home .categories .category-content-leave-to{opacity:0}`,"simple-home-categories-style");const i={anime:"动画",bangumi:"番剧",china:"国创",manga:"漫画",music:"音乐",dance:"舞蹈",game:"游戏",tech:"科技",digital:"数码",life:"生活",kichiku:"鬼畜",fashion:"时尚",ads:"广告",entertainment:"娱乐",column:"专栏",movie:"电影",tv:"TV剧",film:"影视",documentary:"纪录片"};return{export:Object.assign({template:r},{components:{Icon:()=>t.importAsync("icon.vue"),NormalCategory:()=>t.importAsync("simple-home-normal-category.vue"),BangumiCategory:()=>t.importAsync("simple-home-bangumi-category.vue")},data(){return{tabs:Object.entries(i).map(([e,t])=>{return{key:e,name:t}}),selectedTab:Object.entries(e.simpleHomeCategoryOrders).sort((e,t)=>e[1]-t[1])[0][0],reordering:false,reorder:null,regionCodes:null}},async mounted(){const r=this.$refs.reorderContainer;const{RegionCodes:i}=await t.importAsync("category-regions");this.regionCodes=i;const{Reorder:a}=await t.importAsync("reorder");const o=new a(r);this.reorder=o;o.addEventListener("reorder",t=>{const r=t.detail;for(const t of r){const{element:r,order:i}=t;e.simpleHomeCategoryOrders[r.getAttribute("data-key")]=i}e.simpleHomeCategoryOrders=e.simpleHomeCategoryOrders})},methods:{getOrder(t){return e.simpleHomeCategoryOrders[t]}},computed:{content(){if(["bangumi","china"].includes(this.selectedTab)){return"BangumiCategory"}else if(this.selectedTab==="manga"){return null}else if(this.selectedTab==="column"){return null}else{return"NormalCategory"}},rid(){if(!this.regionCodes){return-1}else{return this.regionCodes[this.selectedTab]}}}})}}})();

View File

@ -1 +1 @@
(()=>{return(t,i)=>{const e=`<div class=category-view :class="{'new-activity-loading': newActivity.loading,'new-post-loading': newPost.loading,'rank-loading': rank.loading}"><slideshow-cards class=new-activity :cards=newActivity.videos :error=newActivity.error :show-stat=true @refresh=loadNewActivity() title=有新动态></slideshow-cards><slideshow-cards class=new-post :cards=newPost.videos :error=newPost.errors :show-stat=false @refresh=loadNewPost() title=最新发布></slideshow-cards><rank-list :videos=rank.videos></rank-list><div class="new-activity loading"></div><div class="new-post loading"></div><div class="rank loading"></div></div>`;i.applyStyleFromText(`.category-view{display:grid;grid-template:"new-activity rank" 1fr "new-post rank" 1fr/1fr calc(1.5 * var(--rank-width) + 10px);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}.category-view,.category-view *,.category-view ::after,.category-view ::before{transition:.2s ease-out}body.dark .category-view{--loading-from:#333;--loading-to:#262626}.category-view .loading{opacity:0;pointer-events:none;border-radius:16px;position:absolute}.category-view .new-activity{align-self:start;grid-area:new-activity}.category-view .new-post{align-self:end;grid-area:new-post}.category-view.new-activity-loading .new-activity.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.new-activity-loading .new-activity:not(.loading){opacity:0;pointer-events:none}.category-view.new-post-loading .new-post.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.new-post-loading .new-post:not(.loading){opacity:0;pointer-events:none}.category-view .rank{grid-area:rank}.category-view.rank-loading .rank.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.rank-loading .rank:not(.loading){opacity:0;pointer-events:none}@media screen and (max-width:1300px){.category-view{grid-template:"new-activity" 1fr "new-post" 1fr "rank" auto/1fr}.category-view .rank{justify-self:center}}`,"simple-home-normal-category-style");return{export:Object.assign({template:e},{components:{SlideshowCards:()=>i.importAsync("slideshow-cards.vue"),RankList:()=>i.importAsync("rank-list.vue")},store:store,props:{rid:{type:Number,required:true}},data(){return{newActivity:{error:false,loading:true,videos:[]},newPost:{error:false,loading:true,videos:[]},rank:{error:false,loading:true,videos:[]},loaded:false}},computed:{...Vuex.mapState(["watchlaterList"])},methods:{async loadCards(t,i,e){if(e===undefined){e=(t=>{const i=getUID();const e=_.get(t,"data.archives",[]);return e.map(t=>{return{id:t.aid,aid:t.aid,coverUrl:t.pic.replace("http:","https:"),title:t.title,upName:t.owner.name,upFaceUrl:t.owner.face.replace("http:","https:"),upID:t.owner.mid,playCount:t.stat.view,danmakuCount:t.stat.danmaku,like:t.stat.like,coins:t.stat.coin,description:t.desc,type:t.tname,watchlater:i?this.watchlaterList.includes(t.aid):null}})})}try{this[t].loading=true;const a=await Ajax.getJson(i);if(a.code!==0){this[t].error=true}this[t].videos=e(a)}catch(i){logError(i);this[t].error=true}finally{this[t].loading=false}},async loadNewActivity(){await this.loadCards("newActivity",`https://api.bilibili.com/x/web-interface/dynamic/region?ps=10&rid=${this.rid}`)},async loadNewPost(){await this.loadCards("newPost",`https://api.bilibili.com/x/web-interface/newlist?ps=10&rid=${this.rid}`)},async loadRank(){await this.loadCards("rank",`https://api.bilibili.com/x/web-interface/ranking/region?rid=${this.rid}&day=3&original=0`,t=>{const i=getUID();const e=t.data;return e.map(t=>{return{id:t.aid,aid:parseInt(t.aid),title:t.title,playCount:t.play,favorites:t.favorites,upID:t.mid,upName:t.author,description:t.description,coverUrl:t.pic.replace("http:","https:"),coins:t.coins,durationText:t.duration,points:t.pts,watchlater:i?this.watchlaterList.includes(parseInt(t.aid)):null}})})},...Vuex.mapActions(["toggleWatchlater"]),updateVideos(){this.loadNewActivity();this.loadNewPost();this.loadRank()}},watch:{rid(t){if(t>0){if(this.loaded){this.updateVideos()}}else{console.warn(`rid=${t}`)}}},mounted(){const t=new IntersectionObserver(()=>{this.updateVideos();this.loaded=true;t.disconnect()});t.observe(this.$el)}})}}})();
(()=>{return(t,i)=>{const e=`<div class=category-view :class="{'new-activity-loading': newActivity.loading,'new-post-loading': newPost.loading,'rank-loading': rank.loading}"><slideshow-cards class=new-activity :cards=newActivity.videos :error=newActivity.error :show-stat=true @refresh=loadNewActivity() title=有新动态></slideshow-cards><slideshow-cards class=new-post :cards=newPost.videos :error=newPost.errors :show-stat=false @refresh=loadNewPost() title=最新发布></slideshow-cards><rank-list :videos=rank.videos></rank-list><div class="new-activity loading"></div><div class="new-post loading"></div><div class="rank loading"></div></div>`;i.applyStyleFromText(`.category-view{display:grid;grid-template:"new-activity rank" 1fr "new-post rank" 1fr/1fr calc(1.5 * var(--rank-width) + 10px);grid-row-gap:24px;row-gap:24px;grid-column-gap:32px;column-gap:32px;position:relative}.category-view,.category-view *,.category-view ::after,.category-view ::before{transition:.2s ease-out}.category-view .loading{opacity:0;pointer-events:none;border-radius:16px;position:absolute}.category-view .new-activity{align-self:start;grid-area:new-activity}.category-view .new-post{align-self:end;grid-area:new-post}.category-view.new-activity-loading .new-activity.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.new-activity-loading .new-activity:not(.loading){opacity:0;pointer-events:none}.category-view.new-post-loading .new-post.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.new-post-loading .new-post:not(.loading){opacity:0;pointer-events:none}.category-view .rank{grid-area:rank}.category-view.rank-loading .rank.loading{position:static;animation:.64s ease-in-out infinite alternate category-loading;opacity:1;pointer-events:initial;width:100%;height:100%}.category-view.rank-loading .rank:not(.loading){opacity:0;pointer-events:none}@media screen and (max-width:1300px){.category-view{grid-template:"new-activity" 1fr "new-post" 1fr "rank" auto/1fr}.category-view .rank{justify-self:center}}`,"simple-home-normal-category-style");return{export:Object.assign({template:e},{components:{SlideshowCards:()=>i.importAsync("slideshow-cards.vue"),RankList:()=>i.importAsync("rank-list.vue")},store:store,props:{rid:{type:Number,required:true}},data(){return{newActivity:{error:false,loading:true,videos:[]},newPost:{error:false,loading:true,videos:[]},rank:{error:false,loading:true,videos:[]},loaded:false}},computed:{...Vuex.mapState(["watchlaterList"])},methods:{async loadCards(t,i,e){if(e===undefined){e=(t=>{const i=getUID();const e=_.get(t,"data.archives",[]);return e.map(t=>{return{id:t.aid,aid:t.aid,coverUrl:t.pic.replace("http:","https:"),title:t.title,upName:t.owner.name,upFaceUrl:t.owner.face.replace("http:","https:"),upID:t.owner.mid,playCount:t.stat.view,danmakuCount:t.stat.danmaku,like:t.stat.like,coins:t.stat.coin,description:t.desc,type:t.tname,watchlater:i?this.watchlaterList.includes(t.aid):null}})})}try{this[t].loading=true;const a=await Ajax.getJson(i);if(a.code!==0){this[t].error=true}this[t].videos=e(a)}catch(i){logError(i);this[t].error=true}finally{this[t].loading=false}},async loadNewActivity(){await this.loadCards("newActivity",`https://api.bilibili.com/x/web-interface/dynamic/region?ps=10&rid=${this.rid}`)},async loadNewPost(){await this.loadCards("newPost",`https://api.bilibili.com/x/web-interface/newlist?ps=10&rid=${this.rid}`)},async loadRank(){await this.loadCards("rank",`https://api.bilibili.com/x/web-interface/ranking/region?rid=${this.rid}&day=3&original=0`,t=>{const i=getUID();const e=t.data;return e.map(t=>{return{id:t.aid,aid:parseInt(t.aid),title:t.title,playCount:t.play,favorites:t.favorites,upID:t.mid,upName:t.author,description:t.description,coverUrl:t.pic.replace("http:","https:"),coins:t.coins,durationText:t.duration,points:t.pts,watchlater:i?this.watchlaterList.includes(parseInt(t.aid)):null}})})},...Vuex.mapActions(["toggleWatchlater"]),updateVideos(){this.loadNewActivity();this.loadNewPost();this.loadRank()}},watch:{rid(t){if(t>0){if(this.loaded){this.updateVideos()}}else{console.warn(`rid=${t}`)}}},mounted(){const t=new IntersectionObserver(()=>{this.updateVideos();this.loaded=true;t.disconnect()});t.observe(this.$el)}})}}})();

View File

@ -1,11 +1,45 @@
<template>
<div class="bangumi-timeline">
bangumi timeline
<div class="timeline-day" v-for="t of timeline" :key="t.date">
<div class="date-container" :class="{today: t.isToday}">
<div class="icon" :class="['day-of-week-' + t.dayOfWeek]"></div>
<div class="date">{{t.date}}</div>
<div class="day-of-week">{{t.dayOfWeekText}}</div>
</div>
<div
class="time-container"
v-for="[time, bangumis] of Object.entries(t.bangumis)"
:key="time"
>
<div class="time">
<icon type="mdi" icon="clock-fast"></icon>
{{time}}
</div>
<a
class="bangumi-item"
v-for="b of bangumis"
:key="b.url"
:class="{delay: b.delay}"
:href="b.url"
target="_blank"
>
<div class="cover-container">
<dpi-img :size="72" :src="b.squareCoverUrl"></dpi-img>
</div>
<div class="title">{{b.title}}</div>
<div class="ep-title">{{b.epTitle}}</div>
</a>
</div>
</div>
</div>
</template>
<script lang="ts">
export default {
components: {
Icon: () => import('../../icon.vue'),
DpiImg: () => import('../../dpi-img.vue')
},
props: {
type: {
type: String,
@ -19,7 +53,66 @@ export default {
chinese: 'https://bangumi.bilibili.com/web_api/timeline_cn'
}
return {
apiUrl: apiMapping[this.type] || apiMapping.global
apiUrl: apiMapping[this.type] || apiMapping.global,
timeline: []
}
},
async mounted() {
try {
const json = await Ajax.getJsonWithCredentials(this.apiUrl)
if (json.code !== 0) {
throw new Error(json.message)
}
const results = (json.result as any[]).map(item => {
return {
date: item.date,
dayOfWeek: item.day_of_week,
dayOfWeekText:
'星期' +
[
,
// undefined for index 0
'一',
'二',
'三',
'四',
'五',
'六',
'日'
][item.day_of_week],
isToday: Boolean(item.is_today),
bangumis: _.groupBy(
(item.seasons as any[]).map(s => {
return {
coverUrl: s.cover.replace('http:', 'https:'),
squareCoverUrl: s.square_cover.replace('http:', 'https:'),
time: s.pub_time,
timestamp: s.pub_ts * 1000,
url: s.url,
follow: Boolean(s.follow),
epTitle: s.pub_index || s.delay_reason + ' ' + s.delay_index,
title: s.title,
delay: Boolean(s.delay),
published: Boolean(s.is_published)
}
}),
it => it.time
)
}
})
// console.log(_.cloneDeep(results))
this.timeline = results
await this.$nextTick()
const el = this.$el as HTMLElement
const style = getComputedStyle(el)
const width = parseInt(style.getPropertyValue('--column-width').match(/(.+)px/)![1])
const gap = parseInt(style.getPropertyValue('--column-gap').match(/(.+)px/)![1])
el.scrollLeft = 5 * (width + gap) // 7
} catch (error) {
logError(error)
this.$emit('error')
} finally {
this.$emit('load')
}
}
}
@ -27,6 +120,179 @@ export default {
<style lang="scss">
.simple-home .bangumi-timeline {
display: grid;
@mixin no-scrollbar {
scrollbar-width: none !important;
&::-webkit-scrollbar {
height: 0 !important;
width: 0 !important;
}
}
display: flex;
align-items: flex-start;
overflow: auto;
@include no-scrollbar();
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
--column-count: 3;
--column-width: 250px;
--column-gap: 24px;
width: calc(
var(--column-count) * (var(--column-width) + var(--column-gap)) - 0.5 *
var(--column-gap)
);
.timeline-day {
scroll-snap-align: start;
width: var(--column-width);
max-height: 700px;
overflow: auto;
flex: 0 0 auto;
padding-bottom: 16px;
// overscroll-behavior-y: contain;
@include no-scrollbar();
.date-container {
display: grid;
grid-template:
'icon date' 1fr
'icon dow' 1fr / auto 1fr;
grid-column-gap: 8px;
column-gap: 8px;
height: 48px;
position: sticky;
top: 0;
z-index: 1;
background-color: #f4f4f4;
body.dark & {
background-color: #161616;
}
.icon {
grid-area: icon;
justify-self: center;
align-self: center;
background-image: url('//s1.hdslb.com/bfs/static/bangumi-timeline/asserts/icons.png');
background-size: 247px 663px;
width: 38px;
height: 36px;
background-position-x: -146px;
filter: brightness(0.5);
@for $day from 1 through 7 {
&.day-of-week-#{$day} {
background-position-y: #{-36 - 72 * ($day - 1)}px;
}
}
}
.date {
grid-area: date;
align-self: end;
opacity: .75;
}
.day-of-week {
grid-area: dow;
align-self: start;
font-weight: bold;
font-size: 15px;
opacity: .75;
}
&.today {
.icon {
width: 50px;
height: 48px;
background-position-x: -56px;
filter: none;
}
.date {
font-size: 14px;
opacity: 1;
}
.day-of-week {
font-size: 18px;
opacity: 1;
}
}
body.dark & {
.icon {
filter: brightness(.8);
}
&.today .icon {
filter: invert(1);
}
}
}
.time-container {
margin-top: 18px;
& > :not(:last-child) {
margin-bottom: 8px;
}
.time {
display: flex;
align-items: center;
font-weight: bold;
.be-icon {
margin-right: 6px;
font-size: 18px;
}
}
.bangumi-item {
display: grid;
$cover-size: 72px;
height: $cover-size;
grid-template:
'cover title' auto
'cover ep' auto / $cover-size 1fr;
background-color: #fff;
color: inherit;
box-shadow: 0 4px 8px 0 #0001;
border-radius: 8px;
grid-row-gap: 8px;
row-gap: 8px;
body.dark & {
background-color: #282828;
}
.cover-container {
grid-area: cover;
overflow: hidden;
border-radius: 8px 0 0 8px;
img {
width: 100%;
height: 100%;
}
}
&.delay {
opacity: 0.4;
}
&.delay:hover {
opacity: 1;
}
&:hover {
color: var(--theme-color) !important;
.cover-container img {
transform: scale(1.05);
}
}
.title {
grid-area: title;
align-self: end;
font-size: 13px;
font-weight: bold;
margin: 0 12px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
max-height: 2.6em;
word-break: break-all;
line-height: 1.3;
overflow: hidden;
}
.ep-title {
grid-area: ep;
align-self: start;
margin: 0 12px;
}
}
}
&:not(:last-child) {
margin-right: var(--column-gap);
}
}
}
</style>

View File

@ -1,9 +1,13 @@
<template>
<div
class="bangumi-category"
:class="{'rank-loading': rank.loading}"
:class="{'rank-loading': rank.loading, 'timeline-loading': timeline.loading}"
>
<bangumi-timeline class="timeline" @load="timeline.loading = false" @error="timeline.error = true"></bangumi-timeline>
<bangumi-timeline
class="timeline"
@load="timeline.loading = false"
@error="timeline.error = true"
></bangumi-timeline>
<!-- <div class="feeds" v-if="layout === '动态'">
</div>-->
<rank-list :videos="rank.videos"></rank-list>
@ -24,7 +28,7 @@ export default {
// layout: settings.simpleHomeBangumiLayout,
timeline: {
error: false,
loading: true,
loading: true
},
rank: {
error: false,
@ -55,7 +59,7 @@ export default {
epTitle: item.new_ep.index_show,
playCount: item.stat.view,
danmakuCount: item.stat.danmaku,
watchlater: null,
watchlater: null
}
})
this.rank.videos = list.slice(0, 10)
@ -69,7 +73,7 @@ export default {
},
mounted() {
this.loadRankList()
},
}
}
</script>
@ -88,6 +92,15 @@ export default {
::before {
transition: 0.2s ease-out;
}
.loading {
opacity: 0;
pointer-events: none;
border-radius: 16px;
position: absolute;
}
.rank {
height: 700px;
}
@each $name in ('timeline', 'rank') {
.#{$name} {
grid-area: unquote($name);

View File

@ -22,7 +22,7 @@
</div>
</div>
</div>
<transition>
<transition mode="out-in">
<component class="category-content" :is="content" :rid="rid"></component>
</transition>
</div>
@ -133,6 +133,10 @@ export default {
--card-width: calc(var(--card-height) * (42 / 25));
display: flex;
flex-direction: column;
body.dark & {
--loading-from: #333;
--loading-to: #262626;
}
@keyframes category-loading {
from {
background-color: var(--loading-from);
@ -180,7 +184,7 @@ export default {
justify-content: flex-start;
font-weight: bold;
font-size: 11pt;
margin-bottom: 12px;
padding-bottom: 12px;
&::before {
content: '';
display: inline-flex;

View File

@ -207,18 +207,11 @@ export default {
::before {
transition: 0.2s ease-out;
}
body.dark & {
--loading-from: #333;
--loading-to: #262626;
}
.loading {
opacity: 0;
pointer-events: none;
border-radius: 16px;
position: absolute;
// &.new-activity {
// height: 30vh;
// }
}
.new-activity {
align-self: start;

View File

@ -172,8 +172,6 @@ export default {
}
}
.area-header {
margin-bottom: 0;
padding-bottom: 12px;
position: -webkit-sticky;
position: sticky;
top: 0;