Compare commits

...

22 Commits

Author SHA1 Message Date
CodeDevMLH
a4b2d2edd5 Refactor seasonal plugin configurations to improve clarity and consistency
- Updated comments for clarity on enabling/disabling features across various seasonal scripts.
- Changed default value checks to ensure undefined values are handled consistently.
- Enhanced readability by providing descriptive comments for configuration variables.

[skip ci]
2026-02-27 23:56:36 +01:00
CodeDevMLH
d0634e4487 Refactor sports.js to streamline configuration handling, remove unused variables, and enhance code readability 2026-02-27 23:18:07 +01:00
CodeDevMLH
79c4f988f2 Refactor eid.js to define lantern counts for mobile and desktop, ensuring consistent lantern creation across devices 2026-02-27 23:16:10 +01:00
CodeDevMLH
cee1fa6736 Refactor spring.js to adjust object counts for mobile, streamline pollen and creature creation, and update code comments 2026-02-27 23:11:33 +01:00
CodeDevMLH
8510674d58 Refactor space.js to remove unused randomization options, streamline object counts for mobile, and enhance code readability with updated credits 2026-02-27 23:05:52 +01:00
CodeDevMLH
5ee724201b Refactor summer.js to streamline bubble and dust creation, enhance mobile handling, and remove unused randomization options 2026-02-27 23:03:42 +01:00
CodeDevMLH
b85c038df0 Refactor underwater.js to enhance mobile symbol handling and update credits 2026-02-27 22:56:13 +01:00
CodeDevMLH
3d4e04ab0f Change SymbolCountMobile property type from bool to int in seasonal options 2026-02-27 22:23:39 +01:00
CodeDevMLH
b1d1ce79e6 Merge branch 'main' of ssh://git.mahom03-spacecloud.de:44322/CodeDevMLH/Jellyfin-Seasonals-Plugin
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 53s
2026-02-27 21:57:27 +01:00
CodeDevMLH
0b7b506b8d Remove unnecessary comments and streamline DOM observation in seasonal scripts 2026-02-27 21:57:24 +01:00
CodeDevMLH
f3ea84cc80 Refactor seasonal options in PluginConfiguration to streamline and enhance organization 2026-02-27 21:55:04 +01:00
CodeDevMLH
3d9a474aae Update manifest.json for release v2.0.0.1 [skip ci] 2026-02-27 03:27:03 +00:00
CodeDevMLH
db5baa1fd7 Bump version to 2.0.0.1
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 53s
2026-02-27 04:26:12 +01:00
CodeDevMLH
72ad4ee1a4 Add option to enable different symbol durations for spooky theme; fix casing in snowstorm config 2026-02-27 04:25:53 +01:00
CodeDevMLH
bb6c7796d5 Reduce z-index of matrix-container to improve stacking context and prevent overlap issues [skip ci] 2026-02-27 04:08:00 +01:00
CodeDevMLH
bd8088c52b Add checks for container presence in animation functions to prevent errors when elements are removed from the DOM [skip ci] 2026-02-27 04:07:29 +01:00
CodeDevMLH
3c1bd01373 Fix positioning of olympia-symbol and adjust ring CSS for improved alignment [skip ci] 2026-02-27 03:59:19 +01:00
CodeDevMLH
669ac6d3da Fix spider and mouse creation logic to ensure animations only continue if the container is present in the DOM 2026-02-27 03:58:34 +01:00
CodeDevMLH
73f9be91ef Refactor z-index values and optimize CSS properties for various seasonal styles; enhance performance with will-change property [skip ci] 2026-02-27 03:53:05 +01:00
CodeDevMLH
f14785c54a Enhance CSS animations and performance across seasonal styles; add will-change property for smoother transitions and optimize keyframes. [skip ci] 2026-02-27 03:42:23 +01:00
CodeDevMLH
296873f89e Fix rabbit animation transform origin and improve GIF reset logic
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 40s
2026-02-27 01:58:53 +01:00
CodeDevMLH
d6a9ff7176 Fix z-index for pride container and clean up comments in pride.js
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 42s
2026-02-27 01:35:25 +01:00
63 changed files with 1314 additions and 1540 deletions

View File

@@ -18,40 +18,40 @@ public class PluginConfiguration : BasePluginConfiguration
EnableClientSideToggle = true;
Autumn = new AutumnOptions();
Snowflakes = new SnowflakesOptions();
Snowfall = new SnowfallOptions();
Snowstorm = new SnowstormOptions();
Birthday = new BirthdayOptions();
Carnival = new CarnivalOptions();
CherryBlossom = new CherryBlossomOptions();
Christmas = new ChristmasOptions();
EarthDay = new EarthDayOptions();
Easter = new EasterOptions();
Eid = new EidOptions();
Eurovision = new EurovisionOptions();
FilmNoir = new FilmNoirOptions();
Fireworks = new FireworksOptions();
Friday13 = new Friday13Options();
Frost = new FrostOptions();
Halloween = new HalloweenOptions();
Hearts = new HeartsOptions();
Christmas = new ChristmasOptions();
Santa = new SantaOptions();
Easter = new EasterOptions();
Resurrection = new ResurrectionOptions();
Spring = new SpringOptions();
Summer = new SummerOptions();
CherryBlossom = new CherryBlossomOptions();
Carnival = new CarnivalOptions();
Matrix = new MatrixOptions();
Eurovision = new EurovisionOptions();
Storm = new StormOptions();
Pride = new PrideOptions();
EarthDay = new EarthDayOptions();
Rain = new RainOptions();
Frost = new FrostOptions();
FilmNoir = new FilmNoirOptions();
Oscar = new OscarOptions();
MarioDay = new MarioDayOptions();
StarWars = new StarWarsOptions();
Matrix = new MatrixOptions();
Oktoberfest = new OktoberfestOptions();
Friday13 = new Friday13Options();
Eid = new EidOptions();
Olympia = new OlympiaOptions();
Oscar = new OscarOptions();
Rain = new RainOptions();
Pride = new PrideOptions();
Resurrection = new ResurrectionOptions();
Santa = new SantaOptions();
Snowfall = new SnowfallOptions();
Snowflakes = new SnowflakesOptions();
Snowstorm = new SnowstormOptions();
Space = new SpaceOptions();
Spooky = new SpookyOptions();
Sports = new SportsOptions();
Olympia = new OlympiaOptions();
Space = new SpaceOptions();
Spring = new SpringOptions();
StarWars = new StarWarsOptions();
Storm = new StormOptions();
Summer = new SummerOptions();
Underwater = new UnderwaterOptions();
Birthday = new BirthdayOptions();
}
/// <summary>
@@ -83,44 +83,43 @@ public class PluginConfiguration : BasePluginConfiguration
/// Gets or sets the Seasonals options.
/// </summary>
public AutumnOptions Autumn { get; set; }
public SnowflakesOptions Snowflakes { get; set; }
public SnowfallOptions Snowfall { get; set; }
public SnowstormOptions Snowstorm { get; set; }
public BirthdayOptions Birthday { get; set; }
public CarnivalOptions Carnival { get; set; }
public CherryBlossomOptions CherryBlossom { get; set; }
public ChristmasOptions Christmas { get; set; }
public EarthDayOptions EarthDay { get; set; }
public EasterOptions Easter { get; set; }
public EidOptions Eid { get; set; }
public EurovisionOptions Eurovision { get; set; }
public FilmNoirOptions FilmNoir { get; set; }
public FireworksOptions Fireworks { get; set; }
public Friday13Options Friday13 { get; set; }
public FrostOptions Frost { get; set; }
public HalloweenOptions Halloween { get; set; }
public HeartsOptions Hearts { get; set; }
public ChristmasOptions Christmas { get; set; }
public SantaOptions Santa { get; set; }
public EasterOptions Easter { get; set; }
public ResurrectionOptions Resurrection { get; set; }
public SpringOptions Spring { get; set; }
public SummerOptions Summer { get; set; }
public CherryBlossomOptions CherryBlossom { get; set; }
public CarnivalOptions Carnival { get; set; }
public MatrixOptions Matrix { get; set; }
public EurovisionOptions Eurovision { get; set; }
public StormOptions Storm { get; set; }
public PrideOptions Pride { get; set; }
public EarthDayOptions EarthDay { get; set; }
public RainOptions Rain { get; set; }
public FrostOptions Frost { get; set; }
public FilmNoirOptions FilmNoir { get; set; }
public OscarOptions Oscar { get; set; }
public MarioDayOptions MarioDay { get; set; }
public StarWarsOptions StarWars { get; set; }
public MatrixOptions Matrix { get; set; }
public OktoberfestOptions Oktoberfest { get; set; }
public Friday13Options Friday13 { get; set; }
public EidOptions Eid { get; set; }
public OlympiaOptions Olympia { get; set; }
public OscarOptions Oscar { get; set; }
public PrideOptions Pride { get; set; }
public RainOptions Rain { get; set; }
public ResurrectionOptions Resurrection { get; set; }
public SantaOptions Santa { get; set; }
public SnowfallOptions Snowfall { get; set; }
public SnowflakesOptions Snowflakes { get; set; }
public SnowstormOptions Snowstorm { get; set; }
public SpaceOptions Space { get; set; }
public SpookyOptions Spooky { get; set; }
public SportsOptions Sports { get; set; }
public OlympiaOptions Olympia { get; set; }
public SpaceOptions Space { get; set; }
public SpringOptions Spring { get; set; }
public StarWarsOptions StarWars { get; set; }
public StormOptions Storm { get; set; }
public SummerOptions Summer { get; set; }
public UnderwaterOptions Underwater { get; set; }
public BirthdayOptions Birthday { get; set; }
}
public class AutumnOptions
{
public class AutumnOptions {
public int LeafCount { get; set; } = 25;
public bool EnableAutumn { get; set; } = true;
public bool EnableRandomLeaves { get; set; } = true;
@@ -129,300 +128,261 @@ public class AutumnOptions
public bool EnableRotation { get; set; } = false;
}
public class SnowflakesOptions
{
public int SnowflakeCount { get; set; } = 25;
public bool EnableSnowflakes { get; set; } = true;
public bool EnableRandomSnowflakes { get; set; } = true;
public bool EnableRandomSnowflakesMobile { get; set; } = false;
public bool EnableColoredSnowflakes { get; set; } = true;
public class BirthdayOptions {
public bool EnableBirthday { get; set; } = true;
public int SymbolCount { get; set; } = 12;
public int SymbolCountMobile { get; set; } = 5;
public bool EnableDifferentDuration { get; set; } = true;
public int ConfettiCount { get; set; } = 60;
}
public class CarnivalOptions {
public bool EnableCarnival { get; set; } = true;
public bool EnableRandomCarnival { get; set; } = true;
public bool EnableRandomCarnivalMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableCarnivalSway { get; set; } = true;
public int ObjectCount { get; set; } = 120;
}
public class CherryBlossomOptions {
public bool EnableCherryBlossom { get; set; } = true;
public int PetalCount { get; set; } = 25;
public bool EnableRandomCherryBlossom { get; set; } = true;
public bool EnableRandomCherryBlossomMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
}
public class SnowfallOptions
{
public int SnowflakesCount { get; set; } = 500;
public int SnowflakesCountMobile { get; set; } = 250;
public double Speed { get; set; } = 3;
public bool EnableSnowfall { get; set; } = true;
public class ChristmasOptions {
public bool EnableChristmas { get; set; } = true;
public bool EnableRandomChristmas { get; set; } = true;
public bool EnableRandomChristmasMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public int SymbolCount { get; set; } = 25;
}
public class SnowstormOptions
{
public int SnowflakesCount { get; set; } = 500;
public int SnowflakesCountMobile { get; set; } = 250;
public double Speed { get; set; } = 6;
public bool EnableSnowstorm { get; set; } = true;
public double HorizontalWind { get; set; } = 4;
public double VerticalVariation { get; set; } = 2;
public class EarthDayOptions {
public bool EnableEarthDay { get; set; } = true;
public int VineCount { get; set; } = 4;
}
public class FireworksOptions
{
public int ParticleCount { get; set; } = 50;
public int LaunchInterval { get; set; } = 3200;
public class EasterOptions {
public bool EnableEaster { get; set; } = true;
public bool EnableBunny { get; set; } = true;
public int MinBunnyRestTime { get; set; } = 2000;
public int MaxBunnyRestTime { get; set; } = 5000;
public int EggCount { get; set; } = 15;
}
public class EidOptions {
public bool EnableEid { get; set; } = true;
public int LanternCount { get; set; } = 8;
public int LanternCountMobile { get; set; } = 3;
}
public class EurovisionOptions {
public bool EnableEurovision { get; set; } = true;
public int SymbolCount { get; set; } = 25;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableColorfulNotes { get; set; } = true;
public string EurovisionColors { get; set; } = "#ff0026ff,#17a6ffff,#32d432ff,#FFD700,#f0821bff,#f826f8ff";
public int EurovisionGlowSize { get; set; } = 2;
}
public class FilmNoirOptions {
public bool EnableFilmNoir { get; set; } = true;
}
public class FireworksOptions {
public bool EnableFireworks { get; set; } = true;
public bool ScrollFireworks { get; set; } = true;
public int ParticleCount { get; set; } = 50;
public int MinFireworks { get; set; } = 3;
public int MaxFireworks { get; set; } = 6;
public int LaunchInterval { get; set; } = 3200;
}
public class HalloweenOptions
{
public int SymbolCount { get; set; } = 25;
public class Friday13Options {
public bool EnableFriday13 { get; set; } = true;
}
public class FrostOptions {
public bool EnableFrost { get; set; } = true;
}
public class HalloweenOptions {
public bool EnableHalloween { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableSpiders { get; set; } = true;
public bool EnableMice { get; set; } = true;
public int SymbolCount { get; set; } = 25;
}
public class HeartsOptions
{
public int SymbolCount { get; set; } = 25;
public class HeartsOptions {
public bool EnableHearts { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public int SymbolCount { get; set; } = 25;
}
public class ChristmasOptions
{
public class MarioDayOptions {
public bool EnableMarioDay { get; set; } = true;
public bool LetMarioJump { get; set; } = true;
}
public class MatrixOptions {
public bool EnableMatrix { get; set; } = true;
public int SymbolCount { get; set; } = 25;
public bool EnableChristmas { get; set; } = true;
public bool EnableRandomChristmas { get; set; } = true;
public bool EnableRandomChristmasMobile { get; set; } = false;
public bool EnableMatrixBackground { get; set; } = false;
public string MatrixChars { get; set; } = "0123456789";
}
public class OktoberfestOptions {
public bool EnableOktoberfest { get; set; } = true;
}
public class OlympiaOptions {
public bool EnableOlympia { get; set; } = true;
public int SymbolCount { get; set; } = 25;
public int SymbolCountMobile { get; set; } = 10;
public bool EnableDifferentDuration { get; set; } = true;
}
public class SantaOptions
{
public class OscarOptions {
public bool EnableOscar { get; set; } = true;
}
public class PrideOptions {
public bool EnablePride { get; set; } = true;
public int HeartCount { get; set; } = 20;
public int HeartSize { get; set; } = 1.5;
public bool ColorHeader { get; set; } = true;
}
public class RainOptions {
public bool EnableRain { get; set; } = true;
public int RaindropCount { get; set; } = 300;
public int RaindropCountMobile { get; set; } = 150;
public double RainSpeed { get; set; } = 1.0;
}
public class ResurrectionOptions {
public bool EnableResurrection { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public int SymbolCount { get; set; } = 12;
}
public class SantaOptions {
public bool EnableSanta { get; set; } = true;
public int SnowflakesCount { get; set; } = 500;
public int SnowflakesCountMobile { get; set; } = 250;
public double SnowFallSpeed { get; set; } = 3;
public double SantaSpeed { get; set; } = 10;
public double SantaSpeedMobile { get; set; } = 8;
public bool EnableSanta { get; set; } = true;
public double SnowFallSpeed { get; set; } = 3;
public double MaxSantaRestTime { get; set; } = 8;
public double MinSantaRestTime { get; set; } = 3;
public double MaxPresentFallSpeed { get; set; } = 5;
public double MinPresentFallSpeed { get; set; } = 2;
}
public class EasterOptions
{
public int EggCount { get; set; } = 20;
public bool EnableEaster { get; set; } = true;
public bool EnableRandomEaster { get; set; } = true;
public bool EnableRandomEasterMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableBunny { get; set; } = true;
public int BunnyDuration { get; set; } = 12000;
public int HopHeight { get; set; } = 12;
public int MinBunnyRestTime { get; set; } = 2000;
public int MaxBunnyRestTime { get; set; } = 5000;
public class SnowfallOptions {
public bool EnableSnowfall { get; set; } = true;
public int SnowflakesCount { get; set; } = 500;
public int SnowflakesCountMobile { get; set; } = 250;
public double Speed { get; set; } = 3;
}
public class ResurrectionOptions
{
public int SymbolCount { get; set; } = 12;
public bool EnableResurrection { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public class SnowflakesOptions {
public bool EnableSnowflakes { get; set; } = true;
public int SnowflakeCount { get; set; } = 25;
public bool EnableRandomSnowflakes { get; set; } = true;
public bool EnableRandomSnowflakesMobile { get; set; } = false;
public bool EnableColoredSnowflakes { get; set; } = true;
public bool EnableDifferentDuration { get; set; } = true;
}
public class SpringOptions
{
public int PollenCount { get; set; } = 30;
public int SunbeamCount { get; set; } = 5;
public int BirdCount { get; set; } = 4;
public int ButterflyCount { get; set; } = 4;
public int BeeCount { get; set; } = 2;
public int LadybugCount { get; set; } = 2;
public bool EnableSpring { get; set; } = true;
public bool EnableSpringSunbeams { get; set; } = true;
public bool EnableRandomSpring { get; set; } = true;
public bool EnableRandomSpringMobile { get; set; } = false;
public class SnowstormOptions {
public bool EnableSnowstorm { get; set; } = true;
public int SnowflakesCount { get; set; } = 500;
public int SnowflakesCountMobile { get; set; } = 250;
public double Speed { get; set; } = 6;
public double HorizontalWind { get; set; } = 4;
public double VerticalVariation { get; set; } = 2;
}
public class SpaceOptions {
public bool EnableSpace { get; set; } = true;
public int PlanetCount { get; set; } = 6;
public int AstronautCount { get; set; } = 1;
public int SatelliteCount { get; set; } = 4;
public int IssCount { get; set; } = 1;
public int RocketCount { get; set; } = 1;
public bool EnableDifferentDuration { get; set; } = true;
public int SymbolCountMobile { get; set; } = 2;
}
public class SummerOptions
{
public int BubbleCount { get; set; } = 20;
public int DustCount { get; set; } = 50;
public bool EnableSummer { get; set; } = true;
public bool EnableRandomSummer { get; set; } = true;
public bool EnableRandomSummerMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
}
public class CarnivalOptions
{
public int ObjectCount { get; set; } = 25;
public bool EnableCarnival { get; set; } = true;
public bool EnableRandomCarnival { get; set; } = true;
public bool EnableRandomCarnivalMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableCarnivalSway { get; set; } = true;
}
public class CherryBlossomOptions
{
public int PetalCount { get; set; } = 25;
public bool EnableCherryBlossom { get; set; } = true;
public bool EnableRandomCherryBlossom { get; set; } = true;
public bool EnableRandomCherryBlossomMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
}
public class MatrixOptions
{
public int SymbolCount { get; set; } = 25;
public bool EnableMatrix { get; set; } = true;
public bool EnableRandomMatrix { get; set; } = true;
public bool EnableRandomMatrixMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableMatrixBackground { get; set; } = false;
public string MatrixChars { get; set; } = "0123456789";
}
public class EurovisionOptions
{
public int SymbolCount { get; set; } = 25;
public bool EnableEurovision { get; set; } = true;
public bool EnableRandomEurovision { get; set; } = true;
public bool EnableRandomEurovisionMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableColorfulNotes { get; set; } = true;
public string EurovisionColors { get; set; } = "#ff0026ff,#17a6ffff,#32d432ff,#FFD700,#f0821bff,#f826f8ff";
public int EurovisionGlowSize { get; set; } = 8;
}
public class StormOptions
{
public int RaindropCount { get; set; } = 300;
public int RaindropCountMobile { get; set; } = 150;
public bool EnableStorm { get; set; } = true;
public bool EnableLightning { get; set; } = true;
public double RainSpeed { get; set; } = 1;
}
public class PrideOptions
{
public bool EnablePride { get; set; } = true;
public int HeartCount { get; set; } = 20;
public int HeartSize { get; set; } = 2;
public bool ColorHeader { get; set; } = true;
}
public class EarthDayOptions
{
public bool EnableEarthDay { get; set; } = true;
public int VineCount { get; set; } = 4;
}
public class RainOptions
{
public bool EnableRain { get; set; } = true;
public int RaindropCount { get; set; } = 300;
public int RaindropCountMobile { get; set; } = 150;
public double RainSpeed { get; set; } = 1;
}
public class FrostOptions
{
public bool EnableFrost { get; set; } = true;
}
public class FilmNoirOptions
{
public bool EnableFilmNoir { get; set; } = true;
}
public class OscarOptions
{
public bool EnableOscar { get; set; } = true;
}
public class MarioDayOptions
{
public bool EnableMarioDay { get; set; } = true;
}
public class StarWarsOptions
{
public bool EnableStarWars { get; set; } = true;
}
public class OktoberfestOptions
{
public bool EnableOktoberfest { get; set; } = true;
}
public class Friday13Options
{
public bool EnableFriday13 { get; set; } = true;
}
public class EidOptions
{
public bool EnableEid { get; set; } = true;
}
public class SpookyOptions
{
public class SpookyOptions {
public bool EnableSpooky { get; set; } = true;
public int SymbolCount { get; set; } = 25;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableSpookySway { get; set; } = true;
public int SpookySize { get; set; } = 20;
public int SpookyGlowSize { get; set; } = 2;
}
public class SportsOptions
{
public int SymbolCount { get; set; } = 5;
public class SportsOptions {
public bool EnableSports { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public int SymbolCount { get; set; } = 5;
public bool EnableDifferentDuration { get; set; } = true;
public string TurfColor { get; set; } = "#228b22";
public string SportsBalls { get; set; } = "football,basketball,tennis,volleyball";
public bool EnableTrophy { get; set; } = false;
public string ConfettiColors { get; set; } = "#000000,#FF0000,#FFCC00";
}
public class OlympiaOptions
{
public int SymbolCount { get; set; } = 25;
public bool EnableOlympia { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public class SpringOptions {
public bool EnableSpring { get; set; } = true;
public int PollenCount { get; set; } = 30;
public bool EnableSpringSunbeams { get; set; } = true;
public int SunbeamCount { get; set; } = 5;
public int BirdCount { get; set; } = 3;
public int ButterflyCount { get; set; } = 4;
public int BeeCount { get; set; } = 2;
public int LadybugCount { get; set; } = 2;
public int SymbolCountMobile { get; set; } = 2;
}
public class StarWarsOptions {
public bool EnableStarWars { get; set; } = true;
}
public class StormOptions {
public bool EnableStorm { get; set; } = true;
public int RaindropCount { get; set; } = 300;
public int RaindropCountMobile { get; set; } = 150;
public bool EnableLightning { get; set; } = true;
public double RainSpeed { get; set; } = 1.0;
}
public class SummerOptions {
public bool EnableSummer { get; set; } = true;
public int BubbleCount { get; set; } = 30;
public int DustCount { get; set; } = 50;
public int SymbolCountMobile { get; set; } = 2;
public bool EnableDifferentDuration { get; set; } = true;
}
public class SpaceOptions
{
public int PlanetCount { get; set; } = 12;
public int AstronautCount { get; set; } = 5;
public int SatelliteCount { get; set; } = 2;
public int IssCount { get; set; } = 1;
public int RocketCount { get; set; } = 1;
public bool EnableSpace { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
}
public class UnderwaterOptions
{
public int SymbolCount { get; set; } = 15;
public class UnderwaterOptions {
public bool EnableUnderwater { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public int SymbolCountMobile { get; set; } = 2;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableLightRays { get; set; } = true;
public int SeaweedCount { get; set; } = 30;
public int SeaweedCount { get; set; } = 50;
public int CrabCount { get; set; } = 2;
public int StarfishCount { get; set; } = 2;
public int ShellCount { get; set; } = 2;
@@ -430,15 +390,4 @@ public class UnderwaterOptions
public int SeahorseCount { get; set; } = 3;
public int JellyfishCount { get; set; } = 3;
public int TurtleCount { get; set; } = 1;
}
public class BirthdayOptions
{
public int SymbolCount { get; set; } = 5;
public int ConfettiCount { get; set; } = 60;
public bool EnableBirthday { get; set; } = true;
public bool EnableRandomSymbols { get; set; } = true;
public bool EnableRandomSymbolsMobile { get; set; } = false;
public bool EnableDifferentDuration { get; set; } = true;
public bool EnableGarland { get; set; } = true;
}
}

View File

@@ -388,6 +388,12 @@
<input is="emby-input" type="number" id="SpookySize" name="SpookySize" />
<div class="fieldDescription">Size of the floating symbols in pixels (default 30).</div>
</div>
<div class="checkboxContainer">
<label class="emby-checkbox-label">
<input id="EnableDifferentDurationSpooky" name="EnableDifferentDurationSpooky" type="checkbox" is="emby-checkbox" />
<span>Enable Different Symbol Durations</span>
</label>
</div>
<div class="checkboxContainer">
<label class="emby-checkbox-label">
<input id="EnableSpookySway" name="EnableSpookySway" type="checkbox" is="emby-checkbox" />
@@ -1779,6 +1785,7 @@
// Advanced Config
// Autumn
document.querySelector('#EnableAutumn').checked = config.Autumn.EnableAutumn;
document.querySelector('#AutumnLeafCount').value = config.Autumn.LeafCount;
document.querySelector('#EnableRandomLeaves').checked = config.Autumn.EnableRandomLeaves;
@@ -1786,152 +1793,49 @@
document.querySelector('#EnableDifferentDurationAutumn').checked = config.Autumn.EnableDifferentDuration;
document.querySelector('#EnableRotation').checked = config.Autumn.EnableRotation;
// Snowflakes
document.querySelector('#SnowflakesCount').value = config.Snowflakes.SnowflakeCount;
document.querySelector('#EnableSnowflakes').checked = config.Snowflakes.EnableSnowflakes;
document.querySelector('#EnableRandomSnowflakes').checked = config.Snowflakes.EnableRandomSnowflakes;
document.querySelector('#EnableRandomSnowflakesMobile').checked = config.Snowflakes.EnableRandomSnowflakesMobile;
document.querySelector('#EnableColoredSnowflakes').checked = config.Snowflakes.EnableColoredSnowflakes;
document.querySelector('#EnableDifferentDurationSnowflakes').checked = config.Snowflakes.EnableDifferentDuration;
// Snowfall
document.querySelector('#EnableSnowfall').checked = config.Snowfall.EnableSnowfall;
document.querySelector('#SnowfallCount').value = config.Snowfall.SnowflakesCount;
document.querySelector('#SnowfallCountMobile').value = config.Snowfall.SnowflakesCountMobile;
document.querySelector('#SnowfallSpeed').value = config.Snowfall.Speed;
// Snowstorm
document.querySelector('#EnableSnowstorm').checked = config.Snowstorm.EnableSnowstorm;
document.querySelector('#SnowstormCount').value = config.Snowstorm.SnowflakesCount;
document.querySelector('#SnowstormCountMobile').value = config.Snowstorm.SnowflakesCountMobile;
document.querySelector('#SnowstormSpeed').value = config.Snowstorm.Speed;
document.querySelector('#SnowstormHorizontalWind').value = config.Snowstorm.HorizontalWind;
document.querySelector('#SnowstormVerticalVariation').value = config.Snowstorm.VerticalVariation;
// Fireworks
document.querySelector('#EnableFireworks').checked = config.Fireworks.EnableFireworks;
document.querySelector('#FireworksParticles').value = config.Fireworks.ParticleCount;
document.querySelector('#FireworksInterval').value = config.Fireworks.LaunchInterval;
document.querySelector('#ScrollFireworks').checked = config.Fireworks.ScrollFireworks;
document.querySelector('#MinFireworks').value = config.Fireworks.MinFireworks;
document.querySelector('#MaxFireworks').value = config.Fireworks.MaxFireworks;
// Eid
document.querySelector('#EidSymbolCount').value = config.Eid.SymbolCount || 25;
// Spooky Theme
document.querySelector('#SpookyCount').value = config.Spooky.SymbolCount || 25;
// Sports
document.querySelector('#EnableSports').checked = config.Sports.EnableSports || false;
document.querySelector('#EnableRandomSymbolsSports').checked = config.Sports.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileSports').checked = config.Sports.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationSports').checked = config.Sports.EnableDifferentDuration || false;
document.querySelector('#SportsSymbolCount').value = config.Sports.SymbolCount || 25;
// Olympia
document.querySelector('#EnableOlympia').checked = config.Olympia.EnableOlympia || false;
document.querySelector('#EnableRandomSymbolsOlympia').checked = config.Olympia.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileOlympia').checked = config.Olympia.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationOlympia').checked = config.Olympia.EnableDifferentDuration || false;
document.querySelector('#OlympiaSymbolCount').value = config.Olympia.SymbolCount || 25;
// Space
document.querySelector('#EnableSpace').checked = config.Space.EnableSpace || false;
document.querySelector('#EnableRandomSymbolsSpace').checked = config.Space.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileSpace').checked = config.Space.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationSpace').checked = config.Space.EnableDifferentDuration || false;
document.querySelector('#PlanetCount').value = config.Space.PlanetCount !== undefined ? config.Space.PlanetCount : 12;
document.querySelector('#AstronautCount').value = config.Space.AstronautCount !== undefined ? config.Space.AstronautCount : 5;
document.querySelector('#SatelliteCount').value = config.Space.SatelliteCount !== undefined ? config.Space.SatelliteCount : 2;
document.querySelector('#IssCount').value = config.Space.IssCount !== undefined ? config.Space.IssCount : 1;
document.querySelector('#RocketCount').value = config.Space.RocketCount !== undefined ? config.Space.RocketCount : 1;
// Underwater
document.querySelector('#EnableUnderwater').checked = config.Underwater.EnableUnderwater || false;
document.querySelector('#EnableRandomSymbolsUnderwater').checked = config.Underwater.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileUnderwater').checked = config.Underwater.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationUnderwater').checked = config.Underwater.EnableDifferentDuration || false;
document.querySelector('#UnderwaterSeaweedCount').value = config.Underwater.SeaweedCount !== undefined ? config.Underwater.SeaweedCount : 30;
document.querySelector('#UnderwaterFishCount').value = config.Underwater.FishCount !== undefined ? config.Underwater.FishCount : 15;
document.querySelector('#UnderwaterSeahorseCount').value = config.Underwater.SeahorseCount !== undefined ? config.Underwater.SeahorseCount : 3;
document.querySelector('#UnderwaterJellyfishCount').value = config.Underwater.JellyfishCount !== undefined ? config.Underwater.JellyfishCount : 3;
document.querySelector('#UnderwaterTurtleCount').value = config.Underwater.TurtleCount !== undefined ? config.Underwater.TurtleCount : 1;
document.querySelector('#UnderwaterCrabCount').value = config.Underwater.CrabCount !== undefined ? config.Underwater.CrabCount : 2;
document.querySelector('#UnderwaterStarfishCount').value = config.Underwater.StarfishCount !== undefined ? config.Underwater.StarfishCount : 2;
document.querySelector('#UnderwaterShellCount').value = config.Underwater.ShellCount !== undefined ? config.Underwater.ShellCount : 2;
// Birthday
document.querySelector('#EnableBirthday').checked = config.Birthday.EnableBirthday || false;
document.querySelector('#EnableBirthday').checked = config.Birthday.EnableBirthday !== false;
document.querySelector('#EnableGarland').checked = config.Birthday.EnableGarland !== false;
document.querySelector('#EnableRandomSymbolsBirthday').checked = config.Birthday.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileBirthday').checked = config.Birthday.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationBirthday').checked = config.Birthday.EnableDifferentDuration || false;
document.querySelector('#EnableRandomSymbolsBirthday').checked = config.Birthday.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileBirthday').checked = config.Birthday.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationBirthday').checked = config.Birthday.EnableDifferentDuration !== false;
document.querySelector('#BirthdaySymbolCount').value = config.Birthday.SymbolCount || 25;
document.querySelector('#BirthdayConfettiCount').value = config.Birthday.ConfettiCount || 60;
config.Birthday = config.Birthday || {};
// Sports
if (!config.Sports) config.Sports = { EnableSports: true, SymbolCount: 25, EnableRandomSymbols: true, EnableRandomSymbolsMobile: false, EnableDifferentDuration: true };
document.querySelector('#EnableSports').checked = config.Sports.EnableSports !== false;
document.querySelector('#EnableRandomSymbolsSports').checked = config.Sports.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileSports').checked = config.Sports.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationSports').checked = config.Sports.EnableDifferentDuration !== false;
document.querySelector('#SportsSymbolCount').value = config.Sports.SymbolCount || 25;
document.querySelector('#TurfColor').value = config.Sports.TurfColor || '#228b22';
document.querySelector('#EnableTrophy').checked = config.Sports.EnableTrophy !== false;
// Load Checkboxes
const savedBallsString = config.Sports.SportsBalls || 'football,basketball,tennis,volleyball';
const savedBalls = savedBallsString.split(',');
document.querySelectorAll('.sport-ball-cb').forEach(cb => {
// Support for both new category string and legacy filename strings
cb.checked = savedBalls.some(b => b === cb.value || b.startsWith(cb.value + '_'));
});
// Carnival
// Olympia
if (!config.Olympia) config.Olympia = { EnableOlympia: true, SymbolCount: 25, EnableRandomSymbols: true, EnableRandomSymbolsMobile: false, EnableDifferentDuration: true };
document.querySelector('#EnableOlympia').checked = config.Olympia.EnableOlympia !== false;
document.querySelector('#EnableRandomSymbolsOlympia').checked = config.Olympia.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileOlympia').checked = config.Olympia.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationOlympia').checked = config.Olympia.EnableDifferentDuration !== false;
document.querySelector('#OlympiaSymbolCount').value = config.Olympia.SymbolCount || 25;
document.querySelector('#EnableCarnival').checked = config.Carnival.EnableCarnival;
document.querySelector('#EnableCarnivalSway').checked = config.Carnival.EnableCarnivalSway !== undefined ? config.Carnival.EnableCarnivalSway : true;
document.querySelector('#CarnivalObjectCount').value = config.Carnival.ObjectCount;
document.querySelector('#EnableRandomCarnival').checked = config.Carnival.EnableRandomCarnival;
document.querySelector('#EnableRandomCarnivalMobile').checked = config.Carnival.EnableRandomCarnivalMobile;
document.querySelector('#EnableDifferentDurationCarnival').checked = config.Carnival.EnableDifferentDuration;
// Halloween
document.querySelector('#EnableHalloween').checked = config.Halloween.EnableHalloween;
document.querySelector('#HalloweenCount').value = config.Halloween.SymbolCount;
document.querySelector('#EnableRandomHalloween').checked = config.Halloween.EnableRandomSymbols;
document.querySelector('#EnableRandomHalloweenMobile').checked = config.Halloween.EnableRandomSymbolsMobile;
document.querySelector('#EnableDifferentDurationHalloween').checked = config.Halloween.EnableDifferentDuration;
document.querySelector('#EnableSpiders').checked = config.Halloween.EnableSpiders !== undefined ? config.Halloween.EnableSpiders : true;
document.querySelector('#EnableMice').checked = config.Halloween.EnableMice !== undefined ? config.Halloween.EnableMice : true;
// CherryBlossom
// Hearts
document.querySelector('#EnableHearts').checked = config.Hearts.EnableHearts;
document.querySelector('#HeartsCount').value = config.Hearts.SymbolCount;
document.querySelector('#EnableRandomHearts').checked = config.Hearts.EnableRandomSymbols;
document.querySelector('#EnableRandomHeartsMobile').checked = config.Hearts.EnableRandomSymbolsMobile;
document.querySelector('#EnableDifferentDurationHearts').checked = config.Hearts.EnableDifferentDuration;
document.querySelector('#EnableCherryBlossom').checked = config.CherryBlossom.EnableCherryBlossom;
document.querySelector('#CherryBlossomPetalCount').value = config.CherryBlossom.PetalCount;
document.querySelector('#EnableRandomCherryBlossom').checked = config.CherryBlossom.EnableRandomCherryBlossom;
document.querySelector('#EnableRandomCherryBlossomMobile').checked = config.CherryBlossom.EnableRandomCherryBlossomMobile;
document.querySelector('#EnableDifferentDurationCherryBlossom').checked = config.CherryBlossom.EnableDifferentDuration;
// Christmas
document.querySelector('#EnableChristmas').checked = config.Christmas.EnableChristmas;
document.querySelector('#ChristmasCount').value = config.Christmas.SymbolCount;
document.querySelector('#EnableRandomChristmas').checked = config.Christmas.EnableRandomChristmas;
document.querySelector('#EnableRandomChristmasMobile').checked = config.Christmas.EnableRandomChristmasMobile;
document.querySelector('#EnableDifferentDurationChristmas').checked = config.Christmas.EnableDifferentDuration;
// Santa
document.querySelector('#EnableSanta').checked = config.Santa.EnableSanta;
document.querySelector('#SantaSnowflakes').value = config.Santa.SnowflakesCount;
document.querySelector('#SantaSnowflakesMobile').value = config.Santa.SnowflakesCountMobile;
document.querySelector('#SantaSpeed').value = config.Santa.SantaSpeed;
document.querySelector('#SantaSpeedMobile').value = config.Santa.SantaSpeedMobile;
document.querySelector('#SantaSnowFallSpeed').value = config.Santa.SnowFallSpeed;
document.querySelector('#MaxSantaRestTime').value = config.Santa.MaxSantaRestTime;
document.querySelector('#MinSantaRestTime').value = config.Santa.MinSantaRestTime;
document.querySelector('#MaxPresentFallSpeed').value = config.Santa.MaxPresentFallSpeed;
document.querySelector('#MinPresentFallSpeed').value = config.Santa.MinPresentFallSpeed;
// EarthDay
document.querySelector('#EnableEarthDay').checked = config.EarthDay.EnableEarthDay;
document.querySelector('#EarthDayVineCount').value = config.EarthDay.VineCount;
// Easter
document.querySelector('#EnableEaster').checked = config.Easter.EnableEaster;
document.querySelector('#EasterEggCount').value = config.Easter.EggCount;
document.querySelector('#EnableRandomEaster').checked = config.Easter.EnableRandomEaster;
@@ -1943,14 +1847,163 @@
document.querySelector('#MinBunnyRestTime').value = config.Easter.MinBunnyRestTime;
document.querySelector('#MaxBunnyRestTime').value = config.Easter.MaxBunnyRestTime;
// Eurovision
document.querySelector('#EnableEurovision').checked = config.Eurovision.EnableEurovision;
document.querySelector('#EurovisionSymbolCount').value = config.Eurovision.SymbolCount;
document.querySelector('#EnableRandomEurovision').checked = config.Eurovision.EnableRandomEurovision;
document.querySelector('#EnableRandomEurovisionMobile').checked = config.Eurovision.EnableRandomEurovisionMobile;
document.querySelector('#EnableDifferentDurationEurovision').checked = config.Eurovision.EnableDifferentDuration;
document.querySelector('#EnableColorfulNotes').checked = config.Eurovision.EnableColorfulNotes;
document.querySelector('#EurovisionColors').value = config.Eurovision.EurovisionColors;
document.querySelector('#EurovisionGlowSize').value = config.Eurovision.EurovisionGlowSize;
// Fireworks
document.querySelector('#EnableFireworks').checked = config.Fireworks.EnableFireworks;
document.querySelector('#FireworksParticles').value = config.Fireworks.ParticleCount;
document.querySelector('#FireworksInterval').value = config.Fireworks.LaunchInterval;
document.querySelector('#ScrollFireworks').checked = config.Fireworks.ScrollFireworks;
document.querySelector('#MinFireworks').value = config.Fireworks.MinFireworks;
document.querySelector('#MaxFireworks').value = config.Fireworks.MaxFireworks;
// Halloween
document.querySelector('#EnableHalloween').checked = config.Halloween.EnableHalloween;
document.querySelector('#HalloweenCount').value = config.Halloween.SymbolCount;
document.querySelector('#EnableRandomHalloween').checked = config.Halloween.EnableRandomSymbols;
document.querySelector('#EnableRandomHalloweenMobile').checked = config.Halloween.EnableRandomSymbolsMobile;
document.querySelector('#EnableDifferentDurationHalloween').checked = config.Halloween.EnableDifferentDuration;
document.querySelector('#EnableSpiders').checked = config.Halloween.EnableSpiders !== undefined ? config.Halloween.EnableSpiders : true;
document.querySelector('#EnableMice').checked = config.Halloween.EnableMice !== undefined ? config.Halloween.EnableMice : true;
// Hearts
document.querySelector('#EnableHearts').checked = config.Hearts.EnableHearts;
document.querySelector('#HeartsCount').value = config.Hearts.SymbolCount;
document.querySelector('#EnableRandomHearts').checked = config.Hearts.EnableRandomSymbols;
document.querySelector('#EnableRandomHeartsMobile').checked = config.Hearts.EnableRandomSymbolsMobile;
document.querySelector('#EnableDifferentDurationHearts').checked = config.Hearts.EnableDifferentDuration;
// Matrix
document.querySelector('#EnableMatrix').checked = config.Matrix.EnableMatrix;
document.querySelector('#MatrixSymbolCount').value = config.Matrix.SymbolCount;
document.querySelector('#MatrixChars').value = config.Matrix.MatrixChars !== undefined ? config.Matrix.MatrixChars : '0123456789';
document.querySelector('#EnableRandomMatrix').checked = config.Matrix.EnableRandomMatrix;
document.querySelector('#EnableRandomMatrixMobile').checked = config.Matrix.EnableRandomMatrixMobile;
document.querySelector('#EnableDifferentDurationMatrix').checked = config.Matrix.EnableDifferentDuration;
document.querySelector('#EnableMatrixBackground').checked = config.Matrix.EnableMatrixBackground !== undefined ? config.Matrix.EnableMatrixBackground : false;
// Olympia
if (!config.Olympia) config.Olympia = { EnableOlympia: true, SymbolCount: 25, EnableRandomSymbols: true, EnableRandomSymbolsMobile: false, EnableDifferentDuration: true };
document.querySelector('#EnableOlympia').checked = config.Olympia.EnableOlympia !== false;
document.querySelector('#EnableRandomSymbolsOlympia').checked = config.Olympia.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileOlympia').checked = config.Olympia.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationOlympia').checked = config.Olympia.EnableDifferentDuration !== false;
document.querySelector('#OlympiaSymbolCount').value = config.Olympia.SymbolCount || 25;
// Pride
document.querySelector('#EnablePride').checked = config.Pride.EnablePride;
document.querySelector('#PrideHeartCount').value = config.Pride.HeartCount;
document.querySelector('#PrideHeartSize').value = config.Pride.HeartSize;
document.querySelector('#PrideColorHeader').checked = config.Pride.ColorHeader;
// Rain
document.querySelector('#EnableRain').checked = config.Rain.EnableRain;
document.querySelector('#RaindropCount').value = config.Rain.RaindropCount;
document.querySelector('#RaindropCountMobile').value = config.Rain.RaindropCountMobile;
document.querySelector('#RainSpeed').value = config.Rain.RainSpeed;
// Resurrection
document.querySelector('#EnableResurrection').checked = config.Resurrection.EnableResurrection;
document.querySelector('#ResurrectionSymbolCount').value = config.Resurrection.SymbolCount;
document.querySelector('#EnableRandomResurrection').checked = config.Resurrection.EnableRandomSymbols;
document.querySelector('#EnableRandomResurrectionMobile').checked = config.Resurrection.EnableRandomSymbolsMobile;
document.querySelector('#EnableDifferentDurationResurrection').checked = config.Resurrection.EnableDifferentDuration;
// Santa
document.querySelector('#EnableSanta').checked = config.Santa.EnableSanta;
document.querySelector('#SantaSnowflakes').value = config.Santa.SnowflakesCount;
document.querySelector('#SantaSnowflakesMobile').value = config.Santa.SnowflakesCountMobile;
document.querySelector('#SantaSpeed').value = config.Santa.SantaSpeed;
document.querySelector('#SantaSpeedMobile').value = config.Santa.SantaSpeedMobile;
document.querySelector('#SantaSnowFallSpeed').value = config.Santa.SnowFallSpeed;
document.querySelector('#MaxSantaRestTime').value = config.Santa.MaxSantaRestTime;
document.querySelector('#MinSantaRestTime').value = config.Santa.MinSantaRestTime;
document.querySelector('#MaxPresentFallSpeed').value = config.Santa.MaxPresentFallSpeed;
document.querySelector('#MinPresentFallSpeed').value = config.Santa.MinPresentFallSpeed;
// Snowfall
document.querySelector('#EnableSnowfall').checked = config.Snowfall.EnableSnowfall;
document.querySelector('#SnowfallCount').value = config.Snowfall.SnowflakesCount;
document.querySelector('#SnowfallCountMobile').value = config.Snowfall.SnowflakesCountMobile;
document.querySelector('#SnowfallSpeed').value = config.Snowfall.Speed;
// Snowflakes
document.querySelector('#SnowflakesCount').value = config.Snowflakes.SnowflakeCount;
document.querySelector('#EnableSnowflakes').checked = config.Snowflakes.EnableSnowflakes;
document.querySelector('#EnableRandomSnowflakes').checked = config.Snowflakes.EnableRandomSnowflakes;
document.querySelector('#EnableRandomSnowflakesMobile').checked = config.Snowflakes.EnableRandomSnowflakesMobile;
document.querySelector('#EnableColoredSnowflakes').checked = config.Snowflakes.EnableColoredSnowflakes;
document.querySelector('#EnableDifferentDurationSnowflakes').checked = config.Snowflakes.EnableDifferentDuration;
// Snowstorm
document.querySelector('#EnableSnowstorm').checked = config.Snowstorm.EnableSnowstorm;
document.querySelector('#SnowstormCount').value = config.Snowstorm.SnowflakesCount;
document.querySelector('#SnowstormCountMobile').value = config.Snowstorm.SnowflakesCountMobile;
document.querySelector('#SnowstormSpeed').value = config.Snowstorm.Speed;
document.querySelector('#SnowstormHorizontalWind').value = config.Snowstorm.HorizontalWind;
document.querySelector('#SnowstormVerticalVariation').value = config.Snowstorm.VerticalVariation;
// Space
document.querySelector('#EnableSpace').checked = config.Space.EnableSpace || false;
document.querySelector('#EnableRandomSymbolsSpace').checked = config.Space.EnableRandomSymbols || false;
document.querySelector('#EnableRandomSymbolsMobileSpace').checked = config.Space.EnableRandomSymbolsMobile || false;
document.querySelector('#EnableDifferentDurationSpace').checked = config.Space.EnableDifferentDuration || false;
document.querySelector('#PlanetCount').value = config.Space.PlanetCount !== undefined ? config.Space.PlanetCount : 12;
document.querySelector('#AstronautCount').value = config.Space.AstronautCount !== undefined ? config.Space.AstronautCount : 5;
document.querySelector('#SatelliteCount').value = config.Space.SatelliteCount !== undefined ? config.Space.SatelliteCount : 2;
document.querySelector('#IssCount').value = config.Space.IssCount !== undefined ? config.Space.IssCount : 1;
document.querySelector('#RocketCount').value = config.Space.RocketCount !== undefined ? config.Space.RocketCount : 1;
// Spooky
document.querySelector('#SpookyCount').value = config.Spooky.SymbolCount !== undefined ? config.Spooky.SymbolCount : 25;
document.querySelector('#EnableSpooky').checked = config.Spooky.EnableSpooky !== undefined ? config.Spooky.EnableSpooky : true;
document.querySelector('#SpookySize').value = config.Spooky.SpookySize !== undefined ? config.Spooky.SpookySize : 30;
document.querySelector('#EnableSpookySway').checked = config.Spooky.EnableSpookySway !== undefined ? config.Spooky.EnableSpookySway : true;
document.querySelector('#SpookyGlowSize').value = config.Spooky.SpookyGlowSize !== undefined ? config.Spooky.SpookyGlowSize : 5;
document.querySelector('#EnableDifferentDurationSpooky').checked = config.Spooky.EnableDifferentDuration !== false;
// Sports
if (!config.Sports) config.Sports = { EnableSports: true, SymbolCount: 25, EnableRandomSymbols: true, EnableRandomSymbolsMobile: false, EnableDifferentDuration: true };
// Load Checkboxes
const savedBallsString = config.Sports.SportsBalls || 'football,basketball,tennis,volleyball';
const savedBalls = savedBallsString.split(',');
document.querySelector('#EnableSports').checked = config.Sports.EnableSports !== false;
document.querySelector('#EnableRandomSymbolsSports').checked = config.Sports.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileSports').checked = config.Sports.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationSports').checked = config.Sports.EnableDifferentDuration !== false;
document.querySelector('#SportsSymbolCount').value = config.Sports.SymbolCount || 25;
document.querySelector('#TurfColor').value = config.Sports.TurfColor || '#228b22';
document.querySelector('#EnableTrophy').checked = config.Sports.EnableTrophy !== false;
document.querySelectorAll('.sport-ball-cb').forEach(cb => {
// Spring
document.querySelector('#EnableSpring').checked = config.Spring.EnableSpring;
document.querySelector('#EnableSpringSunbeams').checked = config.Spring.EnableSpringSunbeams !== undefined ? config.Spring.EnableSpringSunbeams : true;
document.querySelector('#SpringPollenCount').value = config.Spring.PollenCount;
@@ -1963,7 +2016,16 @@
document.querySelector('#EnableRandomSpringMobile').checked = config.Spring.EnableRandomSpringMobile;
document.querySelector('#EnableDifferentDurationSpring').checked = config.Spring.EnableDifferentDuration;
// Storm
document.querySelector('#EnableStorm').checked = config.Storm.EnableStorm;
document.querySelector('#StormRaindropCount').value = config.Storm.RaindropCount;
document.querySelector('#StormRaindropCountMobile').value = config.Storm.RaindropCountMobile;
document.querySelector('#StormRainSpeed').value = config.Storm.RainSpeed;
document.querySelector('#StormEnableLightning').checked = config.Storm.EnableLightning;
// Summer
document.querySelector('#EnableSummer').checked = config.Summer.EnableSummer;
document.querySelector('#SummerBubbleCount').value = config.Summer.BubbleCount;
document.querySelector('#SummerDustCount').value = config.Summer.DustCount;
@@ -1971,88 +2033,29 @@
document.querySelector('#EnableRandomSummerMobile').checked = config.Summer.EnableRandomSummerMobile;
document.querySelector('#EnableDifferentDurationSummer').checked = config.Summer.EnableDifferentDuration;
// Carnival
document.querySelector('#EnableCarnival').checked = config.Carnival.EnableCarnival;
document.querySelector('#EnableCarnivalSway').checked = config.Carnival.EnableCarnivalSway !== undefined ? config.Carnival.EnableCarnivalSway : true;
document.querySelector('#CarnivalObjectCount').value = config.Carnival.ObjectCount;
document.querySelector('#EnableRandomCarnival').checked = config.Carnival.EnableRandomCarnival;
document.querySelector('#EnableRandomCarnivalMobile').checked = config.Carnival.EnableRandomCarnivalMobile;
document.querySelector('#EnableDifferentDurationCarnival').checked = config.Carnival.EnableDifferentDuration;
// Support for both new category string and legacy filename strings
cb.checked = savedBalls.some(b => b === cb.value || b.startsWith(cb.value + '_'));
});
// Cherry Blossom
document.querySelector('#EnableCherryBlossom').checked = config.CherryBlossom.EnableCherryBlossom;
document.querySelector('#CherryBlossomPetalCount').value = config.CherryBlossom.PetalCount;
document.querySelector('#EnableRandomCherryBlossom').checked = config.CherryBlossom.EnableRandomCherryBlossom;
document.querySelector('#EnableRandomCherryBlossomMobile').checked = config.CherryBlossom.EnableRandomCherryBlossomMobile;
document.querySelector('#EnableDifferentDurationCherryBlossom').checked = config.CherryBlossom.EnableDifferentDuration;
// Earth Day
document.querySelector('#EnableEarthDay').checked = config.EarthDay.EnableEarthDay;
document.querySelector('#EarthDayVineCount').value = config.EarthDay.VineCount;
// Eurovision
document.querySelector('#EnableEurovision').checked = config.Eurovision.EnableEurovision;
document.querySelector('#EurovisionSymbolCount').value = config.Eurovision.SymbolCount;
document.querySelector('#EnableRandomEurovision').checked = config.Eurovision.EnableRandomEurovision;
document.querySelector('#EnableRandomEurovisionMobile').checked = config.Eurovision.EnableRandomEurovisionMobile;
document.querySelector('#EnableDifferentDurationEurovision').checked = config.Eurovision.EnableDifferentDuration;
document.querySelector('#EnableColorfulNotes').checked = config.Eurovision.EnableColorfulNotes;
document.querySelector('#EurovisionColors').value = config.Eurovision.EurovisionColors;
document.querySelector('#EurovisionGlowSize').value = config.Eurovision.EurovisionGlowSize;
// Matrix
document.querySelector('#EnableMatrix').checked = config.Matrix.EnableMatrix;
document.querySelector('#MatrixSymbolCount').value = config.Matrix.SymbolCount;
document.querySelector('#MatrixChars').value = config.Matrix.MatrixChars !== undefined ? config.Matrix.MatrixChars : '0123456789';
document.querySelector('#EnableRandomMatrix').checked = config.Matrix.EnableRandomMatrix;
document.querySelector('#EnableRandomMatrixMobile').checked = config.Matrix.EnableRandomMatrixMobile;
document.querySelector('#EnableDifferentDurationMatrix').checked = config.Matrix.EnableDifferentDuration;
document.querySelector('#EnableMatrixBackground').checked = config.Matrix.EnableMatrixBackground !== undefined ? config.Matrix.EnableMatrixBackground : false;
// Pride
document.querySelector('#EnablePride').checked = config.Pride.EnablePride;
document.querySelector('#PrideHeartCount').value = config.Pride.HeartCount;
document.querySelector('#PrideHeartSize').value = config.Pride.HeartSize;
document.querySelector('#PrideColorHeader').checked = config.Pride.ColorHeader;
// Spooky Theme
document.querySelector('#EnableSpooky').checked = config.Spooky.EnableSpooky !== undefined ? config.Spooky.EnableSpooky : true;
document.querySelector('#SpookyCount').value = config.Spooky.SymbolCount !== undefined ? config.Spooky.SymbolCount : 25;
document.querySelector('#SpookySize').value = config.Spooky.SpookySize !== undefined ? config.Spooky.SpookySize : 30;
document.querySelector('#EnableSpookySway').checked = config.Spooky.EnableSpookySway !== undefined ? config.Spooky.EnableSpookySway : true;
document.querySelector('#SpookyGlowSize').value = config.Spooky.SpookyGlowSize !== undefined ? config.Spooky.SpookyGlowSize : 5;
// Rain
document.querySelector('#EnableRain').checked = config.Rain.EnableRain;
document.querySelector('#RaindropCount').value = config.Rain.RaindropCount;
document.querySelector('#RaindropCountMobile').value = config.Rain.RaindropCountMobile;
document.querySelector('#RainSpeed').value = config.Rain.RainSpeed;
// Storm
document.querySelector('#EnableStorm').checked = config.Storm.EnableStorm;
document.querySelector('#StormRaindropCount').value = config.Storm.RaindropCount;
document.querySelector('#StormRaindropCountMobile').value = config.Storm.RaindropCountMobile;
document.querySelector('#StormRainSpeed').value = config.Storm.RainSpeed;
document.querySelector('#StormEnableLightning').checked = config.Storm.EnableLightning;
// Underwater
config.Underwater = config.Underwater || {};
document.querySelector('#EnableUnderwater').checked = config.Underwater.EnableUnderwater !== false;
document.querySelector('#EnableUnderwaterLightRays').checked = config.Underwater.EnableLightRays !== false;
document.querySelector('#UnderwaterSymbolCount').value = config.Underwater.SymbolCount || 15;
document.querySelector('#EnableRandomSymbolsUnderwater').checked = config.Underwater.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileUnderwater').checked = config.Underwater.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationUnderwater').checked = config.Underwater.EnableDifferentDuration !== false;
document.querySelector('#UnderwaterSeaweedCount').value = config.Underwater.SeaweedCount !== undefined ? config.Underwater.SeaweedCount : 30;
document.querySelector('#UnderwaterFishCount').value = config.Underwater.FishCount !== undefined ? config.Underwater.FishCount : 15;
document.querySelector('#UnderwaterSeahorseCount').value = config.Underwater.SeahorseCount !== undefined ? config.Underwater.SeahorseCount : 3;
document.querySelector('#UnderwaterJellyfishCount').value = config.Underwater.JellyfishCount !== undefined ? config.Underwater.JellyfishCount : 3;
document.querySelector('#UnderwaterTurtleCount').value = config.Underwater.TurtleCount !== undefined ? config.Underwater.TurtleCount : 1;
document.querySelector('#UnderwaterCrabCount').value = config.Underwater.CrabCount !== undefined ? config.Underwater.CrabCount : 2;
document.querySelector('#UnderwaterStarfishCount').value = config.Underwater.StarfishCount !== undefined ? config.Underwater.StarfishCount : 2;
document.querySelector('#UnderwaterShellCount').value = config.Underwater.ShellCount !== undefined ? config.Underwater.ShellCount : 2;
config.Underwater = config.Underwater || {};
document.querySelector('#EnableUnderwaterLightRays').checked = config.Underwater.EnableLightRays !== false;
document.querySelector('#UnderwaterSymbolCount').value = config.Underwater.SymbolCount || 15;
// Birthday
config.Birthday = config.Birthday || {};
document.querySelector('#EnableBirthday').checked = config.Birthday.EnableBirthday !== false;
document.querySelector('#EnableGarland').checked = config.Birthday.EnableGarland !== false;
document.querySelector('#BirthdaySymbolCount').value = config.Birthday.SymbolCount || 25;
document.querySelector('#BirthdayConfettiCount').value = config.Birthday.ConfettiCount || 60;
document.querySelector('#EnableRandomSymbolsBirthday').checked = config.Birthday.EnableRandomSymbols !== false;
document.querySelector('#EnableRandomSymbolsMobileBirthday').checked = config.Birthday.EnableRandomSymbolsMobile === true;
document.querySelector('#EnableDifferentDurationBirthday').checked = config.Birthday.EnableDifferentDuration !== false;
Dashboard.hideLoadingMsg();
});
@@ -2079,22 +2082,6 @@
config.Autumn.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationAutumn').checked;
config.Autumn.EnableRotation = document.querySelector('#EnableRotation').checked;
// Friday13
if (!config.Friday13) config.Friday13 = {};
config.Friday13.EnableFriday13 = document.querySelector('#EnableFriday13').checked;
config.Friday13.SymbolCount = parseInt(document.querySelector('#Friday13SymbolCount').value);
config.Friday13.EnableRandomSymbols = document.querySelector('#EnableRandomFriday13').checked;
config.Friday13.EnableRandomSymbolsMobile = document.querySelector('#EnableRandomFriday13Mobile').checked;
config.Friday13.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationFriday13').checked;
// Eid
if (!config.Eid) config.Eid = {};
config.Eid.EnableEid = document.querySelector('#EnableEid').checked;
config.Eid.EnableRandomSymbols = document.querySelector('#EnableRandomEid').checked;
config.Eid.EnableRandomSymbolsMobile = document.querySelector('#EnableRandomEidMobile').checked;
config.Eid.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationEid').checked;
config.Eid.SymbolCount = parseInt(document.querySelector('#EidSymbolCount').value);
// Legacy Halloween
if (!config.LegacyHalloween) config.LegacyHalloween = {};
config.LegacyHalloween.SymbolCount = parseInt(document.querySelector('#LegacyHalloweenSymbolCount').value);
@@ -2339,7 +2326,7 @@
config.Underwater.EnableRandomSymbolsMobile = document.querySelector('#EnableRandomUnderwaterMobile').checked;
config.Underwater.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationUnderwater').checked;
// New Themes
// Simple Themes (just on/off toggles)
config.Frost.EnableFrost = document.querySelector('#EnableFrost').checked;
config.FilmNoir.EnableFilmNoir = document.querySelector('#EnableFilmNoir').checked;
config.Oscar.EnableOscar = document.querySelector('#EnableOscar').checked;
@@ -2446,13 +2433,6 @@
config.Olympia.EnableRandomSymbolsMobile = document.querySelector('#EnableRandomSymbolsMobileOlympia').checked;
config.Olympia.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationOlympia').checked;
// Pi-Day
config.PiDay.EnablePiDay = document.querySelector('#EnablePiDay').checked;
config.PiDay.SymbolCount = parseInt(document.querySelector('#PiDaySymbolCount').value);
config.PiDay.EnableRandomPiDay = document.querySelector('#EnableRandomPiDay').checked;
config.PiDay.EnableRandomPiDayMobile = document.querySelector('#EnableRandomPiDayMobile').checked;
config.PiDay.EnableDifferentDuration = document.querySelector('#EnableDifferentDurationPiDay').checked;
// Pride
config.Pride.EnablePride = document.querySelector('#EnablePride').checked;
config.Pride.HeartCount = parseInt(document.querySelector('#PrideHeartCount').value);

View File

@@ -12,7 +12,7 @@
<!-- <TreatWarningsAsErrors>false</TreatWarningsAsErrors> -->
<Title>Jellyfin Seasonals Plugin</Title>
<Authors>CodeDevMLH</Authors>
<Version>2.0.0.0</Version>
<Version>2.0.0.1</Version>
<RepositoryUrl>https://github.com/CodeDevMLH/Jellyfin-Seasonals</RepositoryUrl>
</PropertyGroup>

View File

@@ -1,164 +1,139 @@
.autumn-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.leaf {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
-webkit-user-select: none;
cursor: default;
-webkit-animation-name: leaf-fall, leaf-shake;
-webkit-animation-duration: 7s, 4s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
-webkit-user-select: none;
animation-name: leaf-fall, leaf-shake;
animation-duration: 7s, 4s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
/* Class to disable rotation */
.no-rotation {
--rotate-start: 0deg !important;
--rotate-end: 0deg !important;
}
@-webkit-keyframes leaf-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 100vh;
}
}
@keyframes leaf-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 100vh;
}
}
@-webkit-keyframes leaf-shake {
0%, 100% {
transform: translateX(0) rotate(var(--rotate-start, -20deg));
}
50% {
transform: translateX(80px) rotate(var(--rotate-end, 20deg));
}
}
@keyframes leaf-shake {
0%, 100% {
transform: translateX(0) rotate(var(--rotate-start, -20deg));
}
50% {
transform: translateX(80px) rotate(var(--rotate-end, 20deg));
}
}
.leaf:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
--rotate-start: -25deg;
--rotate-end: 22deg;
}
.leaf:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 0.5s;
--rotate-start: -32deg;
--rotate-end: 35deg;
}
.leaf:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 1s;
--rotate-start: -28deg;
--rotate-end: 28deg;
}
.leaf:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 1.5s;
--rotate-start: -38deg;
--rotate-end: 32deg;
}
.leaf:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 0.8s;
--rotate-start: -22deg;
--rotate-end: 38deg;
}
.leaf:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 2s;
--rotate-start: -35deg;
--rotate-end: 25deg;
}
.leaf:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 1.2s;
--rotate-start: -40deg;
--rotate-end: 40deg;
}
.leaf:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 0.3s;
--rotate-start: -30deg;
--rotate-end: 30deg;
}
.leaf:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 1.8s;
--rotate-start: -26deg;
--rotate-end: 36deg;
}
.leaf:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 0.7s;
--rotate-start: -34deg;
--rotate-end: 24deg;
}
.leaf:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 2.3s;
--rotate-start: -29deg;
--rotate-end: 33deg;
}
.leaf:nth-of-type(11) {
left: 65%;
animation-delay: 4s, 1.4s;
--rotate-start: -37deg;
--rotate-end: 27deg;
.autumn-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.leaf {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
cursor: default;
animation-name: leaf-fall, leaf-shake;
animation-duration: 7s, 4s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
/* Class to disable rotation */
.no-rotation {
--rotate-start: 0deg !important;
--rotate-end: 0deg !important;
}
@keyframes leaf-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 100vh;
}
}
@keyframes leaf-shake {
0%, 100% {
transform: translateX(0) rotate(var(--rotate-start, -20deg));
}
50% {
transform: translateX(80px) rotate(var(--rotate-end, 20deg));
}
}
.leaf:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
--rotate-start: -25deg;
--rotate-end: 22deg;
}
.leaf:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 0.5s;
--rotate-start: -32deg;
--rotate-end: 35deg;
}
.leaf:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 1s;
--rotate-start: -28deg;
--rotate-end: 28deg;
}
.leaf:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 1.5s;
--rotate-start: -38deg;
--rotate-end: 32deg;
}
.leaf:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 0.8s;
--rotate-start: -22deg;
--rotate-end: 38deg;
}
.leaf:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 2s;
--rotate-start: -35deg;
--rotate-end: 25deg;
}
.leaf:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 1.2s;
--rotate-start: -40deg;
--rotate-end: 40deg;
}
.leaf:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 0.3s;
--rotate-start: -30deg;
--rotate-end: 30deg;
}
.leaf:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 1.8s;
--rotate-start: -26deg;
--rotate-end: 36deg;
}
.leaf:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 0.7s;
--rotate-start: -34deg;
--rotate-end: 24deg;
}
.leaf:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 2.3s;
--rotate-start: -29deg;
--rotate-end: 33deg;
}
.leaf:nth-of-type(11) {
left: 65%;
animation-delay: 4s, 1.4s;
--rotate-start: -37deg;

View File

@@ -1,11 +1,11 @@
const config = window.SeasonalsPluginConfig?.Autumn || {};
const leaves = config.EnableAutumn !== undefined ? config.EnableAutumn : true; // enable/disable leaves
const leaves = config.EnableAutumn !== undefined ? config.EnableAutumn : true; // enable/disable autumn
const randomLeaves = config.EnableRandomLeaves !== undefined ? config.EnableRandomLeaves : true; // enable random leaves
const randomLeavesMobile = config.EnableRandomLeavesMobile !== undefined ? config.EnableRandomLeavesMobile : false; // enable random leaves on mobile devices (Warning: High values may affect performance)
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different duration for the random leaves
const enableRotation = config.EnableRotation !== undefined ? config.EnableRotation : false; // enable/disable leaf rotation
const leafCount = config.LeafCount || 25; // count of random extra leaves
const randomLeavesMobile = config.EnableRandomLeavesMobile !== undefined ? config.EnableRandomLeavesMobile : false; // enable random leaves on mobile
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableRotation = config.EnableRotation !== undefined ? config.EnableRotation : false; // enable/disable rotation
const leafCount = config.LeafCount !== undefined ? config.LeafCount : 25; // count of random extra leaves
const images = [
"../Seasonals/Resources/autumn_images/acorn1.png",

View File

@@ -5,12 +5,14 @@
width: 100vw;
height: 100vh;
pointer-events: none;
z-index: 9999;
z-index: 10;
overflow: hidden;
contain: strict;
contain: layout paint;
}
.birthday-symbol {
will-change: opacity;
position: fixed;
top: 0;
left: 0;
@@ -29,7 +31,7 @@
}
.birthday-inner {
pointer-events: auto; /* Allow hover over the actual item */
pointer-events: auto;
cursor: crosshair;
display: inline-block;
}
@@ -138,7 +140,7 @@
opacity: 1;
}
100% {
transform: translateY(calc(var(--burst-y) + 150px)); /* Gravity pull downwards */
transform: translateY(calc(var(--burst-y) + 150px));
opacity: 0;
}
}

View File

@@ -228,7 +228,19 @@ function createBirthday() {
// Ensure the burst container is appended to the main document body or the birthday container
createBalloonPopConfetti(document.body, cx, cy, balloonColors[randomItem]);
}
}, { once: true });
});
// Reset the balloon when it reappears at the bottom of the screen
symbol.addEventListener('animationiteration', function(e) {
// Ignore bubbling events from the inner sway animation
if (e.animationName === 'birthday-rise' || e.target === symbol) {
if (innerDiv.classList.contains('popped')) {
innerDiv.classList.remove('popped');
innerDiv.style.animation = '';
innerDiv.style.pointerEvents = 'auto';
}
}
});
}
const startRot = (Math.random() * 20) - 10; // -10 to +10 spread

View File

@@ -1,11 +1,11 @@
const config = window.SeasonalsPluginConfig?.Carnival || {};
const carnival = config.EnableCarnival !== undefined ? config.EnableCarnival : true; // Enable/disable carnival
const randomCarnival = config.EnableRandomCarnival !== undefined ? config.EnableRandomCarnival : true; // Enable random carnival objects
const randomCarnivalMobile = config.EnableRandomCarnivalMobile !== undefined ? config.EnableRandomCarnivalMobile : false; // Enable random carnival objects on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // Randomize falling and flutter speeds
const enableSway = config.EnableCarnivalSway !== undefined ? config.EnableCarnivalSway : true; // Enable side-to-side sway animation
const carnivalCount = config.ObjectCount || 120; // Number of confetti pieces to spawn
const carnival = config.EnableCarnival !== undefined ? config.EnableCarnival : true; // enable/disable carnival
const randomCarnival = config.EnableRandomCarnival !== undefined ? config.EnableRandomCarnival : true; // enable random carnival
const randomCarnivalMobile = config.EnableRandomCarnivalMobile !== undefined ? config.EnableRandomCarnivalMobile : false; // enable random carnival on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableSway = config.EnableCarnivalSway !== undefined ? config.EnableCarnivalSway : true; // enable/disable carnivalsway
const carnivalCount = config.ObjectCount !== undefined ? config.ObjectCount : 120; // Number of confetti pieces to spawn
const confettiColors = [
'#fce18a', '#ff726d', '#b48def', '#f4306d',
@@ -41,7 +41,6 @@ function toggleCarnival() {
}
}
// observe changes in the DOM
const observer = new MutationObserver(toggleCarnival);
observer.observe(document.body, {
childList: true,

View File

@@ -1,10 +1,10 @@
const config = window.SeasonalsPluginConfig?.CherryBlossom || {};
const cherryBlossom = config.EnableCherryBlossom !== undefined ? config.EnableCherryBlossom : true;
const petalCount = config.PetalCount || 25;
const randomCherryBlossom = config.EnableRandomCherryBlossom !== undefined ? config.EnableRandomCherryBlossom : true;
const randomCherryBlossomMobile = config.EnableRandomCherryBlossomMobile !== undefined ? config.EnableRandomCherryBlossomMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const cherryBlossom = config.EnableCherryBlossom !== undefined ? config.EnableCherryBlossom : true; // enable/disable cherryblossom
const petalCount = config.PetalCount !== undefined ? config.PetalCount : 25; // count of petal
const randomCherryBlossom = config.EnableRandomCherryBlossom !== undefined ? config.EnableRandomCherryBlossom : true; // enable random cherryblossom
const randomCherryBlossomMobile = config.EnableRandomCherryBlossomMobile !== undefined ? config.EnableRandomCherryBlossomMobile : false; // enable random cherryblossom on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
let msgPrinted = false;

View File

@@ -1,138 +1,112 @@
.christmas-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.christmas {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
cursor: default;
-webkit-user-select: none;
-webkit-animation-name: christmas-fall, christmas-shake;
-webkit-animation-duration: 10s, 3s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
animation-name: christmas-fall, christmas-shake;
animation-duration: 10s, 3s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
@-webkit-keyframes christmas-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@-webkit-keyframes christmas-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
@keyframes christmas-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@keyframes christmas-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
.christmas:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
}
.christmas:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 1s;
}
.christmas:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 0.5s;
}
.christmas:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 2s;
}
.christmas:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 2s;
}
.christmas:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 3s;
}
.christmas:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 2s;
}
.christmas:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 1s;
}
.christmas:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 0s;
}
.christmas:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 1.5s;
}
.christmas:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 0s;
}
.christmas:nth-of-type(11) {
left: 65%;
animation-delay: 4s, 2.5s;
.christmas-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.christmas {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
cursor: default;
animation-name: christmas-fall, christmas-shake;
animation-duration: 10s, 3s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
@keyframes christmas-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@keyframes christmas-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
.christmas:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
}
.christmas:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 1s;
}
.christmas:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 0.5s;
}
.christmas:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 2s;
}
.christmas:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 2s;
}
.christmas:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 3s;
}
.christmas:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 2s;
}
.christmas:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 1s;
}
.christmas:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 0s;
}
.christmas:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 1.5s;
}
.christmas:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 0s;
}
.christmas:nth-of-type(11) {
left: 65%;
animation-delay: 4s, 2.5s;

View File

@@ -1,10 +1,10 @@
const config = window.SeasonalsPluginConfig?.Christmas || {};
const christmas = config.EnableChristmas !== undefined ? config.EnableChristmas : true; // enable/disable christmas
const randomChristmas = config.EnableRandomChristmas !== undefined ? config.EnableRandomChristmas : true; // enable random Christmas
const randomChristmasMobile = config.EnableRandomChristmasMobile !== undefined ? config.EnableRandomChristmasMobile : false; // enable random Christmas on mobile devices (Warning: High values may affect performance)
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different duration for the random Christmas symbols
const christmasCount = config.SymbolCount || 25; // count of random extra christmas
const randomChristmas = config.EnableRandomChristmas !== undefined ? config.EnableRandomChristmas : true; // enable random christmas
const randomChristmasMobile = config.EnableRandomChristmasMobile !== undefined ? config.EnableRandomChristmasMobile : false; // enable random christmas on mobile
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const christmasCount = config.SymbolCount !== undefined ? config.SymbolCount : 25; // count of symbol
// Array of christmas characters
const christmasSymbols = ['❆', '🎁', '❄️', '🎁', '🎅', '🎊', '🎁', '🎉'];

View File

@@ -7,9 +7,11 @@
pointer-events: none;
z-index: 1000;
overflow: hidden;
contain: layout paint;
}
.earthday-meadow {
will-change: transform;
position: absolute;
bottom: 0;
left: 0;
@@ -25,6 +27,7 @@
}
.earthday-sway {
will-change: transform;
transform-origin: bottom center;
animation: sway-grass 4s ease-in-out infinite alternate;
}

View File

@@ -1,7 +1,7 @@
const config = window.SeasonalsPluginConfig?.EarthDay || {};
const enabled = config.EnableEarthDay !== undefined ? config.EnableEarthDay : true;
const vineCount = config.VineCount || 4;
const enabled = config.EnableEarthDay !== undefined ? config.EnableEarthDay : true; // enable/disable earthday
const vineCount = config.VineCount !== undefined ? config.VineCount : 4; // count of vine
const flowerColors = ['#FF69B4', '#FFD700', '#87CEFA', '#FF4500', '#BA55D3', '#FFA500', '#FF1493'];

View File

@@ -9,6 +9,7 @@
z-index: 10000;
contain: strict;
overflow: hidden;
contain: layout paint;
}
.easter-grass-container {
@@ -38,6 +39,7 @@
/* sway */
.easter-sway {
will-change: transform;
transform-origin: bottom center;
animation: easter-wind-sway 6s ease-in-out infinite alternate;
}

View File

@@ -1,18 +1,19 @@
const config = window.SeasonalsPluginConfig?.Easter || {};
const easter = config.EnableEaster !== undefined ? config.EnableEaster : true;
const enableBunny = config.EnableBunny !== undefined ? config.EnableBunny : true;
const easter = config.EnableEaster !== undefined ? config.EnableEaster : true; // enable/disable easter
const enableBunny = config.EnableBunny !== undefined ? config.EnableBunny : true; // enable/disable bunny
const minBunnyRestTime = config.MinBunnyRestTime !== undefined ? config.MinBunnyRestTime : 2000; // timing parameter
const maxBunnyRestTime = config.MaxBunnyRestTime !== undefined ? config.MaxBunnyRestTime : 5000; // timing parameter
const eggCount = config.EggCount !== undefined ? config.EggCount : 15; // count of egg
/* MARK: Bunny movement config */
const jumpDistanceVw = 5; // Distance in vw the bunny covers per jump
const jumpDurationMs = 770; // Time in ms the bunny spends moving during a jump
const pauseDurationMs = 116.6666; // Time in ms the bunny pauses between jumps
const minBunnyRestTime = config.MinBunnyRestTime || 2000;
const maxBunnyRestTime = config.MaxBunnyRestTime || 5000;
const eggCount = config.EggCount || 15;
const rabbit = "../Seasonals/Resources/easter_images/Osterhase.gif";
// Credit: https://flaticon.com
const easterEggImages = [
"../Seasonals/Resources/easter_images/egg_1.png",
"../Seasonals/Resources/easter_images/egg_2.png",
@@ -197,6 +198,8 @@ function animateRabbit(rabbit) {
rabbit.style.transition = 'none';
const transformScale = startFromLeft ? 'scaleX(-1)' : '';
// Set bounding box center-of-gravity shift when graphic is flipped
rabbit.style.transformOrigin = startFromLeft ? '59% 50%' : '50% 50%';
rabbit.style.transform = `translateX(${currentX}vw) ${transformScale}`;
const loopDurationMs = jumpDurationMs + pauseDurationMs;
@@ -211,10 +214,8 @@ function animateRabbit(rabbit) {
if (!startTime) {
startTime = timestamp;
// resetting gif, forces the browser to restart the GIF from the first frame (crucial for syncing hops with movement)
const currSrc = rabbit.src.split('?')[0];
rabbit.src = '';
rabbit.src = currSrc;
rabbit.src = currSrc + '?t=' + Date.now();
}
const elapsed = timestamp - startTime;
@@ -234,7 +235,6 @@ function animateRabbit(rabbit) {
currentX = startX + (completedLoops * jumpDistanceVw + currentLoopDistance) * direction;
// Update DOM without CSS transitions
rabbit.style.transform = `translateX(${currentX}vw) ${transformScale}`;
// Check if finished crossing
@@ -243,6 +243,7 @@ function animateRabbit(rabbit) {
isAnimating = false;
rabbitTimeout = setTimeout(() => {
if (!document.body.contains(rabbit)) return;
animateRabbit(document.querySelector('#rabbit'));
}, restTime);
return;

View File

@@ -9,6 +9,7 @@
z-index: 10;
contain: strict;
overflow: hidden;
contain: layout paint;
}
.eid-symbol {
@@ -18,12 +19,14 @@
}
.eid-symbol.floating-star {
will-change: opacity;
opacity: 0;
animation: eid-twinkle 4s ease-in-out infinite;
mix-blend-mode: screen;
}
.lantern-rope {
will-change: transform;
position: absolute;
top: 0;
width: 2px;

View File

@@ -1,5 +1,7 @@
const config = window.SeasonalsPluginConfig?.Eid || {};
const eid = config.EnableEid !== undefined ? config.EnableEid : true;
const eid = config.EnableEid !== undefined ? config.EnableEid : true; // enable/disable eid
const lanternCount = config.LanternCount !== undefined ? config.LanternCount : 8; // count of lantern
const lanternCountMobile = config.LanternCountMobile !== undefined ? config.LanternCountMobile : 3; // count of lantern on mobile
const eidSymbols = ['🌙', '⭐', '✨'];
@@ -39,11 +41,13 @@ observer.observe(document.body, {
function createEid(container) {
const starCount = 20;
const lanternCount = Math.floor(Math.random() * 3) + 4; // 4 to 6 lanterns
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
let activeLanternCount = isMobile ? lanternCountMobile : lanternCount;
// Create evenly spaced lanterns
const segmentWidth = 100 / lanternCount;
for (let i = 0; i < lanternCount; i++) {
const segmentWidth = 100 / activeLanternCount;
for (let i = 0; i < activeLanternCount; i++) {
const symbol = document.createElement('div');
symbol.className = 'eid-symbol lantern-rope';

View File

@@ -1,15 +1,14 @@
const config = window.SeasonalsPluginConfig?.Eurovision || {};
const enabled = config.EnableEurovision !== undefined ? config.EnableEurovision : true;
const elementCount = config.SymbolCount || 25;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const enableColorfulNotes = config.EnableColorfulNotes !== undefined ? config.EnableColorfulNotes : true;
const eurovisionColorsStr = config.EurovisionColors || '#ff0026ff, #17a6ffff, #32d432ff, #FFD700, #f0821bff, #f826f8ff';
const glowSize = config.EurovisionGlowSize !== undefined ? config.EurovisionGlowSize : 2;
const enabled = config.EnableEurovision !== undefined ? config.EnableEurovision : true; // enable/disable eurovision
const elementCount = config.SymbolCount !== undefined ? config.SymbolCount : 25; // count of notes
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableColorfulNotes = config.EnableColorfulNotes !== undefined ? config.EnableColorfulNotes : true; // enable/disable colorful notes
const eurovisionColorsStr = config.EurovisionColors !== undefined ? config.EurovisionColors : '#ff0026ff, #17a6ffff, #32d432ff, #FFD700, #f0821bff, #f826f8ff'; // colors to use
const glowSize = config.EurovisionGlowSize !== undefined ? config.EurovisionGlowSize : 2; // size of eurovision glow
let msgPrinted = false;
// Toggle Function
function toggleEurovision() {
const container = document.querySelector('.eurovision-container');
if (!container) return;

View File

@@ -22,8 +22,9 @@
/* Film grain */
.filmnoir-grain {
will-change: transform, opacity;
position: absolute;
top: -50%;
top: 0;
left: -50%;
width: 200%;
height: 200%;
@@ -32,6 +33,7 @@
pointer-events: none;
mix-blend-mode: overlay;
opacity: 0.3;
translate: 0 -50vh;
}
/* Vignette */
@@ -48,6 +50,7 @@
/* Occasional flicker and scratch */
.filmnoir-scratches {
will-change: opacity;
position: absolute;
top: 0;
left: 0;

View File

@@ -1,5 +1,5 @@
const config = window.SeasonalsPluginConfig?.FilmNoir || {};
const filmnoir = config.EnableFilmNoir !== undefined ? config.EnableFilmNoir : true;
const filmnoir = config.EnableFilmNoir !== undefined ? config.EnableFilmNoir : true; // enable/disable filmnoir
let msgPrinted = false;

View File

@@ -11,9 +11,10 @@
}
.rocket-trail {
will-change: transform;
position: absolute;
left: var(--trailX);
top: var(--trailStartY);
top: 0;
width: 4px;
/* activate the following for rocket trail */
@@ -28,6 +29,7 @@
box-shadow: 0 0 8px 2px white;*/
animation: rocket-trail-animation 1s linear forwards;
translate: 0 var(--trailStartY);
}
@keyframes rocket-trail-animation {
@@ -56,6 +58,7 @@
}
.firework {
will-change: transform;
position: absolute;
width: 5px;
height: 5px;

View File

@@ -2,10 +2,10 @@ const config = window.SeasonalsPluginConfig?.Fireworks || {};
const fireworks = config.EnableFireworks !== undefined ? config.EnableFireworks : true; // enable/disable fireworks
const scrollFireworks = config.ScrollFireworks !== undefined ? config.ScrollFireworks : true; // enable fireworks to scroll with page content
const particlesPerFirework = config.ParticleCount || 50; // count of particles per firework (Warning: High values may affect performance)
const minFireworks = config.MinFireworks || 3; // minimum number of simultaneous fireworks
const maxFireworks = config.MaxFireworks || 6; // maximum number of simultaneous fireworks
const intervalOfFireworks = config.LaunchInterval || 3200; // interval for the fireworks in milliseconds
const particlesPerFirework = config.ParticleCount !== undefined ? config.ParticleCount : 50; // count of particles per firework
const minFireworks = config.MinFireworks !== undefined ? config.MinFireworks : 3; // minimum number of simultaneous fireworks
const maxFireworks = config.MaxFireworks !== undefined ? config.MaxFireworks : 6; // maximum number of simultaneous fireworks
const intervalOfFireworks = config.LaunchInterval !== undefined ? config.LaunchInterval : 3200; // interval for the fireworks in milliseconds
// array of color palettes for the fireworks
const colorPalettes = [
@@ -162,6 +162,7 @@ function startFireworks() {
}
fireworksInterval = setInterval(() => {
if (!document.body.contains(fireworkContainer)) { clearInterval(fireworksInterval); return; }
const randomCount = Math.floor(Math.random() * maxFireworks) + minFireworks;
for (let i = 0; i < randomCount; i++) {
setTimeout(() => {

View File

@@ -1,5 +1,5 @@
const config = window.SeasonalsPluginConfig?.Friday13 || {};
const friday13 = config.EnableFriday13 !== undefined ? config.EnableFriday13 : true;
const friday13 = config.EnableFriday13 !== undefined ? config.EnableFriday13 : true; // enable/disable friday13
let msgPrinted = false;
@@ -61,12 +61,12 @@ function createFriday13(container) {
cat.parentNode.removeChild(cat);
}
// Respawn with random delay between 5 to 25 seconds
setTimeout(spawnCat, Math.random() * 20000 + 5000);
setTimeout(() => { if (document.body.contains(container)) spawnCat(); }, Math.random() * 20000 + 5000);
}, (catWalkDurationSeconds * 1000) + 500); // Wait for duration + 500ms safety margin
}
// Initial spawn with random delay
setTimeout(spawnCat, Math.random() * 5000);
setTimeout(() => { if (document.body.contains(container)) spawnCat(); }, Math.random() * 5000);
}
function initializeFriday13() {

View File

@@ -9,16 +9,17 @@
z-index: 10;
overflow: hidden;
contain: strict;
contain: layout paint;
}
.frost-layer {
will-change: transform;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
/* A glowing white-blue gradient from edges */
background: radial-gradient(ellipse at center, transparent 60%, rgba(180, 220, 255, 0.4) 100%);
box-shadow: inset 0 0 60px rgba(200, 230, 255, 0.5), inset 0 0 120px rgba(255, 255, 255, 0.3);
@@ -27,14 +28,13 @@
animation: frost-creep 4s ease-out forwards;
}
/* Subtle repeating star/crystal pattern */
.frost-crystals {
will-change: transform;
position: absolute;
top: -5%;
top: 0;
left: -5%;
width: 110%;
height: 110%;
/* Use multi-layered star patterns for a random, crystalline spread */
background-image:
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60"><circle cx="10" cy="10" r="1.5" fill="rgba(255,255,255,0.2)"/><circle cx="40" cy="30" r="1" fill="rgba(255,255,255,0.15)"/><circle cx="20" cy="50" r="2" fill="rgba(255,255,255,0.1)"/><path d="M50 10 L51 15 L56 16 L51 17 L50 22 L49 17 L44 16 L49 15 Z" fill="rgba(255,255,255,0.2)"/></svg>'),
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40"><circle cx="5" cy="20" r="1" fill="rgba(255,255,255,0.15)"/><circle cx="25" cy="5" r="1.5" fill="rgba(255,255,255,0.1)"/><path d="M20 20 L21 23 L24 24 L21 25 L20 28 L19 25 L16 24 L19 23 Z" fill="rgba(255,255,255,0.15)"/></svg>'),
@@ -43,12 +43,9 @@
background-size: 110px 110px, 60px 60px, 30px 30px;
background-position: 0 0, 15px 15px, 5px 10px;
mix-blend-mode: overlay;
/* Mask out the center so crystals only appear strongly on the edges */
-webkit-mask-image: radial-gradient(ellipse at center, transparent 50%, black 100%);
mask-image: radial-gradient(ellipse at center, transparent 50%, black 100%);
animation: frost-shimmer 6s infinite alternate ease-in-out;
translate: 0 -5vh;
}
@keyframes frost-creep {

View File

@@ -1,6 +1,6 @@
const config = window.SeasonalsPluginConfig?.Frost || {};
const frost = config.EnableFrost !== undefined ? config.EnableFrost : true;
const frost = config.EnableFrost !== undefined ? config.EnableFrost : true; // enable/disable frost
let msgPrinted = false;

View File

@@ -7,25 +7,17 @@
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10000;
z-index: 10;
contain: layout paint;
}
.halloween {
will-change: transform;
position: fixed;
bottom: -10%;
z-index: 15;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
cursor: default;
-webkit-animation-name: halloween-fall, halloween-shake;
-webkit-animation-duration: 10s, 3s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
-webkit-animation-play-state: running, running;
animation-name: halloween-fall, halloween-shake;
animation-duration: 10s, 3s;
animation-timing-function: linear, ease-in-out;
@@ -33,29 +25,7 @@
animation-play-state: running, running
}
@-webkit-keyframes halloween-fall {
0% {
bottom: -10%;
}
100% {
bottom: 110%;
}
}
@-webkit-keyframes halloween-shake {
0%,
100% {
-webkit-transform: translateX(0);
transform: translateX(0)
}
50% {
-webkit-transform: translateX(80px);
transform: translateX(80px)
}
}
@keyframes halloween-fall {
0% {
@@ -81,73 +51,61 @@
.halloween:nth-of-type(0) {
left: 1%;
-webkit-animation-delay: 0s, 0s;
animation-delay: 0s, 0s;
}
.halloween:nth-of-type(1) {
left: 10%;
-webkit-animation-delay: -1s, -1s;
animation-delay: -1s, -1s;
}
.halloween:nth-of-type(2) {
left: 20%;
-webkit-animation-delay: -2s, -2s;
animation-delay: -2s, -2s;
}
.halloween:nth-of-type(3) {
left: 30%;
-webkit-animation-delay: -3s, -3s;
animation-delay: -3s, -3s;
}
.halloween:nth-of-type(4) {
left: 40%;
-webkit-animation-delay: -4s, -4s;
animation-delay: -4s, -4s;
}
.halloween:nth-of-type(5) {
left: 50%;
-webkit-animation-delay: -5s, -5s;
animation-delay: -5s, -5s;
}
.halloween:nth-of-type(6) {
left: 60%;
-webkit-animation-delay: -6s, -6s;
animation-delay: -6s, -6s;
}
.halloween:nth-of-type(7) {
left: 70%;
-webkit-animation-delay: -7s, -7s;
animation-delay: -7s, -7s;
}
.halloween:nth-of-type(8) {
left: 80%;
-webkit-animation-delay: -8s, -8s;
animation-delay: -8s, -8s;
}
.halloween:nth-of-type(9) {
left: 90%;
-webkit-animation-delay: -9s, -9s;
animation-delay: -9s, -9s;
}
.halloween:nth-of-type(10) {
left: 25%;
-webkit-animation-delay: -10s, -10s;
animation-delay: -10s, -10s;
}
.halloween:nth-of-type(11) {
left: 65%;
-webkit-animation-delay: -11s, -11s;
animation-delay: -11s, -11s;
}
@@ -162,7 +120,6 @@
z-index: 1000;
overflow: hidden;
mask-image: linear-gradient(to top, black, transparent);
-webkit-mask-image: linear-gradient(to top, black, transparent);
}
.halloween-fog-blob {
position: absolute;
@@ -174,10 +131,12 @@
filter: blur(15px);
}
.halloween-fog-blob:nth-child(1) {
will-change: transform;
left: -20vw;
animation: fog-float1 25s ease-in-out infinite alternate;
}
.halloween-fog-blob:nth-child(2) {
will-change: transform;
left: -50vw;
background: radial-gradient(ellipse at center, rgba(100, 110, 120, 0.3) 0%, transparent 65%);
animation: fog-float2 35s ease-in-out infinite alternate;
@@ -196,7 +155,7 @@
/* --- Spiders --- */
.halloween-spider-wrapper {
position: absolute;
top: -50px;
top: 0;
display: flex;
flex-direction: column;
align-items: center;
@@ -204,8 +163,10 @@
transform-origin: top;
will-change: transform;
pointer-events: auto;
padding: 20px; /* Increase hit area safely */
padding: 20px; /* Increase hit area */
translate: 0 -50px;
}
.halloween-thread {
width: 30px; /* Wider hit area for mouse interaction */
height: 100vh;
@@ -223,12 +184,12 @@
background: linear-gradient(to bottom, rgba(200, 200, 200, 0.1), rgba(200, 200, 200, 0.6));
}
.halloween-spider {
will-change: transform;
animation: spider-swing 3s ease-in-out infinite alternate;
transform-origin: top center;
}
/* MARK: SPIDER SWAY CONFIGURATION */
/* Adjust degrees in 'rotate(...)' to change how far spider and thread swing in wind. */
@keyframes wind-sway {
0% { transform: rotate(0deg); }
25% { transform: rotate(2deg); }

View File

@@ -14,7 +14,7 @@ const images = [
"../Seasonals/Resources/halloween_images/pumpkin_20x20.png",
];
let msgPrinted = false; // flag to prevent multiple console messages
let msgPrinted = false;
// function to check and control the halloween
function toggleHalloween() {
@@ -42,7 +42,6 @@ function toggleHalloween() {
}
}
// observe changes in the DOM
const observer = new MutationObserver(toggleHalloween);
observer.observe(document.body, {
childList: true,
@@ -52,26 +51,22 @@ observer.observe(document.body, {
function addRandomSymbols(count) {
const halloweenContainer = document.querySelector('.halloween-container'); // get the halloween container
if (!halloweenContainer) return; // exit if halloween container is not found
const halloweenContainer = document.querySelector('.halloween-container');
if (!halloweenContainer) return;
console.log('Adding random halloween symbols');
for (let i = 0; i < count; i++) {
// create a new halloween elements
const halloweenDiv = document.createElement("div");
halloweenDiv.className = "halloween";
// pick a random halloween symbol
const imageSrc = images[Math.floor(Math.random() * images.length)];
const img = document.createElement("img");
img.src = imageSrc;
halloweenDiv.appendChild(img);
// set random horizontal position, animation delay and size(uncomment lines to enable)
const randomLeft = Math.random() * 100; // position (0% to 100%)
const randomAnimationDelay = Math.random() * 10; // delay (0s to 10s)
const randomAnimationDelay2 = -(Math.random() * 3); // delay (-3s to 0s)
@@ -87,13 +82,11 @@ function addRandomSymbols(count) {
halloweenDiv.style.animationDuration = `${randomAnimationDuration}s, ${randomAnimationDuration2}s`;
}
// add the halloween to the container
halloweenContainer.appendChild(halloweenDiv);
}
console.log('Random halloween symbols added');
}
// create halloween objects
function createHalloween() {
const container = document.querySelector('.halloween-container') || document.createElement("div");
@@ -182,14 +175,18 @@ function createSpider(container) {
setTimeout(() => {
wrapper.remove();
setTimeout(() => createSpider(container), Math.random() * 5000 + 1000);
if (document.body.contains(container)) {
setTimeout(() => createSpider(container), Math.random() * 5000 + 1000);
}
}, 500);
});
wrapper.addEventListener('animationend', () => {
if (isRetreating) return;
wrapper.remove();
setTimeout(() => createSpider(container), Math.random() * 5000 + 1000);
if (document.body.contains(container)) {
setTimeout(() => createSpider(container), Math.random() * 5000 + 1000);
}
});
container.appendChild(wrapper);
@@ -223,15 +220,16 @@ function createMouse(container) {
mouse.addEventListener('animationend', () => {
mouse.remove();
setTimeout(() => createMouse(container), Math.random() * 4000 + 2000);
if (document.body.contains(container)) {
setTimeout(() => createMouse(container), Math.random() * 4000 + 2000);
}
});
container.appendChild(mouse);
}
// initialize halloween
function initializeHalloween() {
if (!halloween) return; // exit if halloween is disabled
if (!halloween) return;
createHalloween();
toggleHalloween();
@@ -256,7 +254,7 @@ function initializeHalloween() {
}
const screenWidth = window.innerWidth; // get the screen width to detect mobile devices
if (randomSymbols && (screenWidth > 768 || randomSymbolsMobile)) { // add random halloweens only on larger screens, unless enabled for mobile devices
if (randomSymbols && (screenWidth > 768 || randomSymbolsMobile)) {
addRandomSymbols(halloweenCount);
}
}

View File

@@ -12,48 +12,21 @@
}
.heart {
will-change: transform;
position: fixed;
bottom: -10%;
z-index: 15;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
cursor: default;
-webkit-animation-name: heart-fall, heart-shake;
-webkit-animation-duration: 14s, 5s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
animation-name: heart-fall, heart-shake;
animation-duration: 14s, 5s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
@-webkit-keyframes heart-fall {
0% {
bottom: -10%;
}
100% {
bottom: 110%;
}
}
@-webkit-keyframes heart-shake {
0%,
100% {
-webkit-transform: translateX(0);
transform: translateX(0)
}
50% {
-webkit-transform: translateX(80px);
transform: translateX(80px)
}
}
@keyframes heart-fall {
0% {
@@ -79,72 +52,60 @@
.heart:nth-of-type(0) {
left: 1%;
-webkit-animation-delay: 0s, 0s;
animation-delay: 0s, 0s
}
.heart:nth-of-type(1) {
left: 10%;
-webkit-animation-delay: 1s, 1s;
animation-delay: 1s, 1s
}
.heart:nth-of-type(2) {
left: 20%;
-webkit-animation-delay: 6s, .5s;
animation-delay: 6s, .5s
}
.heart:nth-of-type(3) {
left: 30%;
-webkit-animation-delay: 4s, 2s;
animation-delay: 4s, 2s
}
.heart:nth-of-type(4) {
left: 40%;
-webkit-animation-delay: 2s, 2s;
animation-delay: 2s, 2s
}
.heart:nth-of-type(5) {
left: 50%;
-webkit-animation-delay: 8s, 3s;
animation-delay: 8s, 3s
}
.heart:nth-of-type(6) {
left: 60%;
-webkit-animation-delay: 6s, 2s;
animation-delay: 6s, 2s
}
.heart:nth-of-type(7) {
left: 70%;
-webkit-animation-delay: 2.5s, 1s;
animation-delay: 2.5s, 1s
}
.heart:nth-of-type(8) {
left: 80%;
-webkit-animation-delay: 1s, 0s;
animation-delay: 1s, 0s
}
.heart:nth-of-type(9) {
left: 90%;
-webkit-animation-delay: 3s, 1.5s;
animation-delay: 3s, 1.5s
}
.heart:nth-of-type(10) {
left: 25%;
-webkit-animation-delay: 2s, 0s;
animation-delay: 2s, 0s
}
.heart:nth-of-type(11) {
left: 65%;
-webkit-animation-delay: 4s, 2.5s;
animation-delay: 4s, 2.5s
}

View File

@@ -1,10 +1,10 @@
const config = window.SeasonalsPluginConfig?.Hearts || {};
const hearts = config.EnableHearts !== undefined ? config.EnableHearts : true; // enable/disable hearts
const randomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true; // enable more random symbols
const randomSymbolsMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false; // enable random symbols on mobile devices (Warning: High values may affect performance)
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different animation duration for random symbols
const heartsCount = config.SymbolCount || 25; // count of random extra symbols
const randomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true; // enable random symbols
const randomSymbolsMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false; // enable random symbols on mobile
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const heartsCount = config.SymbolCount !== undefined ? config.SymbolCount : 25; // count of symbol
// Array of hearts characters
const heartSymbols = ['❤️', '💕', '💞', '💓', '💗', '💖'];

View File

@@ -29,11 +29,13 @@
}
.mario-jump {
will-change: transform;
animation: jump-arc 0.8s ease-in-out;
}
/* 8-bit coin styling */
.mario-coin {
will-change: transform;
position: absolute;
width: 32px;
height: 32px;
@@ -47,11 +49,12 @@
.mario-coin::after {
content: '';
position: absolute;
top: 6px;
top: 0;
left: 10px;
width: 4px;
height: 12px;
background: #daa520;
translate: 0 6px;
}
@keyframes mario-run {

View File

@@ -51,8 +51,9 @@ function createMarioDay(container) {
container.appendChild(wrapper);
// Periodically throw out an 8-bit coin
setInterval(() => {
if (!document.querySelector('.marioday-container')) return;
const intervalId = setInterval(() => {
if (!document.body.contains(container)) { clearInterval(intervalId); return; }
if (container.style.display === 'none') return;
const coin = document.createElement('div');
coin.className = 'mario-coin';

View File

@@ -5,7 +5,7 @@
width: 100vw;
height: 100vh;
pointer-events: none;
z-index: 1000;
z-index: 10;
overflow: hidden;
contain: layout paint;
}

View File

@@ -1,9 +1,9 @@
const config = window.SeasonalsPluginConfig?.Matrix || {};
const enabled = config.EnableMatrix !== undefined ? config.EnableMatrix : true;
const maxTrails = config.SymbolCount || 25;
const backgroundMode = config.EnableMatrixBackground !== undefined ? config.EnableMatrixBackground : false;
const matrixChars = config.MatrixChars || '0123456789';
const enabled = config.EnableMatrix !== undefined ? config.EnableMatrix : true; // enable/disable matrix
const maxTrails = config.SymbolCount !== undefined ? config.SymbolCount : 25; // count of max trails on screen
const backgroundMode = config.EnableMatrixBackground !== undefined ? config.EnableMatrixBackground : false; // enable/disable matrix as background
const matrixChars = config.MatrixChars !== undefined ? config.MatrixChars : '0123456789'; // characters to use in the matrix rain, default is '0123456789'
let msgPrinted = false;
let isHidden = false;
@@ -136,6 +136,7 @@ function createElements() {
for(let i=0; i<maxTrails; i++) trails.push(new Trail());
function loop() {
if (!document.body.contains(container)) { clearInterval(window.matrixInterval); return; }
if (isHidden) return; // Pause drawing when hidden
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.font = 'bold ' + fontSize + 'px monospace';

View File

@@ -12,13 +12,15 @@
}
.oktoberfest-symbol {
will-change: transform;
position: absolute;
top: -10%;
top: 0;
font-size: 2.2em;
user-select: none;
animation-name: oktoberfest-fall, oktoberfest-sway;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
translate: 0 -10vh;
}
@keyframes oktoberfest-fall {

View File

@@ -1,5 +1,5 @@
const config = window.SeasonalsPluginConfig?.Oktoberfest || {};
const oktoberfest = config.EnableOktoberfest !== undefined ? config.EnableOktoberfest : true;
const oktoberfest = config.EnableOktoberfest !== undefined ? config.EnableOktoberfest : true; // enable/disable oktoberfest
const oktoberfestSymbols = ['🥨', '🍺', '🍻', '🥨', '🥨'];
@@ -31,7 +31,6 @@ function toggleOktoberfest() {
}
}
// observe changes in the DOM
const observer = new MutationObserver(toggleOktoberfest);
observer.observe(document.body, {
childList: true,

View File

@@ -12,10 +12,11 @@
.olympia-symbol {
position: absolute;
top: -10vh;
top: 0;
opacity: 0.95;
text-shadow: 0 0 10px rgba(255,255,255,0.2);
z-index: 40;
translate: 0 -10vh;
}
.olympia-flame {
@@ -34,8 +35,8 @@
.olympia-ring-css::before {
content: '';
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
top: 0;
translate: -50% -50%;
width: 30px;
height: 30px;
border: 5px solid #0081C8; /* Default blue ring */
@@ -46,13 +47,15 @@
}
.olympia-symbol {
position: absolute;
top: -10vh;
top: 0;
opacity: 0.95;
text-shadow: 0 0 10px rgba(255,255,255,0.2);
z-index: 40;
translate: 0 -10vh;
}
.olympia-inner {
will-change: transform;
display: inline-block;
animation: olympia-sway linear infinite alternate;
}

View File

@@ -6,7 +6,7 @@
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10; /* Behind popups but over background */
z-index: 10;
contain: strict;
overflow: hidden;
}
@@ -30,8 +30,9 @@
}
.oscar-spotlight {
will-change: transform;
position: absolute;
top: -10vh;
top: 0;
/* MARK: SPOTLIGHT WIDTH CONFIGURATION */
/* To adjust bottom width (spread), change 'width' property (e.g., 20vw for narrow, 40vw for wide). */
/* To adjust top width (origin), modify first two percentages in 'clip-path' (e.g., 48% 0, 52% 0 for a very thin start). */
@@ -42,9 +43,11 @@
transform-origin: top center;
animation: spotlight-sweep 12s infinite alternate ease-in-out;
mix-blend-mode: screen;
translate: 0 -10vh;
}
.oscar-flash {
will-change: transform;
position: absolute;
width: 10px;
height: 10px;

View File

@@ -1,5 +1,5 @@
const config = window.SeasonalsPluginConfig?.Oscar || {};
const oscar = config.EnableOscar !== undefined ? config.EnableOscar : true;
const oscar = config.EnableOscar !== undefined ? config.EnableOscar : true; // enable/disable oscar
let msgPrinted = false;
@@ -56,9 +56,9 @@ function createOscar(container) {
container.appendChild(carpet);
container.appendChild(spotlights);
// Paparazzi flashes with randomized intervals
function flashLoop() {
if (!document.querySelector('.oscar-container')) {
if (!document.body.contains(container)) return; // Kill the loop if container is removed
if (container.style.display === 'none') {
setTimeout(flashLoop, 1000); // Check again later if hidden
return;
}

View File

@@ -5,7 +5,7 @@
width: 100vw;
height: 100vh;
pointer-events: none;
z-index: 9999;
z-index: 10;
overflow: hidden;
contain: layout paint;
}

View File

@@ -1,15 +1,12 @@
// 1. Read Configuration
const config = window.SeasonalsPluginConfig?.Pride || {};
const enabled = config.EnablePride !== undefined ? config.EnablePride : true;
const elementCount = config.HeartCount || 20;
const heartSize = config.HeartSize || 1.5;
const colorHeader = config.ColorHeader !== undefined ? config.ColorHeader : true;
const enabled = config.EnablePride !== undefined ? config.EnablePride : true; // enable/disable pride
const elementCount = config.HeartCount !== undefined ? config.HeartCount : 20; // count of heart
const heartSize = config.HeartSize !== undefined ? config.HeartSize : 1.5; // size of hearts
const colorHeader = config.ColorHeader !== undefined ? config.ColorHeader : true; // optionally color the header with pride colors
let msgPrinted = false;
// 2. Toggle Function
// Hides the effect when a video player, trailer (in full width mode), dashboard, or user menu is active.
function togglePride() {
const container = document.querySelector('.pride-container');
if (!container) return;
@@ -34,8 +31,6 @@ function togglePride() {
}
}
// 3. MutationObserver
// Watches the DOM for changes so the effect can auto-hide/show.
const observer = new MutationObserver(togglePride);
observer.observe(document.body, {
childList: true,
@@ -43,8 +38,6 @@ observer.observe(document.body, {
attributes: true
});
// 4. Element Creation
// Create and append your animated elements to the container.
function createElements() {
const container = document.querySelector('.pride-container') || document.createElement('div');
@@ -82,7 +75,6 @@ function createElements() {
}
}
// 5. Initialization
function initializePride() {
if (!enabled) return;
createElements();

View File

@@ -1,9 +1,9 @@
const config = window.SeasonalsPluginConfig?.Rain || {};
const enabled = config.EnableRain !== undefined ? config.EnableRain : true;
const enabled = config.EnableRain !== undefined ? config.EnableRain : true; // enable/disable rain
const isMobile = window.innerWidth <= 768;
const elementCount = isMobile ? (config.RaindropCountMobile || 150) : (config.RaindropCount || 300);
const rainSpeed = config.RainSpeed || 1.0;
const elementCount = isMobile ? (config.RaindropCountMobile || 150) : (config.RaindropCount || 300); // count of raindrops
const rainSpeed = config.RainSpeed !== undefined ? config.RainSpeed : 1.0; // speed of rain
let msgPrinted = false;

View File

@@ -1,68 +1,66 @@
.resurrection-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.resurrection-symbol {
position: fixed;
z-index: 15;
top: 0;
translate: 0 -15vh;
user-select: none;
-webkit-user-select: none;
cursor: default;
animation-name: resurrection-fall;
animation-timing-function: linear;
animation-iteration-count: infinite;
will-change: transform;
}
.resurrection-sway-wrapper {
will-change: transform;
animation-name: resurrection-sway;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
}
.resurrection-symbol img {
z-index: 15;
height: auto;
width: 56px;
opacity: 0.95;
filter: drop-shadow(0 0 8px rgba(255, 215, 130, 0.5));
}
@media (max-width: 768px) {
.resurrection-symbol img {
width: 42px;
}
}
@keyframes resurrection-fall {
0% {
transform: translate3d(0, -15vh, 0);
}
100% {
transform: translate3d(0, 105vh, 0);
}
}
@keyframes resurrection-sway {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(65px);
}
}
.resurrection-container {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.resurrection-symbol {
position: fixed;
z-index: 15;
top: 0;
translate: 0 -15vh;
user-select: none;
cursor: default;
animation-name: resurrection-fall;
animation-timing-function: linear;
animation-iteration-count: infinite;
will-change: transform;
}
.resurrection-sway-wrapper {
will-change: transform;
animation-name: resurrection-sway;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
}
.resurrection-symbol img {
z-index: 15;
height: auto;
width: 56px;
opacity: 0.95;
filter: drop-shadow(0 0 8px rgba(255, 215, 130, 0.5));
}
@media (max-width: 768px) {
.resurrection-symbol img {
width: 42px;
}
}
@keyframes resurrection-fall {
0% {
transform: translate3d(0, -15vh, 0);
}
100% {
transform: translate3d(0, 105vh, 0);
}
}
@keyframes resurrection-sway {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(65px);
}

View File

@@ -1,10 +1,10 @@
const config = window.SeasonalsPluginConfig?.Resurrection || {};
const enableResurrection = config.EnableResurrection !== undefined ? config.EnableResurrection : true;
const enableRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true;
const enableRandomSymbolsMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const symbolCount = config.SymbolCount || 12;
const enableResurrection = config.EnableResurrection !== undefined ? config.EnableResurrection : true; // enable/disable resurrection
const enableRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true; // enable random symbols
const enableRandomSymbolsMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false; // enable random symbols on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const symbolCount = config.SymbolCount !== undefined ? config.SymbolCount : 12; // count of symbols
let animationEnabled = true;
let statusLogged = false;

View File

@@ -1,15 +1,15 @@
const config = window.SeasonalsPluginConfig?.Santa || {};
const santaIsFlying = config.EnableSanta !== undefined ? config.EnableSanta : true; // enable/disable santa
let snowflakesCount = config.SnowflakesCount || 500; // count of snowflakes (recommended values: 300-600)
const snowflakesCountMobile = config.SnowflakesCountMobile || 250; // count of snowflakes on mobile devices (Warning: High values may affect performance)
const snowFallSpeed = config.SnowFallSpeed || 3; // speed of snowfall (recommended values: 0-5)
const santaSpeed = config.SantaSpeed || 10; // speed of santa in seconds (recommended values: 5-15)
const santaSpeedMobile = config.SantaSpeedMobile || 8; // speed of santa on mobile devices in seconds
const maxSantaRestTime = config.MaxSantaRestTime || 8; // maximum time santa rests in seconds
const minSantaRestTime = config.MinSantaRestTime || 3; // minimum time santa rests in seconds
const maxPresentFallSpeed = config.MaxPresentFallSpeed || 5; // maximum speed of falling presents in seconds
const minPresentFallSpeed = config.MinPresentFallSpeed || 2; // minimum speed of falling presents in seconds
let snowflakesCount = config.SnowflakesCount !== undefined ? config.SnowflakesCount : 500; // count of snowflakes
const snowflakesCountMobile = config.SnowflakesCountMobile !== undefined ? config.SnowflakesCountMobile : 250; // count of snowflakes on mobile
const snowFallSpeed = config.SnowFallSpeed !== undefined ? config.SnowFallSpeed : 3; // speed of snowfall
const santaSpeed = config.SantaSpeed !== undefined ? config.SantaSpeed : 10; // speed of santa in seconds
const santaSpeedMobile = config.SantaSpeedMobile !== undefined ? config.SantaSpeedMobile : 8; // speed of santa on mobile devices in seconds
const maxSantaRestTime = config.MaxSantaRestTime !== undefined ? config.MaxSantaRestTime : 8; // maximum time santa rests in seconds
const minSantaRestTime = config.MinSantaRestTime !== undefined ? config.MinSantaRestTime : 3; // minimum time santa rests in seconds
const maxPresentFallSpeed = config.MaxPresentFallSpeed !== undefined ? config.MaxPresentFallSpeed : 5; // maximum speed of falling presents in seconds
const minPresentFallSpeed = config.MinPresentFallSpeed !== undefined ? config.MinPresentFallSpeed : 2; // minimum speed of falling presents in seconds
// credits: flaticon.com
const presentImages = [
@@ -238,7 +238,7 @@ function animateSanta() {
function startAnimation() {
const santaHeight = santa.offsetHeight;
if (santaHeight === 0) {
setTimeout(startAnimation, 100);
setTimeout(() => { if (document.body.contains(santa)) startAnimation(); }, 100);
return;
}
// console.log('Santa height: ', santaHeight);
@@ -283,7 +283,7 @@ function animateSanta() {
animationFrameIdSanta = requestAnimationFrame(move);
} else {
const pause = Math.random() * ((maxSantaRestTime - minSantaRestTime) * 1000) + minSantaRestTime * 1000;
setTimeout(animateSanta, pause);
setTimeout(() => { if (document.body.contains(santa)) animateSanta(); }, pause);
}
}

View File

@@ -1,9 +1,9 @@
const config = window.SeasonalsPluginConfig?.Snowfall || {};
const snowfall = config.EnableSnowfall !== undefined ? config.EnableSnowfall : true; // enable/disable snowfall
let snowflakesCount = config.SnowflakesCount || 500; // count of snowflakes (recommended values: 300-600)
const snowflakesCountMobile = config.SnowflakesCountMobile || 250; // count of snowflakes on mobile devices (Warning: High values may affect performance)
const snowFallSpeed = config.Speed || 3; // speed of snowfall (recommended values: 0-5)
let snowflakesCount = config.SnowflakesCount !== undefined ? config.SnowflakesCount : 500; // count of snowflakes
const snowflakesCountMobile = config.SnowflakesCountMobile !== undefined ? config.SnowflakesCountMobile : 250; // count of snowflakes on mobile
const snowFallSpeed = config.Speed !== undefined ? config.Speed : 3; // speed of snowfall
let msgPrinted = false; // flag to prevent multiple console messages

View File

@@ -1,139 +1,112 @@
.snowflakes {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.snowflake {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
-webkit-user-select: none;
cursor: default;
-webkit-animation-name: heart-fall, heart-shake;
-webkit-animation-duration: 12s, 3s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
animation-name: snowflakes-fall, snowflakes-shake;
animation-duration: 12s, 3s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
@-webkit-keyframes snowflakes-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@-webkit-keyframes snowflakes-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
@keyframes snowflakes-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@keyframes snowflakes-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
.snowflake:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
}
.snowflake:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 1s;
}
.snowflake:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 0.5s;
}
.snowflake:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 2s;
}
.snowflake:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 2s;
}
.snowflake:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 3s;
}
.snowflake:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 2s;
}
.snowflake:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 1s;
}
.snowflake:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 0s;
}
.snowflake:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 1.5s;
}
.snowflake:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 0s;
}
.snowflake:nth-of-type(11) {
left: 65%;
animation-delay: 4s, 2.5s;
.snowflakes {
display: block;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.snowflake {
position: fixed;
z-index: 15;
top: 0;
will-change: transform;
translate: 0 -10vh;
font-size: 1em;
color: #fff;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
user-select: none;
cursor: default;
animation-name: snowflakes-fall, snowflakes-shake;
animation-duration: 12s, 3s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
}
@keyframes snowflakes-fall {
0% {
translate: 0 -10vh;
}
100% {
translate: 0 110vh;
}
}
@keyframes snowflakes-shake {
0%,
100% {
transform: translateX(0);
}
50% {
transform: translateX(80px);
}
}
.snowflake:nth-of-type(0) {
left: 0%;
animation-delay: 0s, 0s;
}
.snowflake:nth-of-type(1) {
left: 10%;
animation-delay: 1s, 1s;
}
.snowflake:nth-of-type(2) {
left: 20%;
animation-delay: 6s, 0.5s;
}
.snowflake:nth-of-type(3) {
left: 30%;
animation-delay: 4s, 2s;
}
.snowflake:nth-of-type(4) {
left: 40%;
animation-delay: 2s, 2s;
}
.snowflake:nth-of-type(5) {
left: 50%;
animation-delay: 8s, 3s;
}
.snowflake:nth-of-type(6) {
left: 60%;
animation-delay: 6s, 2s;
}
.snowflake:nth-of-type(7) {
left: 70%;
animation-delay: 2.5s, 1s;
}
.snowflake:nth-of-type(8) {
left: 80%;
animation-delay: 1s, 0s;
}
.snowflake:nth-of-type(9) {
left: 90%;
animation-delay: 3s, 1.5s;
}
.snowflake:nth-of-type(10) {
left: 25%;
animation-delay: 2s, 0s;
}
.snowflake:nth-of-type(11) {
left: 65%;

View File

@@ -1,11 +1,11 @@
const config = window.SeasonalsPluginConfig?.Snowflakes || {};
const snowflakes = config.EnableSnowflakes !== undefined ? config.EnableSnowflakes : true; // enable/disable snowflakes
const randomSnowflakes = config.EnableRandomSnowflakes !== undefined ? config.EnableRandomSnowflakes : true; // enable random Snowflakes
const randomSnowflakesMobile = config.EnableRandomSnowflakesMobile !== undefined ? config.EnableRandomSnowflakesMobile : false; // enable random Snowflakes on mobile devices
const enableColoredSnowflakes = config.EnableColoredSnowflakes !== undefined ? config.EnableColoredSnowflakes : true; // enable colored snowflakes
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different animation duration
const snowflakeCount = config.SnowflakeCount || 25; // count of random extra snowflakes
const snowflakeCount = config.SnowflakeCount !== undefined ? config.SnowflakeCount : 25; // count of snowflakes
const randomSnowflakes = config.EnableRandomSnowflakes !== undefined ? config.EnableRandomSnowflakes : true; // enable random snowflakes
const randomSnowflakesMobile = config.EnableRandomSnowflakesMobile !== undefined ? config.EnableRandomSnowflakesMobile : false; // enable random snowflakes on mobile
const enableColoredSnowflakes = config.EnableColoredSnowflakes !== undefined ? config.EnableColoredSnowflakes : true; // enable/disable colored snowflakes
const enableDiffrentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const snowflakeSymbols = ['❅', '❆']; // some snowflake symbols
const snowflakeSymbolsMobile = ['❅', '❆', '❄']; // some snowflake symbols mobile version

View File

@@ -1,11 +1,11 @@
const config = window.SeasonalsPluginConfig?.Snowstorm || {};
const snowstorm = config.enableSnowstorm !== undefined ? config.EnableSnowstorm : true; // enable/disable snowstorm
let snowflakesCount = config.SnowflakesCount || 500; // count of snowflakes (recommended values: 300-600)
const snowflakesCountMobile = config.SnowflakesCountMobile || 250; // count of snowflakes on mobile devices (Warning: High values may affect performance)
const snowFallSpeed = config.Speed || 6; // speed of snowfall (recommended values: 4-8)
const horizontalWind = config.HorizontalWind || 4; // horizontal wind speed (recommended value: 4)
const verticalVariation = config.VerticalVariation || 2; // vertical variation (recommended value: 2)
const snowstorm = config.EnableSnowstorm !== undefined ? config.EnableSnowstorm : true; // enable/disable snowstorm
let snowflakesCount = config.SnowflakesCount !== undefined ? config.SnowflakesCount : 500; // count of snowflakes
const snowflakesCountMobile = config.SnowflakesCountMobile !== undefined ? config.SnowflakesCountMobile : 250; // count of snowflakes on mobile
const snowFallSpeed = config.Speed !== undefined ? config.Speed : 6; // speed of snowstorm
const horizontalWind = config.HorizontalWind !== undefined ? config.HorizontalWind : 4; // horizontal wind strength
const verticalVariation = config.VerticalVariation !== undefined ? config.VerticalVariation : 2; // vertical variation
let msgPrinted = false; // flag to prevent multiple console messages

View File

@@ -5,12 +5,13 @@
width: 100vw;
height: 100vh;
pointer-events: none;
z-index: 9999;
z-index: 10;
overflow: hidden;
contain: strict;
}
.space-bg-glow {
will-change: transform;
position: absolute;
top: 0; left: 0; width: 100vw; height: 100vh;
background: radial-gradient(circle at 70% 30%, rgba(138, 43, 226, 0.15), transparent 60%),
@@ -33,6 +34,7 @@
}
.space-shooting-star {
will-change: opacity;
position: absolute;
width: 250px;
height: 3px;
@@ -61,11 +63,11 @@
}
.space-symbol img {
will-change: transform;
width: 6vh;
height: auto;
max-width: 60px;
object-fit: contain;
/* Add a slow spin to images */
animation: space-slow-spin var(--rot-dur, 20s) linear infinite;
}

View File

@@ -1,18 +1,20 @@
const config = window.SeasonalsPluginConfig?.Space || {};
const space = config.EnableSpace !== undefined ? config.EnableSpace : true;
const planetCountConf = config.PlanetCount !== undefined ? config.PlanetCount : 6;
const astronautCountConf = config.AstronautCount !== undefined ? config.AstronautCount : 1;
const satelliteCountConf = config.SatelliteCount !== undefined ? config.SatelliteCount : 4;
const issCountConf = config.IssCount !== undefined ? config.IssCount : 1;
const rocketCountConf = config.RocketCount !== undefined ? config.RocketCount : 1;
const useRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true;
const enableRandomMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const space = config.EnableSpace !== undefined ? config.EnableSpace : true; // enable/disable space
const planetCountConf = config.PlanetCount !== undefined ? config.PlanetCount : 6; // count of planets
const astronautCountConf = config.AstronautCount !== undefined ? config.AstronautCount : 1; // count of astronaut
const satelliteCountConf = config.SatelliteCount !== undefined ? config.SatelliteCount : 4; // count of satellite
const issCountConf = config.IssCount !== undefined ? config.IssCount : 1; // count of iss
const rocketCountConf = config.RocketCount !== undefined ? config.RocketCount : 1; // count of rocket/space shuttle
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const symbolCountMobile = config.SymbolCountMobile !== undefined ? config.SymbolCountMobile : 2; // Devisor to reduce number of objects on mobile
// Credit: https://lottiefiles.com/free-animation/astronaut-63lcWG4Xnh
const astronautImages = [
"../Seasonals/Resources/space_assets/astronaut_1.gif"
];
// Credits: https://flaticon.com
const planetImages = [
"../Seasonals/Resources/space_assets/planet_1.png",
"../Seasonals/Resources/space_assets/planet_2.png",
@@ -24,13 +26,21 @@ const planetImages = [
"../Seasonals/Resources/space_assets/planet_8.png",
"../Seasonals/Resources/space_assets/planet_9.png"
];
// Credits: https://lottiefiles.com/free-animation/s-satellite-vfnNE8AALo
const satelliteImages = [
"../Seasonals/Resources/space_assets/Satellite_1.gif",
"../Seasonals/Resources/space_assets/Satellite_2.gif"
];
// Credit: https://pixabay.com/de/illustrations/raumstation-raum-struktur-8023777/
const issImage = "../Seasonals/Resources/space_assets/iss.png";
/**
* Credits:
* https://lottiefiles.com/free-animation/rocket-MYUQ3UFq3k
* https://pixabay.com/de/vectors/space-shuttle-atlantis-nasa-156012/
*/
const rocketImages = [
"../Seasonals/Resources/space_assets/rocket.gif",
"../Seasonals/Resources/space_assets/space-shuttle.png"
@@ -78,26 +88,19 @@ function createSpace() {
document.body.appendChild(container);
}
const standardPlanetCount = 4;
const standardAstronautCount = 1;
const standardSatelliteCount = 2;
const standardIssCount = 1;
const standardRocketCount = 1;
// const standardPlanetCount = 4;
// const standardAstronautCount = 1;
// const standardSatelliteCount = 2;
// const standardIssCount = 1;
// const standardRocketCount = 1;
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
let pCount = planetCountConf;
let aCount = astronautCountConf;
let sCount = satelliteCountConf;
let iCount = issCountConf;
let rCount = rocketCountConf;
if (isMobile && !enableRandomMobile) {
pCount = standardPlanetCount;
aCount = standardAstronautCount;
sCount = standardSatelliteCount;
iCount = standardIssCount;
rCount = standardRocketCount;
}
let divisor = isMobile ? Math.max(1, symbolCountMobile) : 1;
let pCount = Math.floor(planetCountConf / divisor);
let aCount = Math.floor(astronautCountConf / divisor);
let sCount = Math.floor(satelliteCountConf / divisor);
let iCount = Math.floor(issCountConf / divisor);
let rCount = Math.floor(rocketCountConf / divisor);
// Add Nebula Glow
const bgGlow = document.createElement('div');
@@ -252,7 +255,8 @@ function createSpace() {
// Swap to a random image from the pool every time it completes an orbit (disappears)
if (imageArr.length > 1) {
// The animation delay pushes the initial cycle, so we use setInterval matched to duration
setInterval(() => {
const intervalId = setInterval(() => {
if (!document.body.contains(container)) { clearInterval(intervalId); return; }
// Update only if currently out of bounds to avoid popping
const rect = symbol.getBoundingClientRect();
if (rect.right < 0 || rect.left > window.innerWidth) {

View File

@@ -8,6 +8,7 @@
height: 100%;
pointer-events: none;
z-index: 10;
contain: layout paint;
}
.spooky {
@@ -16,19 +17,8 @@
will-change: transform;
translate: 0 120vh;
z-index: 15;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
cursor: default;
-webkit-animation-name: spooky-float;
-webkit-animation-duration: 10s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-play-state: running;
animation-name: spooky-float;
animation-duration: 10s;
animation-timing-function: linear;
@@ -40,13 +30,6 @@
width: 30px;
height: auto;
will-change: transform;
-webkit-animation-name: spooky-shake;
-webkit-animation-duration: 3s;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-play-state: running;
animation-name: spooky-shake;
animation-duration: 3s;
animation-timing-function: ease-in-out;
@@ -59,22 +42,6 @@
width: 100%;
}
@-webkit-keyframes spooky-float {
0% {
translate: 0 120vh;
opacity: 0;
}
10% {
opacity: 0.8;
}
90% {
opacity: 0.8;
}
100% {
translate: 0 -150px;
opacity: 0;
}
}
@keyframes spooky-float {
0% {
@@ -93,14 +60,6 @@
}
}
@-webkit-keyframes spooky-shake {
0%, 100% {
transform: translateX(0) scale(1) rotate(15deg);
}
50% {
transform: translateX(80px) scale(1.2) rotate(-15deg);
}
}
@keyframes spooky-shake {
0%, 100% {
@@ -111,7 +70,6 @@
}
}
/* Base predefined starting offsets (if not overridden by js) */
.spooky:nth-of-type(0) { left: 1%; }
.spooky:nth-of-type(1) { left: 10%; }
.spooky:nth-of-type(2) { left: 20%; }

View File

@@ -1,11 +1,17 @@
const config = window.SeasonalsPluginConfig?.Spooky || {};
const spooky = config.EnableSpooky !== undefined ? config.EnableSpooky : true; // enable/disable
const spookyCount = config.SymbolCount || 25; // count of random extra symbols
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const enableSpookySway = config.EnableSpookySway !== undefined ? config.EnableSpookySway : true;
const spookySize = config.SpookySize || 20;
const spookyGlowSize = config.SpookyGlowSize !== undefined ? config.SpookyGlowSize : 2;
const spooky = config.EnableSpooky !== undefined ? config.EnableSpooky : true; // enable/disable spooky
const spookyCount = config.SymbolCount !== undefined ? config.SymbolCount : 25; // count of symbols
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableSpookySway = config.EnableSpookySway !== undefined ? config.EnableSpookySway : true; // enable/disable spooky sway
const spookySize = config.SpookySize !== undefined ? config.SpookySize : 20; // size of elements
const spookyGlowSize = config.SpookyGlowSize !== undefined ? config.SpookyGlowSize : 2; // size of element glow
const spookyImages = [
"../Seasonals/Resources/halloween_images/ghost_20x20.png",
"../Seasonals/Resources/halloween_images/bat_20x20.png",
"../Seasonals/Resources/halloween_images/pumpkin_20x20.png",
];
let msgPrinted = false;
@@ -20,13 +26,13 @@ function toggleSpooky() {
const hasUserMenu = document.querySelector('#app-user-menu');
if (videoPlayer || trailerPlayer || isDashboard || hasUserMenu) {
spookyContainer.style.display = 'none'; // hide spooky
spookyContainer.style.display = 'none';
if (!msgPrinted) {
console.log('Spooky Theme hidden');
msgPrinted = true;
}
} else {
spookyContainer.style.display = 'block'; // show spooky
spookyContainer.style.display = 'block';
if (msgPrinted) {
console.log('Spooky Theme visible');
msgPrinted = false;
@@ -34,7 +40,6 @@ function toggleSpooky() {
}
}
// observe changes in the DOM
const observer = new MutationObserver(toggleSpooky);
observer.observe(document.body, {
childList: true,
@@ -42,13 +47,7 @@ observer.observe(document.body, {
attributes: true
});
const spookyImages = [
"../Seasonals/Resources/halloween_images/ghost_20x20.png",
"../Seasonals/Resources/halloween_images/bat_20x20.png",
"../Seasonals/Resources/halloween_images/pumpkin_20x20.png",
];
// create spooky objects
function createSpooky() {
const container = document.querySelector('.spooky-container') || document.createElement("div");
@@ -95,7 +94,6 @@ function createSpooky() {
});
}
// Add configured extra symbols
for (let i = 0; i < spookyCount; i++) {
const spookyOuter = document.createElement("div");
spookyOuter.className = "spooky";

View File

@@ -5,16 +5,17 @@
width: 100vw;
height: 100vh;
pointer-events: none;
z-index: 9999;
z-index: 10;
overflow: hidden;
contain: strict;
}
.sports-symbol {
position: absolute;
top: -10vh;
top: 0;
opacity: 0.9;
z-index: 40;
translate: 0 -10vh;
}
.sports-inner {
@@ -29,13 +30,15 @@
}
.sports-confetti {
will-change: transform, opacity;
position: absolute;
top: -5vh;
top: 0;
width: 10px;
height: 15px;
opacity: 0.8;
animation: sports-confetti-fall linear infinite;
border-radius: 2px;
translate: 0 -5vh;
}
.sports-confetti.circle {

View File

@@ -1,29 +1,30 @@
const config = window.SeasonalsPluginConfig?.Sports || {};
const sports = config.EnableSports !== undefined ? config.EnableSports : true;
const symbolCount = config.SymbolCount || 5;
const useRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true;
const enableRandomMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const enableTrophy = config.EnableTrophy !== undefined ? config.EnableTrophy : false;
const sports = config.EnableSports !== undefined ? config.EnableSports : true; // enable/disable sports
const symbolCount = config.SymbolCount !== undefined ? config.SymbolCount : 5; // count of balls per category
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableTrophy = config.EnableTrophy !== undefined ? config.EnableTrophy : false; // enable/disable trophy
const rawSportsBalls = config.SportsBalls !== undefined ? config.SportsBalls : 'football,basketball,tennis,volleyball'; // set sports categories to spawn
const turfColorHex = config.TurfColor !== undefined ? config.TurfColor : '#228b22'; // color of turf
const confettiColors = config.ConfettiColors ? config.ConfettiColors.split(',') : ['#000000', '#FF0000', '#FFCC00']; // Add Country Colored confetti
// Pre-declare and manage image assets
// Credits: https://flaticon.com
const SPORTS_ASSETS = {
badminton: ['badminton_1', 'badminton_2'],
baseball: ['baseball_1', 'baseball_2'],
basketball: ['basketball_1', 'basketball_2'],
billiard: Array.from({length: 14}, (_, i) => `billiard_ball_${i + 1}`),
bowling: ['bowling_1', 'bowling_2'],
football: Array.from({length: 5}, (_, i) => `football_${i + 1}`),
golf: ['golf_ball_1', 'golf_ball_2'],
rugby: ['rugby_ball_1', 'rugby_ball_2'],
table_tennis: ['table_tennis_ball_1', 'table_tennis_ball_2'],
tennis: ['tennis_ball_1', 'tennis_ball_2'],
volleyball: ['volleyball_1', 'volleyball_2'],
waterball: ['waterball_1', 'waterball_2']
badminton: ['badminton_1', 'badminton_2'],
baseball: ['baseball_1', 'baseball_2'],
basketball: ['basketball_1', 'basketball_2'],
billiard: Array.from({length: 14}, (_, i) => `billiard_ball_${i + 1}`),
bowling: ['bowling_1', 'bowling_2'],
football: Array.from({length: 5}, (_, i) => `football_${i + 1}`),
golf: ['golf_ball_1', 'golf_ball_2'],
rugby: ['rugby_ball_1', 'rugby_ball_2'],
table_tennis: ['table_tennis_ball_1', 'table_tennis_ball_2'],
tennis: ['tennis_ball_1', 'tennis_ball_2'],
volleyball: ['volleyball_1', 'volleyball_2'],
waterball: ['waterball_1', 'waterball_2']
};
const turfColorHex = config.TurfColor || '#228b22';
let msgPrinted = false;
@@ -67,11 +68,10 @@ function createSports() {
document.body.appendChild(container);
}
// Parse turf color config
// Create a turf/grass overlay at the bottom using the provided hex
const turf = document.createElement('div');
turf.className = 'sports-turf';
// Using hex with transparency (e.g., 4D = 30%, CC = 80%)
// Using hex with transparency
turf.style.background = `linear-gradient(180deg, transparent 0%, ${turfColorHex}4D 30%, ${turfColorHex}CC 100%)`;
container.appendChild(turf);
@@ -85,7 +85,6 @@ function createSports() {
const useRandomDuration = enableDifferentDuration !== false;
// Map standard sports balls to spawn based on category configuration
const rawSportsBalls = config.SportsBalls || 'football,basketball,tennis,volleyball';
const chosenCategories = rawSportsBalls.split(',').map(s => s.trim()).filter(s => s !== '');
const createBall = (randomItem) => {
@@ -140,7 +139,7 @@ function createSports() {
// Create falling sports balls
chosenCategories.forEach(category => {
let variants = SPORTS_ASSETS[category];
if (!variants) variants = [category]; // Legacy fallback
if (!variants) variants = [category];
for (let i = 0; i < ballsPerCategory; i++) {
// Pick a random variant
@@ -162,7 +161,6 @@ function createSports() {
let trophyImg = document.createElement('img');
trophyImg.src = `../Seasonals/Resources/sport_assets/trophy.gif`;
// Randomly scale trophy slightly larger
trophyImg.style.transform = `scale(${Math.random() * 0.5 + 0.8})`;
trophyImg.onerror = function() {
this.style.display = 'none';
@@ -203,16 +201,14 @@ function createSports() {
}, arcDuration * 1000 + 500);
// Schedule the next trophy
setTimeout(launchTrophy, Math.random() * 20000 + 10000); // Wait 10-30s until next trophy
setTimeout(() => { if (document.body.contains(container)) launchTrophy(); }, Math.random() * 20000 + 10000); // Wait 10-30s until next trophy
}
// Launch initial trophy after a short delay
if (enableTrophy) {
setTimeout(launchTrophy, Math.random() * 5000 + 2000);
setTimeout(() => { if (document.body.contains(container)) launchTrophy(); }, Math.random() * 5000 + 2000);
}
// Add Germany Colored confetti (Black, Red, Gold)
const confettiColors = ['#000000', '#FF0000', '#FFCC00'];
const confettiCount = isMobile ? 30 : 60;
for (let i = 0; i < confettiCount; i++) {
@@ -257,8 +253,6 @@ function createSports() {
}
}
/* Removed legacy fallback logic */
function initializeSports() {
if (!sports) return;
createSports();

View File

@@ -29,13 +29,14 @@
/* Sunbeams */
.spring-sunbeam {
position: fixed;
top: -50%;
top: 0;
height: 200%;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 200, 0.08) 50%, rgba(255, 255, 255, 0));
z-index: 5;
transform-origin: top center;
pointer-events: none;
opacity: 0;
translate: 0 -50vh;
}
/* Grass Container (Wrapper) */
@@ -72,6 +73,7 @@
/* SVG Meadow Layer */
.spring-meadow-layer {
will-change: transform;
position: absolute;
bottom: 0;
left: 0;
@@ -94,6 +96,7 @@
}
.spring-sway {
will-change: transform;
transform-origin: bottom center;
animation: spring-meadow-sway 4s ease-in-out infinite alternate;
}

View File

@@ -1,14 +1,14 @@
const config = window.SeasonalsPluginConfig?.Spring || {};
const spring = config.EnableSpring !== undefined ? config.EnableSpring : true; // Enable/disable spring
const pollenCount = config.PollenCount || 30; // Number of pollen particles
const sunbeamCount = config.SunbeamCount || 5; // Number of sunbeams
const enableSunbeams = config.EnableSpringSunbeams !== undefined ? config.EnableSpringSunbeams : true; // Enable/disable sunbeams
const birdCount = config.BirdCount !== undefined ? config.BirdCount : 3; // Number of birds
const butterflyCount = config.ButterflyCount !== undefined ? config.ButterflyCount : 4; // Number of butterflies
const beeCount = config.BeeCount !== undefined ? config.BeeCount : 2; // Number of bees
const ladybugCount = config.LadybugCount !== undefined ? config.LadybugCount : 2; // Number of ladybugs
const randomSpring = config.EnableRandomSpring !== undefined ? config.EnableRandomSpring : true; // Enable random spring objects
const spring = config.EnableSpring !== undefined ? config.EnableSpring : true; // enable/disable spring
const pollenCount = config.PollenCount !== undefined ? config.PollenCount : 30; // count of pollen
const enableSunbeams = config.EnableSpringSunbeams !== undefined ? config.EnableSpringSunbeams : true; // enable/disable sunbeams
const sunbeamCount = config.SunbeamCount !== undefined ? config.SunbeamCount : 5; // count of sunbeams
const birdCount = config.BirdCount !== undefined ? config.BirdCount : 3; // count of birds
const butterflyCount = config.ButterflyCount !== undefined ? config.ButterflyCount : 4; // count of butterflies
const beeCount = config.BeeCount !== undefined ? config.BeeCount : 2; // count of bees
const ladybugCount = config.LadybugCount !== undefined ? config.LadybugCount : 2; // count of ladybugs
const symbolCountMobile = config.SymbolCountMobile !== undefined ? config.SymbolCountMobile : 2; // Devisor to reduce number of objects on mobile
// Credit: https://lottiefiles.com/free-animation/birds-flying-V7O0L8jkOg
const birdImages = [
@@ -23,7 +23,10 @@ const butterflyImages = [
'../Seasonals/Resources/spring_assets/Butterfly_2.gif'
];
// Credit: https://lottiefiles.com/free-animation/loading-flying-beee-WcTfIccdJZ
const beeImage = '../Seasonals/Resources/spring_assets/Bee.gif';
// Credit: https://pixabay.com/gifs/ladybug-insect-nature-fly-wings-5068/
const ladybugImage = '../Seasonals/Resources/spring_assets/ladybug.gif';
let msgPrinted = false;
@@ -230,28 +233,35 @@ function initializeSpring() {
const container = document.querySelector('.spring-container');
if (container) {
if (randomSpring) {
// Add Pollen
for (let i = 0; i < pollenCount; i++) {
createPollen(container);
}
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
let divisor = isMobile ? Math.max(1, symbolCountMobile) : 1;
// Add Birds
for (let i = 0; i < birdCount; i++) {
setTimeout(() => createBird(container), Math.random() * 1000); // 0-1s desync
}
// Add Butterflies
for (let i = 0; i < butterflyCount; i++) {
setTimeout(() => createButterfly(container), Math.random() * 1000); // 0-1s desync
}
// Add Bees
for (let i = 0; i < beeCount; i++) {
setTimeout(() => createBee(container), Math.random() * 1000); // 0-1s desync
}
// Add Ladybugs
for (let i = 0; i < ladybugCount; i++) {
setTimeout(() => createLadybugGif(container), Math.random() * 1000); // 0-1s desync
}
let adjPollen = Math.floor(pollenCount / divisor);
let adjBird = Math.floor(birdCount / divisor);
let adjButterfly = Math.floor(butterflyCount / divisor);
let adjBee = Math.floor(beeCount / divisor);
let adjLadybug = Math.floor(ladybugCount / divisor);
// Add Pollen
for (let i = 0; i < adjPollen; i++) {
createPollen(container);
}
// Add Birds
for (let i = 0; i < adjBird; i++) {
setTimeout(() => createBird(container), Math.random() * 1000); // 0-1s desync
}
// Add Butterflies
for (let i = 0; i < adjButterfly; i++) {
setTimeout(() => createButterfly(container), Math.random() * 1000); // 0-1s desync
}
// Add Bees
for (let i = 0; i < adjBee; i++) {
setTimeout(() => createBee(container), Math.random() * 1000); // 0-1s desync
}
// Add Ladybugs
for (let i = 0; i < adjLadybug; i++) {
setTimeout(() => createLadybugGif(container), Math.random() * 1000); // 0-1s desync
}
}
}
@@ -295,7 +305,7 @@ function createBird(container) {
wrapper.addEventListener('animationend', (e) => {
if (e.animationName.includes('fly-')) {
wrapper.remove();
createBird(container);
if (document.body.contains(container)) createBird(container);
}
});
@@ -338,7 +348,7 @@ function createButterfly(container) {
wrapper.addEventListener('animationend', (e) => {
if (e.animationName.includes('fly-')) {
wrapper.remove();
createButterfly(container);
if (document.body.contains(container)) createButterfly(container);
}
});
@@ -385,7 +395,7 @@ function createBee(container) {
wrapper.addEventListener('animationend', (e) => {
if (e.animationName.includes('fly-')) {
wrapper.remove();
createBee(container);
if (document.body.contains(container)) createBee(container);
}
});
@@ -428,7 +438,7 @@ function createLadybugGif(container) {
wrapper.addEventListener('animationend', (e) => {
if (e.animationName.includes('walk-')) {
wrapper.remove();
createLadybugGif(container);
if (document.body.contains(container)) createLadybugGif(container);
}
});

View File

@@ -13,10 +13,11 @@
.starwars-center {
position: absolute;
top: 50%;
top: 0;
left: 50%;
width: 0;
height: 0;
translate: 0 50vh;
}
.starwars-streak {

View File

@@ -1,5 +1,5 @@
const config = window.SeasonalsPluginConfig?.StarWars || {};
const starwars = config.EnableStarWars !== undefined ? config.EnableStarWars : true;
const starwars = config.EnableStarWars !== undefined ? config.EnableStarWars : true; // enable/disable starwars
let msgPrinted = false;

View File

@@ -1,10 +1,10 @@
const config = window.SeasonalsPluginConfig?.Storm || {};
const enabled = config.EnableStorm !== undefined ? config.EnableStorm : true;
const enabled = config.EnableStorm !== undefined ? config.EnableStorm : true; // enable/disable storm
const isMobile = window.innerWidth <= 768;
const elementCount = isMobile ? (config.RaindropCountMobile || 150) : (config.RaindropCount || 300);
const enableLightning = config.EnableLightning !== undefined ? config.EnableLightning : true;
const rainSpeed = config.RainSpeed || 1.0;
const elementCount = isMobile ? (config.RaindropCountMobile || 150) : (config.RaindropCount || 300); // count of raindrops
const enableLightning = config.EnableLightning !== undefined ? config.EnableLightning : true; // enable/disable lightning
const rainSpeed = config.RainSpeed !== undefined ? config.RainSpeed : 1.0; // speed of rain
let msgPrinted = false;

View File

@@ -1,11 +1,10 @@
const config = window.SeasonalsPluginConfig?.Summer || {};
const summer = config.EnableSummer !== undefined ? config.EnableSummer : true; // Enable/disable summer theme
const bubbleCount = config.BubbleCount || 30; // Number of bubbles
const dustCount = config.DustCount || 50; // Number of dust particles
const randomSummer = config.EnableRandomSummer !== undefined ? config.EnableRandomSummer : true; // Enable random generating objects
const randomSummerMobile = config.EnableRandomSummerMobile !== undefined ? config.EnableRandomSummerMobile : false; // Enable random generating objects on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // Randomize animation duration of bubbles and dust
const summer = config.EnableSummer !== undefined ? config.EnableSummer : true; // enable/disable summer
const bubbleCount = config.BubbleCount !== undefined ? config.BubbleCount : 30; // count of bubbles
const dustCount = config.DustCount !== undefined ? config.DustCount : 50; // count of dust particles
const symbolCountMobile = config.SymbolCountMobile !== undefined ? config.SymbolCountMobile : 2; // Devisor to reduce number of objects on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
let msgPrinted = false;
@@ -39,34 +38,23 @@ observer.observe(document.body, {
subtree: true,
attributes: true
});
function createBubble(container, isDust = false) {
function createBubble(container) {
const bubble = document.createElement('div');
if (isDust) {
bubble.classList.add('summer-dust');
} else {
bubble.classList.add('summer-bubble');
}
bubble.classList.add('summer-bubble');
// Random horizontal position
const randomLeft = Math.random() * 100;
bubble.style.left = `${randomLeft}%`;
// Random size
if (!isDust) {
// MARK: BUBBLE SIZE
const size = Math.random() * 20 + 10; // 10-30px bubbles
bubble.style.width = `${size}px`;
bubble.style.height = `${size}px`;
} else {
// MARK: DUST SIZE
const size = Math.random() * 3 + 1; // 1-4px dust
bubble.style.width = `${size}px`;
bubble.style.height = `${size}px`;
}
// MARK: BUBBLE SIZE
const size = Math.random() * 20 + 10; // 10-30px bubbles
bubble.style.width = `${size}px`;
bubble.style.height = `${size}px`;
// Animation properties
const duration = isDust ? (Math.random() * 20 + 10) : (Math.random() * 10 + 5); // Dust is slower
const duration = (Math.random() * 10 + 5);
const delay = Math.random() * 10;
if (enableDifferentDuration) {
@@ -77,19 +65,30 @@ function createBubble(container, isDust = false) {
container.appendChild(bubble);
}
function addRandomSummerObjects() {
const container = document.querySelector('.summer-container');
if (!container) return;
function createDust(container) {
const dust = document.createElement('div');
dust.classList.add('summer-dust');
// Random horizontal position
const randomLeft = Math.random() * 100;
dust.style.left = `${randomLeft}%`;
// MARK: DUST SIZE
const size = Math.random() * 3 + 1; // 1-4px dust
dust.style.width = `${size}px`;
dust.style.height = `${size}px`;
// Animation properties
const duration = (Math.random() * 20 + 10); // Dust is slower
const delay = Math.random() * 10;
// Add bubbles
for (let i = 0; i < bubbleCount; i++) {
createBubble(container, false);
}
// Add some dust particles
for (let i = 0; i < dustCount; i++) {
createBubble(container, true);
if (enableDifferentDuration) {
dust.style.animationDuration = `${duration}s`;
}
dust.style.animationDelay = `${delay}s`;
container.appendChild(dust);
}
function initSummerObjects() {
@@ -101,38 +100,18 @@ function initSummerObjects() {
document.body.appendChild(container);
}
// Initial bubbles/dust
for (let i = 0; i < 10; i++) {
const bubble = document.createElement('div');
const isDust = Math.random() > 0.5;
if (isDust) {
bubble.classList.add('summer-dust');
} else {
bubble.classList.add('summer-bubble');
}
const randomLeft = Math.random() * 100;
bubble.style.left = `${randomLeft}%`;
if (!isDust) {
// MARK: BUBBLE SIZE
const size = Math.random() * 20 + 10;
bubble.style.width = `${size}px`;
bubble.style.height = `${size}px`;
} else {
// MARK: DUST SIZE
const size = Math.random() * 3 + 1;
bubble.style.width = `${size}px`;
bubble.style.height = `${size}px`;
}
const duration = isDust ? (Math.random() * 20 + 10) : (Math.random() * 10 + 5);
if (enableDifferentDuration) {
bubble.style.animationDuration = `${duration}s`;
}
bubble.style.animationDelay = `-${Math.random() * 10}s`;
container.appendChild(bubble);
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
let limitBubbles = isMobile ? Math.floor(bubbleCount / Math.max(1, symbolCountMobile)) : bubbleCount;
let limitDust = isMobile ? Math.floor(dustCount / Math.max(1, symbolCountMobile)) : dustCount;
// Initial bubbles
for (let i = 0; i < limitBubbles; i++) {
createBubble(container);
}
// Initial dust
for (let i = 0; i < limitDust; i++) {
createDust(container);
}
}
@@ -140,11 +119,6 @@ function initializeSummer() {
if (!summer) return;
initSummerObjects();
toggleSummer();
const screenWidth = window.innerWidth;
if (randomSummer && (screenWidth > 768 || randomSummerMobile)) {
addRandomSummerObjects();
}
}
initializeSummer();

View File

@@ -35,6 +35,7 @@
}
.underwater-seaweed {
will-change: transform, opacity;
position: absolute;
bottom: -1vh;
font-size: 4rem;
@@ -52,6 +53,7 @@
}
.underwater-bubble {
will-change: transform;
position: absolute;
bottom: -5vh;
border-radius: 50%;
@@ -73,13 +75,13 @@
}
@keyframes underwater-traverse-up {
0% { top: 120vh; }
100% { top: -20vh; }
0% { top: 0; translate: 0 120vh; }
100% { top: 0; translate: 0 -20vh; }
}
@keyframes underwater-traverse-down {
0% { top: -20vh; }
100% { top: 120vh; }
0% { top: 0; translate: 0 -20vh; }
100% { top: 0; translate: 0 120vh; }
}
@keyframes underwater-sway-y {
@@ -101,8 +103,9 @@
}
.underwater-god-rays {
will-change: transform;
position: absolute;
top: -50vh;
top: 0;
left: -50vw;
width: 200vw;
height: 200vh;
@@ -119,6 +122,7 @@
transform-origin: top center;
mix-blend-mode: overlay;
filter: blur(5px);
translate: 0 -50vh;
}
@keyframes god-rays-sway {

View File

@@ -1,43 +1,63 @@
const config = window.SeasonalsPluginConfig?.Underwater || {};
const underwater = config.EnableUnderwater !== undefined ? config.EnableUnderwater : true;
const symbolCount = config.SymbolCount || 15;
const useRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true;
const enableRandomMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;
const enableLightRays = config.EnableLightRays !== undefined ? config.EnableLightRays : true;
const seaweedCount = config.SeaweedCount !== undefined ? config.SeaweedCount : 50;
const underwater = config.EnableUnderwater !== undefined ? config.EnableUnderwater : true; // enable/disable underwater
const symbolCountMobile = config.SymbolCountMobile !== undefined ? config.SymbolCountMobile : 2; // Devisor to reduce number of objects on mobile
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true; // enable different durations
const enableLightRays = config.EnableLightRays !== undefined ? config.EnableLightRays : true; // enable/disable lightrays
const seaweedCount = config.SeaweedCount !== undefined ? config.SeaweedCount : 50; // count of seaweed
// Entity counts configured
const fishCount = config.FishCount !== undefined ? config.FishCount : 15;
const seahorseCount = config.SeahorseCount !== undefined ? config.SeahorseCount : 3;
const jellyfishCount = config.JellyfishCount !== undefined ? config.JellyfishCount : 3;
const turtleCount = config.TurtleCount !== undefined ? config.TurtleCount : 1;
const crabCount = config.CrabCount !== undefined ? config.CrabCount : 2;
const starfishCount = config.StarfishCount !== undefined ? config.StarfishCount : 2;
const shellCount = config.ShellCount !== undefined ? config.ShellCount : 2;
const fishCount = config.FishCount !== undefined ? config.FishCount : 15; // count of fish
const seahorseCount = config.SeahorseCount !== undefined ? config.SeahorseCount : 3; // count of seahorse
const jellyfishCount = config.JellyfishCount !== undefined ? config.JellyfishCount : 3; // count of jellyfish
const turtleCount = config.TurtleCount !== undefined ? config.TurtleCount : 1; // count of turtle
const crabCount = config.CrabCount !== undefined ? config.CrabCount : 2; // count of crab
const starfishCount = config.StarfishCount !== undefined ? config.StarfishCount : 2; // count of starfish
const shellCount = config.ShellCount !== undefined ? config.ShellCount : 2; // count of shell
// credits: https://lottiefiles.com/free-animation/seaweed-E6Go0HdkqY
const seaweeds = [
"../Seasonals/Resources/underwater_assets/seaweed_1.gif",
"../Seasonals/Resources/underwater_assets/seaweed_2.gif"
];
// Statics for bottom
/**
* Credits:
* https://www.animierte-gifs.net/img-animiertes-krebs-bild-0041-59970.htm
* https://www.animierte-gifs.net/img-animiertes-krebs-bild-0002-59931.htm
*
*/
const crabImages = [
"../Seasonals/Resources/underwater_assets/crab_1.gif",
"../Seasonals/Resources/underwater_assets/crab_2.gif",
"../Seasonals/Resources/underwater_assets/crab_3.gif"
];
/**
* Credits:
* https://lottiefiles.com/free-animation/dancing-starfish-tJ9ZFu9Zq0
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0003-50003.htm
*/
const starfishImages = [
"../Seasonals/Resources/underwater_assets/starfish_1.gif",
"../Seasonals/Resources/underwater_assets/starfish_2.gif"
];
// Credit: https://www.animierte-gifs.net/img-animiertes-muschel-bild-0021-108539.htm
const shellImages = [
"../Seasonals/Resources/underwater_assets/shell_1.gif"
];
/**
* Credits:
* https://lottiefiles.com/free-animation/0101uwt-tt-01-4fA4Lm9gtN
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0473-50473.htm
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0290-50290.htm
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0049-50049.htm
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0403-50403.htm
*
* https://flaticon.com
*/
const fishImages = [
"../Seasonals/Resources/underwater_assets/fish_1.gif",
"../Seasonals/Resources/underwater_assets/fish_2.gif",
@@ -55,15 +75,22 @@ const fishImages = [
"../Seasonals/Resources/underwater_assets/fish_15.png"
];
/**
* Credits:
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0221-50221.htm
* https://www.animierte-gifs.net/img-animiertes-fische-bild-0217-50217.htm
*/
const seahorsesImages = [
"../Seasonals/Resources/underwater_assets/seahorse_1.gif",
"../Seasonals/Resources/underwater_assets/seahorse_2.gif"
];
// credit: https://lottiefiles.com/free-animation/sea-turtle-s0sbHIWS2F
const turtleImages = [
"../Seasonals/Resources/underwater_assets/turtle.gif"
];
// credits: https://lottiefiles.com/free-animation/jellyfish-wPwyF8EeSQ
const jellyfishImages = [
"../Seasonals/Resources/underwater_assets/jellyfish_1.gif",
"../Seasonals/Resources/underwater_assets/jellyfish_2.gif"
@@ -137,16 +164,15 @@ function createUnderwater() {
const useRandomDuration = enableDifferentDuration !== false;
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
// Seaweed swaying at the bottom (evenly distributed based on count)
const activeSeaweedCount = Math.max(1, seaweedCount);
const activeSeaweedCount = isMobile ? Math.max(1, Math.floor(seaweedCount / Math.max(1, symbolCountMobile))) : Math.max(1, seaweedCount);
const seaweedSpacing = 95 / activeSeaweedCount;
for (let i = 0; i < seaweedCount; i++) {
for (let i = 0; i < activeSeaweedCount; i++) {
let seaweed = document.createElement('div');
seaweed.className = 'underwater-seaweed';
seaweed.style.position = 'absolute';
// MARK: Distance from the bottom edge for the seaweed
// Distance from the bottom edge for the seaweed
seaweed.style.bottom = '-18px';
let offset = (Math.random() * seaweedSpacing) - (seaweedSpacing / 2);
@@ -163,7 +189,7 @@ function createUnderwater() {
seaweed.style.transform = `scale(${scale}) ${flip}`;
seaweed.style.zIndex = depth < 0.5 ? '15' : '30';
// Mix Emojis and GIFs
// Mix Emojis and GIFs for seaweed
if (Math.random() > 0.4) {
let img = document.createElement('img');
img.src = seaweeds[Math.floor(Math.random() * seaweeds.length)];
@@ -182,9 +208,8 @@ function createUnderwater() {
// Static Bottom Creatures logic
function spawnStatic(imageArray, maxCount, baseSize) {
// Evaluate an actual count between 1 and maxCount if random symbols are enabled
const actualCount = (useRandomSymbols && maxCount > 0) ? Math.floor(Math.random() * maxCount) + 1 : maxCount;
for (let i = 0; i < actualCount; i++) {
let spawnLimit = isMobile ? Math.floor(maxCount / Math.max(1, symbolCountMobile)) : maxCount;
for (let i = 0; i < spawnLimit; i++) {
let creature = document.createElement('div');
creature.className = 'underwater-static-bottom';
creature.style.position = 'absolute';
@@ -216,13 +241,9 @@ function createUnderwater() {
// Swimmers logic
function spawnSwimmerLoop(imageArray, maxCount, baseSize, typeName) {
if (maxCount <= 0) return;
let spawnLimit = isMobile ? (enableRandomMobile ? maxCount : Math.floor(maxCount / 2)) : maxCount;
let spawnLimit = isMobile ? Math.floor(maxCount / Math.max(1, symbolCountMobile)) : maxCount;
// Randomize the actual amount spawned up to the limit
const actualCount = (useRandomSymbols && spawnLimit > 0) ? Math.floor(Math.random() * spawnLimit) + 1 : spawnLimit;
for (let i = 0; i < actualCount; i++) {
// Spawn immediately but use negative delay to distribute them across the screen!
for (let i = 0; i < spawnLimit; i++) {
spawnSingleSwimmer(imageArray, baseSize, typeName);
}
}

View File

@@ -9,12 +9,12 @@
"imageUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/Jellyfin-Seasonals-Plugin/raw/branch/main/logo.png",
"versions": [
{
"version": "2.0.0.0",
"version": "2.0.0.1",
"changelog": "- feat: add many themes\n- fix: improve performance",
"targetAbi": "10.11.0.0",
"sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/Jellyfin-Seasonals-Plugin/releases/download/v2.0.0.0/Jellyfin.Plugin.Seasonals.zip",
"checksum": "11a55b3af5536ad6b3d281746e61f8e6",
"timestamp": "2026-02-27T00:20:15Z"
"sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/Jellyfin-Seasonals-Plugin/releases/download/v2.0.0.1/Jellyfin.Plugin.Seasonals.zip",
"checksum": "2eb9ce92f3aa89d133ad09cd874b7c85",
"timestamp": "2026-02-27T03:27:02Z"
},
{
"version": "1.7.2.0",