wip for flavor imagesexp-headline-flavor-images

9 files changed, 84 insertions, 15 deletions

diff --git a/classes/article.php b/classes/article.php
index 04855ac9d..b197d71b8 100755
--- a/classes/article.php
+++ b/classes/article.php
@@ -292,9 +292,12 @@ class Article extends Handler_Protected {
 	static function _format_enclosures($id,
 										$always_display_enclosures,
 									   $article_content,
-										$hide_images = false) {
+										$hide_images = false,
+										$enclosures = false) {
+
+		if ($enclosures === false)
+			$enclosures = self::_get_enclosures($id);
 
-		$enclosures = self::_get_enclosures($id);
 		$enclosures_formatted = "";
 
 		/*foreach ($enclosures as &$enc) {
diff --git a/classes/feeds.php b/classes/feeds.php
index 68d535481..f2cfa5b7f 100755
--- a/classes/feeds.php
+++ b/classes/feeds.php
@@ -244,6 +244,38 @@ class Feeds extends Handler_Protected {
 					},
 					$line);
 
+				$this->_mark_timestamp("   pre-enclosures");
+
+				if ($line["num_enclosures"] > 0) {
+					$enclosures = Article::_get_enclosures($id);
+
+					$line["enclosures"] = Article::_format_enclosures($id,
+													$line["always_display_enclosures"],
+													$line["content"],
+													$line["hide_images"],
+													$enclosures);
+
+				} else {
+					$enclosures = [];
+					$line["enclosures"] = [ 'formatted' => '', 'entries' => [] ];
+				}
+
+				$this->_mark_timestamp("   enclosures");
+
+				list ($flavor_image, $flavor_stream, $flavor_kind) = Article::_get_image($enclosures,
+									$line["content"], // unsanitized
+									$line["site_url"],
+									$line);
+
+				$line["flavor_image"] = $flavor_image;
+				$line["flavor_stream"] = $flavor_stream;
+
+				/* optional */
+				if ($flavor_kind)
+					$line["flavor_kind"] = $flavor_kind;
+
+				$this->_mark_timestamp("   flavor image");
+
 				$this->_mark_timestamp("   pre-sanitize");
 
 				$line["content"] = Sanitizer::sanitize($line["content"],
@@ -261,19 +293,6 @@ class Feeds extends Handler_Protected {
 					}
 				}
 
-				$this->_mark_timestamp("   pre-enclosures");
-
-				if ($line["num_enclosures"] > 0) {
-					$line["enclosures"] = Article::_format_enclosures($id,
-						$line["always_display_enclosures"],
-						$line["content"],
-						$line["hide_images"]);
-				} else {
-					$line["enclosures"] = [ 'formatted' => '', 'entries' => [] ];
-				}
-
-				$this->_mark_timestamp("   enclosures");
-
 				$line["updated_long"] = TimeHelper::make_local_datetime($line["updated"],true);
 				$line["updated"] = TimeHelper::make_local_datetime($line["updated"], false, false, false, true);
 
@@ -315,6 +334,7 @@ class Feeds extends Handler_Protected {
 				}
 
 				$this->_mark_timestamp("   color");
+
 				$this->_mark_timestamp("   pre-hook_render_cdm");
 
 				PluginHost::getInstance()->chain_hooks_callback(PluginHost::HOOK_RENDER_ARTICLE_CDM,
diff --git a/js/Headlines.js b/js/Headlines.js
index 28e43be1f..44be4f5ea 100755
--- a/js/Headlines.js
+++ b/js/Headlines.js
@@ -477,6 +477,9 @@ const Headlines = {
 								<i class="pub-pic pub-${hl.id} material-icons" onclick="Headlines.togglePub(${hl.id})">rss_feed</i>
 							</div>
 
+							<img class="flavor-image" style='background-image: url("${App.escapeHtml(hl.flavor_image)}")'
+								loading="lazy" src="data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="/>
+
 							<span onclick="return Headlines.click(event, ${hl.id});" data-article-id="${hl.id}" class="titleWrap hlMenuAttach">
 								${App.getInitParam("debug_headline_ids") ? `<span class="text-muted small">A: ${hl.id} F: ${hl.feed_id}</span>` : ""}
 								<a class="title" title="${App.escapeHtml(hl.title)}" target="_blank" rel="noopener noreferrer" href="${App.escapeHtml(hl.link)}">
diff --git a/themes/compact.css b/themes/compact.css
index 5a3a00cfe..aeee18050 100644
--- a/themes/compact.css
+++ b/themes/compact.css
@@ -1161,6 +1161,13 @@ video::-webkit-media-controls-overlay-play-button {
 .cdm i.material-icons {
   color: #777;
 }
+.cdm img.flavor-image {
+  width: 32px;
+  height: 32px;
+  margin: 8px ! important;
+  border-radius: 50%;
+  background-size: cover;
+}
 .cdm .header {
   position: sticky;
   top: 0;
diff --git a/themes/compact_night.css b/themes/compact_night.css
index c9f9b12a8..f550ebd27 100644
--- a/themes/compact_night.css
+++ b/themes/compact_night.css
@@ -1161,6 +1161,13 @@ video::-webkit-media-controls-overlay-play-button {
 .cdm i.material-icons {
   color: #777;
 }
+.cdm img.flavor-image {
+  width: 32px;
+  height: 32px;
+  margin: 8px ! important;
+  border-radius: 50%;
+  background-size: cover;
+}
 .cdm .header {
   position: sticky;
   top: 0;
diff --git a/themes/light.css b/themes/light.css
index 9a4ac98c0..fdcfcf9bf 100644
--- a/themes/light.css
+++ b/themes/light.css
@@ -1161,6 +1161,13 @@ video::-webkit-media-controls-overlay-play-button {
 .cdm i.material-icons {
   color: #777;
 }
+.cdm img.flavor-image {
+  width: 32px;
+  height: 32px;
+  margin: 8px ! important;
+  border-radius: 50%;
+  background-size: cover;
+}
 .cdm .header {
   position: sticky;
   top: 0;
diff --git a/themes/light/cdm.less b/themes/light/cdm.less
index 3a5b602f2..9c6d80d02 100644
--- a/themes/light/cdm.less
+++ b/themes/light/cdm.less
@@ -3,6 +3,14 @@
 		color : @color-icon;
 	}
 
+	img.flavor-image {
+		width : 32px;
+		height : 32px;
+		margin : 8px ! important;
+		border-radius : 50%;
+		background-size : cover;
+	}
+
 	.header {
 		position: sticky;
 		top : 0;
diff --git a/themes/night.css b/themes/night.css
index 22eb17e9f..1a39c20a8 100644
--- a/themes/night.css
+++ b/themes/night.css
@@ -1162,6 +1162,13 @@ video::-webkit-media-controls-overlay-play-button {
 .cdm i.material-icons {
   color: #777;
 }
+.cdm img.flavor-image {
+  width: 32px;
+  height: 32px;
+  margin: 8px ! important;
+  border-radius: 50%;
+  background-size: cover;
+}
 .cdm .header {
   position: sticky;
   top: 0;
diff --git a/themes/night_blue.css b/themes/night_blue.css
index 8a3d7f8a5..01ce14661 100644
--- a/themes/night_blue.css
+++ b/themes/night_blue.css
@@ -1162,6 +1162,13 @@ video::-webkit-media-controls-overlay-play-button {
 .cdm i.material-icons {
   color: #777;
 }
+.cdm img.flavor-image {
+  width: 32px;
+  height: 32px;
+  margin: 8px ! important;
+  border-radius: 50%;
+  background-size: cover;
+}
 .cdm .header {
   position: sticky;
   top: 0;