diff --git a/components/content/MolstarPdbePlugin.vue b/components/content/MolstarPdbePlugin.vue index 114d01c68990afb6a18bc8e9ee0c06cb0cb1e5e7..dc6457047fd354959fdd4125ca96a5bf3ffa82d5 100644 --- a/components/content/MolstarPdbePlugin.vue +++ b/components/content/MolstarPdbePlugin.vue @@ -2,10 +2,6 @@ import { withTrailingSlash, withLeadingSlash, joinURL } from 'ufo' import { useRuntimeConfig, computed } from '#imports' -import * as d3 from "d3"; -import * as Plot from "@observablehq/plot"; -import PlotFigure from "~/components/PlotFigure"; - import { useDisplay } from "vuetify"; export interface Props { @@ -18,7 +14,7 @@ export interface Props { -const { mobile } = useDisplay() +const { mobile, width, height } = useDisplay() const refinedDataUrls = computed(() => { function refinedUrl(url: string) { @@ -59,7 +55,6 @@ const props = withDefaults(defineProps<Props>(), { dataUrl: undefined }) -const { width, height } = useDisplay() const maxWidth = ref(1500) diff --git a/components/content/PdbeMolstarPlugin.vue b/components/content/PdbeMolstarPlugin.vue index bb1a3cee5973822db5331be5611d33a6629bf64a..5fd1b3fa5fa357505a51a073a48ffbca074f4ea6 100644 --- a/components/content/PdbeMolstarPlugin.vue +++ b/components/content/PdbeMolstarPlugin.vue @@ -1,9 +1,14 @@ <script setup lang="ts"> import { withTrailingSlash, withLeadingSlash, joinURL } from 'ufo' import { useRuntimeConfig, computed, toValue } from '#imports' +import { useDisplay } from "vuetify"; + import type { MaybeRef } from "vue" import FoldseekDialog from '../FoldseekDialog.vue' +const { mobile, width, height } = useDisplay() + + useHead({ link: [ { @@ -48,6 +53,15 @@ const selectedPdb: Ref<string | null> = ref(null) const structureToDownload: Ref<string | null> = ref(null) +const computedWidth = computed(() => { + // if (toValue(width) > toValue(maxWidth)) return toValue(maxWidth) / 1.5 + return toValue(width) / 1.5 +}) + +const computedHeight = computed(() => { + return height.value - 250 +}) + function refinedUrl(url: string) { if (url?.startsWith('/') && !url.startsWith('//')) { const _base = withLeadingSlash(withTrailingSlash(useRuntimeConfig().app.baseURL))