feat: IIIF-native Sprints 4-5-6 — tiled zoom, exports, cleanup

Sprint IIIF-4 — Frontend tiled zoom:
- Viewer.tsx: new props iiifServiceUrl + fallbackImageUrl. When
iiifServiceUrl is set, opens via info.json for native IIIF tiled
zoom (progressive tile loading). Falls back to simple image loading.
Added crossOriginPolicy for CORS-enabled IIIF servers.
- Reader.tsx: passes iiif_service_url from page data to Viewer.
- Editor.tsx: passes iiif_service_url from master ImageInfo to Viewer.

Sprint IIIF-5 — Exports with IIIF URLs:
- iiif.py: generated manifest now includes "service" block on annotation
body when iiif_service_url is set (ImageService3, level2). Any IIIF
viewer (Mirador, Universal Viewer) can use tiled zoom.
- mets.py: fileSec uses IIIF URLs (LOCTYPE="URL") for master and
derivative when iiif_service_url available. Legacy filepath fallback.
- alto.py: fileName prefers iiif_service_url over local paths.

Sprint IIIF-6 — Documentation:
- CLAUDE.md: updated data/ directory notes explaining that masters/,
derivatives/, thumbnails/ are empty in IIIF-native mode.

585 tests pass, 0 regressions. TypeScript clean.

https://claude.ai/code/session_01UB4he7RdRPHLvNjky4X8Sw

CLAUDE.md

@@ -159,9 +159,12 @@ iiif-studio/
 ├── data/                            ← JAMAIS versionné (.gitignore)
 │   └── corpora/
 │       └── {corpus_slug}/
-│           ├── masters/             ← images sources originales
-│           ├── derivatives/         ← JPEG 1500px pour l'IA
-│           ├── thumbnails/          ← aperçus 300px
+│           ├── masters/             ← images uploadées (mode fichier uniquement)
+│           ├── derivatives/         ← JPEG 1500px (mode fichier uniquement)
+│           ├── thumbnails/          ← aperçus 300px (mode fichier uniquement)
+│           │   NOTE : en mode IIIF natif, masters/, derivatives/ et
+│           │   thumbnails/ sont VIDES — les images sont streamées
+│           │   depuis le serveur IIIF d'origine.
 │           ├── iiif/
 │           │   ├── manifest.json
 │           │   └── annotations/

backend/app/services/export/alto.py

@@ -160,7 +160,7 @@ def generate_alto(master: PageMaster) -> str:
     etree.SubElement(desc, _a("MeasurementUnit")).text = "pixel"
 
     src_info = etree.SubElement(desc, _a("sourceImageInformation"))
-    file_name = master.image.master or master.image.derivative_web or master.page_id
+    file_name = master.image.iiif_service_url or master.image.master or master.image.derivative_web or master.page_id
     etree.SubElement(src_info, _a("fileName")).text = str(file_name)
 
     if master.processing:

backend/app/services/export/iiif.py

@@ -108,6 +108,23 @@ def generate_manifest(
         annotation_page_id = f"{canvas_id}/annotation-page/1"
         annotation_id      = f"{canvas_id}/annotation/painting"
         image_url          = page.image.master or ""
+        iiif_svc           = page.image.iiif_service_url
+
+        # Corps de l'annotation painting
+        body: dict = {
+            "id":     image_url,
+            "type":   "Image",
+            "format": "image/jpeg",
+            "width":  width,
+            "height": height,
+        }
+        # Si un IIIF Image Service est connu, le déclarer (zoom tuilé natif)
+        if iiif_svc:
+            body["service"] = [{
+                "id":      iiif_svc,
+                "type":    "ImageService3",
+                "profile": "level2",
+            }]
 
         canvas: dict = {
             "id":     canvas_id,
@@ -124,14 +141,8 @@ def generate_manifest(
                             "id":         annotation_id,
                             "type":       "Annotation",
                             "motivation": "painting",
-                            "body": {
-                                "id":     image_url,
-                                "type":   "Image",
-                                "format": "image/jpeg",
-                                "width":  width,
-                                "height": height,
-                            },
-                            "target": canvas_id,
+                            "body":       body,
+                            "target":     canvas_id,
                         }
                     ],
                 }

backend/app/services/export/mets.py

@@ -178,20 +178,28 @@ def generate_mets(
     for page in pages:
         sid = _safe_id(page.page_id)
 
-        # master image
+        # master image (IIIF service URL ou URL statique)
+        master_url = page.image.iiif_service_url or page.image.master or ""
+        if page.image.iiif_service_url:
+            master_url = f"{page.image.iiif_service_url}/full/max/0/default.jpg"
         f_master = _el(grp_master, f"{_M}file", {"ID": f"IMG_MASTER_{sid}", "MIMETYPE": "image/jpeg"})
         _el(f_master, f"{_M}FLocat", {
             "LOCTYPE": "URL",
-            f"{_XL}href": page.image.master or "",
+            f"{_XL}href": master_url,
             f"{_XL}type": "simple",
         })
 
-        # dérivé web
+        # dérivé web (URL IIIF 1500px ou chemin local legacy)
+        if page.image.iiif_service_url:
+            deriv_href = f"{page.image.iiif_service_url}/full/!1500,1500/0/default.jpg"
+            deriv_loctype_attrs = {"LOCTYPE": "URL"}
+        else:
+            deriv_href = page.image.derivative_web or ""
+            deriv_loctype_attrs = {"LOCTYPE": "OTHER", "OTHERLOCTYPE": "filepath"}
         f_deriv = _el(grp_deriv, f"{_M}file", {"ID": f"IMG_DERIV_{sid}", "MIMETYPE": "image/jpeg"})
         _el(f_deriv, f"{_M}FLocat", {
-            "LOCTYPE": "OTHER",
-            "OTHERLOCTYPE": "filepath",
-            f"{_XL}href": page.image.derivative_web or "",
+            **deriv_loctype_attrs,
+            f"{_XL}href": deriv_href,
             f"{_XL}type": "simple",
         })
 

frontend/src/components/Viewer.tsx

@@ -3,14 +3,16 @@ import OpenSeadragon from 'openseadragon'
 import { RetroButton } from './retro'
 
 interface Props {
-  imageUrl: string
+  /** URL du IIIF Image Service (zoom tuilé natif) */
+  iiifServiceUrl?: string | null
+  /** URL image statique (fallback si pas de service IIIF) */
+  fallbackImageUrl?: string | null
   onViewerReady?: (viewer: OpenSeadragon.Viewer) => void
 }
 
-const Viewer: FC<Props> = ({ imageUrl, onViewerReady }) => {
+const Viewer: FC<Props> = ({ iiifServiceUrl, fallbackImageUrl, onViewerReady }) => {
   const containerRef = useRef<HTMLDivElement>(null)
   const viewerRef = useRef<OpenSeadragon.Viewer | null>(null)
-  // Ref pour toujours accéder au callback le plus récent (évite stale closure)
   const onViewerReadyRef = useRef(onViewerReady)
   onViewerReadyRef.current = onViewerReady
 
@@ -25,6 +27,7 @@ const Viewer: FC<Props> = ({ imageUrl, onViewerReady }) => {
       animationTime: 0.3,
       minZoomLevel: 0.1,
       maxZoomLevel: 20,
+      crossOriginPolicy: 'Anonymous',
     })
 
     viewerRef.current = viewer
@@ -35,15 +38,25 @@ const Viewer: FC<Props> = ({ imageUrl, onViewerReady }) => {
     }
   }, [])
 
+  // Source à ouvrir : préférer le service IIIF (zoom tuilé), sinon image statique
+  const source = iiifServiceUrl || fallbackImageUrl || ''
+
   useEffect(() => {
     const viewer = viewerRef.current
-    if (!viewer || !imageUrl) return
+    if (!viewer || !source) return
+
+    if (iiifServiceUrl) {
+      // Zoom tuilé natif — OpenSeadragon fetch info.json et configure les tuiles
+      viewer.open(iiifServiceUrl + '/info.json')
+    } else {
+      // Image statique simple (pas de zoom tuilé)
+      viewer.open({ type: 'image', url: source })
+    }
 
-    viewer.open({ type: 'image', url: imageUrl })
     viewer.addOnceHandler('open', () => {
       onViewerReadyRef.current?.(viewer)
     })
-  }, [imageUrl])
+  }, [source, iiifServiceUrl])
 
   return (
     <div className="relative w-full h-full bg-retro-black">

frontend/src/pages/Editor.tsx

@@ -154,7 +154,8 @@ export default function Editor() {
     )
   }
 
-  const imageUrl = master?.image?.derivative_web ?? master?.image?.master ?? ''
+  const iiifServiceUrl = master?.image?.iiif_service_url ?? null
+  const fallbackImageUrl = master?.image?.derivative_web ?? master?.image?.master ?? ''
   const regions = master?.layout?.regions ?? []
 
   return (
@@ -194,8 +195,8 @@ export default function Editor() {
           className="flex-1 min-w-0"
         >
           <div className="relative w-full h-full">
-            <Viewer imageUrl={imageUrl} onViewerReady={() => {}} />
-            {!imageUrl && (
+            <Viewer iiifServiceUrl={iiifServiceUrl} fallbackImageUrl={fallbackImageUrl} onViewerReady={() => {}} />
+            {!iiifServiceUrl && !fallbackImageUrl && (
               <div className="absolute inset-0 flex items-center justify-center bg-retro-gray text-retro-darkgray text-retro-sm">
                 Apercu non disponible
               </div>

frontend/src/pages/Reader.tsx

@@ -122,7 +122,8 @@ export default function Reader() {
   }
 
   const currentPage = pages[currentIndex]
-  const imageUrl = currentPage.image_master_path ?? ''
+  const iiifServiceUrl = currentPage.iiif_service_url ?? null
+  const fallbackImageUrl = currentPage.image_master_path ?? ''
   const regions: Region[] = master?.layout?.regions ?? []
 
   return (
@@ -168,12 +169,12 @@ export default function Reader() {
           statusBar={
             master
               ? `${master.editorial.status} — v${master.editorial.version}`
-              : imageUrl ? 'Page non analysee' : 'Aucune image'
+              : (iiifServiceUrl || fallbackImageUrl) ? 'Page non analysee' : 'Aucune image'
           }
           className="flex-[7] min-w-0"
         >
           <div className="relative w-full h-full">
-            <Viewer imageUrl={imageUrl} onViewerReady={handleViewerReady} />
+            <Viewer iiifServiceUrl={iiifServiceUrl} fallbackImageUrl={fallbackImageUrl} onViewerReady={handleViewerReady} />
             <RegionOverlay
               viewer={osdViewer}
               regions={regions}
@@ -211,7 +212,7 @@ export default function Reader() {
             )}
 
             {/* Not analyzed / error badge */}
-            {!master && !loading && imageUrl && (
+            {!master && !loading && (iiifServiceUrl || fallbackImageUrl) && (
               <div className="absolute top-2 left-2">
                 {masterError
                   ? <RetroBadge variant="error">Erreur: {masterError}</RetroBadge>
@@ -261,7 +262,7 @@ export default function Reader() {
               </div>
             ) : (
               <div className="p-3 text-retro-sm text-retro-darkgray">
-                {imageUrl
+                {(iiifServiceUrl || fallbackImageUrl)
                   ? 'Page non encore analysee par l\'IA.'
                   : 'Aucune image associee a cette page.'
                 }