Bilibili-Evolved/min/simple-home.vue.min.js
2019-10-24 12:46:49 +08:00

1 line
7.5 KiB
JavaScript

(()=>{return(e,a)=>{const d=`<div class=simple-home><div class=blackboards><div class=header><div class=title>活动</div><div class=more><icon type=mdi icon=dots-horizontal></icon>更多</div></div><input class="hidden-input blackboard-radio"type=radio name=blackboard v-for="(b, i) of blackboards":checked="i === 0":id="'blackboard' + i":data-index=i :key=i><div class=jump-dots><label v-for="(b, i) of blackboards":for="'blackboard' + i":key=i><div class=jump-dot></div></label></div><div class=blackboard-cards><a class=blackboard-card target=_blank v-for="(b, i) of blackboards":key=i :href=b.url :title=b.title><img :src=b.imageUrl :alt=b.title><div class=title>{{b.title}}</div></a></div></div></div>`;a.applyStyleFromText(`.simple-home{--title-color:black;color:#444}.simple-home,.simple-home *{transition:.2s ease-out}body.dark .simple-home{--title-color:white;color:#ddd}.simple-home .jump-dots{grid-area:dots;align-self:center;justify-self:center}.simple-home .jump-dots label{display:block}.simple-home .jump-dots label:not(:last-child){margin-bottom:6px}.simple-home .jump-dots .jump-dot{background-color:#ddd;width:8px;height:20px;border-radius:8px;cursor:pointer}body.dark .simple-home .jump-dots .jump-dot{background-color:#444}.simple-home .hidden-input{display:none}.simple-home .hidden-input:checked:nth-of-type(1)~.jump-dots label:nth-child(1) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(1)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 0 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(2)~.jump-dots label:nth-child(2) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(2)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 1 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(3)~.jump-dots label:nth-child(3) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(3)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 2 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(4)~.jump-dots label:nth-child(4) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(4)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 3 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(5)~.jump-dots label:nth-child(5) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(5)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 4 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(6)~.jump-dots label:nth-child(6) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(6)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 5 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(7)~.jump-dots label:nth-child(7) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(7)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 6 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(8)~.jump-dots label:nth-child(8) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(8)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 7 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(9)~.jump-dots label:nth-child(9) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(9)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 8 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(10)~.jump-dots label:nth-child(10) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(10)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 9 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(11)~.jump-dots label:nth-child(11) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(11)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 10 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(12)~.jump-dots label:nth-child(12) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(12)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 11 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(13)~.jump-dots label:nth-child(13) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(13)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 12 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(14)~.jump-dots label:nth-child(14) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(14)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 13 * var(--card-height)))}.simple-home .hidden-input:checked:nth-of-type(15)~.jump-dots label:nth-child(15) .jump-dot{background-color:var(--theme-color);height:40px}.simple-home .hidden-input:checked:nth-of-type(15)~.blackboard-cards .blackboard-card{transform:translateY(calc(-1 * 14 * var(--card-height)))}.simple-home .more{background-color:#ddd;cursor:pointer;padding:2px 16px 2px 8px;display:flex;align-items:center;border-radius:16px;font-size:14px}.simple-home .more .be-icon{margin-right:8px;transition:.3s cubic-bezier(.25,.46,.45,.94)}.simple-home .more:hover .be-icon{transform:rotate(180deg)}body.dark .simple-home .more{background-color:#333}.simple-home .blackboards{display:grid;grid-template-areas:"header header" "dots cards";grid-template-columns:8px 1fr;grid-template-rows:1fr 250px;row-gap:16px;column-gap:16px}.simple-home .blackboards .header{grid-area:header;display:flex;justify-content:space-between;align-items:center}.simple-home .blackboards .header .title{color:var(--title-color);font-weight:700;font-size:24px}.simple-home .blackboards .blackboard-cards{grid-area:cards;--card-width:500px;--card-height:250px;width:var(--card-width);height:var(--card-height);border-radius:16px;overflow:hidden}.simple-home .blackboards .blackboard-cards .blackboard-card{width:100%;height:100%;scroll-snap-align:start;position:relative;display:block;transition:.3s cubic-bezier(.65,.05,.36,1)}.simple-home .blackboards .blackboard-cards .blackboard-card img{width:100%;height:100%;object-fit:fill;display:block}.simple-home .blackboards .blackboard-cards .blackboard-card .title{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);padding:4px 16px;color:#fff;background-color:#000a;font-size:14px;font-weight:700;border-radius:14px;white-space:nowrap}`,"simple-home-style");const o=[{name:"一周",day:7},{name:"三日",day:3},{name:"昨日",day:1}];return{export:Object.assign({template:d},{components:{Icon:()=>a.importAsync("icon.vue")},data(){return{blackboards:[],tabs:o,currentTab:o[0]}},computed:{trendingCards(){}},async mounted(){const{getBlackboards:e}=await a.importAsync("blackboard");this.blackboards=(await e()).filter(e=>!e.isAd);const d=dq(".blackboards");setInterval(()=>{if(!document.hasFocus()||d.matches(".blackboards:hover")){return}const e=parseInt(dq(`.blackboard-radio:checked`).getAttribute("data-index"));let a;if(e===this.blackboards.length-1){a=0}else{a=e+1}dq(`.blackboard-radio[data-index='${a}']`).checked=true},5e3)}})}}})();