diff --git a/.env.example b/.env.example
index 1546e68..41f1599 100644
--- a/.env.example
+++ b/.env.example
@@ -35,9 +35,10 @@ SITE_AUTHOR=""
OG_IMAGE="https://radio.example.com/assets/icons/og.png"
OG_IMAGE_WIDTH=""
OG_IMAGE_HEIGHT=""
-# Set true if you have dropped a full favicon set into ICONS_DIR
-# (apple-touch-icon.png, favicon-32x32.png, favicon-16x16.png, site.webmanifest).
-SHOW_ICONS=false
+# Render the favicon / touch-icon links. The repo ships a default set in
+# ICONS_DIR (favicon-96x96.png, favicon.svg, favicon.ico, apple-touch-icon.png,
+# site.webmanifest, web-app-manifest-*.png) — replace them with your own.
+SHOW_ICONS=true
ICONS_DIR="assets/icons"
# Browser UI colors.
THEME_COLOR="#e21d31"
diff --git a/assets/js/player.js b/assets/js/player.js
index 1352fef..b2592c3 100644
--- a/assets/js/player.js
+++ b/assets/js/player.js
@@ -215,24 +215,42 @@
}
/* ------------------------------------------------------------- artwork */
- // Point the OpenGraph image and the favicon at the current album art.
+ // Point the OpenGraph image + browser tab favicon at the current album art.
+ // The static set is removed (including the SVG favicon, which Firefox would
+ // otherwise prefer) and replaced with a single album-art icon; the originals
+ // are kept so resetMeta() can restore them when the stream goes offline.
+ // apple-touch-icon and the web manifest are left alone (home-screen / PWA).
+ var ICON_SEL = 'link[rel~="icon"], link[rel="shortcut icon"]';
+ var _origIcons = null;
+ var _origOg = null;
+
function updateMeta(url) {
if (!CFG.dynamicMeta || !url) return;
+ if (_origOg === null && el.ogImage) _origOg = el.ogImage.getAttribute('content') || '';
if (el.ogImage) el.ogImage.setAttribute('content', url);
- // Update any existing favicon / touch-icon links...
- var icons = document.querySelectorAll('link[rel~="icon"], link[rel="apple-touch-icon"], link[rel="shortcut icon"]');
- for (var i = 0; i < icons.length; i++) {
- if (icons[i].id !== 'dyn-favicon') icons[i].setAttribute('href', url);
+
+ var head = document.head, existing = head.querySelectorAll(ICON_SEL), i;
+ if (_origIcons === null) {
+ _origIcons = [];
+ for (i = 0; i < existing.length; i++) _origIcons.push(existing[i]);
+ }
+ for (i = 0; i < existing.length; i++) {
+ if (existing[i].parentNode) existing[i].parentNode.removeChild(existing[i]);
}
- // ...and (re)create a dedicated icon link — a fresh is the most
- // reliable way to make browsers actually repaint the favicon.
- var old = document.getElementById('dyn-favicon');
- if (old && old.parentNode) old.parentNode.removeChild(old);
var link = document.createElement('link');
link.id = 'dyn-favicon';
link.rel = 'icon';
link.href = url;
- document.head.appendChild(link);
+ head.appendChild(link);
+ }
+
+ // Put the station's own favicon + OG image back (e.g. when off air).
+ function resetMeta() {
+ if (_origIcons === null) return;
+ var head = document.head, cur = head.querySelectorAll(ICON_SEL), i;
+ for (i = 0; i < cur.length; i++) if (cur[i].parentNode) cur[i].parentNode.removeChild(cur[i]);
+ for (i = 0; i < _origIcons.length; i++) head.appendChild(_origIcons[i]);
+ if (el.ogImage && _origOg !== null) el.ogImage.setAttribute('content', _origOg);
}
function setArt(url, album) {
@@ -379,6 +397,7 @@
if (el.title) el.title.textContent = offName;
if (el.art) { el.art.setAttribute('src', offArt); el.art.title = ''; }
resetTint(); // neutral look while off air
+ resetMeta(); // station favicon + OG back
if (CFG.offlineStreamUrl) setSource(CFG.offlineStreamUrl, CFG.offlineLoop);
updateMediaSession({ title: offName, artist: '', album: '' }, offArt);
}
diff --git a/config.php b/config.php
index 9303d50..a60a7c9 100644
--- a/config.php
+++ b/config.php
@@ -117,7 +117,7 @@ if (!defined('RADIO_CONFIG_LOADED')) {
'og_width' => radio_env('OG_IMAGE_WIDTH', ''),
'og_height' => radio_env('OG_IMAGE_HEIGHT', ''),
'icons_dir' => rtrim(radio_env('ICONS_DIR', 'assets/icons'), '/'),
- 'show_icons' => radio_env_bool('SHOW_ICONS', false),
+ 'show_icons' => radio_env_bool('SHOW_ICONS', true),
'theme_color' => radio_env('THEME_COLOR', radio_env('THEME_ACCENT', '#e21d31')),
'tile_color' => radio_env('TILE_COLOR', radio_env('THEME_COLOR', '#5e656e')),
],
diff --git a/partials/head.php b/partials/head.php
index 57ddac6..92ae2b6 100644
--- a/partials/head.php
+++ b/partials/head.php
@@ -50,9 +50,11 @@ $iconsDir = cfg('seo.icons_dir');
+
+
+
-
-
+