@3cr/viewer-browser 0.0.10 → 0.0.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.html CHANGED
@@ -1,24 +1,22 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
3
3
 
4
- <!--<head>-->
5
- <!-- <meta charset="UTF-8" />-->
6
- <!-- <link rel="icon" href="/favicon.ico" />-->
7
- <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" />-->
8
- <!-- <title>Welcome to Vuetify 3</title>-->
9
- <!--</head>-->
4
+ <head>
5
+ <meta charset="UTF-8" />
6
+ <link rel="icon" href="/favicon.ico" />
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
8
+ <title>Welcome to Vuetify 3</title>
9
+ </head>
10
10
 
11
11
  <body>
12
- <div id="app"></div>
13
- <script type="module">
14
- import { createApp } from 'vue';
15
- import {App as BrowserViewer} from './src/main.ts';
16
- import {registerPlugins} from "./src/plugins";
12
+ <div id="app"></div>
13
+ <script type="module">
14
+ import {registerViewer, loadViewer} from './index.ts';
17
15
 
18
- const app = createApp(BrowserViewer)
19
- registerPlugins(app)
20
- app.mount('#app');
21
- </script>
16
+ registerViewer('1.0.0_234', '#app').then(() => {
17
+ loadViewer().then()
18
+ })
19
+ </script>
22
20
  </body>
23
21
 
24
22
  </html>
package/index.ts CHANGED
@@ -1,9 +1,8 @@
1
1
  import {registerVersion} from "@3cr/sdk-browser";
2
- import {createApp} from "vue";
2
+ import {ComponentPublicInstance, createApp} from "vue";
3
3
  import {registerPlugins} from "./src/plugins";
4
4
  import {App as BrowserViewer} from './src/main';
5
5
 
6
- let idSelectorLocal = ''
7
6
 
8
7
  export interface LoadViewerPayload {
9
8
  Url: string;
@@ -14,16 +13,19 @@ export interface MftpDecryptionKey {
14
13
  Iv: string;
15
14
  }
16
15
 
16
+ let mountedApp: ComponentPublicInstance | undefined = undefined
17
+
17
18
  export async function registerViewer(version: string, idSelector: string) {
18
- idSelectorLocal = idSelector;
19
19
  const app = createApp(BrowserViewer)
20
20
  registerPlugins(app)
21
21
 
22
- app.mount(idSelector);
22
+ mountedApp = app.mount(idSelector);
23
23
  await registerVersion(version);
24
24
  }
25
25
 
26
- export async function loadViewer(payload: LoadViewerPayload) {
27
- const el = document.getElementById(idSelectorLocal) as any
28
- await el?._instance.exposed.instanceLoaded(payload)
26
+ export async function loadViewer(payload: LoadViewerPayload | undefined = undefined): Promise<void> {
27
+ if (!mountedApp) {
28
+ throw new Error('Please call `registerViewer(version: string, idSelector: string)` first');
29
+ }
30
+ await (mountedApp as any).loadInstance(payload)
29
31
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3cr/viewer-browser",
3
- "version": "0.0.10",
3
+ "version": "0.0.14",
4
4
  "main": "./dist/Viewer3CR.umd.js",
5
5
  "module": "dist/Viewer3CR.umd.js",
6
6
  "homepage": "https://docs.3cr.singular.health",
@@ -11,6 +11,7 @@
11
11
  "scripts": {
12
12
  "dev": "vite",
13
13
  "build": "vue-tsc --noEmit && vite build",
14
+ "deploy": "npm version --no-git-tag-version patch && npm run build && npm publish",
14
15
  "preview": "vite preview",
15
16
  "test": "vitest",
16
17
  "coverage": "vitest run --coverage"
package/src/App.vue CHANGED
@@ -1,40 +1,32 @@
1
1
  <template>
2
2
  <v-app>
3
3
  <v-main>
4
- <MftpWebGL3DRModal ref="mftpWebGL3DRModal" @instanceLoaded="instanceLoaded" />
4
+ <MftpWebGL3DRModal ref="mftpWebGL3DRModal" :payload="payload" />
5
5
  </v-main>
6
6
  </v-app>
7
7
  </template>
8
8
 
9
9
  <script setup lang="ts">
10
- import { registerVersion } from '@3cr/sdk-browser';
11
10
 
12
11
  import MftpWebGL3DRModal from "@/components/MftpWebGL3DRModal.vue";
13
- import {nextTick, onMounted, ref, unref} from "vue";
12
+ import {ref, unref} from "vue";
13
+ import {LoadViewerPayload} from "../index";
14
14
 
15
+ const payload = ref<LoadViewerPayload>({
16
+ Url:"https://webgl-3dr.singular.health/test_scans/8bdddee1-e581-485d-827d-6aa12eef2fc8/Head+Axial+Axial.3vxl",
17
+ DecryptionKey:{
18
+ Iv:"x856FgjpYDsRhIa3BFj5cg==",
19
+ Key:"OWjSMiL/ewUV1V6fGybhKcTyiysTPsIMp2DjdVoOUGI="
20
+ }
21
+ });
15
22
  const mftpWebGL3DRModal = ref<typeof MftpWebGL3DRModal | null>(null)
16
- onMounted(async () => {
17
- await registerVersion('1.0.0_234');
18
- await nextTick()
19
- setTimeout(async () => {
20
- unref(mftpWebGL3DRModal)?.alterValue(true)
21
- // await instanceLoaded({
22
- // Url:"https://webgl-3dr.singular.health/test_scans/8bdddee1-e581-485d-827d-6aa12eef2fc8/Head+Axial+Axial.3vxl",
23
- // DecryptionKey:{
24
- // Iv:"x856FgjpYDsRhIa3BFj5cg==",
25
- // Key:"OWjSMiL/ewUV1V6fGybhKcTyiysTPsIMp2DjdVoOUGI="
26
- // }
27
- // })
28
- }, 1000)
29
- })
30
23
  defineExpose({
31
- instanceLoaded
24
+ loadInstance
32
25
  })
33
26
 
34
- async function instanceLoaded(payload: any) {
35
- await unref(mftpWebGL3DRModal)?.load(payload)
27
+ async function loadInstance(payloadIncoming: LoadViewerPayload | undefined = undefined) {
28
+ payload.value = payloadIncoming || payload.value;
29
+
30
+ unref(mftpWebGL3DRModal)?.alterValue(true)
36
31
  }
37
- setTimeout(() => {
38
- console.log(mftpWebGL3DRModal?.value)
39
- }, 1000)
40
32
  </script>
@@ -341,7 +341,7 @@
341
341
  v-if="value"
342
342
  ref="web_gl"
343
343
  @on_payload="handleOnPayload"
344
- @instance_loaded="emit('instanceLoaded');"
344
+ @instance_loaded="load"
345
345
  @hover="hoverOverCanvas"
346
346
  >
347
347
  <div
@@ -555,9 +555,23 @@ defineExpose({
555
555
  load
556
556
  });
557
557
 
558
+ export interface Props {
559
+ payload: LoadViewerPayload;
560
+ }
561
+
562
+ const props = withDefaults(defineProps<Props>(), {
563
+ payload: () => ({
564
+ Url:"https://webgl-3dr.singular.health/test_scans/8bdddee1-e581-485d-827d-6aa12eef2fc8/Head+Axial+Axial.3vxl",
565
+ DecryptionKey:{
566
+ Iv:"x856FgjpYDsRhIa3BFj5cg==",
567
+ Key:"OWjSMiL/ewUV1V6fGybhKcTyiysTPsIMp2DjdVoOUGI="
568
+ }
569
+ })
570
+ });
571
+
558
572
  const emptyPayload = JSON.stringify({ Version: '1.1.0' });
559
573
 
560
- const value = ref<boolean>(true);
574
+ const value = ref<boolean>(false);
561
575
  const drawer = ref<boolean>(true);
562
576
  const drawerCollapsed = ref<boolean>(true);
563
577
  const scanLoading = ref<boolean>(true);
@@ -812,10 +826,10 @@ async function sendPayload(interfaceType: string, actionType: string, message: a
812
826
  }),
813
827
  );
814
828
  }
815
- async function load(downloadResponse: LoadViewerPayload) {
829
+ async function load() {
816
830
  instanceLoaded.value = true;
817
831
  scanLoading.value = true;
818
- await sendPayload('file_management', 'fm_01', downloadResponse);
832
+ await sendPayload('file_management', 'fm_01', props.payload);
819
833
  }
820
834
  async function viewSelection(action: string) {
821
835
  await sendPayload('view_selection', action, emptyPayload)