create store for comment draft

src/components/project/PdfViewer.vue

@@ -18,7 +18,7 @@
       >{{ isCommentsOpen ? "Masquer" : "Afficher" }} les commentaires</span
     >
   </button>
-  <Comments v-if="isCommentsOpen" @show-draft-marker="showDraftMarker" />
+  <Comments v-if="isCommentsOpen" />
 </template>
 
 <script setup>
@@ -32,9 +32,9 @@ import { useRoute, useRouter } from "vue-router";
 const licenseKey = import.meta.env.VITE_VPV_LICENSE ?? 'd0ab730a-ebba-4060-856c-76d322565645';
 useLicense({ licenseKey });
 
-const { openedFile, isCommentsOpen, comments } = storeToRefs(useDialogStore());
-
-const draftComment = ref(null);
+const { openedFile, isCommentsOpen, comments, draftComment } = storeToRefs(
+  useDialogStore()
+);
 
 const isViewerDisabled = ref(false);
 
@@ -122,6 +122,8 @@ function setCommentMarkers() {
       `.vpv-page-inner-container[aria-label="page ${comment.position.pageIndex}"] .page-inner-container`
     );
 
+    console.log(container);
+
     container.appendChild(bubble);
 
     setTimeout(() => {
@@ -145,22 +147,6 @@ function removeCommentMarkers() {
     bubble.parentNode.removeChild(bubble);
   });
 }
-
-function showDraftMarker(draftComment) {
-  const bubble = document.createElement("a");
-
-  bubble.classList.add("comment-marker");
-  bubble.classList.add("comment-marker--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.position.pageIndex}"] .page-inner-container`
-  );
-
-  container.appendChild(bubble);
-}
 </script>
 
 <style scoped>

src/components/project/virtual-sample/StaticView.vue

@@ -24,7 +24,7 @@
       <span class="label">Verre parachevé</span>
     </button>
   </header>
-  <div class="dialog__inner" id="verre-brut">
+  <div id="vpv-container" class="dialog__inner">
     <PdfViewer />
   </div>
 </template>