Add known sizes of images to the viewer

Related to #79

app/Resources/Viewer/scripts/discord.js

@@ -26,6 +26,7 @@ const DISCORD = (function() {
 	let templateUserAvatar;
 	let templateAttachmentDownload;
 	let templateEmbedImage;
+	let templateEmbedImageWithSize;
 	let templateEmbedRich;
 	let templateEmbedRichNoDescription;
 	let templateEmbedUrl;
@@ -64,6 +65,19 @@ const DISCORD = (function() {
 		return "<p>" + processed + "</p>";
 	};
 	
+	const getImageEmbed = function(url, image) {
+		if (!SETTINGS.enableImagePreviews) {
+			return "";
+		}
+		
+		if (image.width && image.height) {
+			return templateEmbedImageWithSize.apply({ url, src: image.url, width: image.width, height: image.height });
+		}
+		else {
+			return templateEmbedImage.apply({ url, src: image.url });
+		}
+	};
+	
 	return {
 		setup() {
 			templateChannelServer = new TEMPLATE([
@@ -117,6 +131,11 @@ const DISCORD = (function() {
 				"<a href='{url}' class='embed thumbnail'><img src='{src}' alt='(image attachment not found)'></a><br>"
 			].join(""));
 			
+			// noinspection HtmlUnknownTarget
+			templateEmbedImageWithSize = new TEMPLATE([
+				"<a href='{url}' class='embed thumbnail'><img src='{src}' width='{width}' height='{height}' alt='(image attachment not found)'></a><br>"
+			].join(""));
+			
 			// noinspection HtmlUnknownTarget
 			templateEmbedRich = new TEMPLATE([
 				"<div class='embed download'><a href='{url}' class='title'>{title}</a><p class='desc'>{description}</p></div>"
@@ -183,10 +202,10 @@ const DISCORD = (function() {
 							return templateEmbedUnsupported.apply(embed);
 						}
 						else if ("image" in embed && embed.image.url) {
-							return SETTINGS.enableImagePreviews ? templateEmbedImage.apply({ url: embed.url, src: embed.image.url }) : "";
+							return getImageEmbed(embed.url, embed.image);
 						}
 						else if ("thumbnail" in embed && embed.thumbnail.url) {
-							return SETTINGS.enableImagePreviews ? templateEmbedImage.apply({ url: embed.url, src: embed.thumbnail.url }) : "";
+							return getImageEmbed(embed.url, embed.thumbnail);
 						}
 						else if ("title" in embed && "description" in embed) {
 							return templateEmbedRich.apply(embed);

app/Resources/Viewer/styles/messages.css

@@ -112,6 +112,7 @@
 }
 
 .message .thumbnail img {
+  width: auto;
   max-width: 100%;
   max-height: 320px;
   border-radius: 3px;