From bd2517e19064a80573b0a1653c4b7dd42f7f9d7d Mon Sep 17 00:00:00 2001
From: herby2212 <jannes.nagel@gmx.de>
Date: Wed, 10 Mar 2021 19:55:55 +0100
Subject: [PATCH] include dynamic library background and thumbnail

---
 data/interfaces/default/home_stats.html |  8 +++++++-
 data/interfaces/default/index.html      | 13 ++++++++++---
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/data/interfaces/default/home_stats.html b/data/interfaces/default/home_stats.html
index f054cec9..eaa66b20 100644
--- a/data/interfaces/default/home_stats.html
+++ b/data/interfaces/default/home_stats.html
@@ -76,6 +76,8 @@ DOCUMENTATION :: END
         <div id="stats-background-${stat_id}" class="dashboard-stats-background" style="background-image: url(${page('pms_image_proxy', row0['art'], row0['rating_key'], 500, 280, 40, '282828', 3, fallback=fallback)});">
         % elif stat_id == 'top_platforms':
         <div id="stats-background-${stat_id}" class="dashboard-stats-background platform-${row0['platform_name']}-rgba no-image">
+        % elif stat_id == 'top_libraries':
+        <div id="stats-background-${stat_id}" class="dashboard-stats-background" style="background-image: url(${page('pms_image_proxy', row0['art'], None, 500, 280, 40, '282828', 3, fallback='art')});">
         % else:
         <div id="stats-background-${stat_id}" class="dashboard-stats-background flat">
         % endif
@@ -112,7 +114,11 @@ DOCUMENTATION :: END
             % elif stat_id == 'most_concurrent':
             <div id="stats-thumb-${stat_id}" class="dashboard-stats-flat svg-icon stats-${stat_id} transparent hidden-xs"></div>
             % elif stat_id == 'top_libraries':
-            <div id="stats-thumb-${stat_id}" class="dashboard-stats-flat svg-icon library-${row0['section_type']} hidden-xs"></div>
+                % if row0['thumb'].startswith('http'):
+                <div id="stats-thumb-${stat_id}" class="dashboard-stats-flat hidden-xs" style="background-image: url(${page('pms_image_proxy', row0['thumb'], None, 80, 80)});"></div>
+                % else:
+                <div id="stats-thumb-${stat_id}" class="dashboard-stats-flat svg-icon library-${row0['section_type']} hidden-xs"></div>
+                % endif         
             % endif
             <div class="dashboard-stats-info-container">
                 <div id="stats-title-${stat_id}" class="dashboard-stats-info-title">
diff --git a/data/interfaces/default/index.html b/data/interfaces/default/index.html
index 1a82a3d1..2e2a9ec6 100644
--- a/data/interfaces/default/index.html
+++ b/data/interfaces/default/index.html
@@ -783,6 +783,7 @@
             var art = $(elem).data('art');
             var thumb = $(elem).data('thumb');
             var user_id = $(elem).data('user_id');
+            var library_type = $(elem).data('library-type');
             var user_thumb = $(elem).data('user_thumb');
             var rating_key = $(elem).data('rating_key');
             var guid = $(elem).data('guid');
@@ -810,10 +811,16 @@
                 $('#stats-background-' + stat_id).removeClass(function (index, className) {
                     return (className.match (/(^|\s)platform-\S+/g) || []).join(' ');
                 }).addClass('platform-' + $(elem).data('platform') + '-rgba');
-            } else if (stat_id == 'top_libraries') {
+            } else if (stat_id === 'top_libraries') {
+                $('#stats-background-' + stat_id).css('background-image', 'url(' + page('pms_image_proxy', art, null, 500, 280, 40, '282828', 3, 'art') + ')');
                 $('#stats-thumb-' + stat_id).removeClass(function (index, className) {
-                    return (className.match (/(^|\s)library-\S+/g) || []).join(' ');
-                }).addClass('library-' + $(elem).data('library-type'));
+                    return (className.match (/(^|\s)svg-icon library-\S+/g) || []).join(' ')});
+                if (thumb.startsWith('http')) {
+                    $('#stats-thumb-' + stat_id).css('background-image', 'url(' + page('pms_image_proxy', thumb, null, 300, 300, null, null, null, 'cover') + ')');
+                } else {
+                    $('#stats-thumb-' + stat_id).css('background-image', '')
+                        .addClass('svg-icon library-' + library_type);
+                }
             } else {
                 if (rating_key) {
                     if (live) {