Display previews and inline images for reddit-hosted images.

Avoid division by 0 in the rendering code.

Partially addresses #246.

src/utils.rs

@@ -134,8 +134,10 @@ impl Media {
 		} else if data["is_gallery"].as_bool().unwrap_or_default() {
 			// If this post contains a gallery of images
 			gallery = GalleryMedia::parse(&data["gallery_data"]["items"], &data["media_metadata"]);
-
 			("gallery", &data["url"], None)
+		} else if data["is_reddit_media_domain"].as_bool().unwrap_or_default() && data["domain"] == "i.redd.it" {
+			// If this post contains a reddit media (image) URL.
+			("image", &data["url"], None)
 		} else {
 			// If type can't be determined, return url
 			("link", &data["url"], None)
@@ -150,6 +152,8 @@ impl Media {
 			Self {
 				url: format_url(url_val.as_str().unwrap_or_default()),
 				alt_url,
+				// Note: in the data["is_reddit_media_domain"] path above
+				// width and height will be 0.
 				width: source["width"].as_i64().unwrap_or_default(),
 				height: source["height"].as_i64().unwrap_or_default(),
 				poster: format_url(source["url"].as_str().unwrap_or_default()),

templates/post.html

@@ -69,15 +69,7 @@
 			<!-- post_type: {{ post.post_type }} -->
 			{% if post.post_type == "image" %}
 			<a href="{{ post.media.url }}" class="post_media_image" >
-				<svg
-					width="{{ post.media.width }}px" 
-					height="{{ post.media.height }}px" 
-					xmlns="http://www.w3.org/2000/svg">
-						<image width="100%" height="100%" href="{{ post.media.url }}"/>
-						<desc>
-							<img loading="lazy" alt="Post image" src="{{ post.media.url }}"/>
-						</desc>
-				</svg>
+				<img loading="lazy" alt="Post image" src="{{ post.media.url }}"/>
 			</a>
 			{% else if post.post_type == "video" || post.post_type == "gif" %}
 			{% if prefs.use_hls == "on" && !post.media.alt_url.is_empty() %}

templates/utils.html

@@ -94,16 +94,8 @@
 	</p>
 	<!-- POST MEDIA/THUMBNAIL -->
 	{% if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "image" %}
-	<a href="{{ post.media.url }}" class="post_media_image {% if post.media.height / post.media.width < 2 %}short{% endif %}" >
-		<svg
-			width="{{ post.media.width }}px" 
-			height="{{ post.media.height }}px" 
-			xmlns="http://www.w3.org/2000/svg">
-				<image width="100%" height="100%" href="{{ post.media.url }}"/>
-				<desc>
-					<img loading="lazy" alt="Post image" src="{{ post.media.url }}"/>
-				</desc>
-		</svg>
+	<a href="{{ post.media.url }}" class="post_media_image {% if post.media.height < post.media.width*2 %}short{% endif %}" >
+		<img loading="lazy" alt="Post image" src="{{ post.media.url }}"/>
 	</a>
 	{% else if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "gif" %}
 	<video class="post_media_video short" src="{{ post.media.url }}" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" preload="none" controls loop {% if prefs.autoplay_videos == "on" %}autoplay{% endif %}><a href={{ post.media.url }}>Video</a></video>