Fixed: Change Unreleased Color, Add Partial Status

Fixes #527

frontend/src/Calendar/Agenda/AgendaEvent.css

@@ -58,6 +58,10 @@
   composes: downloaded from 'Calendar/Events/CalendarEvent.css';
 }
 
+.partial {
+  composes: partial from 'Calendar/Events/CalendarEvent.css';
+}
+
 .downloading {
   composes: downloading from 'Calendar/Events/CalendarEvent.css';
 }

frontend/src/Calendar/Events/CalendarEvent.css

@@ -41,6 +41,10 @@
   border-left-color: $successColor;
 }
 
+.partial {
+  border-left-color: $yellow;
+}
+
 .downloading {
   border-left-color: $purple;
 }
@@ -62,7 +66,7 @@
 }
 
 .unreleased {
-  border-left-color: $primaryColor;
+  border-left-color: $blue;
 
   &:global(.colorImpaired) {
     background: repeating-linear-gradient(90deg, transparent, transparent 5px, #eee 5px, #eee 10px);

frontend/src/Calendar/Events/CalendarEvent.js

@@ -122,9 +122,6 @@ CalendarEvent.propTypes = {
   title: PropTypes.string.isRequired,
   foreignAlbumId: PropTypes.string.isRequired,
   statistics: PropTypes.object.isRequired,
-  // seasonNumber: PropTypes.number.isRequired,
-  // episodeNumber: PropTypes.number.isRequired,
-  // absoluteEpisodeNumber: PropTypes.number,
   releaseDate: PropTypes.string.isRequired,
   monitored: PropTypes.bool.isRequired,
   grabbed: PropTypes.bool,

frontend/src/Calendar/Legend/Legend.js

@@ -28,8 +28,8 @@ function Legend({ colorImpairedMode }) {
         />
 
         <LegendItem
-          status="missing"
+          status="partial"
-          tooltip="Track file has not been found"
+          tooltip="Album was partially downloaded"
           colorImpairedMode={colorImpairedMode}
         />
       </div>
@@ -40,6 +40,12 @@ function Legend({ colorImpairedMode }) {
           tooltip="Album is unmonitored"
           colorImpairedMode={colorImpairedMode}
         />
+
+        <LegendItem
+          status="missing"
+          tooltip="Track file has not been found"
+          colorImpairedMode={colorImpairedMode}
+        />
       </div>
     </div>
   );

frontend/src/Calendar/Legend/LegendItem.css

@@ -16,6 +16,10 @@
   composes: downloaded from 'Calendar/Events/CalendarEvent.css';
 }
 
+.partial {
+  composes: partial from 'Calendar/Events/CalendarEvent.css';
+}
+
 .downloading {
   composes: downloading from 'Calendar/Events/CalendarEvent.css';
 }

frontend/src/Calendar/getStatusStyle.js

@@ -8,6 +8,10 @@ function getStatusStyle(episodeNumber, downloading, startTime, isMonitored, perc
     return 'downloaded';
   }
 
+  if (percentOfTracks > 0) {
+    return 'partial';
+  }
+
   if (downloading) {
     return 'downloading';
   }

frontend/src/Styles/Variables/colors.js

@@ -6,6 +6,8 @@ module.exports = {
   dimColor: '#555',
   black: '#000',
   white: '#fff',
+  blue: '#06f',
+  yellow: '#FFA500',
   primaryColor: '#0b8750',
   selectedColor: '#f9be03',
   successColor: '#27c24c',