Using thumbnail size instead of original photo size in image tags.

src/web/plugins/media.js

@@ -0,0 +1,43 @@
+'use strict';
+
+const config = require('config');
+const { makeExtendSchemaPlugin, gql } = require('graphile-utils');
+
+const schemaExtender = makeExtendSchemaPlugin(_build => ({
+	typeDefs: gql`
+      extend type Media {
+        thumbnailWidth: Int @requires(columns: ["width", "height"])
+        thumbnailHeight: Int @requires(columns: ["height", "width"])
+      }
+    `,
+	resolvers: {
+		Media: {
+			thumbnailWidth(parent, _args, _context, _info) {
+				if (!parent.width || !parent.height) {
+					return null;
+				}
+
+				if (parent.height <= config.media.thumbnailSize) {
+					// thumbnails aren't upscaled
+					return parent.width;
+				}
+
+				return Math.round(parent.width / (parent.height / config.media.thumbnailSize));
+			},
+			thumbnailHeight(parent, _args, _context, _info) {
+				if (!parent.width || !parent.height) {
+					return null;
+				}
+
+				if (parent.height <= config.media.thumbnailSize) {
+					// thumbnails aren't upscaled
+					return parent.height;
+				}
+
+				return config.media.thumbnailSize;
+			},
+		},
+	},
+}));
+
+module.exports = [schemaExtender];

src/web/plugins/plugins.js

@@ -3,9 +3,11 @@
 const ActorPlugins = require('./actors');
 const SitePlugins = require('./sites');
 // const ReleasePlugins = require('./releases');
+const MediaPlugins = require('./media');
 
 module.exports = {
 	ActorPlugins,
 	SitePlugins,
 	ReleasePlugins: [],
+	MediaPlugins,
 };