modified readme

2024-12-22 03:01:08 +01:00
parent c5bc800971
commit 5dee38aec0
2 changed files with 108 additions and 3 deletions
--- a/README.md
+++ b/README.md
@ -1,2 +1,107 @@
-# Seasonals
+# Jellyfin Seasonals

+Jellyfin Seasonals is a simple modification that adds seasonal themes to your Jellyfin web interface. Depending on the configuration, it automatically selects a theme based on the current date or allows you to manually set a default theme.
+
+## Features
+
+- **Automatic Theme Selection**: Dynamically updates the theme based on the date (e.g., snowflakes in December, hearts for Valentine's Day).
+- **Custom Themes**: Add your own seasonal themes by extending the `themeConfigs` object.
+- **Easy Integration**: Lightweight and requires minimal changes to your Jellyfin setup.
+
+## Installation
+
+1. **Add Seasonal Container to `index.html`**  
+   Edit the `index.html` file of your Jellyfin web instance. Add the following code inside the `<body>` tag:
+
+   ```html
+   <div class="seasonals-container"></div>
+   <script src="seasonals/seasonals.js"></script>
+    ```
+2. **Deploy Files**  
+    Place the seasonals folder (including seasonals.js, CSS, and additional JavaScript files for each theme) inside the Jellyfin web server directory (labeld with "web").
+
+3. **Configure Themes**  
+    Customize the theme-configs.js file to modify or add new themes. The default configuration is shown below:
+
+    ```javascript
+    const automateThemeSelection = true; // Set to false to disable automatic theme selection based on current date
+    const defaultTheme = 'none';    // Default theme if automatic selection is off
+
+    const themeConfigs = {
+        snowflakes: {
+            css: 'seasonals/snowflakes.css',
+            js: 'seasonals/snowflakes.js',
+            containerClass: 'snowflakes'
+        },
+        snowfall: {
+            css: 'seasonals/snowfall.css',
+            js: 'seasonals/snowfall.js',
+            containerClass: 'snowfall'
+        },
+        
+        // more configs...
+
+        none: {
+            containerClass: 'none'
+        },
+    };
+    ```
+
+4. **Restart Jellyfin Web Interface**  
+    After making these changes, restart your Jellyfin web server or refresh the interface to see the changes.
+
+## Theme Settings
+Each theme's JavaScript file contains additional settings to customize its behavior. Here are examples for the `autumn` and `snowflakes` themes:
+
+**Autumn Theme Settings**
+```javascript
+const leaves = true; // Enable/disable leaves
+const randomLeaves = true; // Enable random leaves
+const randomLeavesMobile = false; // Enable random leaves on mobile devices
+const enableDiffrentDuration = true; // Enable different animation duration for random leaves
+const leafCount = 25; // Number of random extra leaves
+```
+
+**Snowflakes Theme Settings**
+```javascript
+const snowflakes = true; // Enable/disable snowflakes
+const randomSnowflakes = true; // Enable random snowflakes
+const randomSnowflakesMobile = false; // Enable random snowflakes on mobile devices
+const enableColoredSnowflakes = true; // Enable colored snowflakes on mobile devices
+const enableDiffrentDuration = true; // Enable different animation duration for random snowflakes
+const snowflakeCount = 25; // Number of random extra snowflakes
+```
+
+## Usage
+**Automatic Theme Selection**  
+By default, the theme is automatically selected based on the date. For example:
+
+    Snowfall: January
+    Hearts: February (Valentine's Day)
+    Halloween: October
+
+Modify the determineCurrentTheme() function in seasonals.js to adjust date-based logic.
+
+**Manual Theme Selection**  
+To use a fixed theme, set automateThemeSelection to false in the theme-configs.js file and specify a defaultTheme.
+
+**Custom Themes**  
+1. Add your CSS and JavaScript files to the seasonals folder.
+   
+2. Extend the themeConfigs object with your theme details:
+    ```javascript
+    myTheme: {
+        css: 'seasonals/my-theme.css',
+        js: 'seasonals/my-theme.js',
+        containerClass: 'my-theme-container',
+    }
+    ```
+
+## Troubleshooting
+- **No Theme Appears:** Ensure the `<div class="seasonals-container"></div>` and `<script src="seasonals/seasonals.js"></script>` element exists in your index.html inside the `<body> </body>` tags.
+- **Missing Files:** Verify that the paths in themeConfigs point to the correct files in the seasonals folder.
+- **Errors in Console:** Check browser developer tools for logs or errors related to the seasonal scripts.
+
+## Contributing
+
+Feel free to contribute to this project by creating pull requests or reporting issues.
--- a/seasonals/seasonals.js
+++ b/seasonals/seasonals.js
@ -1,7 +1,7 @@
 // theme-configs.js

-const automateThemeSelection = true;    // Set to false to disable automatic theme selection based on the current month
-const defaultTheme = 'snowfall';       // The theme to use if automatic theme selection is disabled
+const automateThemeSelection = true;    // Set to false to disable automatic theme selection based on current date
+const defaultTheme = 'none';       // The theme to use if automatic theme selection is disabled

 // theme configurations
 const themeConfigs = {