@cmstops/pro-compo
Version:
[物料平台文档中心](https://arco.design/docs/material/guide)
77 lines (76 loc) • 1.94 kB
JavaScript
import { ref } from "vue";
import { editthumb } from "./api.js";
function calculateFrameCoverCount(videoDuration) {
const base = 5;
const coefficient = 10;
const maxCount = 50;
let count = Math.log(videoDuration / base) * coefficient;
count = Math.min(count, maxCount);
return Math.ceil(count);
}
function useVideoThumbs() {
const thumbs = ref([]);
const loading = ref(true);
const curThumb = ref();
async function getVideoThumbs(BASE_API, url, duration) {
loading.value = true;
try {
const { Code, Msg } = await editthumb(BASE_API, {
url,
count: calculateFrameCoverCount(duration),
start: 0,
end: duration,
search: "&cover=true"
});
if (Code !== 200)
return;
const { Domain, Frames } = Msg;
thumbs.value = Frames.map((item) => {
return `${Domain}/${item}`;
});
[curThumb.value] = thumbs.value;
} catch (e) {
console.log("\u52A0\u8F7D\u5C01\u9762\u56FE\u5931\u8D25", e);
} finally {
loading.value = false;
}
}
function handleSelectThumb(idx) {
curThumb.value = thumbs.value[idx];
}
return {
loading,
thumbs,
curThumb,
getVideoThumbs,
handleSelectThumb
};
}
function useDragger(moveCallback, upCallback, downCallback) {
const x = ref(0);
const isDrag = ref(false);
const handleMousedown = (e) => {
isDrag.value = true;
x.value = e.x;
window.onmouseup = handleMouseup;
window.onmousemove = handleMousemove;
downCallback && downCallback();
};
const handleMouseup = () => {
isDrag.value = false;
x.value = 0;
window.onmouseup = null;
window.onmousemove = null;
upCallback && upCallback();
};
const handleMousemove = (e) => {
if (!isDrag.value)
return;
moveCallback && moveCallback(e.x - x.value);
};
return {
isDrag,
handleMousedown
};
}
export { useDragger, useVideoThumbs };