Downloads sample images

Dockerfile

@@ -17,11 +17,13 @@ RUN pip install huggingface_hub
 # Create models directory
 RUN mkdir -p /models
 
-# Download models from seamo-ai/marina-species-v1
+# Download models and sample images from seamo-ai/marina-species-v1
 RUN python -c "\
 from huggingface_hub import hf_hub_download; \
 hf_hub_download('seamo-ai/marina-species-v1', 'marina-benthic-33k.pt', local_dir='/models', local_dir_use_symlinks=False); \
-hf_hub_download('seamo-ai/marina-species-v1', 'marina-benthic-33k.names', local_dir='/models', local_dir_use_symlinks=False)"
+hf_hub_download('seamo-ai/marina-species-v1', 'marina-benthic-33k.names', local_dir='/models', local_dir_use_symlinks=False); \
+hf_hub_download('seamo-ai/marina-species-v1', 'images/red_fish.png', local_dir='/models', local_dir_use_symlinks=False); \
+hf_hub_download('seamo-ai/marina-species-v1', 'images/red_fish_2.png', local_dir='/models', local_dir_use_symlinks=False)"
 
 # Stage 2: Build the application
 FROM python:3.10-slim
@@ -71,6 +73,11 @@ COPY --chown=user ./app app
 COPY --chown=user ./templates templates
 COPY --chown=user ./static static
 
+# Copy sample images from models to static directory for web access
+RUN mkdir -p static/images/samples
+RUN cp $HOME/app/models/images/red_fish.png static/images/samples/
+RUN cp $HOME/app/models/images/red_fish_2.png static/images/samples/
+
 # Create necessary directories
 RUN mkdir -p $HOME/.cache/huggingface $HOME/.cache/torch
 

static/css/dashboard-simple.css

@@ -6,23 +6,7 @@
   padding: 20px;
 }
 
-.page-header {
-  text-align: center;
-  margin-bottom: 40px;
-}
 
-.page-header h1 {
-  font-size: 2rem;
-  margin-bottom: 10px;
-  color: #111827;
-}
-
-.page-description {
-  font-size: 1.125rem;
-  color: #6b7280;
-  max-width: 600px;
-  margin: 0 auto;
-}
 
 /* Status Banner */
 .status-banner {

static/js/dashboard.js

@@ -248,12 +248,12 @@ class MarineDashboard {
         const sampleImages = [
             {
                 name: 'red_fish.png',
-                url: 'https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/red_fish.png',
+                url: 'https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/images/red_fish.png',
                 description: 'Marine Fish Sample'
             },
             {
                 name: 'red_fish_2.png',
-                url: 'https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/red_fish_2.png',
+                url: 'https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/images/red_fish_2.png',
                 description: 'Deep Sea Sample'
             }
         ];
@@ -272,8 +272,24 @@ class MarineDashboard {
             // Show loading state
             window.MarineAPI.utils.showNotification('Loading sample image...', 'info');
 
+            let finalUrl = imageUrl;
+
+            // Try local URL first, fallback to HuggingFace if needed
+            try {
+                const testResponse = await fetch(imageUrl, { method: 'HEAD' });
+                if (!testResponse.ok) {
+                    finalUrl = `https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/images/${imageName}`;
+                }
+            } catch (e) {
+                finalUrl = `https://huggingface.co/seamo-ai/marina-species-v1/resolve/main/images/${imageName}`;
+            }
+
             // Fetch the image
-            const response = await fetch(imageUrl);
+            const response = await fetch(finalUrl);
+            if (!response.ok) {
+                throw new Error(`Failed to fetch image: ${response.status}`);
+            }
+
             const blob = await response.blob();
 
             // Convert to File object
@@ -285,7 +301,7 @@ class MarineDashboard {
             window.MarineAPI.utils.showNotification('Sample image loaded successfully!', 'success');
         } catch (error) {
             console.error('Failed to load sample image:', error);
-            window.MarineAPI.utils.showNotification('Failed to load sample image', 'error');
+            window.MarineAPI.utils.showNotification('Failed to load sample image. Please try uploading your own image.', 'error');
         }
     }
 }

templates/dashboard.html

@@ -9,10 +9,7 @@
 
 {% block content %}
 <div class="dashboard">
-    <!-- Page Header -->
-    <div class="page-header">
-        <h1>Species Identification</h1>
-    </div>
+
 
     <!-- API Status Banner -->
     <div class="status-banner" id="statusBanner">