Bilibili-Evolved/min/simple-home-categories.vue.min.js
2021-07-01 20:06:21 +08:00

1 line
5.5 KiB
JavaScript

(()=>(e,i)=>{const t=`<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=selectTab(t)><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>`;i.applyStyleFromText(`.simple-home .categories{--loading-from:#d4d4d4;--loading-to:#ddd;--slideshow-ratio:0.6;--rank-width:370px;--rank-height:calc(var(--rank-width) / 16 * 10);--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 r={anime:"动画",bangumi:"番剧",china:"国创",music:"音乐",dance:"舞蹈",game:"游戏",knowledge:"知识",tech:"科技",life:"生活",food:"美食",animal:"动物圈",kichiku:"鬼畜",fashion:"时尚",information:"资讯",entertainment:"娱乐",movie:"影视",tv:"TV剧",film:"放映厅",documentary:"纪录片"};return{export:Object.assign({template:t},{components:{Icon:()=>i.importAsync("icon.vue"),NormalCategory:()=>i.importAsync("simple-home-normal-category.vue"),BangumiCategory:()=>i.importAsync("simple-home-bangumi-category.vue")},data(){let i=e.simpleHomeCategoryOrders;const t=Object.values(i);const a=t.some((e=>e===null||e===undefined||Number.isNaN(e)));const o=_.uniq(t).length!==t.length;if(a||o){e.simpleHomeCategoryOrders=simpleHomeCategoryDefaultOrders;i=simpleHomeCategoryDefaultOrders}return{tabs:Object.entries(r).map((([e,i])=>({key:e,name:i}))),selectedTab:Object.entries(i).sort(((e,i)=>e[1]-i[1]))[0][0],reordering:false,reorder:null,regionCodes:null,regionLinks:null}},async mounted(){this.checkAds();const t=this.$refs.reorderContainer;const{RegionCodes:r,RegionLinks:a}=await i.importAsync("category-regions");this.regionCodes=r;this.regionLinks=a;const{Reorder:o}=await i.importAsync("reorder");const s=new o(t);this.reorder=s;s.addEventListener("reorder",(i=>{const t=i.detail;for(const i of t){const{element:t,order:r}=i;e.simpleHomeCategoryOrders[t.getAttribute("data-key")]=r}e.simpleHomeCategoryOrders=e.simpleHomeCategoryOrders}))},methods:{getOrder(i){return e.simpleHomeCategoryOrders[i]},checkAds(){if("ads"in e.simpleHomeCategoryOrders){e.simpleHomeCategoryOrders.information=e.simpleHomeCategoryOrders.ads;delete e.simpleHomeCategoryOrders.ads;e.simpleHomeCategoryOrders=e.simpleHomeCategoryOrders}},selectTab(e){if(this.reordering){return}if(this.selectedTab===e.key&&this.regionLinks){const i=this.regionLinks[e.key];window.open(`https://www.bilibili.com/${i}`,"_blank")}else{this.selectedTab=e.key}}},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]}}}})}})();