Skip to content

Commit

Permalink
MINOR: Feature: Photopshere Viewer (#461)
Browse files Browse the repository at this point in the history
* feat(models): add support for photosphere models (wip)

* feat(photosphere): add photosphere and photosphere building support

* feat(photosphere): photosphere-building-maker integration

* fix(models): use viewer alpha version with photsphere features

* fix(photosphere): show sturcture button for photosphere buildings

* fix(photosphere): restore 'Images' tab in models manager

* Update src/state/models.js

Co-authored-by: Gaëtan LAGIER <[email protected]>

* fix: update api-client to v10.18.0

---------

Co-authored-by: Gaëtan LAGIER <[email protected]>
  • Loading branch information
NicolasRichel and Kurtil authored Jan 9, 2025
1 parent 81b6837 commit aa19c10
Show file tree
Hide file tree
Showing 23 changed files with 894 additions and 425 deletions.
849 changes: 451 additions & 398 deletions package-lock.json

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@
},
"dependencies": {
"@bimdata/bcf-components": "6.4.7",
"@bimdata/components": "1.7.1",
"@bimdata/design-system": "2.2.1-beta.7",
"@bimdata/typescript-fetch-api-client": "10.17.2",
"@bimdata/components": "1.7.2",
"@bimdata/design-system": "2.2.1-beta.8",
"@bimdata/typescript-fetch-api-client": "10.18.0",
"@bimdata/viewer": "2.7.0-beta.2",
"@paddle/paddle-js": "^1.3.2",
"async": "^3.2.6",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -215,6 +215,7 @@
:file="file"
:loading="loadingFileIds.includes(file.id)"
@create-model="$emit('create-model', file)"
@create-photosphere="$emit('create-photosphere', file)"
@delete="$emit('delete', file)"
@download="$emit('download', file)"
@file-clicked="$emit('file-clicked', file)"
Expand Down Expand Up @@ -283,6 +284,7 @@ export default {
},
emits: [
"create-model",
"create-photosphere",
"delete",
"download",
"file-clicked",
Expand Down
15 changes: 12 additions & 3 deletions src/components/specific/files/files-manager/FilesManager.vue
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@
:foldersToUpload="foldersToUpload"
@back-parent-folder="backToParent"
@create-model="createModelFromFile"
@create-photosphere="createModelFromFile($event, MODEL_TYPE.PHOTOSPHERE)"
@delete="openFileDeleteModal([$event])"
@download="downloadFiles([$event])"
@dragover.prevent="() => {}"
Expand All @@ -100,6 +101,7 @@
:loadingFileIds="loadingFileIds"
:files="displayedFiles"
@create-model="createModelFromFile"
@create-photosphere="createModelFromFile($event, MODEL_TYPE.PHOTOSPHERE)"
@delete="openFileDeleteModal([$event])"
@download="downloadFiles([$event])"
@file-clicked="onFileSelected"
Expand Down Expand Up @@ -191,6 +193,7 @@ import { useAppSidePanel } from "../../app/app-side-panel/app-side-panel.js";
import { useSession } from "../../../../composables/session.js";
import { useListFilter } from "../../../../composables/list-filter.js";
import { useStandardBreakpoints } from "../../../../composables/responsive.js";
import { MODEL_TYPE } from "../../../../config/models.js";
import { VISA_STATUS } from "../../../../config/visa.js";
import FileService from "../../../../services/FileService.js";
import TagService from "../../../../services/TagService";
Expand Down Expand Up @@ -271,7 +274,7 @@ export default {
moveFiles: move,
downloadFiles: download,
} = useFiles();
const { createModel, deleteModels } = useModels();
const { createModel, createPhotosphere, deleteModels } = useModels();
const { fetchToValidateVisas, fetchCreatedVisas } = useVisa();
Expand Down Expand Up @@ -391,10 +394,15 @@ export default {
const loadingFileIds = ref([]);
const createModelFromFile = async (file) => {
const createModelFromFile = async (file, type) => {
try {
loadingFileIds.value.push(file.id);
const model = await createModel(props.project, file);
let model;
if (type === MODEL_TYPE.PHOTOSPHERE) {
model = await createPhotosphere(props.project, file);
} else {
model = await createModel(props.project, file);
}
emit("model-created", model);
pushNotification({
type: "success",
Expand Down Expand Up @@ -750,6 +758,7 @@ export default {
folderToManage,
importFromOtherProjectsActions,
loadingFileIds,
MODEL_TYPE,
searchText,
selectedFileTab,
selection,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ import { useUser } from "../../../../../state/user.js";
import { isFolder } from "../../../../../utils/file-structure.js";
import {
isConvertible,
isConvertibleToPhotosphere,
isModel,
isViewable,
openInViewer
Expand Down Expand Up @@ -76,6 +77,7 @@ export default {
},
emits: [
"create-model",
"create-photosphere",
"delete",
"download",
"file-clicked",
Expand Down Expand Up @@ -139,6 +141,16 @@ export default {
}
}
if (!isFolder(props.file) && isConvertibleToPhotosphere(props.file) && !isModel(props.file)) {
menuItems.value.push({
key: 3,
iconComponent: SetAsModelIcon,
text: "FileActionsCell.createPhotosphereButtonText",
disabled: !hasAdminPerm(props.project, props.file),
action: () => onClick("create-photosphere")
});
}
menuItems.value.push({
key: 5,
icon: "edit",
Expand Down
2 changes: 2 additions & 0 deletions src/components/specific/files/folder-table/FoldersTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@
:file="file"
:loading="loadingFileIds.includes(file.id)"
@create-model="$emit('create-model', file)"
@create-photosphere="$emit('create-photosphere', file)"
@delete="$emit('delete', file)"
@download="$emit('download', file)"
@file-clicked="$emit('file-clicked', file)"
Expand Down Expand Up @@ -165,6 +166,7 @@ export default {
emits: [
"back-parent-folder",
"create-model",
"create-photosphere",
"delete",
"download",
"file-clicked",
Expand Down
4 changes: 3 additions & 1 deletion src/components/specific/files/folder-table/columns.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import { fileExtension } from "../../../../utils/files.js";
import i18n from "../../../../i18n/index.js";
import { fileExtension } from "../../../../utils/files.js";

const { t } = i18n.global;

export default [
{
id: "type",
Expand Down
15 changes: 12 additions & 3 deletions src/components/specific/models/models-manager/ModelsManager.vue
Original file line number Diff line number Diff line change
Expand Up @@ -84,9 +84,10 @@ import { segregateByType } from "../../../../utils/models.js";
import DWGManager from "./dwg-manager/DWGManager.vue";
import IFCManager from "./ifc-manager/IFCManager.vue";
import PDFManager from "./pdf-manager/PDFManager.vue";
import PhotosphereManager from "./photosphere-manager/PhotosphereManager.vue";
import PointCloudManager from "./point-cloud-manager/PointCloudManager.vue";
const { DWG, DXF, IFC, JPEG, META_BUILDING, PDF, PNG, POINT_CLOUD } =
const { DWG, DXF, IFC, JPEG, META_BUILDING, PDF, PHOTOSPHERE, PHOTOSPHERE_BUILDING, PNG, POINT_CLOUD } =
MODEL_TYPE;
const tabsDef = [
Expand Down Expand Up @@ -129,11 +130,18 @@ const tabsDef = [
beta: true
},
{
id: "photos",
text: "Photos",
id: "images",
text: "Images",
icon: "fileImagePolychrome",
modelTypes: [JPEG, PNG],
component: "DWGManager"
},
{
id: "photosphere",
text: "Photosphere",
icon: "filePhotospherePolychrome",
modelTypes: [PHOTOSPHERE, PHOTOSPHERE_BUILDING],
component: "PhotosphereManager"
}
];
Expand All @@ -142,6 +150,7 @@ export default {
DWGManager,
IFCManager,
PDFManager,
PhotosphereManager,
PointCloudManager
},
props: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,8 @@
@download="downloadModels([$event])"
@view-metaBuilding="$emit('view-metaBuilding', $event)"
@edit-metaBuilding="$emit('edit-metaBuilding', $event)"
@view-photosphereBuilding="$emit('view-photosphereBuilding', $event)"
@edit-photosphereBuilding="$emit('edit-photosphereBuilding', $event)"
>
<template #placeholder>
<slot name="tablePlaceholder"></slot>
Expand Down Expand Up @@ -125,9 +127,11 @@ export default {
},
emits: [
"edit-metaBuilding",
"edit-photosphereBuilding",
"file-uploaded",
"tab-changed",
"view-metaBuilding"
"view-metaBuilding",
"view-photosphereBuilding",
],
setup(props, { emit }) {
const router = useRouter();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -135,14 +135,14 @@ export default {
const modelsBySource = segregateBySource(
models.filter(model => model.type !== MODEL_TYPE.META_BUILDING)
);
const metaBuildings = models.filter(
const buildings = models.filter(
model => model.type === MODEL_TYPE.META_BUILDING
);
tabs.value = tabs.value.map(tab => ({
...tab,
label: tab.label || tab.id,
models:
tab.id === "metaBuildings" ? metaBuildings : modelsBySource[tab.id]
tab.id === "metaBuildings" ? buildings : modelsBySource[tab.id]
}));
},
{ immediate: true }
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
<script setup>
import apiClient from "../../../../../services/api-client.js";
import { useModels } from "../../../../../state/models.js";
const { loadProjectModels } = useModels();
defineProps({
space: {
type: Object,
required: true
},
project: {
type: Object,
required: true
},
model: {
type: Object,
default: null
},
});
defineEmits(["close"]);
</script>

<template>
<div class="photosphere-building-maker-panel">
<BIMDataButton
class="close"
ghost
rounded
icon
@click="$emit('close')"
>
<BIMDataIconClose size="xxs" fill color="granite-light" />
</BIMDataButton>
<div class="content">
<BIMDataPhotosphereBuildingMaker
:apiClient="apiClient"
:space="space"
:project="project"
:model="model"
@metaBuilding-created="loadProjectModels(project)"
@metaBuilding-updated="loadProjectModels(project)"
@metaBuilding-deleted="loadProjectModels(project)"
/>
</div>
</div>
</template>

<style scoped>
.photosphere-building-maker-panel {
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
.close {
position: absolute;
z-index: 1;
top: calc(var(--spacing-unit) / 2);
right: var(--spacing-unit);
}
.content {
height: 100%;
}
}
</style>
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
<script setup>
import apiClient from "../../../../../services/api-client.js";
defineProps({
space: {
type: Object,
required: true
},
project: {
type: Object,
required: true
},
model: {
type: Object,
required: true
},
});
defineEmits(["close"]);
</script>

<template>
<div class="photosphere-building-panel">
<BIMDataButton
class="close"
ghost
rounded
icon
@click="$emit('close')"
>
<BIMDataIconClose size="xxs" fill color="granite-light" />
</BIMDataButton>
<div class="content">
<BIMDataPhotosphereBuilding
:apiClient="apiClient"
:space="space"
:project="project"
:model="model"
:selectable="false"
/>
</div>
</div>
</template>

<style scoped>
.photosphere-building-panel {
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
.close {
position: absolute;
z-index: 1;
top: calc(var(--spacing-unit) / 2);
right: var(--spacing-unit);
}
.content {
height: 100%;
}
}
</style>
Loading

0 comments on commit aa19c10

Please sign in to comment.