Merge branch 'develop'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bimdata/bcf-components",
-  "version": "6.2.1",
+  "version": "6.3.0-rc.3",
   "files": [
     "src",
     "vue3-plugin.js"

src/components/bcf-topic-form/BcfTopicForm.vue

@@ -199,6 +199,7 @@
 import { computed, inject, ref, watch } from "vue";
 import service from "../../service.js";
 import { setViewpointDefaults } from "../../utils/viewpoints.js";
+import { getViewerViewpoint } from "../../utils/viewer.js";
 // Components
 import BcfTopicImages from "./bcf-topic-images/BcfTopicImages.vue";
 import BcfTopicSnapshots from "./bcf-topic-snapshots/BcfTopicSnapshots.vue";
@@ -349,8 +350,7 @@ export default {
         ($viewer?.globalContext.localContexts ?? [])
           .filter(ctx => ctx.viewer && ctx.loadedModels.length > 0)
           .map(async ctx => {
-            const viewpoint = ctx.getViewpoint();
-            viewpoint.snapshot = await ctx.getSnapshot();
+            const viewpoint = await getViewerViewpoint(ctx);
             viewpointsToCreate.value.push(viewpoint);
           })
       );

src/components/bcf-topic-overview/BcfTopicOverview.vue

@@ -56,6 +56,7 @@
         :detailedExtensions="detailedExtensions"
         :topic="topic"
         @view-topic-viewpoint="$emit('view-topic-viewpoint', $event)"
+        :warning="warning"
       />
 
       <BIMDataButton
@@ -272,6 +273,10 @@ export default {
       type: String,
       required: false,
     },
+    warning: {
+      type: Boolean,
+      default: false,
+    },
   },
   emits: [
     "back",

src/components/bcf-topic-overview/bcf-topic-viewpoints/BcfTopicViewpoints.scss

@@ -51,6 +51,22 @@
     width: 100%;
     height: 100%;
 
+    .warning {
+      position: absolute;
+      top: var(--spacing-unit);
+      right: var(--spacing-unit);
+
+      width: 30px;
+      height: 27px;
+
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      background-color: var(--color-white);
+      box-shadow: var(--box-shadow);
+    }
+
     img {
       width: 100%;
       height: 100%;

src/components/bcf-topic-overview/bcf-topic-viewpoints/BcfTopicViewpoints.vue

@@ -14,6 +14,9 @@
     <template v-if="viewpoints.length > 0">
       <BIMDataCarousel :sliderPadding="0">
         <div class="snapshot-preview" v-for="viewpoint in viewpoints" :key="viewpoint.guid">
+          <div class="warning" v-if="warning">
+            <BIMDataIconWarning fill color="warning" size="xxs"/>
+          </div>
           <img
             v-if="viewpoint.snapshot.snapshot_data"
             :src="viewpoint.snapshot.snapshot_data"
@@ -50,6 +53,10 @@ export default {
       type: Object,
       required: true,
     },
+    warning: {
+      type: Boolean,
+      default: false,
+    },
   },
   emits: ["view-topic-viewpoint"],
   setup(props) {

src/components/bcf-topics-table/BcfTopicsTable.vue

@@ -54,10 +54,7 @@
       {{ toShortDateFormat(topic.creation_date) }}
     </template>
     <template #cell-actions="{ row: topic }">
-      <BcfTopicActionsCell
-        :topic="topic"
-        @open-topic="$emit('open-topic', $event)"
-      />
+      <BcfTopicActionsCell :topic="topic" @open-topic="$emit('open-topic', $event)" :warning="warningCallback(topic)" :warningTooltipMessage="warningTooltipMessage" />
     </template>
   </BIMDataTable>
 </template>
@@ -110,6 +107,14 @@ export default {
       type: Map,
       default: () => new Map(),
     },
+    warningCallback: {
+      type: Function,
+      default: () => false
+    },
+    warningTooltipMessage: {
+      type: String,
+      default: ""
+    }
   },
   emits: [
     "open-topic",

src/components/bcf-topics-table/bcf-topic-actions-cell/BcfTopicActionsCell.vue

@@ -1,14 +1,22 @@
 <template>
   <div class="bcf-topic-actions-cell">
     <BIMDataButton
-      color="primary"
+      :color="warning ? 'secondary' : 'primary'"
       outline
       radius
       icon
       @click="$emit('open-topic', topic)"
     >
-      <BIMDataIconShow size="xs" />
+      <BIMDataIconShow size="xs" :color="warning ? 'warning' : 'primary'" fill/>
     </BIMDataButton>
+    <div class="bcf-topic-actions-cell__warning" v-if="warning">
+      <div class="bcf-topic-actions-cell__warning__white-gradient"></div>
+      <BIMDataTooltip :message="warningTooltipMessage" position="left" >
+        <div class="bcf-topic-actions-cell__warning__icon">
+          <BIMDataIconWarning fill color="warning" />
+        </div>
+      </BIMDataTooltip>
+    </div>
   </div>
 </template>
 
@@ -18,6 +26,14 @@ export default {
     topic: {
       type: Object,
       required: true
+    },
+    warning: {
+      type: Boolean,
+      default: false
+    },
+    warningTooltipMessage: {
+      type: String,
+      default: ""
     }
   },
   emits: [
@@ -28,8 +44,43 @@ export default {
 
 <style scoped lang="scss">
 .bcf-topic-actions-cell {
+  position: relative;
+  height: 42px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
   .bimdata-btn {
     margin: auto;
   }
+
+  &__warning {
+    position: absolute;
+    top: 0;
+    right: 44px;
+
+    display: flex;
+    justify-content: flex-end;
+    
+    &__white-gradient {      
+      background: linear-gradient(90deg, transparent, var(--color-white) 90%);
+  
+      width: 350px;
+      height: 42px;
+    }
+
+    &__icon {
+      box-shadow: var(--box-shadow);
+
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      width: 42px;
+      height: 42px;
+
+      background-color: var(--color-white);
+    }
+  }
 }
 </style>

src/config.js

@@ -40,7 +40,7 @@ const VIEWPOINT_TYPES = Object.freeze({
   IFC2D: "ifc2d",
   DWG: "dwg",
   PLAN: "plan",
-  PANORAMA: "panorama",
+  PHOTOSPHERE: "photosphere",
 });
 
 const VIEWPOINT_CONFIG = Object.freeze({
@@ -68,9 +68,9 @@ const VIEWPOINT_CONFIG = Object.freeze({
     plugin: "plan",
     icon: "filePlanPolychrome",
   },
-  [VIEWPOINT_TYPES.PANORAMA]: {
-    window: "panorama",
-    plugin: "panorama",
+  [VIEWPOINT_TYPES.PHOTOSPHERE]: {
+    window: "photosphere",
+    plugin: "photosphere",
     icon: "filePlanPolychrome",
   },
 });

src/utils/viewer.js

@@ -6,10 +6,9 @@ export function getViewerOptions($viewer) {
 
 export async function getViewerViewpoint(context) {
   const ctx = context.viewer.$viewer.localContext;
-  return {
-    ...ctx.getViewpoint(),
-    snapshot: await ctx.getSnapshot()
-  };
+  const viewpoint = await ctx.getViewpoint();
+  viewpoint.snapshot = await ctx.getSnapshot();
+  return viewpoint;
 }
 
 export function highlightViewer(context) {