diff --git a/.dockerignore b/.dockerignore index 187c53d..c152b46 100644 --- a/.dockerignore +++ b/.dockerignore @@ -7,8 +7,10 @@ node_modules/ npm-debug.log yarn-debug.log yarn-error.log +Dockerfile # Development files +.dockerignore .editorconfig .eslintrc .stylelintrc @@ -18,8 +20,7 @@ yarn-error.log *.swp *.swo -# Documentation -docs/ +# docs/ README.md LICENSE CHANGELOG.md @@ -45,11 +46,13 @@ dist/ build/ # Environment files -.env +# We need .env for our application +#.env .env.* -*.env + # Project specific files -screenshots/ labels.example -virt-game-timer.service \ No newline at end of file +virt-game-timer.service +package.json +package-lock.json \ No newline at end of file diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..f5ea3f5 --- /dev/null +++ b/.env.example @@ -0,0 +1,12 @@ +# Environment Variables Example for Game Timer Application +# Copy this file to .env and fill in your own values + +# Public VAPID key for push notifications +# Generate your own VAPID keys for production: +# https://github.com/web-push-libs/web-push#generatevapidkeys +PUBLIC_VAPID_KEY=your_public_vapid_key_here + +# Backend URL for your push notification server +BACKEND_URL=https://your-push-server.example.com + +# Other environment variables can be added here \ No newline at end of file diff --git a/Dockerfile b/Dockerfile index 496b523..d51d60d 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,12 +1,14 @@ -# Use the official Nginx image as the base image +# Use a lightweight server FROM nginx:alpine -# Remove the default Nginx static files -RUN rm -rf /usr/share/nginx/html/* +# Set working directory +WORKDIR /usr/share/nginx/html -# Copy public directory contents into the Nginx directory -COPY public/ /usr/share/nginx/html/ -COPY src/ /usr/share/nginx/html/src/ +# Copy all the application files +COPY . . + +# Copy the .env file +COPY .env . # Expose port 80 EXPOSE 80 diff --git a/README.md b/README.md index bfb4fb0..79110fa 100644 --- a/README.md +++ b/README.md @@ -6,27 +6,57 @@ Multi-player game-timer timer with carousel navigation ``` game-timer/ -├── docs/ # Documentation and project resources -│ └── screenshots/ # Application screenshots -├── public/ # Static assets and public-facing resources -│ ├── css/ # CSS stylesheets -│ ├── images/ # Images used by the application -│ ├── icons/ # App icons for PWA -│ ├── audio/ # Audio files -│ ├── index.html # Main HTML entry point -│ ├── manifest.json # PWA manifest -│ └── sw.js # Service Worker -├── src/ # Source code -│ └── js/ # JavaScript files -│ ├── core/ # Core application logic -│ ├── ui/ # UI-related code -│ ├── services/ # External services integration -│ └── utils/ # Utility functions -├── Dockerfile # Docker container definition -├── .dockerignore # Files to exclude from Docker build -└── package.json # Project metadata and dependencies +├── css/ # CSS stylesheets +├── icons/ # App icons +├── images/ # Image assets +├── js/ # Symbolic link to src/js for compatibility +├── index.html # Main HTML entry point +├── manifest.json # PWA manifest +├── sw.js # Service Worker +├── src/ # Source code +│ └── js/ # JavaScript files +│ ├── core/ # Core application logic +│ ├── ui/ # UI-related code +│ └── services/ # External services integration +├── Dockerfile # Docker container definition (nginx) +├── .dockerignore # Files to exclude from Docker build +├── .env # Environment variables for production +├── .env.example # Example environment variables template +└── package.json # Project metadata and deployment scripts ``` +## Environment Variables + +The application uses environment variables for configuration. These are loaded from a `.env` file at runtime. + +### Setting Up Environment Variables + +1. Copy `.env.example` to `.env`: + ```bash + cp .env.example .env + ``` + +2. Edit the `.env` file with your own values: + ``` + # Public VAPID key for push notifications + PUBLIC_VAPID_KEY=your_public_vapid_key_here + + # Backend URL for push notifications + BACKEND_URL=https://your-push-server.example.com + ``` + +3. For security, never commit your `.env` file to version control. It's already included in `.gitignore`. + +### Generating VAPID Keys + +For push notifications, you need to generate your own VAPID keys: + +```bash +npx web-push generate-vapid-keys +``` + +Use the public key in your `.env` file and keep the private key secure for your backend server. + # PWA Containerized Deployment This document provides step-by-step instructions to pull the source code and deploy the Progressive Web App (PWA) using Docker on a production server. @@ -56,12 +86,24 @@ From the repository root, run the following command to build your Docker image: docker build -t 'game-timer:latest' . ``` -### 3. Run the Docker Container - -Once the image is built, run the container on port 8080 with: +or use the npm script: ```bash -docker run -d -p 8080:80 --name game-timer-container game-timer:latest +npm run docker:build +``` + +### 3. Run the Docker Container + +Once the image is built, run the container on port 80 with: + +```bash +docker run -d -p 80:80 --name game-timer game-timer:latest +``` + +or use the npm script: + +```bash +npm run start ``` ### 4. Verify the Deployment @@ -75,29 +117,42 @@ docker ps View logs (if needed): ```bash -docker logs game-timer-container +docker logs game-timer ``` After running the container, open your web browser and navigate to: -```bash -http://localhost:8080 +``` +http://localhost ``` ### 5. Terminate -To stop your running game-timer-container, use: +To stop your running game-timer container, use: ```bash -docker stop game-timer-container +docker stop game-timer +docker rm game-timer +``` + +or use the npm script: + +```bash +npm run stop ``` ## Development -For local development without Docker, you can use: +For local development without Docker, you can use any static file server such as: ```bash -npm run dev +python -m http.server ``` -This will start a local development server and open the application in your browser. \ No newline at end of file +or + +```bash +npx serve +``` + +This will start a local development server and you can access the application in your browser. \ No newline at end of file diff --git a/public/css/styles.css b/css/styles.css similarity index 100% rename from public/css/styles.css rename to css/styles.css diff --git a/docs/screenshots/screenshot1.png b/docs/screenshots/screenshot1.png deleted file mode 100644 index 4db22a7..0000000 Binary files a/docs/screenshots/screenshot1.png and /dev/null differ diff --git a/docs/screenshots/screenshot2.png b/docs/screenshots/screenshot2.png deleted file mode 100644 index fd590cd..0000000 Binary files a/docs/screenshots/screenshot2.png and /dev/null differ diff --git a/public/favicon.ico b/favicon.ico similarity index 100% rename from public/favicon.ico rename to favicon.ico diff --git a/public/icons/android-chrome-192x192.png b/icons/android-chrome-192x192.png similarity index 100% rename from public/icons/android-chrome-192x192.png rename to icons/android-chrome-192x192.png diff --git a/public/icons/android-chrome-512x512.png b/icons/android-chrome-512x512.png similarity index 100% rename from public/icons/android-chrome-512x512.png rename to icons/android-chrome-512x512.png diff --git a/public/icons/apple-touch-icon.png b/icons/apple-touch-icon.png similarity index 100% rename from public/icons/apple-touch-icon.png rename to icons/apple-touch-icon.png diff --git a/public/icons/favicon-16x16.png b/icons/favicon-16x16.png similarity index 100% rename from public/icons/favicon-16x16.png rename to icons/favicon-16x16.png diff --git a/public/icons/favicon-32x32.png b/icons/favicon-32x32.png similarity index 100% rename from public/icons/favicon-32x32.png rename to icons/favicon-32x32.png diff --git a/images/screenshot1.png b/images/screenshot1.png new file mode 100644 index 0000000..b1c6477 Binary files /dev/null and b/images/screenshot1.png differ diff --git a/images/screenshot2.png b/images/screenshot2.png new file mode 100644 index 0000000..3347df3 Binary files /dev/null and b/images/screenshot2.png differ diff --git a/public/index.html b/index.html similarity index 90% rename from public/index.html rename to index.html index cd7f9a2..397d2a3 100644 --- a/public/index.html +++ b/index.html @@ -5,9 +5,20 @@ Game Timer - + + + + + + + + + + + + - + @@ -102,10 +113,10 @@ - + + + \ No newline at end of file diff --git a/docs/examples/virt-game-timer.service b/virt-game-timer.service similarity index 100% rename from docs/examples/virt-game-timer.service rename to virt-game-timer.service