Add history list component

This commit is contained in:
the1812 2020-02-01 19:06:12 +08:00
parent 1d42df83d7
commit f760b762e6
21 changed files with 280 additions and 129 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

View File

@ -30,15 +30,18 @@
"compact-layout.min.js": "B20609A7CBBDB1845FA0156FB5BE6B1E1A1B8B069EA85F65D16241DD2C12D738",
"custom-control-background.min.css": "1981FD2BF3B17ECF33F98D5DEDAF0D32ACBE9532A51FDB70822286991AB98EF3",
"custom-control-background.min.js": "2A439B045A51D24F5115DD25995ED37E3D0371A074199FE6C727F2235F39C4D9",
"custom-navbar.min.css": "248C2D63B76E9ECFF2A979D5F649F259A2930FF0FF6B856FC837FC9DA3DFB563",
"custom-navbar.min.css": "B59EAD6B917EF426E2C1D1DF0F1E64FFF9EF93E84C0D309A100003FE729817FB",
"custom-navbar.min.html": "17FD1B1727E8D62E7997F10002FE7BF23472F390042D44DE3376A7A5A5FF2FDF",
"custom-navbar.min.js": "3CBF688BE1F0FD3AEFFB6268328FEEC5B1BB189EC0F53C6B86E4D9353AE67DE7",
"custom-navbar.min.js": "A93BB5ABDED07764B3BF39A085BFF75CC0427A214B900127717583230B066836",
"custom-navbar-activities.min.js": "7CCA4AF4555CF9E9D338FE7285879C9F1396112F1FCD7293AD92EEE965E656C3",
"custom-navbar-article-history.vue.min.js": "E19AF7EEFCAAA3F4C89931E60A172D7FCE3118199230E3E846A646FB05DA1007",
"custom-navbar-blank.min.js": "DC2B75D5760EECD3A257785FDFBB7E5DEBF61CD9083C68DD5BCE468B093F54F3",
"custom-navbar-category.min.js": "4CF38ACE1D0501217266D1E35DFCBF9D5C1D9A3838C54D53C614878BB8CF55E2",
"custom-navbar-component.min.js": "D1B98EDF5C32D19E4A009D2303F69207B35ED35DD06E0F161E7D0BBB313F3C37",
"custom-navbar-favorites-list.min.js": "19ADC90C7B746C0214E7F5A8EF0E11C20A7F253A984FBB57BE653ED2F3A7526D",
"custom-navbar-favorites-list.min.js": "6321DC8C5EB93E2FEEC0D424EE9B0F4282066018D44DFE66FEAD079F29F7F040",
"custom-navbar-history-list.min.js": "5188143C7628452F99F3A8F3659A9889A9E9892045A518DBFBB2D3F7DD5D237D",
"custom-navbar-iframe.min.js": "C4EE469EC09655F9FF535ACBBD2A5F7C332DA2081936F8F485F5FB015EBD794B",
"custom-navbar-live-history.vue.min.js": "6C6E331D83D0E5DEBC88BF2FE466DFEA9BB6E36208219AA6FDF67E06EE9C2AE1",
"custom-navbar-logo.min.js": "236CCC887A3917A6D4840889B7380B648197765B8CDA27CB233F3F1E3215F7BB",
"custom-navbar-messages.min.js": "D7B315A4D8FD9E2EF9C1E40C1F3CA7EC18C5A87AC7A9410049061A0D851868DE",
"custom-navbar-search-box.min.js": "F91CB1678AE6E353148134A16184BDC67C8310099000986451F3668E7F505345",
@ -47,6 +50,7 @@
"custom-navbar-subscriptions.min.js": "40F7ACEB501462A72D6BC15D1814DFD8A75B9FA6867748F362593CB00260C51E",
"custom-navbar-upload.min.js": "0CDEEA46DCF0D6187C86BB12DE8CD36737116EF171AA1F63AB20C5DC7549C976",
"custom-navbar-user-info.min.js": "F0C8D9FC280BA0A69746EC36079FA97AD9F0B69EB7D8FB56C6ED815C46791321",
"custom-navbar-video-history.vue.min.js": "5D1A1A65F2927D0608CCF4218CA20EA50C85DD8A0E98F9DE557E6FACAAAEDB56",
"custom-navbar-video-list.min.js": "08D6713144E910C1303CB610A5890A5663B92BE82630BDA3C8E6299FB4A429E2",
"custom-navbar-watchlater-list.min.js": "2742EAFAA8C716A9E937F70DE1D222DAA97A83EA6323B56DA001F609757240DE",
"danmaku-converter.min.js": "FDAB4DB2E3C79730A39CDA7C5FD193693621FED206C6549E9B8F13778080CC12",
@ -54,7 +58,6 @@
"dark-important.min.css": "8453644F7FC8BB0E9DA401DC161815E2AC198E9B4D7A5A19C29934B672F277B1",
"dark-navbar.min.css": "A2D91F11127D165571ACCC53004EDDB118CEE110F9B020D7E0541E1C8FAEA478",
"dark-schedule.min.js": "853C446547603F4F0425F19F09F73335C9EC451A790C1C07E5E5B88A09E9B453",
"dark-slice-9.min.css": "CD4FCA9822F269BA4E09EE07AB2B691762BF9DF9949FCF1EEEDF6BF78633530A",
"dark-styles.min.js": "C62AFBB47DDC1E2F3F45D688B0F98394E471A423BE26BF47504D5C7D069ADBA1",
"debounce.min.js": "54D33E1273C1F3FE19550BF1844339C3D54D6B01DF8A39C3162D95B93B079CFA",
"default-danmaku-settings.min.css": "D9942B184FEDA7B08CFA0C34920E97D7A83B81762DCBF757642EBB60F95FF25D",

Binary file not shown.

View File

@ -0,0 +1 @@
(()=>{return(t,e)=>{const r=`<div class=article-history>article</div>`;return{export:Object.assign({template:r},{})}}})();

View File

@ -1 +1 @@
(()=>{return(t,i)=>{const{NavbarComponent:a}=i.import("custom-navbar-component");class e extends a{constructor(){super();this.noPadding=true;this.href=`https://space.bilibili.com/${getUID()}/favlist`;this.html=`收藏`;this.active=document.URL.replace(/\?.*$/,"")===`https://space.bilibili.com/${getUID()}/favlist`;this.popupHtml=`\n<div class="favorites-list loading">\n<div class="loading-tip">\n 加载中...\n</div>\n<div class="content">\n<div class="header">\n<v-dropdown class="list-select" @change="changeList()" :round="true" :items="listNames" :value.sync="selectedListName">\n</v-dropdown>\n<div class="play-all-container">\n<a class="play-all" :href="playLink" title="播放全部" target="_blank">\n<i class="mdi mdi-play"></i>\n</a>\n</div>\n<a class="more-info" :href="moreLink" title="查看更多" target="_blank">\n 查看更多\n<i class="mdi mdi-dots-horizontal"></i>\n</a>\n</div>\n<transition-group name="cards" tag="div" class="cards">\n<div class="empty-tip" v-if="!cardsLoading && cards.length === 0" key="empty-tip">\n 空空如也哦 = ̄ω ̄=\n</div>\n<div class="favorite-card" v-for="card of cards" :key="card.id">\n<a class="cover-container" target="_blank" :href="'https://www.bilibili.com/video/av' + card.aid">\n<dpi-img class="cover" :src="card.coverUrl" :size="{width: 130, height: 85}"></dpi-img>\n<div class="floating duration">{{card.durationText}}</div>\n<div class="floating favorite-time">{{card.favoriteTime | formatDate}}</div>\n</a>\n<a class="title" target="_blank" :href="'https://www.bilibili.com/video/av' + card.aid" :title="card.title">{{card.title}}</a>\n<a class="up" target="_blank" :href="'https://space.bilibili.com/' + card.upID" :title="card.upName">\n<dpi-img class="face" :src="card.upFaceUrl" :size="20"></dpi-img>\n<div class="name">{{card.upName}}</div>\n</a>\n</div>\n<div class="loading-tip" v-if="cardsLoading" key="loading-tip">\n 加载中...\n</div>\n</transition-group>\n</div>\n</div>\n`;this.initialPopup=(()=>this.init())}get name(){return"favoritesList"}async init(){new Vue({el:await SpinQuery.select(`.custom-navbar [data-name="${this.name}"] .favorites-list`),store:store,filters:{formatDate(t){return`${t.getFullYear()}-${(t.getMonth()+1).toString().padEnd(2,"0")}-${t.getDate().toString().padEnd(2,"0")}`}},components:{DpiImg:()=>i.importAsync("dpi-img.vue"),VDropdown:()=>i.importAsync("v-dropdown.vue")},data:{list:[],cards:[],selectedListName:"",cardsLoading:true,cardsPage:1},computed:{listNames(){return this.list.map(t=>t.name)},selectedListId(){const t=this.list.find(t=>t.name===this.selectedListName);return t?t.id:0},moreLink(){const t=this.selectedListId;if(t===0){return`https://space.bilibili.com/${getUID()}/favlist`}return`https://space.bilibili.com/${getUID()}/favlist?fid=${t}`},playLink(){const t=this.selectedListId;if(t===0){return undefined}return`https://www.bilibili.com/medialist/play/ml${t}`}},methods:{async getCards(){const t=`https://api.bilibili.com/medialist/gateway/base/spaceDetail?media_id=${this.selectedListId}&pn=${this.cardsPage}&ps=20`;const i=await Ajax.getJsonWithCredentials(t);if(i.code!==0){throw new Error(`加载收藏夹内容失败: ${i.message}`)}if(!i.data.medias){return[]}return i.data.medias.filter(t=>{return t.attr===0}).map(t=>{return{id:t.id,aid:t.id,coverUrl:t.cover.replace("http:","https:"),favoriteTimestamp:t.fav_time*1e3,favoriteTime:new Date(t.fav_time*1e3),title:t.title,description:t.intro,duration:t.duration,durationText:formatDuration(t.duration),playCount:t.cnt_info.play,danmakuCount:t.cnt_info.danmaku,upName:t.upper.name,upFaceUrl:t.upper.face.replace("http:","https:"),upID:t.upper.mid}})},async changeList(){try{this.cards=[];this.cardsPage=1;this.cardsLoading=true;this.cards=await this.getCards();this.setInfiniteScroll()}catch(t){logError(t)}finally{this.cardsLoading=false}},async loadNextPage(){try{this.cardsLoading=true;this.cardsPage++;const t=await this.getCards();this.cards.push(...t);if(t.length>0){this.setInfiniteScroll()}}catch(t){logError(t)}finally{this.cardsLoading=false}},setInfiniteScroll(){const t=this.$el.querySelector(".cards");const i=_.debounce(()=>{if(t.scrollTop+t.clientHeight>=t.scrollHeight-48){t.removeEventListener("scroll",i);this.loadNextPage()}},200);t.addEventListener("scroll",i)}},async mounted(){try{const t=`https://api.bilibili.com/medialist/gateway/base/created?pn=1&ps=100&up_mid=${getUID()}&is_space=0`;const i=await Ajax.getJsonWithCredentials(t);if(i.code!==0){throw new Error(`获取收藏夹列表失败: ${i.message}`)}this.list=i.data.list.map(t=>{return{id:t.id,name:t.title,count:t.media_count}});if(this.list.length>0){this.selectedListName=this.list[0].name;this.changeList()}}catch(t){logError(t)}finally{this.$el.classList.remove("loading")}}})}}return{export:{FavoritesList:e}}}})();
(()=>{return(t,i)=>{const{NavbarComponent:a}=i.import("custom-navbar-component");class e extends a{constructor(){super();this.noPadding=true;this.href=`https://space.bilibili.com/${getUID()}/favlist`;this.html=`收藏`;this.active=document.URL.replace(/\?.*$/,"")===this.href;this.popupHtml=`\n<div class="favorites-list loading">\n<div class="loading-tip">\n 加载中...\n</div>\n<div class="content">\n<div class="header">\n<v-dropdown class="list-select" @change="changeList()" :round="true" :items="listNames" :value.sync="selectedListName">\n</v-dropdown>\n<div class="play-all-container">\n<a class="play-all" :href="playLink" title="播放全部" target="_blank">\n<i class="mdi mdi-play"></i>\n</a>\n</div>\n<a class="more-info" :href="moreLink" title="查看更多" target="_blank">\n 查看更多\n<i class="mdi mdi-dots-horizontal"></i>\n</a>\n</div>\n<transition-group name="cards" tag="div" class="cards">\n<div class="empty-tip" v-if="!cardsLoading && cards.length === 0" key="empty-tip">\n 空空如也哦 = ̄ω ̄=\n</div>\n<div class="favorite-card" v-for="card of cards" :key="card.id">\n<a class="cover-container" target="_blank" :href="'https://www.bilibili.com/video/av' + card.aid">\n<dpi-img class="cover" :src="card.coverUrl" :size="{width: 130, height: 85}"></dpi-img>\n<div class="floating duration">{{card.durationText}}</div>\n<div class="floating favorite-time">{{card.favoriteTime | formatDate}}</div>\n</a>\n<a class="title" target="_blank" :href="'https://www.bilibili.com/video/av' + card.aid" :title="card.title">{{card.title}}</a>\n<a class="up" target="_blank" :href="'https://space.bilibili.com/' + card.upID" :title="card.upName">\n<dpi-img class="face" :src="card.upFaceUrl" :size="20"></dpi-img>\n<div class="name">{{card.upName}}</div>\n</a>\n</div>\n<div class="loading-tip" v-if="cardsLoading" key="loading-tip">\n 加载中...\n</div>\n</transition-group>\n</div>\n</div>\n`;this.initialPopup=(()=>this.init())}get name(){return"favoritesList"}async init(){new Vue({el:await SpinQuery.select(`.custom-navbar [data-name="${this.name}"] .favorites-list`),store:store,filters:{formatDate(t){return`${t.getFullYear()}-${(t.getMonth()+1).toString().padEnd(2,"0")}-${t.getDate().toString().padEnd(2,"0")}`}},components:{DpiImg:()=>i.importAsync("dpi-img.vue"),VDropdown:()=>i.importAsync("v-dropdown.vue")},data:{list:[],cards:[],selectedListName:"",cardsLoading:true,cardsPage:1},computed:{listNames(){return this.list.map(t=>t.name)},selectedListId(){const t=this.list.find(t=>t.name===this.selectedListName);return t?t.id:0},moreLink(){const t=this.selectedListId;if(t===0){return`https://space.bilibili.com/${getUID()}/favlist`}return`https://space.bilibili.com/${getUID()}/favlist?fid=${t}`},playLink(){const t=this.selectedListId;if(t===0){return undefined}return`https://www.bilibili.com/medialist/play/ml${t}`}},methods:{async getCards(){const t=`https://api.bilibili.com/medialist/gateway/base/spaceDetail?media_id=${this.selectedListId}&pn=${this.cardsPage}&ps=20`;const i=await Ajax.getJsonWithCredentials(t);if(i.code!==0){throw new Error(`加载收藏夹内容失败: ${i.message}`)}if(!i.data.medias){return[]}return i.data.medias.filter(t=>{return t.attr===0}).map(t=>{return{id:t.id,aid:t.id,coverUrl:t.cover.replace("http:","https:"),favoriteTimestamp:t.fav_time*1e3,favoriteTime:new Date(t.fav_time*1e3),title:t.title,description:t.intro,duration:t.duration,durationText:formatDuration(t.duration),playCount:t.cnt_info.play,danmakuCount:t.cnt_info.danmaku,upName:t.upper.name,upFaceUrl:t.upper.face.replace("http:","https:"),upID:t.upper.mid}})},async changeList(){try{this.cards=[];this.cardsPage=1;this.cardsLoading=true;this.cards=await this.getCards();this.setInfiniteScroll()}catch(t){logError(t)}finally{this.cardsLoading=false}},async loadNextPage(){try{this.cardsLoading=true;this.cardsPage++;const t=await this.getCards();this.cards.push(...t);if(t.length>0){this.setInfiniteScroll()}}catch(t){logError(t)}finally{this.cardsLoading=false}},setInfiniteScroll(){const t=this.$el.querySelector(".cards");const i=_.debounce(()=>{if(t.scrollTop+t.clientHeight>=t.scrollHeight-48){t.removeEventListener("scroll",i);this.loadNextPage()}},200);t.addEventListener("scroll",i)}},async mounted(){try{const t=`https://api.bilibili.com/medialist/gateway/base/created?pn=1&ps=100&up_mid=${getUID()}&is_space=0`;const i=await Ajax.getJsonWithCredentials(t);if(i.code!==0){throw new Error(`获取收藏夹列表失败: ${i.message}`)}this.list=i.data.list.map(t=>{return{id:t.id,name:t.title,count:t.media_count}});if(this.list.length>0){this.selectedListName=this.list[0].name;this.changeList()}}catch(t){logError(t)}finally{this.$el.classList.remove("loading")}}})}}return{export:{FavoritesList:e}}}})();

1
min/custom-navbar-history-list.min.js vendored Normal file
View File

@ -0,0 +1 @@
(()=>{return(t,i)=>{const{NavbarComponent:n}=i.import("custom-navbar-component");const e=[{name:"视频",componentName:"VideoHistory",moreLink:"https://www.bilibili.com/account/history"},{name:"专栏",componentName:"ArticleHistory",moreLink:""},{name:"直播",componentName:"LiveHistory",moreLink:"https://link.bilibili.com/p/center/index#/user-center/view-history/live"}];class s extends n{constructor(){super();this.noPadding=true;this.href=`https://www.bilibili.com/account/history`;this.html=`历史`;this.active=document.URL.replace(/\?.*$/,"")===this.href;this.popupHtml=`\n<div class="history-list loading">\n<div class="loading-tip">\n 加载中...\n</div>\n<div class="content">\n<div class="header">\n<div class="tabs">\n<div class="tab" v-for="tab of tabs" :class="{active: selectedTab === tab}" @click="selectedTab = tab">\n<div class="tab-name">{{tab.name}}</div>\n</div>\n</div>\n<a class="more-info" :href="selectedTab.moreLink || null" title="查看更多" target="_blank">\n 查看更多\n<i class="mdi mdi-dots-horizontal"></i>\n</a>\n</div>\n<transition name="history-content" mode="out-in">\n<component class="history-content" :is="selectedTab.componentName"></component>\n</transition>\n</div>\n</div>\n`;this.initialPopup=(()=>this.init())}get name(){return"historyList"}async init(){new Vue({el:await SpinQuery.select(`.custom-navbar [data-name="${this.name}"] .history-list`),store:store,components:{DpiImg:()=>i.importAsync("dpi-img.vue"),VideoHistory:()=>i.importAsync("custom-navbar-video-history.vue"),ArticleHistory:()=>i.importAsync("custom-navbar-article-history.vue"),LiveHistory:()=>i.importAsync("custom-navbar-live-history.vue")},data:{tabs:e,selectedTab:e[0]},async mounted(){this.$el.classList.remove("loading")}})}}return{export:{HistoryList:s}}}})();

View File

@ -0,0 +1 @@
(()=>{return(e,t)=>{const i=`<div class=live-history>live</div>`;return{export:Object.assign({template:i},{})}}})();

View File

@ -0,0 +1 @@
(()=>{return(e,t)=>{const i=`<div class=video-history>video</div>`;return{export:Object.assign({template:i},{})}}})();

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
(()=>{return(t,i)=>{const a=["//www.bilibili.com","//t.bilibili.com","//search.bilibili.com","//space.bilibili.com","//account.bilibili.com","//pay.bilibili.com","//member.bilibili.com","//big.bilibili.com","//message.bilibili.com","//app.bilibili.com","//passport.bilibili.com","//game.bilibili.com","//live.bilibili.com/blackboard/"];const s=["//t.bilibili.com/vote/h5/index/#/result","//t.bilibili.com/lottery/h5/index/#/result","//member.bilibili.com/video/upload","//space.bilibili.com/ajax/","//www.bilibili.com/h5/comment/","//www.bilibili.com/blackboard/"];const o=()=>{document.body.style.setProperty("--navbar-bounds-padding",`0 ${t.customNavbarBoundsPadding}%`);document.body.style.setProperty("--navbar-blur-opacity",(t.customNavbarBlurOpacity||.7).toString());addSettingsListener("customNavbarBlurOpacity",t=>{document.body.style.setProperty("--navbar-blur-opacity",t)})};const n=(t,i,a)=>{a.classList.toggle(t,i)};const e=t=>{dq(".custom-navbar").classList.toggle("dark",t);dq(".custom-navbar-settings").classList.toggle("dark",t)};return(()=>{if(isIframe()){return}o();const c=!(!a.some(t=>document.URL.includes(t))||s.some(t=>document.URL.includes(t)))||document.URL.includes("//www.bilibili.com/blackboard/bnj2020.html");if(c){document.body.classList.add("custom-navbar-loading");(async()=>{const a=await i.importAsync((()=>"customNavbarHtml")());document.body.insertAdjacentHTML("beforeend",a);addSettingsListener("useDarkStyle",e,true);const s=()=>dq(".custom-navbar");["Fill","Shadow","Compact","Blur"].forEach(t=>{const i="customNavbar"+t;addSettingsListener(i,i=>n(t.toLowerCase(),i,s()),true)});SpinQuery.condition(()=>dq("#banner_link,.international-header .bili-banner"),t=>t===null?false:Boolean(t.style.backgroundImage),i=>{Observer.attributes(i,()=>{const a=dqa(".custom-navbar .blur-layer");a.forEach(t=>{t.style.backgroundImage=i.style.backgroundImage;t.setAttribute("data-image",i.style.backgroundImage)});addSettingsListener("customNavbarTransparent",i=>{if(!t.hideBanner){s().classList.toggle("transparent",i)}},true);addSettingsListener("hideBanner",i=>{if(t.customNavbarTransparent){s().classList.toggle("transparent",!i)}})})});const{Blank:o}=await i.importAsync("custom-navbar-blank");const{Logo:c}=await i.importAsync("custom-navbar-logo");const{Category:r}=await i.importAsync("custom-navbar-category");const{SimpleLink:l}=await i.importAsync("custom-navbar-simple-link");const{UserInfo:m}=await i.importAsync("custom-navbar-user-info");const{SearchBox:b}=await i.importAsync("custom-navbar-search-box");const{Iframe:u}=await i.importAsync("custom-navbar-iframe");const d=[new o(1),new c,new r,new l("排行","https://www.bilibili.com/ranking","ranking"),new l("相簿","https://h.bilibili.com","drawing"),new l("音频","https://www.bilibili.com/audio/home/","music"),new u("游戏中心","https://game.bilibili.com/",{src:`https://www.bilibili.com/page-proxy/game-nav.html`,width:`680px`,height:`260px`,lazy:true,iframeName:"games"}),new u("直播","https://live.bilibili.com",{src:`https://live.bilibili.com/blackboard/dropdown-menu.html`,width:`528px`,height:`266px`,lazy:true,iframeName:"lives"}),new l("会员购","https://show.bilibili.com","shop"),new l("漫画","https://manga.bilibili.com","manga"),new o(2),new b,new m];if(getUID()){const{WatchlaterList:t}=await i.importAsync("custom-navbar-watchlater-list");const{Messages:a}=await i.importAsync("custom-navbar-messages");const{Activities:s}=await i.importAsync("custom-navbar-activities");const{Subscriptions:o}=await i.importAsync("custom-navbar-subscriptions");const{FavoritesList:n}=await i.importAsync("custom-navbar-favorites-list");const{HistoryList:e}=await i.importAsync("custom-navbar-video-list");d.push(new a,new o,new s,new t,new n,new e)}const{Upload:p}=await i.importAsync("custom-navbar-upload");d.push(new p,new o(3));new Vue({el:".custom-navbar",data:{components:d},methods:{requestPopup(t){if(!t.requestedPopup&&!t.disabled&&!t.active){this.$set(t,`requestedPopup`,true);t.initialPopup&&t.initialPopup()}t.onPopup&&t.onPopup()}},mounted(){document.body.classList.remove("custom-navbar-loading")}})})()}return{widget:{content:`\n<div class="gui-settings-flat-button" id="custom-navbar-settings">\n<i class="mdi mdi-24px mdi-auto-fix"></i>\n<span>顶栏布局</span>\n</div>`,condition:()=>c,success:async()=>{const{initSettingsPanel:t}=await i.importAsync("custom-navbar-settings");await t()}},unload:()=>{const t=dqa(".custom-navbar,.custom-navbar-settings");t.forEach(t=>t.style.display="none");i.removeStyle("customNavbarStyle")},reload:()=>{const t=dqa(".custom-navbar,.custom-navbar-settings");t.forEach(t=>t.style.display="flex");i.applyImportantStyle("customNavbarStyle")}}})()}})();
(()=>{return(t,i)=>{const a=["//www.bilibili.com","//t.bilibili.com","//search.bilibili.com","//space.bilibili.com","//account.bilibili.com","//pay.bilibili.com","//member.bilibili.com","//big.bilibili.com","//message.bilibili.com","//app.bilibili.com","//passport.bilibili.com","//game.bilibili.com","//live.bilibili.com/blackboard/"];const s=["//t.bilibili.com/vote/h5/index/#/result","//t.bilibili.com/lottery/h5/index/#/result","//member.bilibili.com/video/upload","//space.bilibili.com/ajax/","//www.bilibili.com/h5/comment/","//www.bilibili.com/blackboard/"];const o=()=>{document.body.style.setProperty("--navbar-bounds-padding",`0 ${t.customNavbarBoundsPadding}%`);document.body.style.setProperty("--navbar-blur-opacity",(t.customNavbarBlurOpacity||.7).toString());addSettingsListener("customNavbarBlurOpacity",t=>{document.body.style.setProperty("--navbar-blur-opacity",t)})};const n=(t,i,a)=>{a.classList.toggle(t,i)};const e=t=>{dq(".custom-navbar").classList.toggle("dark",t);dq(".custom-navbar-settings").classList.toggle("dark",t)};return(()=>{if(isIframe()){return}o();const c=!(!a.some(t=>document.URL.includes(t))||s.some(t=>document.URL.includes(t)))||document.URL.includes("//www.bilibili.com/blackboard/bnj2020.html");if(c){document.body.classList.add("custom-navbar-loading");(async()=>{const a=await i.importAsync((()=>"customNavbarHtml")());document.body.insertAdjacentHTML("beforeend",a);addSettingsListener("useDarkStyle",e,true);const s=()=>dq(".custom-navbar");["Fill","Shadow","Compact","Blur"].forEach(t=>{const i="customNavbar"+t;addSettingsListener(i,i=>n(t.toLowerCase(),i,s()),true)});SpinQuery.condition(()=>dq("#banner_link,.international-header .bili-banner"),t=>t===null?false:Boolean(t.style.backgroundImage),i=>{Observer.attributes(i,()=>{const a=dqa(".custom-navbar .blur-layer");a.forEach(t=>{t.style.backgroundImage=i.style.backgroundImage;t.setAttribute("data-image",i.style.backgroundImage)});addSettingsListener("customNavbarTransparent",i=>{if(!t.hideBanner){s().classList.toggle("transparent",i)}},true);addSettingsListener("hideBanner",i=>{if(t.customNavbarTransparent){s().classList.toggle("transparent",!i)}})})});const{Blank:o}=await i.importAsync("custom-navbar-blank");const{Logo:c}=await i.importAsync("custom-navbar-logo");const{Category:r}=await i.importAsync("custom-navbar-category");const{SimpleLink:l}=await i.importAsync("custom-navbar-simple-link");const{UserInfo:m}=await i.importAsync("custom-navbar-user-info");const{SearchBox:b}=await i.importAsync("custom-navbar-search-box");const{Iframe:u}=await i.importAsync("custom-navbar-iframe");const d=[new o(1),new c,new r,new l("排行","https://www.bilibili.com/ranking","ranking"),new l("相簿","https://h.bilibili.com","drawing"),new l("音频","https://www.bilibili.com/audio/home/","music"),new u("游戏中心","https://game.bilibili.com/",{src:`https://www.bilibili.com/page-proxy/game-nav.html`,width:`680px`,height:`260px`,lazy:true,iframeName:"games"}),new u("直播","https://live.bilibili.com",{src:`https://live.bilibili.com/blackboard/dropdown-menu.html`,width:`528px`,height:`266px`,lazy:true,iframeName:"lives"}),new l("会员购","https://show.bilibili.com","shop"),new l("漫画","https://manga.bilibili.com","manga"),new o(2),new b,new m];if(getUID()){const{WatchlaterList:t}=await i.importAsync("custom-navbar-watchlater-list");const{Messages:a}=await i.importAsync("custom-navbar-messages");const{Activities:s}=await i.importAsync("custom-navbar-activities");const{Subscriptions:o}=await i.importAsync("custom-navbar-subscriptions");const{FavoritesList:n}=await i.importAsync("custom-navbar-favorites-list");const{HistoryList:e}=await i.importAsync("custom-navbar-history-list");d.push(new a,new o,new s,new t,new n,new e)}const{Upload:p}=await i.importAsync("custom-navbar-upload");d.push(new p,new o(3));new Vue({el:".custom-navbar",data:{components:d},methods:{requestPopup(t){if(!t.requestedPopup&&!t.disabled&&!t.active){this.$set(t,`requestedPopup`,true);t.initialPopup&&t.initialPopup()}t.onPopup&&t.onPopup()}},mounted(){document.body.classList.remove("custom-navbar-loading")}})})()}return{widget:{content:`\n<div class="gui-settings-flat-button" id="custom-navbar-settings">\n<i class="mdi mdi-24px mdi-auto-fix"></i>\n<span>顶栏布局</span>\n</div>`,condition:()=>c,success:async()=>{const{initSettingsPanel:t}=await i.importAsync("custom-navbar-settings");await t()}},unload:()=>{const t=dqa(".custom-navbar,.custom-navbar-settings");t.forEach(t=>t.style.display="none");i.removeStyle("customNavbarStyle")},reload:()=>{const t=dqa(".custom-navbar,.custom-navbar-settings");t.forEach(t=>t.style.display="flex");i.applyImportantStyle("customNavbarStyle")}}})()}})();

View File

@ -851,7 +851,7 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
}
}
@import "./activities/activities", "./subscriptions/subscriptions", "_round-corner", "./settings/settings",
"./category/category", "./watchlater-list/watchlater-list", "./favorites-list/favorites-list";
"./category/category", "./watchlater-list/watchlater-list", "./favorites-list/favorites-list", "./history-list/history-list";
.custom-navbar > ul > li:not(.disabled):hover > .popup,
#custom-navbar-home-popup .category-item:hover .popup,
@ -951,103 +951,4 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
.custom-navbar form input {
width: 200px;
}
}
/*
body.all-navbar-fill .link-navbar,
body.all-navbar-fill .nav-header-wrapper,
body.all-navbar-fill .link-navbar .main-ctnr .nav-items-ctnr,
body.all-navbar-fill .manga-navbar,
body.all-navbar-fill .manga-navbar .search-bar .search-bar-bg
{
background-color: var(--theme-color) !important;
}
body.all-navbar-fill .link-navbar .nav-item:first-child::before,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-logo,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-tv-icon,
body.all-navbar-fill .nav-header-wrapper .nav-header .search-icon,
body.all-navbar-fill .link-navbar .main-ctnr .nav-logo::before,
body.all-navbar-fill .link-navbar .main-ctnr .nav-switcher.open-btn,
body.all-navbar-fill .manga-navbar .nav-list .nav-item .item-icon
{
filter: brightness(0) invert(1) !important;
opacity: 0.8666666;
}
body.all-navbar-fill .link-navbar .nav-item .label,
body.all-navbar-fill .link-navbar .nav-item:hover .nav-link .label,
body.all-navbar-fill .shortcuts-ctnr .shortcut-item .label-wrapper .text,
body.all-navbar-fill .shortcuts-ctnr .shortcut-item .label-wrapper .text:hover,
body.all-navbar-fill .link-navbar .publish-btn,
body.all-navbar-fill .link-navbar .publish-btn:hover,
body.all-navbar-fill .search-bar-ctnr .search-bar .placeholder,
body.all-navbar-fill .search-bar-ctnr .search-bar .search-btn,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-mainsite,
body.all-navbar-fill .nav-header-wrapper .nav-header .order-center,
body.all-navbar-fill .link-navbar .main-ctnr .nav-logo,
body.all-navbar-fill .shortcuts-ctnr .shortcut-item,
body.all-navbar-fill .my-link-btn,
body.all-navbar-fill .link-navbar .main-ctnr .nav-switcher i,
body.all-navbar-fill .link-navbar .main-ctnr .nav-switcher i:hover,
body.all-navbar-fill .link-navbar.black .my-link-btn .label,
body.all-navbar-fill .manga-navbar .search-bar .placeholder-list .placeholder-item,
body.all-navbar-fill .manga-navbar .search-bar .search-input,
body.all-navbar-fill .manga-navbar .nav-list .nav-item,
body.all-navbar-fill .manga-navbar .action-button
{
color: var(--foreground-color-d) !important;
}
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar input,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-search-bar,
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar input::placeholder,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-search-bar::placeholder
{
color: white !important;
}
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar input::placeholder,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-search-bar::placeholder,
body.all-navbar-fill .manga-navbar .search-bar .placeholder-list .placeholder-item
{
opacity: 0.7 !important;
}
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-search-bar,
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar,
body.all-navbar-fill .manga-navbar .search-bar .search-bar-bg
{
box-shadow: 0px 1px 4px 0 #0002;
}
body.all-navbar-fill .link-navbar .nav-item:hover,
body.all-navbar-fill .link-navbar .shortcuts-ctnr .shortcut-item:hover,
body.all-navbar-fill .link-navbar .publish-btn,
body.all-navbar-fill .link-navbar .publish-btn:hover:after,
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar,
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar:hover,
body.all-navbar-fill .nav-header-wrapper .nav-header .nav-header-search-bar
{
background-color: transparent !important;
}
body.all-navbar-fill .link-navbar .search-bar-ctnr .search-bar
{
border-color: transparent !important;
}
body.all-navbar-fill .link-navbar .publish-btn
{
background-image: none !important;
box-shadow: none !important;
}
body.all-navbar-fill .link-navbar .nav-item:hover .nav-link .label,
body.all-navbar-fill .link-navbar .shortcuts-ctnr .shortcut-item .label-wrapper .text:hover,
body.all-navbar-fill .link-navbar .my-link-btn .label:hover,
body.all-navbar-fill :not(.app-ctnr) .link-navbar .nav-item:hover,
body.all-navbar-fill .link-navbar .shortcuts-ctnr .shortcut-item:hover
{
background-color: transparent !important;
}
body.all-navbar-fill .link-navbar .shortcuts-ctnr .shortcut-item,
body.all-navbar-fill .link-navbar .nav-item
{
transition: all .2s ease-out;
}
body.all-navbar-fill .manga-navbar .search-bar .confirm-btn .search-icon
{
visibility: hidden !important;
} */
}

View File

@ -120,7 +120,7 @@ export default (() => {
const { Activities } = await import('./activities/custom-navbar-activities')
const { Subscriptions } = await import('./subscriptions/custom-navbar-subscriptions')
const { FavoritesList } = await import('./favorites-list/custom-navbar-favorites-list')
const { HistoryList } = await import('./simple/custom-navbar-video-list')
const { HistoryList } = await import('./history-list/custom-navbar-history-list')
components.push(
new Messages(),
new Subscriptions(),

View File

@ -15,7 +15,7 @@ export class FavoritesList extends NavbarComponent {
this.noPadding = true
this.href = `https://space.bilibili.com/${getUID()}/favlist`
this.html = `收藏`
this.active = document.URL.replace(/\?.*$/, "") === `https://space.bilibili.com/${getUID()}/favlist`
this.active = document.URL.replace(/\?.*$/, "") === this.href
this.popupHtml = /*html*/`
<div class="favorites-list loading">
<div class="loading-tip">
@ -73,7 +73,7 @@ export class FavoritesList extends NavbarComponent {
}
},
components: {
DpiImg: () => import('../dpi-img.vue'),
DpiImg: () => import('../../dpi-img.vue'),
VDropdown: () => import('../../../video/download-video/v-dropdown.vue'),
},
data: {

View File

@ -0,0 +1,117 @@
@import "../../common";
.custom-navbar .history-list {
width: 300px;
height: 600px;
font-size: 12px;
@include v-stretch();
justify-content: center;
.loading-tip {
display: flex;
justify-content: center;
width: 100%;
}
& > .loading-tip {
display: none;
}
.mdi {
line-height: 1;
font-size: 18px;
}
&.loading {
& > .loading-tip {
display: flex;
}
& > :not(.loading-tip) {
display: none;
}
}
.content {
@include v-stretch();
@include no-scrollbar();
justify-content: space-between;
flex-grow: 1;
overflow: auto;
.floating {
@include round-bar(20);
@include h-center();
background-color: #000c;
color: white;
justify-content: center;
cursor: pointer;
}
.header {
@include h-center();
justify-content: space-between;
margin: 16px 12px;
.tabs {
flex-grow: 1;
margin-right: 48px;
padding: 0 6px;
@include h-center();
justify-content: space-between;
.tab {
cursor: pointer;
position: relative;
white-space: nowrap;
&::after {
content: "";
width: calc(80%);
height: 2px;
border-radius: 1px;
position: absolute;
background-color: var(--theme-color);
left: 10%;
bottom: -4px;
transform: scaleX(0);
transition: 0.2s ease-out;
}
&.active::after {
transform: scaleX(1);
}
.tab-name {
opacity: 0.5;
line-height: normal;
}
&.active {
transform: scale(1.2);
.tab-name {
font-weight: bold;
opacity: 1;
}
}
}
}
.more-info {
@include h-center();
@include round-bar(26);
padding: 4px 6px 4px 10px;
background-color: #8882;
&:hover {
background-color: #8884;
}
.mdi {
margin-left: 8px;
}
}
}
.history-content {
&-enter-active,
&-leave-active {
transition: 0.2s ease-out;
}
&-enter,
&-leave-to {
opacity: 0;
transform: translateY(12px);
}
flex: 1;
overflow: auto;
overscroll-behavior: contain;
scroll-behavior: smooth;
position: relative;
@include no-scrollbar();
padding: 0 12px;
padding-bottom: 12px;
}
}
}

View File

@ -0,0 +1,9 @@
<template>
<div class="article-history">article</div>
</template>
<script lang="ts">
export default {
}
</script>

View File

@ -0,0 +1,86 @@
import { NavbarComponent } from '../custom-navbar-component'
interface HistoryTab {
name: string
componentName: string
moreLink: string
}
const tabs = [
{
name: '视频',
componentName: 'VideoHistory',
moreLink: 'https://www.bilibili.com/account/history',
},
{
name: '专栏',
componentName: 'ArticleHistory',
moreLink: '',
},
{
name: '直播',
componentName: 'LiveHistory',
moreLink: 'https://link.bilibili.com/p/center/index#/user-center/view-history/live'
},
] as HistoryTab[]
export class HistoryList extends NavbarComponent {
constructor() {
super()
this.noPadding = true
this.href = `https://www.bilibili.com/account/history`
this.html = `历史`
this.active = document.URL.replace(/\?.*$/, "") === this.href
this.popupHtml = /*html*/`
<div class="history-list loading">
<div class="loading-tip">
...
</div>
<div class="content">
<div class="header">
<div class="tabs">
<div class="tab" v-for="tab of tabs" :class="{active: selectedTab === tab}" @click="selectedTab = tab">
<div class="tab-name">{{tab.name}}</div>
</div>
</div>
<a class="more-info" :href="selectedTab.moreLink || null" title="查看更多" target="_blank">
<i class="mdi mdi-dots-horizontal"></i>
</a>
</div>
<transition name="history-content" mode="out-in">
<component class="history-content" :is="selectedTab.componentName"></component>
</transition>
</div>
</div>
`
this.initialPopup = () => this.init()
}
get name(): keyof CustomNavbarOrders {
return 'historyList'
}
async init() {
new Vue({
el: await SpinQuery.select(`.custom-navbar [data-name="${this.name}"] .history-list`) as HTMLElement,
store,
components: {
DpiImg: () => import('../../dpi-img.vue'),
VideoHistory: () => import('./custom-navbar-video-history.vue'),
ArticleHistory: () => import('./custom-navbar-article-history.vue'),
LiveHistory: () => import('./custom-navbar-live-history.vue'),
},
data: {
tabs,
selectedTab: tabs[0],
},
async mounted() {
this.$el.classList.remove('loading')
},
})
}
}
export default {
export: {
HistoryList,
},
}

View File

@ -0,0 +1,9 @@
<template>
<div class="live-history">live</div>
</template>
<script lang="ts">
export default {
}
</script>

View File

@ -0,0 +1,10 @@
<template>
<div class="video-history">video</div>
</template>
<script lang="ts">
// https://api.bilibili.com/x/web-interface/history/cursor?type=article&ps=30
export default {
}
</script>