Skip to content

Commit

Permalink
Merge branch 'feat/iiif-viewer' into dev
Browse files Browse the repository at this point in the history
  • Loading branch information
katharinawuensche committed Aug 19, 2024
2 parents 5d1a676 + 5d135c2 commit 8dc379c
Show file tree
Hide file tree
Showing 11 changed files with 357 additions and 41 deletions.
5 changes: 5 additions & 0 deletions .env.local.example
Original file line number Diff line number Diff line change
Expand Up @@ -17,3 +17,8 @@ NUXT_PUBLIC_API_BASE_URL="https://sicprod.acdh-dev.oeaw.ac.at/"
# -------------------------------------------------------------------------------------------------
NUXT_PUBLIC_MATOMO_BASE_URL="https://matomo.acdh.oeaw.ac.at"
# NUXT_PUBLIC_MATOMO_ID=

# -------------------------------------------------------------------------------------------------
# IIIF
# -------------------------------------------------------------------------------------------------
NUXT_PUBLIC_IIIF_BASE_URL="https://iiif.acdh-dev.oeaw.ac.at/iiif/images/sicprod/"
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ node_modules/

# generated libs
lib/api.ts
# generated manifests
assets/manifests/

# logs
*.log
Expand Down
42 changes: 42 additions & 0 deletions components/iiif-viewer.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<script setup lang="ts">
import "tify/dist/tify.css";
import "tify";
import type { Manifest } from "@iiif/presentation-3";
const route = useRoute();
const router = useRouter();
const manifest = ref<Manifest>();
onMounted(async () => {
let manifestUrl;
const page = route.query.page;
if (typeof route.query.book === "string") {
const book = route.query.book.replaceAll(/\(|\)/g, "");
manifestUrl = await import(`~/assets/manifests/${decodeURI(book)}.json?url`);
manifest.value = await import(`~/assets/manifests/${decodeURI(book)}.json`);
}
if (manifest.value === undefined) return;
const pageIdx = manifest.value.items.findIndex((item) => item.label?.de?.[0] === page);
//@ts-expect-error no Tify export
const tify = new Tify({
container: "#tify",
manifestUrl: manifestUrl.default,
pages: [pageIdx + 1],
});
tify.ready.then(() => {
tify.viewer.addHandler("open", () => {
const page = tify.options.pages[0] ?? 1;
void router.replace({
query: { page: manifest.value?.items[page - 1]?.label?.de?.[0], book: route.query.book },
});
});
});
});
</script>

<template>
<div id="tify" class="h-full"></div>
</template>
27 changes: 22 additions & 5 deletions components/reference-button.vue
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,10 @@ import Cite from "citation-js";
import { ArrowDownToLine, BookOpenText, Copy } from "lucide-vue-next";
import type { Reference } from "@/types/resulttypes";
import { NuxtLink } from "#components";
import styleSheet from "~/assets/sicprod-style.csl?raw";
const localePath = useLocalePath();
const t = useTranslations();
const props = withDefaults(
defineProps<{
Expand Down Expand Up @@ -69,6 +71,17 @@ async function copyToClipboard() {
await navigator.clipboard.write(data);
}
function getLink(ref: Reference) {
const regexMatch = [...ref.scan_path.matchAll(/(.*?)\/(.*?).jpg/g)][0];
return {
path: localePath("/iiif"),
query: {
book: regexMatch[1] ?? "",
page: regexMatch[2] ?? "",
},
};
}
</script>

<template>
Expand All @@ -92,7 +105,6 @@ async function copyToClipboard() {
ref="floating"
class="z-10 max-h-96 max-w-72 cursor-auto overflow-auto rounded-lg shadow-lg ring-1 ring-black/5"
:style="{ ...floatingStyles }"
@click.stop.prevent
>
<div class="overflow-auto bg-neutral-50 p-4 text-sm dark:bg-neutral-800">
<div class="ml-auto flex w-fit gap-2">
Expand All @@ -106,13 +118,18 @@ async function copyToClipboard() {
<Copy class="size-4 transition-transform hover:scale-125" />
</button>
</div>
<div
<component
:is="references[idx].scan_path ? NuxtLink : 'div'"
v-for="(entry, idx) in citation"
:key="entry"
class="py-2"
:to="getLink(references[idx])"
target="_blank"
class="block py-2"
:class="{ 'border-b-2 dark:border-neutral-700': idx < citation.length - 1 }"
v-html="entry.format('bibliography', citationConfig)"
></div>
@click.stop
>
<span v-html="entry.format('bibliography', citationConfig)"></span>
</component>
</div>
</PopoverPanel>
</Transition>
Expand Down
39 changes: 22 additions & 17 deletions messages/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,18 @@
"title": "Etwas ist schief gelaufen!",
"try-again": "Erneut versuchen"
},
"FamilyTree": {
"siblings": "Geschwister",
"partner": "Ehepartner:in",
"children": "Kinder",
"parents": "Eltern",
"show-all-children": "Zeige alle {count} Kinder",
"show-all-siblings": "Zeige alle {count} Geschwister",
"collapse-children": "Kinder einklappen",
"collapse-siblings": "Geschwister einklappen",
"is-descendant-of": "Nachkomme",
"legend": "Legende"
},
"ImprintPage": {
"meta": {
"title": "Impressum"
Expand Down Expand Up @@ -139,8 +151,17 @@
"gender": "Geschlecht",
"type": "Typ"
}
},
"iiif": {
"title": "IIIF Viewer"
}
},
"References": {
"download-bibtex": "Bibtex herunterladen",
"open-scan": "Scan anzeigen",
"copy-to-clipboard": "In die Zwischenablage kopieren",
"references": "Referenzen"
},
"Relations": {
"function": {
"name": "Beziehung",
Expand Down Expand Up @@ -191,23 +212,7 @@
"end_date_written": "Bis"
}
},
"References": {
"download-bibtex": "Bibtex herunterladen",
"copy-to-clipboard": "In die Zwischenablage kopieren",
"references": "Referenzen"
},
"FamilyTree": {
"siblings": "Geschwister",
"partner": "Ehepartner:in",
"children": "Kinder",
"parents": "Eltern",
"show-all-children": "Zeige alle {count} Kinder",
"show-all-siblings": "Zeige alle {count} Geschwister",
"collapse-children": "Kinder einklappen",
"collapse-siblings": "Geschwister einklappen",
"is-descendant-of": "Nachkomme",
"legend": "Legende"
},

"Timeline": {
"timeline": "Zeitleiste"
},
Expand Down
38 changes: 21 additions & 17 deletions messages/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,18 @@
"title": "Something went wrong!",
"try-again": "Try again"
},
"FamilyTree": {
"siblings": "Siblings",
"partner": "Partner",
"children": "Children",
"parents": "Parents",
"show-all-children": "Show all {count} children",
"show-all-siblings": "Show all {count} siblings",
"collapse-children": "Collapse children",
"collapse-siblings": "Collapse siblings",
"is-descendant-of": "Descendant",
"legend": "Legend"
},
"ImprintPage": {
"meta": {
"title": "Imprint"
Expand Down Expand Up @@ -139,8 +151,17 @@
"gender": "Gender",
"type": "Type"
}
},
"iiif": {
"title": "IIIF Viewer"
}
},
"References": {
"copy-to-clipboard": "Copy to clipboard",
"download-bibtex": "Download Bibtex",
"open-scan": "Scan anzeigen",
"references": "References"
},
"Relations": {
"function": {
"name": "Relation",
Expand Down Expand Up @@ -191,23 +212,6 @@
"end_date_written": "To"
}
},
"References": {
"download-bibtex": "Download Bibtex",
"copy-to-clipboard": "Copy to clipboard",
"references": "References"
},
"FamilyTree": {
"siblings": "Siblings",
"partner": "Partner",
"children": "Children",
"parents": "Parents",
"show-all-children": "Show all {count} children",
"show-all-siblings": "Show all {count} siblings",
"collapse-children": "Collapse children",
"collapse-siblings": "Collapse siblings",
"is-descendant-of": "Descendant",
"legend": "Legend"
},
"Timeline": {
"timeline": "Timeline"
},
Expand Down
8 changes: 6 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
"lint:code:fix": "pnpm run lint:code:check --fix",
"lint:styles:check": "stylelint \"./**/*.@(css|vue)\" --cache --ignore-path ./.gitignore",
"lint:styles:fix": "pnpm run lint:styles:check --fix",
"postinstall": "nuxt prepare && pnpm run createclient",
"postinstall": "nuxt prepare && pnpm run createclient && pnpm run generatemanifest",
"preinstall": "npx only-allow pnpm",
"prepare": "run-s setup",
"setup": "is-ci || simple-git-hooks",
Expand All @@ -32,14 +32,17 @@
"test:e2e:ui": "playwright test --ui",
"types:check": "nuxt typecheck",
"validate": "run-p format:check lint:check types:check test test:e2e",
"createclient": "dotenv -c -- tsx ./scripts/generate-api-client.ts"
"createclient": "dotenv -c -- tsx ./scripts/generate-api-client.ts",
"generatemanifest": "dotenv -c -- tsx ./scripts/generate-iiif-manifest.ts"
},
"dependencies": {
"@acdh-oeaw/lib": "^0.1.7",
"@floating-ui/vue": "^1.0.6",
"@fontsource-variable/inter": "^5.0.17",
"@headlessui/tailwindcss": "^0.2.0",
"@headlessui/vue": "^1.7.19",
"@iiif/builder": "^2.0.1",
"@iiif/presentation-3": "^2.2.3",
"@jsplumb/browser-ui": "^6.2.10",
"@nuxt/content": "^2.12.1",
"@nuxt/image": "^1.4.0",
Expand All @@ -59,6 +62,7 @@
"openapi-zod-client": "^1.16.2",
"pino-http": "^9.0.0",
"satori": "^0.10.13",
"tify": "^0.31.0",
"vue": "^3.4.21",
"vue-i18n": "^9.10.1",
"vue-i18n-routing": "^1.2.0",
Expand Down
15 changes: 15 additions & 0 deletions pages/iiif.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<script setup lang="ts">
import IiifViewer from "@/components/iiif-viewer.vue";
definePageMeta({
title: "Pages.iiif.title",
});
</script>

<template>
<main>
<ClientOnly>
<IiifViewer></IiifViewer>
</ClientOnly>
</main>
</template>
Loading

0 comments on commit 8dc379c

Please sign in to comment.