From 179754f599433326659ecbb65f91c6a391c99ba3 Mon Sep 17 00:00:00 2001 From: Tristan Hill Date: Thu, 20 Mar 2025 00:34:31 +0000 Subject: [PATCH 1/8] intit --- README.md | 24 +++- package-lock.json | 10 ++ package.json | 1 + public/css/styles.css | 143 ++++++++++++++++++++++++ public/index.html | 16 ++- public/js/emailSubscription.js | 55 +++++++++ server.js | 36 ++++++ server/emailManager.js | 197 +++++++++++++++++++++++++++++++++ 8 files changed, 480 insertions(+), 2 deletions(-) create mode 100644 public/js/emailSubscription.js create mode 100644 server/emailManager.js diff --git a/README.md b/README.md index 509560f..23a9ef0 100644 --- a/README.md +++ b/README.md @@ -9,6 +9,7 @@ A real-time streaming platform that supports live chat from both Twitch and YouT - Stream highlights - HLS streaming support - WebSocket-based real-time updates +- Email notifications when stream goes live ## Prerequisites @@ -54,6 +55,11 @@ STREAM_KEY=your_stream_key # Admin Configuration ADMIN_USERNAME=your_admin_username # Username with admin privileges for managing highlights + +# Email Notifications +EMAIL_NOTIFICATIONS_ENABLED=true +PROTONMAIL_USER=your_protonmail_email +PROTONMAIL_PASS=your_protonmail_password ``` ## Configuration @@ -76,6 +82,11 @@ The following environment variables must be set in your `.env` file: #### Admin Configuration - `ADMIN_USERNAME`: Username with administrative privileges for managing highlights and other admin-only features +#### Email Notifications +- `EMAIL_NOTIFICATIONS_ENABLED`: Set to `true` to enable email notifications +- `PROTONMAIL_USER`: Your ProtonMail email address +- `PROTONMAIL_PASS`: Your ProtonMail password or app-specific password + ### Stream Key The stream key is configured through the `STREAM_KEY` environment variable in your `.env` file. If not set, it defaults to `StreamtoME`. This key is used for RTMP authentication and HLS stream paths. @@ -178,4 +189,15 @@ git push origin feature/your-feature-name ## License -This project is licensed under the MIT License - see the LICENSE file for details. \ No newline at end of file +This project is licensed under the MIT License - see the LICENSE file for details. + +## Email Notifications + +The server includes an email notification system that alerts subscribers when the stream goes live. To use this feature: + +1. Set `EMAIL_NOTIFICATIONS_ENABLED=true` in your `.env` file +2. Configure your ProtonMail credentials: + - `PROTONMAIL_USER`: Your ProtonMail email address + - `PROTONMAIL_PASS`: Your ProtonMail password or app-specific password +3. Subscribers can sign up through the form on the website +4. Notifications are automatically sent when the stream starts \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 8510df0..9856f9b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ "hls.js": "^1.5.20", "http": "^0.0.1-security", "node-media-server": "^2.5.0", + "nodemailer": "^6.10.0", "streamserver": "file:", "uuid": "^11.1.0", "ws": "^8.18.1" @@ -681,6 +682,15 @@ "node": ">=8.0.0" } }, + "node_modules/nodemailer": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.10.0.tgz", + "integrity": "sha512-SQ3wZCExjeSatLE/HBaXS5vqUOQk6GtBdIIKxiFdmm01mOQZX/POJkO3SUX1wDiYcwUOJwT23scFSC9fY2H8IA==", + "license": "MIT-0", + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/object-inspect": { "version": "1.13.4", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz", diff --git a/package.json b/package.json index 674d177..059f0dd 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "hls.js": "^1.5.20", "http": "^0.0.1-security", "node-media-server": "^2.5.0", + "nodemailer": "^6.10.0", "streamserver": "file:", "uuid": "^11.1.0", "ws": "^8.18.1" diff --git a/public/css/styles.css b/public/css/styles.css index db971d9..af9fe90 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -2455,4 +2455,147 @@ body { padding: 8px 10px; font-size: 1.6rem; } +} + +/* Email Subscription Form */ +.email-subscription { + background: linear-gradient(to bottom, #2d2d2d, #252525); + padding: 40px 0; + text-align: center; + border-top: 1px solid #404040; + border-bottom: 1px solid #404040; + margin-bottom: 0; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +.email-subscription-content { + max-width: 600px; + margin: 0 auto; + padding: 0 20px; +} + +.email-subscription h3 { + color: #fff; + margin-bottom: 15px; + font-size: 1.8rem; + font-weight: 600; + background: linear-gradient(90deg, #ffffff, #ff9966); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + text-shadow: none; +} + +.email-subscription p { + color: #ccc; + margin-bottom: 25px; + font-size: 1rem; + line-height: 1.6; +} + +.email-form { + display: flex; + gap: 15px; + justify-content: center; + max-width: 500px; + margin: 0 auto; +} + +.email-input { + flex: 1; + padding: 12px 20px; + border: 2px solid #404040; + border-radius: 8px; + background: rgba(26, 26, 26, 0.8); + color: #fff; + font-size: 1rem; + min-width: 200px; + transition: all 0.3s ease; +} + +.email-input:focus { + outline: none; + border-color: #ff9966; + box-shadow: 0 0 10px rgba(255, 153, 102, 0.2); + background: rgba(26, 26, 26, 0.95); +} + +.subscribe-btn { + padding: 12px 30px; + background: linear-gradient(90deg, #ff4d4d, #ff9966); + border: none; + border-radius: 8px; + color: white; + font-weight: bold; + cursor: pointer; + transition: all 0.3s ease; + text-transform: uppercase; + letter-spacing: 0.5px; + font-size: 0.9rem; +} + +.subscribe-btn:hover { + transform: translateY(-2px); + box-shadow: 0 4px 15px rgba(255, 77, 77, 0.3); +} + +.subscribe-btn:active { + transform: translateY(0); +} + +.subscribe-btn:disabled { + background: linear-gradient(90deg, #666, #888); + cursor: not-allowed; + transform: none; + box-shadow: none; +} + +.subscription-message { + margin-top: 15px; + font-size: 0.9rem; + padding: 10px; + border-radius: 6px; + transition: all 0.3s ease; +} + +.subscription-message.success { + color: #4CAF50; + background: rgba(76, 175, 80, 0.1); + border: 1px solid rgba(76, 175, 80, 0.2); +} + +.subscription-message.error { + color: #ff4d4d; + background: rgba(255, 77, 77, 0.1); + border: 1px solid rgba(255, 77, 77, 0.2); +} + +@media (max-width: 767px) { + .email-subscription { + padding: 30px 15px; + } + + .email-subscription h3 { + font-size: 1.5rem; + } + + .email-subscription p { + font-size: 0.9rem; + margin-bottom: 20px; + } + + .email-form { + flex-direction: column; + gap: 10px; + } + + .email-input { + width: 100%; + padding: 10px 15px; + } + + .subscribe-btn { + width: 100%; + padding: 10px 20px; + } } \ No newline at end of file diff --git a/public/index.html b/public/index.html index 8d94719..c18260f 100644 --- a/public/index.html +++ b/public/index.html @@ -804,6 +804,7 @@

Live Chat

+ + +
+ +
+