diff --git a/Makefile b/Makefile index b56dc27..3ccb394 100644 --- a/Makefile +++ b/Makefile @@ -1,5 +1,10 @@ default: start dev: start +# Use PORT environment variable if set, otherwise default to 8080 +PORT ?= 8080 +# Log file for daemonized uWSGI +LOGFILE ?= uwsgi.log + start: python3 -m venv venv - . venv/bin/activate && pip install -r requirements.txt && uwsgi --http :8080 --wsgi-file backend.py --callable app \ No newline at end of file + . venv/bin/activate && pip install -r requirements.txt && uwsgi --http :$(PORT) --wsgi-file backend.py --callable app \ No newline at end of file diff --git a/backend.py b/backend.py index 7f36ad7..fb86c36 100644 --- a/backend.py +++ b/backend.py @@ -7,6 +7,7 @@ It initializes the Falcon application and sets up the routes. """ import sys +import os import falcon # Import utility modules @@ -41,6 +42,11 @@ def create_app(): RateLimitMiddleware() ]) + # Add static file serving + logger.info("Setting up static file serving") + static_dir = os.path.abspath(os.path.join(os.path.dirname(__file__), 'oedb', 'resources', 'demo', 'static')) + app.add_static_route('/static/', static_dir) + # Check database connection before continuing if not check_db_connection(): logger.error("Cannot start server - PostgreSQL database is not responding") diff --git a/doc/demo_endpoint.md b/doc/demo_endpoint.md index 811b7de..1a41a26 100644 --- a/doc/demo_endpoint.md +++ b/doc/demo_endpoint.md @@ -93,17 +93,36 @@ The traffic jam reporting page (`/demo/traffic`) provides a specialized form for #### OpenStreetMap Authentication -The traffic jam reporting page includes OAuth2 authentication with OpenStreetMap: +All demo pages include OAuth2 authentication with OpenStreetMap: -- Users can authenticate with their OpenStreetMap account +- Users can authenticate with their OpenStreetMap account on any demo page +- Authentication state is shared across all demo pages using localStorage - After authentication, the user's OSM username and a link to their profile are displayed -- When submitting a traffic jam report, the OSM username is included in the event properties as `reporter:osm` +- When submitting reports or creating events, the OSM username is included in the event properties as `reporter:osm` - OAuth2 configuration parameters are stored in the `.env` file: - `CLIENT_ID`: The OAuth2 client ID for the application - `CLIENT_SECRET`: The OAuth2 client secret for the application - `CLIENT_AUTORIZATIONS`: The permissions requested (default: "read_prefs") - `CLIENT_REDIRECT`: The redirect URL after authentication +#### Common Styling + +All demo pages share a common CSS style for consistent look and feel: + +- Common CSS file located at `/static/demo/demo_styles.css` +- Improved styling for the OpenStreetMap login button +- Consistent styling for forms, buttons, and other UI elements +- Responsive design for better mobile experience + +#### JavaScript Modules + +The demo pages use JavaScript modules for shared functionality: + +- Authentication module located at `/static/demo/demo_auth.js` +- Handles OAuth2 authentication flow with OpenStreetMap +- Stores and retrieves authentication information in localStorage +- Provides methods for checking authentication status and getting user information + ## Future Improvements Potential future improvements for the demo pages: diff --git a/oedb/resources/demo/demo_main.py b/oedb/resources/demo/demo_main.py index 8e91b16..d7484ca 100644 --- a/oedb/resources/demo/demo_main.py +++ b/oedb/resources/demo/demo_main.py @@ -26,6 +26,16 @@ class DemoMainResource: # Set content type to HTML resp.content_type = 'text/html' + # Load environment variables from .env file for OAuth2 configuration + from oedb.utils.db import load_env_from_file + load_env_from_file() + + # Get OAuth2 configuration parameters + import os + client_id = os.getenv("CLIENT_ID", "") + client_secret = os.getenv("CLIENT_SECRET", "") + client_redirect = os.getenv("CLIENT_REDIRECT", "") + # Create HTML response with MapLibre map html = """ @@ -37,7 +47,9 @@ class DemoMainResource: + + - - -
-Logged in as {osm_username}
- - - -Authenticate with your OpenStreetMap account to include your username in the traffic report.
- - - Login with OpenStreetMap - - """ - - # Add the rest of the HTML template - html_footer = """ -