@vuux/video
Version:
Vue Nuxt 视频播放器
2 lines (1 loc) • 1.33 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),m=(t,c,l)=>{const r=o.ref(!1),a=o.ref(c.modelValue),d=e=>{if(!t.value)return;const n=t.value.getBoundingClientRect();let i=(e-n.left)/n.width;i=Math.max(0,Math.min(1,i)),a.value=i,l("update:modelValue",i),l("change",i)},v=e=>{let n=0;e instanceof MouseEvent?n=e.clientX:e instanceof TouchEvent&&(n=e.touches[0].clientX),d(n),e.preventDefault()},u=()=>{r.value&&(r.value=!1,window.removeEventListener("mousemove",v),window.removeEventListener("mouseup",u),window.removeEventListener("touchmove",v),window.removeEventListener("touchend",u))},s=e=>{r.value=!0,e instanceof MouseEvent?(d(e.clientX),window.addEventListener("mousemove",v),window.addEventListener("mouseup",u)):e instanceof TouchEvent&&(d(e.touches[0].clientX),window.addEventListener("touchmove",v,{passive:!1}),window.addEventListener("touchend",u))},f=o.computed(()=>({width:`${a.value*100}%`,left:`${a.value*100}%`}));return o.watch(()=>c.modelValue,e=>{a.value=e}),o.onMounted(()=>{t.value&&(t.value.addEventListener("mousedown",s),t.value.addEventListener("touchstart",s,{passive:!1}))}),o.onUnmounted(()=>{t.value&&(t.value.removeEventListener("mousedown",s),t.value.removeEventListener("touchstart",s)),u()}),{volumeStyle:f,startDrag:s}};exports.useVolumeDrag=m;