Bilibili-Evolved/min/toast.min.js
2021-10-26 13:22:15 +08:00

1 line
2.4 KiB
JavaScript

(()=>(t,e)=>{function a(t,e,a){if(e in t){Object.defineProperty(t,e,{value:a,enumerable:true,configurable:true,writable:true})}else{t[e]=a}return t}let s;(function(t){t["Default"]="default";t["Info"]="info";t["Success"]="success";t["Error"]="error"})(s||(s={}));let r;class i{constructor(t="",e="",r=s.Default){a(this,"type",void 0);a(this,"message",void 0);a(this,"title",void 0);a(this,"duration",void 0);a(this,"creationTime",new Date);a(this,"randomKey",void 0);this.type=r;this.message=t;this.title=e;this.duration=3e3;this.randomKey=Math.floor(Math.random()*(Number.MAX_SAFE_INTEGER+1))}show(){i.containerVM.cards.splice(0,0,this);if(this.duration!==undefined){setTimeout((()=>this.dismiss()),this.duration)}}dismiss(){if(i.containerVM.cards.includes(this)){i.containerVM.cards.splice(i.containerVM.cards.indexOf(this),1)}}get element(){return dq(`.toast-card[data-key='${this.key}']`)}get key(){return this.creationTime.toISOString()+`[${this.randomKey}]`}static get containerVM(){if(!r){i.createToastContainer()}return r}static createToastContainer(){if(!document.querySelector(".toast-card-container")){document.body.insertAdjacentHTML("beforeend",`\n<transition-group class="toast-card-container" name="toast-card-container" tag="div">\n<toast-card v-for="card of cards" :data-key="card.key" :key="card.key" :card="card"></toast-card>\n</transition-group>`);r=new Vue({el:".toast-card-container",components:{"toast-card":{props:["card"],template:`\n<div class="toast-card icons-enabled visible" :class="'toast-' + card.type">\n<div class="toast-card-border"></div>\n<div class="toast-card-header">\n<h1 class="toast-card-title">{{card.title}}</h1>\n<div class="toast-card-dismiss" @click="card.dismiss()">\n<svg style="width:22px;height:22px" viewBox="0 0 24 24">\n<path\n d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" />\n</svg>\n</div>\n</div>\n<div class="toast-card-message" v-html="card.message"></div>\n</div>\n`}},data:{cards:[]}})}}static internalShow(t,e,a,s){const r=new i(t,e,s);r.duration=a;r.show();return r}static show(t,e,a){return this.internalShow(t,e,a,s.Default)}static info(t,e,a){return this.internalShow(t,e,a,s.Info)}static success(t,e,a){return this.internalShow(t,e,a,s.Success)}static error(t,e,a){return this.internalShow(t,e,a,s.Error)}}e.applyStyle("toastStyle");return{export:i}})();