Fixed season and location seasons inter-functionality

fantasycalendar · Feb 2, 2025 · c156140 · c156140
1 parent caa8d85
commit c156140
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 15 deletions.
diff --git a/resources/js/calendar/locations_collapsible.js b/resources/js/calendar/locations_collapsible.js
@@ -39,7 +39,7 @@ class LocationsCollapsible extends CollapsibleComponent {
     }
 
     changeHandlers = {
-        "seasons": this.updateLocationsWithSeasonBasedTime
+        "seasons": this.seasonsChanged
     }
 
     loaded() {
@@ -262,8 +262,28 @@ class LocationsCollapsible extends CollapsibleComponent {
         }
     }
 
-    updateLocationsWithSeasonBasedTime(){
+    seasonsChanged(){
         for(let location_index in this.locations){
+
+            const current_season_count = this.locations[location_index].seasons.length;
+            if(current_season_count > this.seasons.length){
+                this.locations[location_index].seasons.splice(this.seasons.length, current_season_count - this.seasons.length);
+            }else if(current_season_count < this.seasons.length){
+
+                this.locations[location_index].seasons = this.locations[location_index].seasons.concat(
+                    this.seasons.slice(current_season_count, this.seasons.length).map(season => {
+                        return {
+                            "time": season.time,
+                            "weather": {
+                                "temp_low": 0,
+                                "temp_high": 0,
+                                "precipitation": 0,
+                                "precipitation_intensity": 0
+                            }
+                        }
+                    })
+                )
+            }
             this.updateSeasonBasedTime(location_index)
         }
     }

diff --git a/resources/js/calendar/seasons_collapsible.js b/resources/js/calendar/seasons_collapsible.js
@@ -52,18 +52,26 @@ class SeasonsCollapsible extends CollapsibleComponent {
         "locations": this.evaluateSeasonLengthText,
     }
 
+    draggableRef = "seasons-sortable";
+
+    reorderSortable(start, end) {
+        const elem = this.seasons.splice(start, 1)[0];
+        this.seasons.splice(end, 0, elem);
+    }
+
     loaded(){
         this.handleSeasonsChanged();
     }
 
     handleSeasonsChanged() {
         this.evaluateSeasonLengthText();
-        this.refreshSeasonPresetOrder()
+        this.refreshSeasonPresetOrder();
+        this.sortSeasons();
     }
 
     addSeason() {
         let newSeason = {
-            "name": this.season_name,
+            "name": this.season_name || "New season",
             "color": [
                 "#" + Math.floor(Math.random() * 16777215).toString(16).toString(),
                 "#" + Math.floor(Math.random() * 16777215).toString(16).toString()
@@ -80,7 +88,7 @@ class SeasonsCollapsible extends CollapsibleComponent {
             }
         };
 
-        let averageYearLength = this.$state.calendar.average_year_length;
+        let averageYearLength = this.$store.calendar.average_year_length;
 
         if(this.settings.periodic_seasons){
             if (this.seasons.length === 0) {
@@ -365,6 +373,16 @@ class SeasonsCollapsible extends CollapsibleComponent {
         return false;
     }
 
+    sortSeasons(){
+        if(this.settings.periodic_seasons) return;
+        this.seasons.sort((a, b) => {
+            return (a.timespan === b.timespan)
+                ? a.day - b.day
+                : a.timespan - b.timespan;
+        });
+        // TODO: Figure out a way to persist the current expanded season even though order changed
+    }
+
     refreshSeasonPresetOrder(){
         let detectedSeasons = this.determineAutomaticSeasonMapping();
 
@@ -397,16 +415,16 @@ class SeasonsCollapsible extends CollapsibleComponent {
         let errors = [];
 
         for (let season_i = 0; season_i < this.seasons.length; season_i++) {
-            let curr_season = window.static_data.seasons.data[season_i];
-            if (window.static_data.seasons.global_settings.periodic_seasons) {
+            let curr_season = this.seasons[season_i];
+            if (this.settings.periodic_seasons) {
                 if (curr_season.transition_length === 0) {
                     errors.push(`Season <i>${curr_season.name}</i> can't have 0 transition length.`);
                 }
             } else {
-                if (window.static_data.year_data.timespans[curr_season.timespan].interval !== 1) {
+                if (this.months[curr_season.timespan].interval !== 1) {
                     errors.push(`Season <i>${curr_season.name}</i> can't be on a leaping month.`);
                 }
-                let next_season = window.static_data.seasons.data[(season_i + 1) % this.seasons.length];
+                let next_season = this.seasons[(season_i + 1) % this.seasons.length];
                 if (curr_season.timespan === next_season.timespan && curr_season.day === next_season.day) {
                     errors.push(`Season <i>${curr_season.name}</i> and <i>${next_season.name}</i> cannot be on the same month and day.`);
                 }

diff --git a/resources/views/components/locations-collapsible.blade.php b/resources/views/components/locations-collapsible.blade.php
@@ -92,7 +92,7 @@
                             <div class='lbl-toggle' @click="seasonCollapsed = !seasonCollapsed">
                                 <div class='cursor-pointer text-xl fa mr-2'
                                      :class="{ 'fa-caret-square-up': !seasonCollapsed, 'fa-caret-square-down': seasonCollapsed }"></div>
-                                <span x-text='season.name + " weather"'></span>
+                                <span x-text='(seasons?.[season_index]?.name ?? "Unknown") + " weather"'></span>
                             </div>
                             <div class='p-0' x-show="!seasonCollapsed">
                                 <div x-show="season_settings.enable_weather">

diff --git a/resources/views/components/seasons-collapsible.blade.php b/resources/views/components/seasons-collapsible.blade.php
@@ -15,7 +15,7 @@
         </div>
         <div class='col-12 col-md-2 px-md-0 text-center'>
             <label class="custom-control custom-checkbox flexible">
-                <input type="checkbox" class="custom-control-input" @click.prevent="switchPeriodicSeason">
+                <input type="checkbox" class="custom-control-input" :checked="settings.periodic_seasons" @click.prevent="switchPeriodicSeason">
                 <span class="custom-control-indicator"></span>
             </label>
         </div>
@@ -49,8 +49,8 @@
     </div>
 </div>
 
-<div class='sortable list-group my-2'>
-    <template x-for="(season, index) in seasons">
+<div class='sortable list-group my-2' x-ref="seasons-sortable">
+    <template x-for="(season, index) in seasons" x-ref="seasons-sortable-template">
 
         <div class='sortable-container list-group-item collapsible p-2 first-of-type:rounded-t'
              x-data="{ collapsed: true }"
@@ -79,8 +79,8 @@
                 </button>
             </div>
 
-            <div class='collapse-container container mb-2' x-show="presetSeasons.length">
-                <div class='row no-gutters my-1'>
+            <div class='collapse-container container mb-2'>
+                <div class='row no-gutters my-1' x-show="presetSeasons.length">
                     <div class='col-4 pt-1'>Season type:</div>
                     <div class='col'>
                         <select type='number' class='form-control preset-season-list' @change='handlePresetOrderChanged($event, index)'>