@3cr/viewer-browser 0.0.61 → 0.0.86
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/components.d.ts +0 -1
- package/coverage/3cr-viewer-browser/index.html +5 -5
- package/coverage/3cr-viewer-browser/index.ts.html +14 -26
- package/coverage/3cr-viewer-browser/src/App.vue.html +51 -48
- package/coverage/3cr-viewer-browser/src/components/WebGL3DR.vue.html +1 -1
- package/coverage/3cr-viewer-browser/src/components/icons/index.html +1 -1
- package/coverage/3cr-viewer-browser/src/components/icons/liver.vue.html +1 -1
- package/coverage/3cr-viewer-browser/src/components/index.html +1 -1
- package/coverage/3cr-viewer-browser/src/components/loading/LoadingSpinner.vue.html +82 -16
- package/coverage/3cr-viewer-browser/src/components/loading/index.html +5 -5
- package/coverage/3cr-viewer-browser/src/components/modal/MftpWebGL3DRModal.vue.html +238 -1123
- package/coverage/3cr-viewer-browser/src/components/modal/index.html +19 -19
- package/coverage/3cr-viewer-browser/src/components/selectors/ValueSelector.vue.html +47 -20
- package/coverage/3cr-viewer-browser/src/components/selectors/index.html +7 -7
- package/coverage/3cr-viewer-browser/src/components/sliders/DoubleSliderSelector.vue.html +62 -20
- package/coverage/3cr-viewer-browser/src/components/sliders/VerticalSliderSelector.vue.html +16 -7
- package/coverage/3cr-viewer-browser/src/components/sliders/index.html +10 -10
- package/coverage/3cr-viewer-browser/src/dataLayer/iconData.ts.html +118 -0
- package/coverage/3cr-viewer-browser/src/dataLayer/index.html +146 -0
- package/coverage/3cr-viewer-browser/src/dataLayer/payloadHandler.ts.html +352 -0
- package/coverage/3cr-viewer-browser/src/dataLayer/scanState.ts.html +628 -0
- package/coverage/3cr-viewer-browser/src/helpers/index.html +1 -1
- package/coverage/3cr-viewer-browser/src/helpers/layoutOverlayStyle.ts.html +1 -1
- package/coverage/3cr-viewer-browser/src/helpers/modelHelper.ts.html +105 -105
- package/coverage/3cr-viewer-browser/src/helpers/utils.ts.html +3 -3
- package/coverage/3cr-viewer-browser/src/index.html +5 -5
- package/coverage/3cr-viewer-browser/src/main.ts.html +1 -1
- package/coverage/3cr-viewer-browser/src/models/LoadViewerOptions.ts.html +166 -0
- package/coverage/3cr-viewer-browser/src/models/index.html +116 -0
- package/coverage/3cr-viewer-browser/src/notifications/index.html +116 -0
- package/coverage/3cr-viewer-browser/src/notifications/notification.ts.html +229 -0
- package/coverage/3cr-viewer-browser/src/plugins/index.html +5 -5
- package/coverage/3cr-viewer-browser/src/plugins/index.ts.html +14 -8
- package/coverage/3cr-viewer-browser/src/plugins/vuetify.ts.html +1 -1
- package/coverage/index.html +78 -33
- package/dist/Viewer3CR.js +12 -12
- package/dist/Viewer3CR.mjs +10004 -9916
- package/dist/Viewer3CR.umd.js +12 -12
- package/index.ts +7 -42
- package/package.json +2 -1
- package/src/App.vue +6 -2
- package/src/components/modal/MftpWebGL3DRModal.vue +137 -452
- package/src/components/modal/__tests__/mftp-webgl-3dr-modal.spec.ts +114 -83
- package/src/components/selectors/ValueSelector.vue +4 -0
- package/src/components/selectors/__tests__/value-selector.spec.ts +18 -0
- package/src/components/sliders/DoubleSliderSelector.vue +10 -4
- package/src/components/sliders/__tests__/double-slider-selector.spec.ts +32 -0
- package/src/dataLayer/__tests__/payload-handler.spec.ts +98 -0
- package/src/dataLayer/iconData.ts +11 -0
- package/src/dataLayer/payloadHandler.ts +89 -0
- package/src/dataLayer/scanState.ts +181 -0
- package/src/demo/DemoPatientModal.vue +59 -0
- package/src/demo/options.ts +93 -0
- package/src/models/Callbacks.ts +2 -0
- package/src/models/LoadViewerOptions.ts +27 -0
- package/src/models/LoadViewerPayload.ts +8 -0
- package/src/notifications/notification.ts +48 -0
- package/vitest.config.mts +1 -0
- /package/src/{components/modal → demo}/DemoModal.vue +0 -0
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
<!-- /* c8 ignore start */ -->
|
|
2
2
|
<template>
|
|
3
3
|
<DemoModal v-model:modal="m_demo" />
|
|
4
|
+
<DemoPatientModal v-model:modal="m_demoPatient" :is-modal-open="value" />
|
|
4
5
|
<v-dialog
|
|
5
6
|
id="cr-viewer"
|
|
6
7
|
class="pa-0 ma-0 overflow-y-auto overflow-x-hidden"
|
|
@@ -161,7 +162,9 @@
|
|
|
161
162
|
|
|
162
163
|
<v-spacer />
|
|
163
164
|
<div class="font-weight-bold">
|
|
164
|
-
<span v-if="isDemo"
|
|
165
|
+
<span v-if="isDemo" class="text-capitalize"
|
|
166
|
+
>[3DICOM {{ demoType }} Demo] </span
|
|
167
|
+
>Not for Diagnostic Use
|
|
165
168
|
</div>
|
|
166
169
|
<v-spacer />
|
|
167
170
|
<v-btn
|
|
@@ -326,7 +329,7 @@
|
|
|
326
329
|
/>
|
|
327
330
|
<v-card-actions class="py-3">
|
|
328
331
|
<v-select
|
|
329
|
-
:value="
|
|
332
|
+
:value="currentGreyscalePreset"
|
|
330
333
|
:items="initialScanState.GreyscalePresets"
|
|
331
334
|
label="Greyscale Preset"
|
|
332
335
|
item-text="Name"
|
|
@@ -488,8 +491,12 @@
|
|
|
488
491
|
color="transparent"
|
|
489
492
|
:icon="true"
|
|
490
493
|
@click="
|
|
491
|
-
viewSelection(
|
|
492
|
-
|
|
494
|
+
payloadHandler.viewSelection(
|
|
495
|
+
ViewSelectionActions.vs06
|
|
496
|
+
);
|
|
497
|
+
payloadHandler.viewSelection(
|
|
498
|
+
ViewSelectionActions.vs05
|
|
499
|
+
);
|
|
493
500
|
"
|
|
494
501
|
><v-icon color="white">home</v-icon></v-btn
|
|
495
502
|
>
|
|
@@ -587,7 +594,7 @@
|
|
|
587
594
|
<v-btn
|
|
588
595
|
color="primary"
|
|
589
596
|
@click="
|
|
590
|
-
rotateByDeg(
|
|
597
|
+
payloadHandler.rotateByDeg(
|
|
591
598
|
getCurrentActiveView(layout),
|
|
592
599
|
rotationDeg
|
|
593
600
|
)
|
|
@@ -664,34 +671,55 @@ import VerticalSliderSelector from "@/components/sliders/VerticalSliderSelector.
|
|
|
664
671
|
import { generateDivStyleForLayout } from "@/helpers/layoutOverlayStyle";
|
|
665
672
|
|
|
666
673
|
import {
|
|
667
|
-
inflateInitialScanState,
|
|
668
|
-
inflateScanState,
|
|
669
|
-
} from "@/helpers/modelHelper";
|
|
670
|
-
import {
|
|
671
|
-
SlidersActions,
|
|
672
|
-
PresetsActions,
|
|
673
|
-
ScanMovementActions,
|
|
674
|
-
ScanOrientationActions,
|
|
675
674
|
FileManagementActions,
|
|
676
675
|
FrontEndInterfaces,
|
|
677
|
-
AnchorPoint,
|
|
678
|
-
ColourPresetData,
|
|
679
|
-
CurrentScanState,
|
|
680
|
-
InitialScanState,
|
|
681
676
|
PositionData,
|
|
677
|
+
PresetsActions,
|
|
678
|
+
ScanMovementActions,
|
|
682
679
|
ScanView,
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
NotificationPayload,
|
|
680
|
+
SlidersActions,
|
|
681
|
+
ViewSelectionActions,
|
|
686
682
|
} from "@3cr/types-ts";
|
|
683
|
+
import { defineEmits, nextTick, ref, unref, watch, WatchSource } from "vue";
|
|
687
684
|
|
|
688
|
-
import { toNumber } from "@/helpers/utils";
|
|
689
|
-
import { computed, ref, unref, watch, defineEmits, nextTick } from "vue";
|
|
690
685
|
import {
|
|
691
|
-
|
|
686
|
+
checkIsDemo,
|
|
687
|
+
demoType,
|
|
688
|
+
executeDemoOption,
|
|
689
|
+
isDemo,
|
|
690
|
+
m_demo,
|
|
691
|
+
m_demoPatient,
|
|
692
|
+
} from "@/demo/options";
|
|
693
|
+
import { handleNotification } from "@/notifications/notification";
|
|
694
|
+
import DemoPatientModal from "@/demo/DemoPatientModal.vue";
|
|
695
|
+
import DemoModal from "@/demo/DemoModal.vue";
|
|
696
|
+
import { LoadViewerPayload } from "@/models/LoadViewerPayload";
|
|
697
|
+
import {
|
|
698
|
+
defaultLoadViewerOptions,
|
|
692
699
|
LoadViewerOptions,
|
|
693
|
-
|
|
694
|
-
} from "
|
|
700
|
+
} from "@/models/LoadViewerOptions";
|
|
701
|
+
import { PayloadHandler, sendPayload } from "@/dataLayer/payloadHandler";
|
|
702
|
+
import {
|
|
703
|
+
cMinMax,
|
|
704
|
+
cSlider,
|
|
705
|
+
currentColourPreset,
|
|
706
|
+
currentGreyscalePreset,
|
|
707
|
+
huMinMax,
|
|
708
|
+
initialScanState,
|
|
709
|
+
isLayout1x3,
|
|
710
|
+
isLayout2x2,
|
|
711
|
+
scanState,
|
|
712
|
+
setInitialScanStateFromPayload,
|
|
713
|
+
setScanStateFromPayload,
|
|
714
|
+
sMinMax,
|
|
715
|
+
sSlider,
|
|
716
|
+
thresholdSlider,
|
|
717
|
+
tMinMax,
|
|
718
|
+
transactionStarted,
|
|
719
|
+
tSlider,
|
|
720
|
+
windowSlider,
|
|
721
|
+
} from "@/dataLayer/scanState";
|
|
722
|
+
import { getIconForPreset } from "@/dataLayer/iconData";
|
|
695
723
|
|
|
696
724
|
const emit = defineEmits<{
|
|
697
725
|
instanceLoaded: [void];
|
|
@@ -711,48 +739,15 @@ const props = withDefaults(defineProps<Props>(), {
|
|
|
711
739
|
Key: "OWjSMiL/ewUV1V6fGybhKcTyiysTPsIMp2DjdVoOUGI=",
|
|
712
740
|
},
|
|
713
741
|
}),
|
|
714
|
-
options: () =>
|
|
742
|
+
options: () => defaultLoadViewerOptions,
|
|
715
743
|
});
|
|
716
|
-
const isDemo = ref<boolean>(false);
|
|
717
|
-
let m_demo = ref<boolean>(false);
|
|
718
744
|
|
|
719
|
-
const
|
|
720
|
-
|
|
721
|
-
OnExitViewer: () => {
|
|
722
|
-
m_demo.value = true;
|
|
723
|
-
},
|
|
724
|
-
OnLoadNewDicomSeries: () => {
|
|
725
|
-
m_demo.value = true;
|
|
726
|
-
},
|
|
727
|
-
OnDownloadDicomSeries: () => {
|
|
728
|
-
m_demo.value = true;
|
|
729
|
-
},
|
|
730
|
-
OnLoadSavedSession: () => {
|
|
731
|
-
m_demo.value = true;
|
|
732
|
-
},
|
|
733
|
-
OnSaveSession: () => {
|
|
734
|
-
m_demo.value = true;
|
|
735
|
-
},
|
|
736
|
-
OnSendTo3rdParty: () => {
|
|
737
|
-
m_demo.value = true;
|
|
738
|
-
},
|
|
739
|
-
OnShareToMobile: () => {
|
|
740
|
-
m_demo.value = true;
|
|
741
|
-
},
|
|
742
|
-
OnShare: () => {
|
|
743
|
-
m_demo.value = true;
|
|
744
|
-
},
|
|
745
|
-
OnScreenshot: () => {
|
|
746
|
-
m_demo.value = true;
|
|
747
|
-
},
|
|
748
|
-
};
|
|
745
|
+
const web_gl = ref<typeof WebGL3DR | null>(null);
|
|
746
|
+
const payloadHandler = new PayloadHandler(web_gl);
|
|
749
747
|
|
|
750
748
|
function executeOption(key: keyof LoadViewerOptions) {
|
|
751
749
|
if (unref(isDemo)) {
|
|
752
|
-
|
|
753
|
-
if (functionToExecute !== undefined) {
|
|
754
|
-
functionToExecute();
|
|
755
|
-
}
|
|
750
|
+
executeDemoOption(key);
|
|
756
751
|
} else {
|
|
757
752
|
const functionToExecute = unref(props.options)[key];
|
|
758
753
|
if (functionToExecute !== undefined) {
|
|
@@ -768,9 +763,6 @@ const drawer = ref<boolean>(true);
|
|
|
768
763
|
const drawerCollapsed = ref<boolean>(true);
|
|
769
764
|
const scanLoading = ref<boolean>(true);
|
|
770
765
|
const instanceLoaded = ref<boolean>(true);
|
|
771
|
-
const scanState = ref<CurrentScanState>(inflateScanState());
|
|
772
|
-
const initialScanState = ref<InitialScanState>(inflateInitialScanState());
|
|
773
|
-
const currentColourPreset = ref<ColourPresetData | undefined>(undefined);
|
|
774
766
|
const openPanels = ref<number>(0);
|
|
775
767
|
const previousLayout = ref<string>("lo_02");
|
|
776
768
|
const footerItems = ref([
|
|
@@ -779,9 +771,8 @@ const footerItems = ref([
|
|
|
779
771
|
icon: "refresh",
|
|
780
772
|
color: "red",
|
|
781
773
|
click: async () => {
|
|
782
|
-
|
|
783
|
-
await viewSelection(
|
|
784
|
-
await viewSelection("vs_06");
|
|
774
|
+
await payloadHandler.viewSelection(ViewSelectionActions.vs05);
|
|
775
|
+
await payloadHandler.viewSelection(ViewSelectionActions.vs06);
|
|
785
776
|
},
|
|
786
777
|
},
|
|
787
778
|
{
|
|
@@ -811,238 +802,69 @@ const miniMenu = ref([
|
|
|
811
802
|
tooltip:
|
|
812
803
|
"Tissue Density - Change the view of density within the scan, allowing you to see through a certain density of particles",
|
|
813
804
|
},
|
|
814
|
-
// { icon: 'display_settings', text: 'Display', tooltip: 'Display - Alter the view of the current scan' },
|
|
815
805
|
]);
|
|
816
806
|
|
|
817
|
-
const huMinMax = ref({
|
|
818
|
-
min: -999999,
|
|
819
|
-
max: 999999,
|
|
820
|
-
});
|
|
821
|
-
|
|
822
|
-
const tMinMax = ref({
|
|
823
|
-
min: 0,
|
|
824
|
-
max: 999999,
|
|
825
|
-
});
|
|
826
|
-
const sMinMax = ref({
|
|
827
|
-
min: 0,
|
|
828
|
-
max: 999999,
|
|
829
|
-
});
|
|
830
|
-
const cMinMax = ref({
|
|
831
|
-
min: 0,
|
|
832
|
-
max: 999999,
|
|
833
|
-
});
|
|
834
807
|
const rotationDeg = ref<number>(0);
|
|
835
|
-
const scanStateIncoming = ref<string>("");
|
|
836
|
-
const transactionStarted = ref<boolean>(false);
|
|
837
808
|
const stateOverlay = ref<boolean>(false);
|
|
838
809
|
const m_closeDialog = ref<boolean>(false);
|
|
839
810
|
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
set(value: Array<number>) {
|
|
860
|
-
scanState.value.Display.ThresholdLower = value[0];
|
|
861
|
-
scanState.value.Display.ThresholdUpper = value[1];
|
|
862
|
-
},
|
|
863
|
-
});
|
|
864
|
-
const tSlider = computed({
|
|
865
|
-
get() {
|
|
866
|
-
return [
|
|
867
|
-
Math.trunc(unref(scanState).Slice.TransverseLower),
|
|
868
|
-
Math.trunc(unref(scanState).Slice.TransverseUpper),
|
|
869
|
-
];
|
|
870
|
-
},
|
|
871
|
-
set(value: Array<number>) {
|
|
872
|
-
scanState.value.Slice.TransverseLower = value[0];
|
|
873
|
-
scanState.value.Slice.TransverseLower = value[1];
|
|
874
|
-
},
|
|
875
|
-
});
|
|
876
|
-
const sSlider = computed({
|
|
877
|
-
get() {
|
|
878
|
-
return [
|
|
879
|
-
Math.trunc(unref(scanState).Slice.SagittalLower),
|
|
880
|
-
Math.trunc(unref(scanState).Slice.SagittalUpper),
|
|
881
|
-
];
|
|
882
|
-
},
|
|
883
|
-
set(value: Array<number>) {
|
|
884
|
-
scanState.value.Slice.SagittalLower = value[0];
|
|
885
|
-
scanState.value.Slice.SagittalUpper = value[1];
|
|
886
|
-
},
|
|
887
|
-
});
|
|
811
|
+
type WatchSlidersType = { [key in SlidersActions]: WatchSource<number> };
|
|
812
|
+
const watchSliders: WatchSlidersType = {
|
|
813
|
+
[SlidersActions.sl01]: () => scanState.value.Display.Brightness,
|
|
814
|
+
[SlidersActions.sl02]: () => scanState.value.Display.Contrast,
|
|
815
|
+
[SlidersActions.sl03]: () => scanState.value.Display.Opacity,
|
|
816
|
+
[SlidersActions.sl04]: () => scanState.value.Display.WindowLower,
|
|
817
|
+
[SlidersActions.sl05]: () => scanState.value.Display.WindowUpper,
|
|
818
|
+
[SlidersActions.sl06]: () => scanState.value.Display.ThresholdLower,
|
|
819
|
+
[SlidersActions.sl07]: () => scanState.value.Display.ThresholdUpper,
|
|
820
|
+
[SlidersActions.sl08]: () => scanState.value.Slice.TransverseLower,
|
|
821
|
+
[SlidersActions.sl09]: () => scanState.value.Orientations.Transverse.Slice,
|
|
822
|
+
[SlidersActions.sl10]: () => scanState.value.Slice.TransverseUpper,
|
|
823
|
+
[SlidersActions.sl11]: () => scanState.value.Slice.SagittalLower,
|
|
824
|
+
[SlidersActions.sl12]: () => scanState.value.Orientations.Sagittal.Slice,
|
|
825
|
+
[SlidersActions.sl13]: () => scanState.value.Slice.SagittalUpper,
|
|
826
|
+
[SlidersActions.sl14]: () => scanState.value.Slice.CoronalLower,
|
|
827
|
+
[SlidersActions.sl15]: () => scanState.value.Orientations.Coronal.Slice,
|
|
828
|
+
[SlidersActions.sl16]: () => scanState.value.Slice.CoronalUpper,
|
|
829
|
+
};
|
|
888
830
|
|
|
889
|
-
const
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
scanState.value.Slice.CoronalLower = value[0];
|
|
898
|
-
scanState.value.Slice.CoronalUpper = value[1];
|
|
899
|
-
},
|
|
900
|
-
});
|
|
901
|
-
const web_gl = ref<typeof WebGL3DR | null>(null);
|
|
831
|
+
for (const slider of Object.keys(watchSliders)) {
|
|
832
|
+
watch(
|
|
833
|
+
watchSliders[slider as keyof WatchSlidersType],
|
|
834
|
+
async (value: number) => {
|
|
835
|
+
await payloadHandler.sliderHandler(slider as SlidersActions, value);
|
|
836
|
+
}
|
|
837
|
+
);
|
|
838
|
+
}
|
|
902
839
|
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
await sliderHandler(SlidersActions.sl01, value);
|
|
907
|
-
}
|
|
908
|
-
);
|
|
909
|
-
watch(
|
|
910
|
-
() => scanState.value.Display.Contrast,
|
|
911
|
-
async (value: number) => {
|
|
912
|
-
await sliderHandler(SlidersActions.sl02, value);
|
|
913
|
-
}
|
|
914
|
-
);
|
|
915
|
-
watch(
|
|
916
|
-
() => scanState.value.Display.Opacity,
|
|
917
|
-
async (value: number) => {
|
|
918
|
-
await sliderHandler(SlidersActions.sl03, value);
|
|
919
|
-
}
|
|
920
|
-
);
|
|
921
|
-
watch(
|
|
922
|
-
() => scanState.value.Display.WindowLower,
|
|
923
|
-
async (value: number) => {
|
|
924
|
-
await sliderHandler(SlidersActions.sl04, value);
|
|
925
|
-
}
|
|
926
|
-
);
|
|
927
|
-
watch(
|
|
928
|
-
() => scanState.value.Display.WindowUpper,
|
|
929
|
-
async (value: number) => {
|
|
930
|
-
await sliderHandler(SlidersActions.sl05, value);
|
|
931
|
-
}
|
|
932
|
-
);
|
|
933
|
-
watch(
|
|
934
|
-
() => scanState.value.Display.ThresholdLower,
|
|
935
|
-
async (value: number) => {
|
|
936
|
-
await sliderHandler(SlidersActions.sl06, value);
|
|
937
|
-
}
|
|
938
|
-
);
|
|
939
|
-
watch(
|
|
940
|
-
() => scanState.value.Display.ThresholdUpper,
|
|
941
|
-
async (value: number) => {
|
|
942
|
-
await sliderHandler(SlidersActions.sl07, value);
|
|
943
|
-
}
|
|
944
|
-
);
|
|
945
|
-
watch(
|
|
946
|
-
() => scanState.value.Slice.TransverseLower,
|
|
947
|
-
async (value: number) => {
|
|
948
|
-
await sliderHandler(SlidersActions.sl08, value);
|
|
949
|
-
}
|
|
950
|
-
);
|
|
951
|
-
watch(
|
|
952
|
-
() => scanState.value.Orientations.Transverse.Slice,
|
|
953
|
-
async (value: number) => {
|
|
954
|
-
await sliderHandler(SlidersActions.sl09, value);
|
|
955
|
-
}
|
|
956
|
-
);
|
|
957
|
-
watch(
|
|
958
|
-
() => scanState.value.Slice.TransverseUpper,
|
|
959
|
-
async (value: number) => {
|
|
960
|
-
await sliderHandler(SlidersActions.sl10, value);
|
|
961
|
-
}
|
|
962
|
-
);
|
|
963
|
-
watch(
|
|
964
|
-
() => scanState.value.Slice.SagittalLower,
|
|
965
|
-
async (value: number) => {
|
|
966
|
-
await sliderHandler(SlidersActions.sl11, value);
|
|
967
|
-
}
|
|
968
|
-
);
|
|
969
|
-
watch(
|
|
970
|
-
() => scanState.value.Orientations.Sagittal.Slice,
|
|
971
|
-
async (value: number) => {
|
|
972
|
-
await sliderHandler(SlidersActions.sl12, value);
|
|
973
|
-
}
|
|
974
|
-
);
|
|
975
|
-
watch(
|
|
976
|
-
() => scanState.value.Slice.SagittalUpper,
|
|
977
|
-
async (value: number) => {
|
|
978
|
-
await sliderHandler(SlidersActions.sl13, value);
|
|
979
|
-
}
|
|
980
|
-
);
|
|
981
|
-
watch(
|
|
982
|
-
() => scanState.value.Slice.CoronalLower,
|
|
983
|
-
async (value: number) => {
|
|
984
|
-
await sliderHandler(SlidersActions.sl14, value);
|
|
985
|
-
}
|
|
986
|
-
);
|
|
987
|
-
watch(
|
|
988
|
-
() => scanState.value.Orientations.Coronal.Slice,
|
|
989
|
-
async (value: number) => {
|
|
990
|
-
await sliderHandler(SlidersActions.sl15, value);
|
|
991
|
-
}
|
|
992
|
-
);
|
|
993
|
-
watch(
|
|
994
|
-
() => scanState.value.Slice.CoronalUpper,
|
|
995
|
-
async (value: number) => {
|
|
996
|
-
await sliderHandler(SlidersActions.sl16, value);
|
|
997
|
-
}
|
|
998
|
-
);
|
|
999
|
-
watch(
|
|
1000
|
-
() => scanState.value.InteractionSettings.PanSensivitity,
|
|
1001
|
-
async (value: number) => {
|
|
1002
|
-
await scanMovementHandler(ScanMovementActions.sm05, value);
|
|
1003
|
-
}
|
|
1004
|
-
);
|
|
1005
|
-
watch(
|
|
1006
|
-
() => scanState.value.InteractionSettings.ZoomSensitivity,
|
|
1007
|
-
async (value: number) => {
|
|
1008
|
-
await scanMovementHandler(ScanMovementActions.sm08, value);
|
|
1009
|
-
}
|
|
1010
|
-
);
|
|
1011
|
-
watch(
|
|
1012
|
-
() => scanState.value.InteractionSettings.RotateSensitivity,
|
|
1013
|
-
async (value: number) => {
|
|
1014
|
-
await scanMovementHandler(ScanMovementActions.sm10, value);
|
|
1015
|
-
}
|
|
1016
|
-
);
|
|
1017
|
-
watch(
|
|
1018
|
-
() => scanState.value.InteractionSettings.CameraRotateSensitivity,
|
|
1019
|
-
async (value: number) => {
|
|
1020
|
-
await scanMovementHandler(ScanMovementActions.sm12, value);
|
|
1021
|
-
}
|
|
1022
|
-
);
|
|
840
|
+
type WatchScanMovementType = {
|
|
841
|
+
[key in ScanMovementActions]: WatchSource<number>;
|
|
842
|
+
};
|
|
1023
843
|
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
}
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
{
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
844
|
+
//@ts-ignore
|
|
845
|
+
const watchScanMovement: WatchScanMovementType = {
|
|
846
|
+
[ScanMovementActions.sm05]: () =>
|
|
847
|
+
scanState.value.InteractionSettings.PanSensivitity,
|
|
848
|
+
[ScanMovementActions.sm08]: () =>
|
|
849
|
+
scanState.value.InteractionSettings.ZoomSensitivity,
|
|
850
|
+
[ScanMovementActions.sm10]: () =>
|
|
851
|
+
scanState.value.InteractionSettings.RotateSensitivity,
|
|
852
|
+
[ScanMovementActions.sm12]: () =>
|
|
853
|
+
scanState.value.InteractionSettings.CameraRotateSensitivity,
|
|
854
|
+
};
|
|
855
|
+
|
|
856
|
+
for (const scanMovement of Object.keys(watchScanMovement)) {
|
|
857
|
+
watch(
|
|
858
|
+
watchScanMovement[scanMovement as keyof typeof watchScanMovement],
|
|
859
|
+
async (value: number) => {
|
|
860
|
+
await payloadHandler.scanMovementHandler(
|
|
861
|
+
scanMovement as ScanMovementActions,
|
|
862
|
+
value
|
|
863
|
+
);
|
|
1043
864
|
}
|
|
1044
865
|
);
|
|
1045
866
|
}
|
|
867
|
+
|
|
1046
868
|
function getCurrentActiveView(position: PositionData): ScanView {
|
|
1047
869
|
return unref(scanState).Layout.PositionData.length !== 1
|
|
1048
870
|
? position.DefaultView
|
|
@@ -1058,16 +880,16 @@ function getViewName(index: number) {
|
|
|
1058
880
|
}
|
|
1059
881
|
async function fullscreenLayout(view: ScanView) {
|
|
1060
882
|
await layouts("lo_01");
|
|
1061
|
-
await viewSelection(`vs_0${view + 1}`);
|
|
1062
|
-
}
|
|
1063
|
-
async function scanMovementHandler(action: string, value: number) {
|
|
1064
|
-
if (unref(transactionStarted)) return;
|
|
1065
|
-
await scanMovement(action, value);
|
|
1066
|
-
}
|
|
1067
|
-
async function sliderHandler(action: string, value: number) {
|
|
1068
|
-
if (unref(transactionStarted)) return;
|
|
1069
|
-
await slider(action, value);
|
|
883
|
+
await payloadHandler.viewSelection(`vs_0${view + 1}` as ViewSelectionActions);
|
|
1070
884
|
}
|
|
885
|
+
// async function scanMovementHandler(action: string, value: number) {
|
|
886
|
+
// if (unref(transactionStarted)) return;
|
|
887
|
+
// await scanMovement(action, value);
|
|
888
|
+
// }
|
|
889
|
+
// async function sliderHandler(action: string, value: number) {
|
|
890
|
+
// if (unref(transactionStarted)) return;
|
|
891
|
+
// await slider(action, value);
|
|
892
|
+
// }
|
|
1071
893
|
|
|
1072
894
|
function closeModal() {
|
|
1073
895
|
m_closeDialog.value = false;
|
|
@@ -1079,185 +901,52 @@ function alterValue(val: boolean) {
|
|
|
1079
901
|
m_closeDialog.value = true;
|
|
1080
902
|
return;
|
|
1081
903
|
} else {
|
|
1082
|
-
|
|
1083
|
-
props.payload.Url ===
|
|
1084
|
-
"https://webgl-3dr.singular.health/test_scans/01440d4e-8b04-4b90-bb2c-698535ce16d6/CHEST.3vxl";
|
|
904
|
+
checkIsDemo(props.payload);
|
|
1085
905
|
}
|
|
1086
906
|
|
|
1087
907
|
value.value = val;
|
|
1088
908
|
}
|
|
1089
|
-
async function sendPayload(
|
|
1090
|
-
interfaceType: string,
|
|
1091
|
-
actionType: string,
|
|
1092
|
-
message: any
|
|
1093
|
-
) {
|
|
1094
|
-
await unref(web_gl)?.sendPayload(
|
|
1095
|
-
JSON.stringify({
|
|
1096
|
-
Version: "0.0.1",
|
|
1097
|
-
Interface: interfaceType,
|
|
1098
|
-
Action: actionType,
|
|
1099
|
-
Message: JSON.stringify(message),
|
|
1100
|
-
})
|
|
1101
|
-
);
|
|
1102
|
-
}
|
|
1103
909
|
async function load() {
|
|
1104
910
|
instanceLoaded.value = true;
|
|
1105
911
|
scanLoading.value = true;
|
|
1106
|
-
await sendPayload("file_management", "fm_01", props.payload);
|
|
1107
|
-
}
|
|
1108
|
-
async function viewSelection(action: string) {
|
|
1109
|
-
await sendPayload(FrontEndInterfaces.view_selection, action, emptyPayload);
|
|
912
|
+
await sendPayload(web_gl, "file_management", "fm_01", props.payload);
|
|
1110
913
|
}
|
|
914
|
+
|
|
1111
915
|
async function layouts(action: string) {
|
|
1112
916
|
if (action !== "lo_01") previousLayout.value = action;
|
|
1113
|
-
await sendPayload(FrontEndInterfaces.layout, action, emptyPayload);
|
|
917
|
+
await sendPayload(web_gl, FrontEndInterfaces.layout, action, emptyPayload);
|
|
1114
918
|
}
|
|
1115
919
|
async function snap() {
|
|
1116
920
|
emit("snap");
|
|
1117
921
|
}
|
|
1118
922
|
|
|
1119
923
|
async function setPreset(action: PresetsActions, preset: any) {
|
|
1120
|
-
await sendPayload("presets", action, preset);
|
|
924
|
+
await sendPayload(web_gl, "presets", action, preset);
|
|
1121
925
|
if (action === PresetsActions.pr02) {
|
|
1122
926
|
currentColourPreset.value = preset;
|
|
1123
927
|
}
|
|
1124
928
|
}
|
|
1125
|
-
|
|
1126
|
-
await sendPayload("sliders", action, {
|
|
1127
|
-
Version: "0.0.1",
|
|
1128
|
-
Value: toNumber(value),
|
|
1129
|
-
});
|
|
1130
|
-
}
|
|
1131
|
-
async function scanMovement(action: string, value: number) {
|
|
1132
|
-
await sendPayload(FrontEndInterfaces.scan_movement, action, {
|
|
1133
|
-
Version: "0.0.1",
|
|
1134
|
-
Value: toNumber(value),
|
|
1135
|
-
});
|
|
1136
|
-
}
|
|
929
|
+
|
|
1137
930
|
async function hoverOverCanvas(isHovering: boolean) {
|
|
1138
|
-
await sendPayload("interactivity", "in_01", {
|
|
931
|
+
await sendPayload(web_gl, "interactivity", "in_01", {
|
|
1139
932
|
Version: "0.0.1",
|
|
1140
933
|
Value: isHovering,
|
|
1141
934
|
});
|
|
1142
|
-
await sendPayload("interactivity", "in_02", {
|
|
935
|
+
await sendPayload(web_gl, "interactivity", "in_02", {
|
|
1143
936
|
Version: "0.0.1",
|
|
1144
937
|
Value: isHovering,
|
|
1145
938
|
});
|
|
1146
939
|
}
|
|
1147
|
-
async function i_scanState(_: string, message: string) {
|
|
1148
|
-
transactionStarted.value = true;
|
|
1149
|
-
scanStateIncoming.value = JSON.stringify(JSON.parse(message), null, 2);
|
|
1150
|
-
|
|
1151
|
-
setScanState(message);
|
|
1152
|
-
await nextTick();
|
|
1153
|
-
transactionStarted.value = false;
|
|
1154
|
-
}
|
|
1155
940
|
async function i_fileManagement(action: string, message: string) {
|
|
1156
|
-
if (action
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
scanStateIncoming.value = JSON.stringify(JSON.parse(message), null, 2);
|
|
1160
|
-
const obj = JSON.parse(unref(scanStateIncoming)) as InitialScanState;
|
|
1161
|
-
|
|
1162
|
-
setScanState(JSON.stringify(obj.DefaultDisplaySettings, null, 2));
|
|
1163
|
-
initialScanState.value = obj;
|
|
1164
|
-
huMinMax.value.max = obj.HuUpper;
|
|
1165
|
-
huMinMax.value.min = obj.HuLower;
|
|
1166
|
-
sMinMax.value.max = obj.XSlices;
|
|
1167
|
-
cMinMax.value.max = obj.YSlices;
|
|
1168
|
-
tMinMax.value.max = obj.ZSlices;
|
|
1169
|
-
currentColourPreset.value = obj.ColourPresets[0];
|
|
941
|
+
if (action === FileManagementActions.fm02) {
|
|
942
|
+
await setInitialScanStateFromPayload(action, message);
|
|
1170
943
|
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
}
|
|
1177
|
-
|
|
1178
|
-
import { useNotification } from "@kyvg/vue3-notification";
|
|
1179
|
-
|
|
1180
|
-
const { notify } = useNotification();
|
|
1181
|
-
|
|
1182
|
-
async function i_notifications(action: string, message: string) {
|
|
1183
|
-
const notification = JSON.parse(message) as NotificationPayload;
|
|
1184
|
-
|
|
1185
|
-
switch (notification.Action) {
|
|
1186
|
-
case InteractivityActions.in01:
|
|
1187
|
-
case InteractivityActions.in02:
|
|
1188
|
-
case InteractivityActions.in03:
|
|
1189
|
-
case InteractivityActions.in04:
|
|
1190
|
-
return;
|
|
1191
|
-
default:
|
|
944
|
+
await nextTick();
|
|
945
|
+
transactionStarted.value = false;
|
|
946
|
+
scanLoading.value = false;
|
|
947
|
+
drawerCollapsed.value = false;
|
|
948
|
+
await hoverOverCanvas(false);
|
|
1192
949
|
}
|
|
1193
|
-
if (notification.Action.startsWith("sl")) return;
|
|
1194
|
-
|
|
1195
|
-
let type = "success";
|
|
1196
|
-
switch (action) {
|
|
1197
|
-
// Muting no01
|
|
1198
|
-
case NotificationsActions.no01:
|
|
1199
|
-
type = "success";
|
|
1200
|
-
return;
|
|
1201
|
-
|
|
1202
|
-
case NotificationsActions.no02:
|
|
1203
|
-
type = "warn";
|
|
1204
|
-
break;
|
|
1205
|
-
|
|
1206
|
-
case NotificationsActions.no03:
|
|
1207
|
-
type = "error";
|
|
1208
|
-
break;
|
|
1209
|
-
|
|
1210
|
-
// Muting no04
|
|
1211
|
-
case NotificationsActions.no04:
|
|
1212
|
-
type = "info";
|
|
1213
|
-
return;
|
|
1214
|
-
}
|
|
1215
|
-
|
|
1216
|
-
notify({
|
|
1217
|
-
title: notification.Code,
|
|
1218
|
-
text: notification.Action,
|
|
1219
|
-
type,
|
|
1220
|
-
});
|
|
1221
|
-
}
|
|
1222
|
-
const isLayout2x2 = computed(() => {
|
|
1223
|
-
return (
|
|
1224
|
-
unref(scanState).Layout.PositionData.length > 1 &&
|
|
1225
|
-
unref(scanState).Layout.PositionData[0].Anchor === AnchorPoint.TOP_LEFT &&
|
|
1226
|
-
unref(scanState).Layout.PositionData[1].Anchor === AnchorPoint.TOP_RIGHT &&
|
|
1227
|
-
unref(scanState).Layout.PositionData[2].Anchor ===
|
|
1228
|
-
AnchorPoint.BOTTOM_LEFT &&
|
|
1229
|
-
unref(scanState).Layout.PositionData[3].Anchor === AnchorPoint.BOTTOM_RIGHT
|
|
1230
|
-
);
|
|
1231
|
-
});
|
|
1232
|
-
const isLayout1x3 = computed(() => {
|
|
1233
|
-
return (
|
|
1234
|
-
unref(scanState).Layout.PositionData.length > 1 &&
|
|
1235
|
-
unref(scanState).Layout.PositionData[0].Anchor === AnchorPoint.CENTER &&
|
|
1236
|
-
unref(scanState).Layout.PositionData[1].Anchor === AnchorPoint.TOP_RIGHT &&
|
|
1237
|
-
unref(scanState).Layout.PositionData[2].Anchor === AnchorPoint.RIGHT &&
|
|
1238
|
-
unref(scanState).Layout.PositionData[3].Anchor === AnchorPoint.BOTTOM_RIGHT
|
|
1239
|
-
);
|
|
1240
|
-
});
|
|
1241
|
-
|
|
1242
|
-
function getCurrentGreyscalePreset() {
|
|
1243
|
-
for (const preset of unref(initialScanState).GreyscalePresets) {
|
|
1244
|
-
if (
|
|
1245
|
-
(unref(scanState).Display.WindowLower === preset.Lower ||
|
|
1246
|
-
(preset.Lower < unref(initialScanState).HuLower &&
|
|
1247
|
-
unref(scanState).Display.WindowLower ===
|
|
1248
|
-
unref(initialScanState).HuLower)) &&
|
|
1249
|
-
(unref(scanState).Display.WindowUpper === preset.Upper ||
|
|
1250
|
-
(preset.Upper > unref(initialScanState).HuUpper &&
|
|
1251
|
-
unref(scanState).Display.WindowUpper ===
|
|
1252
|
-
unref(initialScanState).HuUpper))
|
|
1253
|
-
) {
|
|
1254
|
-
return preset.Name;
|
|
1255
|
-
}
|
|
1256
|
-
}
|
|
1257
|
-
return undefined;
|
|
1258
|
-
}
|
|
1259
|
-
function setScanState(message: string) {
|
|
1260
|
-
scanState.value = JSON.parse(message) as CurrentScanState;
|
|
1261
950
|
}
|
|
1262
951
|
|
|
1263
952
|
function handleOnPayload(
|
|
@@ -1266,13 +955,13 @@ function handleOnPayload(
|
|
|
1266
955
|
message: string
|
|
1267
956
|
) {
|
|
1268
957
|
if (interfaceSet === FrontEndInterfaces.scan_state) {
|
|
1269
|
-
|
|
958
|
+
setScanStateFromPayload(actionSet, message);
|
|
1270
959
|
}
|
|
1271
960
|
if (interfaceSet === FrontEndInterfaces.file_management) {
|
|
1272
961
|
i_fileManagement(actionSet, message);
|
|
1273
962
|
}
|
|
1274
963
|
if (interfaceSet === FrontEndInterfaces.notifications) {
|
|
1275
|
-
|
|
964
|
+
handleNotification(actionSet, message);
|
|
1276
965
|
}
|
|
1277
966
|
}
|
|
1278
967
|
|
|
@@ -1280,7 +969,6 @@ defineExpose({
|
|
|
1280
969
|
alterValue,
|
|
1281
970
|
load,
|
|
1282
971
|
handleOnPayload,
|
|
1283
|
-
setScanState,
|
|
1284
972
|
sendPayload,
|
|
1285
973
|
getIconForPreset,
|
|
1286
974
|
cSlider,
|
|
@@ -1288,16 +976,13 @@ defineExpose({
|
|
|
1288
976
|
tSlider,
|
|
1289
977
|
thresholdSlider,
|
|
1290
978
|
windowSlider,
|
|
1291
|
-
isLayout2x2,
|
|
1292
|
-
isLayout1x3,
|
|
1293
979
|
m_closeDialog,
|
|
1294
|
-
getCurrentGreyscalePreset,
|
|
1295
980
|
closeModal,
|
|
1296
981
|
snap,
|
|
1297
982
|
scanState,
|
|
1298
983
|
initialScanState,
|
|
1299
984
|
footerItems,
|
|
1300
|
-
rotateByDeg,
|
|
985
|
+
// rotateByDeg,
|
|
1301
986
|
getCurrentActiveView,
|
|
1302
987
|
getViewName,
|
|
1303
988
|
fullscreenLayout,
|