pdf viewer : show draft bubble

This commit is contained in:
isUnknown 2024-11-19 16:53:31 +01:00
parent 94b9143cab
commit b3c921cd31
3 changed files with 193 additions and 17 deletions

View file

@ -30,7 +30,7 @@
>
<span class="sr-only">Afficher les commentaires</span>
</button>
<Comments v-if="isCommentsOpen" />
<Comments v-if="isCommentsOpen" @show-draft-bubble="showDraftBubble" />
</div>
</Dialog>
</template>
@ -57,7 +57,7 @@ openedFile.value = route.query.fileIndex
const licenseKey = import.meta.env.VITE_VPV_LICENSE;
useLicense({ licenseKey });
// Variables
const draftComment = ref(null);
const isOpen = ref(true);
watch(isOpen, (newValue) => {
router.push({ name: route.name });
@ -76,6 +76,7 @@ watch(isCommentsOpen, (newVal) => {
watch(openedFile, (newVal) => {
removeCommentBubbles();
if (newVal.comments) {
console.log(newVal.comments);
setCommentBubbles();
}
});
@ -158,6 +159,22 @@ function removeCommentBubbles() {
bubble.parentNode.removeChild(bubble);
});
}
function showDraftBubble(draftComment) {
const bubble = document.createElement("a");
bubble.classList.add("comment-bubble");
bubble.classList.add("comment-bubble--draft");
bubble.style.left = draftComment.position.x + "%";
bubble.style.top = draftComment.position.y + "%";
bubble.href = "#comment-" + draftComment.id;
const container = document.querySelector(
`.vpv-page-inner-container[aria-label="page ${draftComment.pageIndex}"] .page-inner-container`
);
container.appendChild(bubble);
}
</script>
<style>