Feature/image support

Makefile

@@ -0,0 +1,20 @@
+ifeq ($(OS),Windows_NT)
+PYTHON := py -3
+BACKEND_PYTHON := venv/Scripts/python.exe
+NPM := npm.cmd
+else
+PYTHON := python3
+BACKEND_PYTHON := venv/bin/python3
+NPM := npm
+endif
+
+.PHONY: dev backend frontend
+
+dev:
+	$(PYTHON) scripts/dev_runner.py
+
+backend:
+	cd backend && $(BACKEND_PYTHON) app.py
+
+frontend:
+	cd frontend && $(NPM) start

backend/README.md

@@ -82,6 +82,28 @@ The server will start on `http://localhost:8000`
 - **PUT** `/api/study_spots/<id>` - Update a study spot (send only fields to update)
 - **DELETE** `/api/study_spots/<id>` - Delete a study spot
 
+`GET /api/study_spots*` responses return `pictures` as backend image API URLs in the format:
+`/api/study_spots/<id>/images/<image_index>`
+
+### Images
+- **GET** `/api/study_spots/<id>/images/<image_index>` - Proxy an image by study spot ID and picture index (recommended for frontend use)
+- **GET** `/api/image_proxy?url=<encoded_remote_url>` - Proxy a remote image URL directly (useful for one-off testing/debugging)
+
+### Uploading and Accessing Images
+This backend stores image **URLs** in the database (it does not accept raw image file uploads).
+
+1. Host each image at a publicly accessible URL (Google Drive public links are supported and normalized).
+2. Create or update a study spot with those URLs in the `pictures` array via:
+   - `POST /api/study_spots`
+   - `PUT /api/study_spots/<id>`
+3. Read the study spot from:
+   - `GET /api/study_spots`
+   - `GET /api/study_spots/<id>`
+4. Use each returned `pictures` value directly in the frontend. These values are backend API endpoints like:
+   - `http://localhost:8000/api/study_spots/1/images/0`
+5. Optional: For a specific source URL, you can also access it through:
+   - `GET /api/image_proxy?url=<encoded_remote_url>`
+
 ## Database
 
 The application uses SQLite by default for development. The database file will be created automatically as `longhorn_studies.db` when you first run the application.
@@ -125,3 +147,11 @@ The application runs in debug mode by default for development. For production:
    pip install gunicorn
    gunicorn app:app
    ```
+
+To normalize existing image links in the database:
+
+```bash
+cd backend
+source venv/bin/activate
+python scripts/normalize_picture_links.py
+```

backend/app.py

@@ -43,4 +43,4 @@
     # WARNING: Debug mode should be disabled in production
     # Set FLASK_ENV=production in .env for production deployment
     debug_mode = os.getenv('FLASK_ENV', 'development') != 'production'
-    app.run(debug=debug_mode, host='0.0.0.0', port=8000)
+    app.run(debug=debug_mode, host='0.0.0.0', port=8000, threaded=True)

backend/models.py

@@ -1,4 +1,5 @@
 from database import db
+from url_utils import normalize_picture_urls
 
 
 def default_access_hours():
@@ -39,7 +40,7 @@ def to_dict(self):
             'address': self.address,
             'floor': self.floor,
             'tags': self.tags if self.tags is not None else [],
-            'pictures': self.pictures if self.pictures is not None else [],
+            'pictures': normalize_picture_urls(self.pictures),
             'noise_level': self.noise_level,
             'capacity': self.capacity,
             'spot_type': self.spot_type if self.spot_type is not None else [],