From 9d496efd03757798a9af0fcf2fb1b564dcff416e Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Fri, 20 Dec 2024 15:52:42 +0100
Subject: [PATCH] fix #79

---
 src/components/project/virtual-sample/DynamicView.vue |  4 +++-
 .../project/virtual-sample/Interactive360.vue         | 11 ++++++++++-
 src/stores/virtualSample.js                           |  9 ++++++++-
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/components/project/virtual-sample/DynamicView.vue b/src/components/project/virtual-sample/DynamicView.vue
index 6058079..dc1c260 100644
--- a/src/components/project/virtual-sample/DynamicView.vue
+++ b/src/components/project/virtual-sample/DynamicView.vue
@@ -51,19 +51,21 @@ import { storeToRefs } from "pinia";
 import { usePageStore } from "../../../stores/page";
 import Interactive360 from "./Interactive360.vue";
 import { useDialogStore } from "../../../stores/dialog";
+import { useVirtualSampleStore } from "../../../stores/virtualSample";
 
 const { page } = storeToRefs(usePageStore());
 const { isCommentsOpen, isCommentPanelEnabled, activeTracks } = storeToRefs(
   useDialogStore()
 );
 
+const { isCompareModeEnabled } = storeToRefs(useVirtualSampleStore());
+
 const tracks = computed(
   () =>
     page.value.steps.find((step) => step.slug === "virtual-sample").files
       .dynamic
 );
 
-const isCompareModeEnabled = ref(false);
 watch(isCompareModeEnabled, (newValue) => {
   if (newValue) {
     isCommentsOpen.value = false;
diff --git a/src/components/project/virtual-sample/Interactive360.vue b/src/components/project/virtual-sample/Interactive360.vue
index dc936dd..fd74ada 100644
--- a/src/components/project/virtual-sample/Interactive360.vue
+++ b/src/components/project/virtual-sample/Interactive360.vue
@@ -5,7 +5,16 @@
       class="drag-zone"
       :class="{ grabbing: isDragToRotateEnabled }"
     ></div>
-    <img :src="openedFile.url" alt="" width="500" height="500" />
+    <img
+      :src="
+        virtualSampleStore.isCompareModeEnabled
+          ? currentFile.url
+          : openedFile.url
+      "
+      alt=""
+      width="500"
+      height="500"
+    />
   </figure>
   <div
     id="helper"
diff --git a/src/stores/virtualSample.js b/src/stores/virtualSample.js
index 9825632..9750a98 100644
--- a/src/stores/virtualSample.js
+++ b/src/stores/virtualSample.js
@@ -5,6 +5,7 @@ import { usePageStore } from "./page";
 export const useVirtualSampleStore = defineStore("virtual-sample", () => {
   const { page } = usePageStore();
   const step = page.steps.find((step) => step.id === "virtualSample");
+  const isCompareModeEnabled = ref(false);
 
   const activeTab = ref(step.files.dynamic ? "dynamic" : "static");
   const currentFile = ref(null);
@@ -12,5 +13,11 @@ export const useVirtualSampleStore = defineStore("virtual-sample", () => {
 
   watch(activeTab, () => (currentFile.value = null));
 
-  return { activeTab, currentFile, step, isLoopAnimationEnabled };
+  return {
+    activeTab,
+    currentFile,
+    step,
+    isLoopAnimationEnabled,
+    isCompareModeEnabled,
+  };
 });