diff options
| author | Terry Truong <terry06890@gmail.com> | 2022-05-05 12:27:45 +1000 |
|---|---|---|
| committer | Terry Truong <terry06890@gmail.com> | 2022-05-05 12:27:45 +1000 |
| commit | 6ff26ab72ec507698f43e86fd59188a3a3fbee54 (patch) | |
| tree | 92c553f7100f6b12719ad144a0371e5be136f701 /src/components | |
| parent | f7c43e02cadbca0546655187bd75eba274a481b7 (diff) | |
Make image copyright/link info retrieved upon info-modal open
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/Tile.vue | 4 | ||||
| -rw-r--r-- | src/components/TileInfoModal.vue | 22 |
2 files changed, 15 insertions, 11 deletions
diff --git a/src/components/Tile.vue b/src/components/Tile.vue index a4083bc..744adc3 100644 --- a/src/components/Tile.vue +++ b/src/components/Tile.vue @@ -88,9 +88,9 @@ export default defineComponent({ leafStyles(): Record<string,string> { return { // Image (and scrims) - backgroundImage: this.tolNode.img?.filename != null ? + backgroundImage: this.tolNode.imgName != 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.img.filename.replaceAll('\'', '\\\'') + '\')' : + 'url(\'/img/' + this.tolNode.imgName.replaceAll('\'', '\\\'') + '\')' : 'none', backgroundColor: '#1c1917', backgroundSize: 'cover', diff --git a/src/components/TileInfoModal.vue b/src/components/TileInfoModal.vue index b59a5c9..7cd75b7 100644 --- a/src/components/TileInfoModal.vue +++ b/src/components/TileInfoModal.vue @@ -11,6 +11,7 @@ export default defineComponent({ return { desc: null as null | string, fromRedirect: false, + imgInfo: null as null | {eolId: string, sourceUrl: string, license: string, copyrightOwner: string}, }; }, props: { @@ -24,9 +25,9 @@ export default defineComponent({ }, imgStyles(): Record<string,string> { return { - backgroundImage: this.tolNode.img?.filename != null ? + backgroundImage: this.tolNode.imgName != 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.img.filename.replaceAll('\'', '\\\'') + '\')' : + 'url(\'/img/' + this.tolNode.imgName.replaceAll('\'', '\\\'') + '\')' : 'none', backgroundColor: '#1c1917', width: this.uiOpts.infoModalImgSz + 'px', @@ -45,14 +46,17 @@ export default defineComponent({ }, created(){ let url = new URL(window.location.href); - url.pathname = '/data/desc'; + url.pathname = '/data/info'; url.search = '?name=' + encodeURIComponent(this.node.name); fetch(url.toString()) .then(response => response.json()) .then(obj => { if (obj != null){ - this.desc = obj[0]; - this.fromRedirect = obj[1]; + if (obj.desc != null){ + this.desc = obj.desc.text; + this.fromRedirect = obj.desc.fromRedirect; + } + this.imgInfo = obj.imgInfo; } }); }, @@ -72,11 +76,11 @@ export default defineComponent({ <div class="flex"> <div> <div :style="imgStyles" class="mr-4" alt="an image"></div> - <div v-if="tolNode.img != null"> + <div v-if="imgInfo != null"> <ul> - <li>License: {{tolNode.img.license}}</li> - <li><a :href="tolNode.img.sourceUrl" class="underline">Source URL</a></li> - <li>Copyright Owner: {{tolNode.img.copyrightOwner}}</li> + <li>License: {{imgInfo.license}}</li> + <li><a :href="imgInfo.sourceUrl" class="underline">Source URL</a></li> + <li>Copyright Owner: {{imgInfo.copyrightOwner}}</li> </ul> </div> </div> |