mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-08 01:17:23 +08:00
55 lines
15 KiB
JavaScript
55 lines
15 KiB
JavaScript
const M=[{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAbAAEAAgMBAQAAAAAAAAAAAAAFBAYBAgMAB//aAAgBAQAAAAD7HU4ObhMC3AnlYvY8ISwA+6WDOd4/RA96FVeF66BOVWB3TsAOgZC27wv/xAAYAQEBAQEBAAAAAAAAAAAAAAACAwQAAf/aAAgBAhAAAAC3sw8uyRDQPV//xAAYAQADAQEAAAAAAAAAAAAAAAAAAgMBBP/aAAgBAxAAAACQ7LfmoUTNvFf/xAA0EAACAQMBBAcHAwUAAAAAAAABAgMABBESBRMxQRAhIjJRYbEUIzRCUnOBM3KSU2KRoeH/2gAIAQEAAT8AmmSCJpHOAoq6vZp8lmITkgonSQCMZxikkdGDxsVbxFbK2l7TGUkwHQfy6Ln4if7jetbcdglvH9TFv40hD71CGzlQpAyACRkt4VcxojxOdIj06GzwA5VKkilGUdjUcNxD9XlwI5g1Bfm0u4nC5UHDeYNWu0LS4B3D6mHHIwaufiJ/uN61tm6Et6GPCIbv8mtqi4gtrFkzjeuxIGRq+TP4orI1jpK+8MHAfVprYcM8kVysmoIGiwG8UfVgVcwh1ecDGiYcvlNWk7W9zDKucqwyPEVOczzfvb1q/wBkXWqR4Sja8nDHGCajAEagHIAx/jourmK0haaV9KrWyrFZLRZJ07MqNhc8Q3M/irfZFlaOGQF2HzOc1cACeYD+o3r0XptYEJKAyMx06TgsxOaupr+MhkIQk6TlfPlkVNCIxBc3A9onLjRG/WtWV1BPFlRp09TpzBHLoufiJ/uN69G05JLxt8C2ksQpTiAMHIq0mQz6HnMnZwurBwBRhKTLLK5Y6Oz/AGf9qwla3u4TykBRh/sdFx8RN9xvWpri43Unv5O6fmNSSSCHGtsb0DGfKrFm3zdZ7o9RUskhMnbbu+NLJJrh7bfqJz869onxjfSY/callk3knvG7x51//8QAIxEAAgEEAQMFAAAAAAAAAAAAAQIRAAMSMRAEIXETMjNBUf/aAAgBAgEBPwBMUTNv3tSdQrgZDYpwMmx0N8PdFv0iBMAyKS4QroF99JcxDhhMntwxgUCoJIER90jZCeG2PBpvjNWtHzx//8QAIBEAAgICAgIDAAAAAAAAAAAAAQIAERASAyEyM0GBkf/aAAgBAwEBPwBtmbURuErdRb1W/nCIW3vqMgJVr8YyWVIyvYG/5CKwJze36jY//9k=",name:"美绪",text:"马什么梅？"},{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAbAAACAwEBAQAAAAAAAAAAAAAABQIDBAEGB//aAAgBAQAAAAD65hzG3WLcATfCbHYQ9IY0uiEfRkU1IOr+RoUG1ornWj7Y6//EABgBAQADAQAAAAAAAAAAAAAAAAQAAgUD/9oACAECEAAAACEf3IJba51tGDNq/wD/xAAYAQEAAwEAAAAAAAAAAAAAAAAEAQMFAv/aAAgBAxAAAABSg0MWQdj+c6VozP/EAC0QAAIBAwMBBgUFAAAAAAAAAAECEQADBBASMUEiUVJhcZEFExQhgSAyQoKx/9oACAEBAAE/AKu5oEi2A3meKOXf8cfgV9Xe2kEgyOeCKsZSXAqs0XP91z7+wC3MSCzeg/RbuG06uO8T6a5kNkOOu0CpUXWQMdo4kQRPQihPd9tH+4jXIw0yDukq0RNHFu2/iOVku0pfx7foHt91MttbMyN7njqQDo3BPkdWEqRJEjkV8QOV2LVq2xBBlkoq+y181CrgHn1nXHffZQ+UH8aEwCaEoJP9qzbe+ySOUO7XCuxca2f5CR6jS477H7bftPWt7+NvekdzbWXYyo60rvtXtHgda3v4j71Yd/qLPaPJ6+Vb38be9f/EACYRAAECBAQHAQAAAAAAAAAAAAECAwAEEBIREzFSITNBQlFhgXL/2gAIAQIBAT8AffKDYjXqYznd5hhwuI46ijjOOaSfaYUm232Ik9F/KKQFRMN2LHgiJVdrmG6s32fYa5iP0Kf/xAAmEQABAgQFBAMAAAAAAAAAAAABAgMAEBESBBNCUoEhMTNhUXFy/9oACAEDAQE/AGGAoXK4EZLWwQ+2G19Oxk28RlhI9GEqur9xi9HMm3C2qtAfRhhy9J+axiUXIrtnhdfEOeNf5Mv/2Q==",name:"博士",text:"马东什么？"},{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAxAAACAgMBAAAAAAAAAAAAAAAABgQFAQIHAwEBAAMBAAAAAAAAAAAAAAAAAwABAgT/2gAMAwEAAhADEAAAAI7CsPnN1VeZ0okpTbSWASKzwmMPRy3PuuWhpv4KvQ7pcJYTUb+hdLQYWJoaVU+RU3jcXiaoegAhWOAPeeaBd1wGtf/EAC4QAAIBAwIEBAUFAQAAAAAAAAECAwAEEQUhBhASMRMiQWEUI3KBoSAzQlFSkv/aAAgBAQABPwDTxidHHbdTyZGjdkcYYelBGKM4HlUgH7/osXInRfQsK0q18abxGHkj/JrV0KXrEfzUGtLiE0F1G48r4GfcVJDJFI0TbMp52W91D9VXt42mWQCu0QUqHZQC7SyDIRA22QO5NXkFyLeFpnWRggYsMZw/+ioAPsRVlOtrpsshx+6d2OFGw3J/oVK897YR6nbfORCTkp0OVQ7lRk5Aq5gMZSVR8qVepfbPpy0jDSRyEZxIg/6JrjKJytlEEJ63uJD7ttXB6Tn41bhW8Mwxxjqzt3OBWrx+Bw9fQsRvIgBzjYutcP3F8upWVmZZltvjFPQW22BqeAJpHh+kWyeyhsL+KXS9RcB1WLpYZGSc4NcKwxTrcRy+qrj2IJIqe3S5AEsSOAcgMobB+9Lb9KhVAAHYCntRIjI6hkYYZWGQRUGm2ltMssVsiSKCAVGMZqWFZ4fDY4XYn7ULaEgF182N/Me9cIuI3kY9gFodLAEHINFgKDKdqwK1LVotOMSsnWz5JAPYUeJZyTiKMVwv2n+la08npcZOBjke3LVWZtRuizE4kI5f/8QAIBEBAAIBAgcAAAAAAAAAAAAAAQARAwIQEiAhMTJBcf/aAAgBAgEBPwDL5HzkadfX0RDjmTSUJtks1MqWpVypk7uxt//EACARAQABAwMFAAAAAAAAAAAAAAEAAhEhAxATEiIxYXH/2gAIAQMBAT8A0m1L9l+2++Sg9sF45p1N7M6iUJYwM5GYW4ZmZT4Njb//2Q==",name:"柚子",text:"什么冬梅？"}],D=["1","2","3","4","5","6","7","8","9"],S=()=>D.map((u,o)=>{const m=o%3;return{avatar:M[m].avatar,name:M[m].name,text:u}});function _(u,o,m="modelValue",c){return Vue.computed({get:()=>u[m],set:a=>{o(`update:${m}`,c?c(a):a)}})}var N=Vue.defineComponent({name:"vue3-danmaku",components:{},props:{danmus:{type:Array,required:!0,default:()=>[]},channels:{type:Number,default:0},autoplay:{type:Boolean,default:!0},loop:{type:Boolean,default:!1},useSlot:{type:Boolean,default:!1},debounce:{type:Number,default:100},speeds:{type:Number,default:200},randomChannel:{type:Boolean,default:!1},fontSize:{type:Number,default:18},top:{type:Number,default:4},right:{type:Number,default:0},isSuspend:{type:Boolean,default:!1},extraStyle:{type:String,default:""}},emits:["list-end","play-end","update:danmus"],setup(u,{emit:o,slots:m}){let c=Vue.ref(document.createElement("div")),a=Vue.ref(document.createElement("div"));const d=Vue.ref(0),p=Vue.ref(0);let h=0;const x=Vue.ref(0),C=Vue.ref(0),V=Vue.ref(0),E=Vue.ref(!1),v=Vue.ref(!1),i=Vue.ref({}),e=_(u,o,"danmus"),f=Vue.reactive({channels:Vue.computed(()=>u.channels||x.value),autoplay:Vue.computed(()=>u.autoplay),loop:Vue.computed(()=>u.loop),useSlot:Vue.computed(()=>u.useSlot),debounce:Vue.computed(()=>u.debounce),randomChannel:Vue.computed(()=>u.randomChannel)}),l=Vue.reactive({height:Vue.computed(()=>C.value),fontSize:Vue.computed(()=>u.fontSize),speeds:Vue.computed(()=>u.speeds),top:Vue.computed(()=>u.top),right:Vue.computed(()=>u.right)});Vue.onMounted(()=>{y()}),Vue.onBeforeUnmount(()=>{I()});function y(){w(),u.isSuspend&&F(),f.autoplay&&s()}function w(){d.value=c.value.offsetWidth,p.value=c.value.offsetHeight}function s(){v.value=!1,h||(h=setInterval(()=>Q(),f.debounce))}function Q(){if(!v.value&&e.value.length)if(V.value>e.value.length-1){const A=a.value.children.length;f.loop&&(A<V.value&&(o("list-end"),V.value=0),k())}else k()}function k(A){const r=f.loop?V.value%e.value.length:V.value,n=A||e.value[r];let t=document.createElement("div");f.useSlot?t=T(n,r).$el:(t.innerHTML=n,t.setAttribute("style",u.extraStyle),t.style.fontSize=`${l.fontSize}px`,t.style.lineHeight=`${l.fontSize}px`),t.classList.add("dm"),a.value.appendChild(t),t.style.opacity="0",Vue.nextTick(()=>{l.height||(C.value=t.offsetHeight),f.channels||(x.value=Math.floor(p.value/(l.height+l.top)));let g=b(t);if(g>=0){const B=t.offsetWidth,J=l.height;t.classList.add("move"),t.dataset.index=`${r}`,t.style.opacity="1",t.style.top=g*(J+l.top)+"px",t.style.width=B+l.right+"px",t.style.setProperty("--dm-scroll-width",`-${d.value+B*2}px`),t.style.left=`${d.value}px`,t.style.animationDuration=`${d.value/l.speeds}s`,t.addEventListener("animationend",()=>{Number(t.dataset.index)===e.value.length-1&&!f.loop&&o("play-end",t.dataset.index),a.value&&a.value.removeChild(t)}),V.value++}else a.value.removeChild(t)})}function T(A,r){return Vue.createApp({render(){return Vue.h("div",{},[m.dm&&m.dm({danmu:A,index:r})])}}).mount(document.createElement("div"))}function b(A){let r=[...Array(f.channels).keys()];f.randomChannel&&(r=r.sort(()=>.5-Math.random()));for(let n of r){const t=i.value[n];if(t&&t.length)for(let g=0;g<t.length;g++){const B=R(t[g])-10;if(B<=(A.offsetWidth-t[g].offsetWidth)*.88||B<=0)break;if(g===t.length-1)return i.value[n].push(A),A.addEventListener("animationend",()=>i.value[n].splice(0,1)),n%f.channels}else return i.value[n]=[A],A.addEventListener("animationend",()=>i.value[n].splice(0,1)),n%f.channels}return-1}function R(A){const r=A.offsetWidth||parseInt(A.style.width),n=A.getBoundingClientRect().right||a.value.getBoundingClientRect().right+r;return a.value.getBoundingClientRect().right-n}function U(){clearInterval(h),h=0}function F(){let A=[];a.value.addEventListener("mousemove",r=>{let n=r.target;n.className.includes("dm")||(n=n.closest(".dm")||n),n.className.includes("dm")&&(n.classList.add("pause"),A.push(n))}),a.value.addEventListener("mouseout",r=>{let n=r.target;n.className.includes("dm")||(n=n.closest(".dm")||n),n.className.includes("dm")&&(n.classList.remove("pause"),A.forEach(t=>{t.classList.remove("pause")}),A=[])})}function I(){U(),V.value=0}function K(){C.value=0,y()}function Y(){i.value={},a.value.innerHTML="",v.value=!0,E.value=!1,I()}function W(){v.value=!0}function z(A){if(V.value===e.value.length)return e.value.push(A),e.value.length-1;{const r=V.value%e.value.length;return e.value.splice(r,0,A),r+1}}function G(A){return e.value.push(A),e.value.length-1}function j(){return!v.value}function H(){E.value=!1}function L(){E.value=!0}function P(){w();const A=a.value.getElementsByClassName("dm");for(let r=0;r<A.length;r++){const n=A[r];n.style.setProperty("--dm-scroll-width",`-${d.value+n.offsetWidth*2}px`),n.style.left=`${d.value}px`,n.style.animationDuration=`${d.value/l.speeds}s`}}return{container:c,dmContainer:a,hidden:E,paused:v,danmuList:e,getPlayState:j,resize:P,play:s,pause:W,stop:Y,show:H,hide:L,reset:K,add:z,push:G,insert:k}}});const O={ref:"container",class:"vue-danmaku"};function X(u,o,m,c,a,d){return Vue.openBlock(),Vue.createElementBlock("div",O,[Vue.createElementVNode("div",{ref:"dmContainer",class:Vue.normalizeClass(["danmus",{show:!u.hidden},{paused:u.paused}])},null,2),Vue.renderSlot(u.$slots,"default")],512)}function Z(u,o){o===void 0&&(o={});var m=o.insertAt;if(!(!u||typeof document>"u")){var c=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css",m==="top"&&c.firstChild?c.insertBefore(a,c.firstChild):c.appendChild(a),a.styleSheet?a.styleSheet.cssText=u:a.appendChild(document.createTextNode(u))}}var q=`.vue-danmaku {
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.vue-danmaku .danmus {
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
opacity: 0;
|
||
-webkit-transition: all 0.3s;
|
||
transition: all 0.3s;
|
||
}
|
||
.vue-danmaku .danmus.show {
|
||
opacity: 1;
|
||
}
|
||
.vue-danmaku .danmus.paused .dm.move {
|
||
animation-play-state: paused;
|
||
}
|
||
.vue-danmaku .danmus .dm {
|
||
position: absolute;
|
||
font-size: 20px;
|
||
color: #ddd;
|
||
white-space: pre;
|
||
transform: translateX(0);
|
||
transform-style: preserve-3d;
|
||
}
|
||
.vue-danmaku .danmus .dm.move {
|
||
will-change: transform;
|
||
animation-name: moveLeft;
|
||
animation-timing-function: linear;
|
||
animation-play-state: running;
|
||
}
|
||
.vue-danmaku .danmus .dm.pause {
|
||
animation-play-state: paused;
|
||
z-index: 10;
|
||
}
|
||
@keyframes moveLeft {
|
||
from {
|
||
transform: translateX(0);
|
||
}
|
||
to {
|
||
transform: translateX(var(--dm-scroll-width));
|
||
}
|
||
}
|
||
@-webkit-keyframes moveLeft {
|
||
from {
|
||
-webkit-transform: translateX(0);
|
||
}
|
||
to {
|
||
-webkit-transform: translateX(var(--dm-scroll-width));
|
||
}
|
||
}`;Z(q);N.render=X;N.__file="src/lib/Danmaku.vue";const $={class:"card-header"},ee={class:"font-medium"},te={class:"flex gap-5"},ne={class:"danmu-item"},ae=["src"],Ae={class:"main"},ue={class:"ml-5"},oe={class:"ml-5"},le={class:"ml-5"},se={class:"flex"},de=Vue.defineComponent({name:"Danmaku",__name:"index",setup(u){const o=Vue.ref(),m=Vue.ref(S()),c=Vue.ref("");let a=0;const d=Vue.reactive({channels:5,useSlot:!0,loop:!0,speeds:200,fontSize:20,top:10,right:0,debounce:100,randomChannel:!0});Vue.onMounted(()=>{window.onresize=()=>E()}),Vue.onUnmounted(()=>{window.onresize=null});function p(i){switch(i){case"play":o.value.play();break;case"pause":o.value.pause();break;case"stop":o.value.stop();break;case"show":o.value.show();break;case"hide":o.value.hide();break;case"reset":o.value.reset();break}}function h(i){d.useSlot=i,m.value=i?S():D,setTimeout(()=>{o.value.stop(),o.value.play()})}function x(i){d.speeds<=10&&i===-10||(d.speeds+=i,o.value.reset())}function C(i){d.fontSize+=i,o.value.reset()}function V(i){!d.channels&&i===-1||(d.channels+=i)}function E(){a&&clearTimeout(a),a=window.setTimeout(()=>{o.value.resize()},500)}function v(){if(!c.value)return;const i=d.useSlot?{avatar:"https://i.loli.net/2021/01/17/xpwbm3jKytfaNOD.jpg",name:"你",text:c.value}:c.value;o.value.add(i),c.value=""}return(i,e)=>{const f=Vue.resolveComponent("el-link"),l=Vue.resolveComponent("el-button"),y=Vue.resolveComponent("el-input"),w=Vue.resolveComponent("el-card");return Vue.openBlock(),Vue.createBlock(w,{shadow:"never"},{header:Vue.withCtx(()=>[Vue.createElementVNode("div",$,[Vue.createElementVNode("span",ee,[Vue.createTextVNode(" 弹幕组件，采用开源的 "),Vue.createVNode(f,{href:"https://github.com/hellodigua/vue-danmaku/tree/vue3",target:"_blank",style:{margin:"0 4px 5px","font-size":"16px"}},{default:Vue.withCtx(()=>[Vue.createTextVNode(" vue3-danmaku ")]),_:1})])])]),default:Vue.withCtx(()=>[Vue.createElementVNode("div",te,[Vue.createVNode(Vue.unref(N),Vue.mergeProps({ref_key:"danmaku",ref:o,class:"demo",danmus:m.value,"onUpdate:danmus":e[0]||(e[0]=s=>m.value=s),isSuspend:""},d),{dm:Vue.withCtx(({danmu:s,index:Q})=>[Vue.createElementVNode("div",ne,[Vue.createElementVNode("img",{class:"img",src:s.avatar},null,8,ae),Vue.createElementVNode("span",null,Vue.toDisplayString(Q)+Vue.toDisplayString(s.name)+"：",1),Vue.createElementVNode("span",null,Vue.toDisplayString(s.text),1)])]),_:1},16,["danmus"]),Vue.createElementVNode("div",Ae,[Vue.createElementVNode("p",null,[Vue.createTextVNode(" 播放： "),Vue.createVNode(l,{onClick:e[1]||(e[1]=s=>p("play"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("播放")]),_:1}),Vue.createVNode(l,{onClick:e[2]||(e[2]=s=>p("pause"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("暂停")]),_:1}),Vue.createVNode(l,{onClick:e[3]||(e[3]=s=>p("stop"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("停止")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 模式： "),Vue.createVNode(l,{onClick:e[4]||(e[4]=s=>h(!0))},{default:Vue.withCtx(()=>[Vue.createTextVNode("弹幕 slot")]),_:1}),Vue.createVNode(l,{onClick:e[5]||(e[5]=s=>h(!1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("普通文本")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 显示： "),Vue.createVNode(l,{onClick:e[6]||(e[6]=s=>p("show"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("显示")]),_:1}),Vue.createVNode(l,{onClick:e[7]||(e[7]=s=>p("hide"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("隐藏")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 速度： "),Vue.createVNode(l,{onClick:e[8]||(e[8]=s=>x(-10))},{default:Vue.withCtx(()=>[Vue.createTextVNode("减速")]),_:1}),Vue.createVNode(l,{onClick:e[9]||(e[9]=s=>x(10))},{default:Vue.withCtx(()=>[Vue.createTextVNode("增速")]),_:1}),Vue.createElementVNode("span",ue,"当前速度："+Vue.toDisplayString(d.speeds)+"像素/s",1)]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 字号： "),Vue.createVNode(l,{disabled:d.useSlot,onClick:e[10]||(e[10]=s=>C(-1))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 缩小 ")]),_:1},8,["disabled"]),Vue.createVNode(l,{disabled:d.useSlot,onClick:e[11]||(e[11]=s=>C(1))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 放大 ")]),_:1},8,["disabled"]),Vue.createElementVNode("span",oe,"当前字号："+Vue.toDisplayString(d.fontSize)+"px",1)]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 轨道： "),Vue.createVNode(l,{onClick:e[12]||(e[12]=s=>V(-1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("-1")]),_:1}),Vue.createVNode(l,{onClick:e[13]||(e[13]=s=>V(1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("+1")]),_:1}),Vue.createVNode(l,{onClick:e[14]||(e[14]=s=>V(-d.channels))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 填满 ")]),_:1}),Vue.createElementVNode("span",le,"当前轨道："+Vue.toDisplayString(d.channels),1)]),Vue.createElementVNode("p",se,[Vue.createVNode(y,{type:"text",placeholder:"输入评论后，回车发送弹幕",modelValue:c.value,"onUpdate:modelValue":e[15]||(e[15]=s=>c.value=s),onKeyup:Vue.withKeys(v,["enter"])},null,8,["modelValue","onKeyup"])])])])]),_:1})}}});export{de as default};
|