From d87bb9bc0991d7ce4eeb895da61c63a204edaa4d Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Sat, 30 Apr 2022 13:24:26 +1000
Subject: Add scripts for downloading/reviewing/cropping_and_resizing images

Also adjust client code to handle new format, and add
backend/data/README.md explaining image production process.
---
 src/components/TileInfoModal.vue | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

(limited to 'src/components/TileInfoModal.vue')

diff --git a/src/components/TileInfoModal.vue b/src/components/TileInfoModal.vue
index 0e2fc94..9805b48 100644
--- a/src/components/TileInfoModal.vue
+++ b/src/components/TileInfoModal.vue
@@ -7,13 +7,19 @@ import {LayoutNode} from '../layout';
 export default defineComponent({
 	props: {
 		node: {type: Object as PropType<LayoutNode>, required: true},
+		tolMap: {type: Object as PropType<TolMap>, required: true},
 		uiOpts: {type: Object, required: true},
 	},
 	computed: {
+		tolNode(): TolNode {
+			return this.tolMap.get(this.node.name)!;
+		},
 		imgStyles(): Record<string,string> {
 			return {
-				//backgroundImage: 'url(\'/img/' + this.node.name.replaceAll('\'', '\\\'') + '.png\')',
-				background: 'black',
+				backgroundImage: this.tolNode.imgFile != null ?
+					'linear-gradient(to bottom, rgba(0,0,0,0.4), #0000 40%, #0000 60%, rgba(0,0,0,0.4) 100%),' +
+						'url(\'/img/' + this.tolNode.imgFile.replaceAll('\'', '\\\'') + '\')' :
+					'none',
 				width: this.uiOpts.infoModalImgSz + 'px',
 				height: this.uiOpts.infoModalImgSz + 'px',
 				backgroundSize: 'cover',
-- 
cgit v1.2.3

