comment 360 working

This commit is contained in:
isUnknown 2024-12-19 17:11:46 +01:00
parent bc0ae8861f
commit 4daaa3dc88
8 changed files with 134 additions and 91 deletions

View file

@ -202,6 +202,10 @@ async function replyComment(newComment) {
}
async function addComment(newComment) {
const matchFileParentUri = openedFile.value.url.match(
/projects\/.*?(?=\/[^/]+\/[^/]+$)/
);
newComment.fileParentUri = matchFileParentUri ? matchFileParentUri[0] : null;
const newFile = await api.addComment(newComment);
resetDraftComment();
isAddOpen.value = false;

View file

@ -36,35 +36,6 @@ const { openedFile, isCommentsOpen, comments, draftComment } = storeToRefs(
useDialogStore()
);
const isViewerDisabled = ref(false);
watch(openedFile, () => {
removeCommentMarkers();
setCommentMarkers();
});
watch(isCommentsOpen, (newVal) => {
if (newVal) {
setCommentMarkers();
} else {
removeCommentMarkers();
}
});
watch(openedFile, (newVal, oldVal) => {
if (newVal.url === oldVal.url) return;
isViewerDisabled.value = true;
setTimeout(() => {
isViewerDisabled.value = false;
removeCommentMarkers();
if (newVal.comments) {
setCommentMarkers();
}
}, 100);
});
const currentPageIndex = ref(1);
// Functions
@ -107,46 +78,6 @@ const onPdfLoaded = () => {
observePages();
};
function setCommentMarkers() {
if (!comments.value) return;
comments.value.forEach((comment) => {
const bubble = document.createElement("a");
bubble.classList.add("comment-marker");
bubble.style.left = comment.position.x + "%";
bubble.style.top = comment.position.y + "%";
bubble.href = "#comment-" + comment.id;
const container = document.querySelector(
`.vpv-page-inner-container[aria-label="page ${comment.position.pageIndex}"] .page-inner-container`
);
console.log(container);
container.appendChild(bubble);
setTimeout(() => {
bubble.addEventListener("mouseenter", () => highlight(comment));
bubble.addEventListener("mouseleave", () => unhighlight(comment));
}, 100);
});
}
function highlight(comment) {
const target = document.querySelector("#comment-" + comment.id);
target.classList.add("highlight");
}
function unhighlight(comment) {
const target = document.querySelector("#comment-" + comment.id);
target.classList.remove("highlight");
}
function removeCommentMarkers() {
document.querySelectorAll(".comment-marker").forEach((bubble) => {
bubble.parentNode.removeChild(bubble);
});
}
</script>
<style scoped>