You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by ma...@apache.org on 2020/01/06 17:56:49 UTC
[airavata-django-portal] branch develop updated: AIRAVATA-3281
Display thumbnail when image
This is an automated email from the ASF dual-hosted git repository.
machristie pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
The following commit(s) were added to refs/heads/develop by this push:
new 3fe559a AIRAVATA-3281 Display thumbnail when image
3fe559a is described below
commit 3fe559a9efabbd921aedccfb23c79c4d762e506b
Author: Marcus Christie <ma...@apache.org>
AuthorDate: Mon Jan 6 12:35:13 2020 -0500
AIRAVATA-3281 Display thumbnail when image
---
.../static/django_airavata_api/js/models/DataProduct.js | 5 +++++
.../experiment/output-displays/DefaultOutputDisplay.vue | 17 +++++++++++------
2 files changed, 16 insertions(+), 6 deletions(-)
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/DataProduct.js b/django_airavata/apps/api/static/django_airavata_api/js/models/DataProduct.js
index da6f6d9..da0a389 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/DataProduct.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/DataProduct.js
@@ -33,6 +33,7 @@ const FIELDS = [
const FILENAME_REGEX = /[^/]+$/;
const TEXT_MIME_TYPE_REGEX = /^text\/.+/;
+const IMAGE_MIME_TYPE_REGEX = /^image\/.+/;
export default class DataProduct extends BaseModel {
constructor(data = {}) {
@@ -55,6 +56,10 @@ export default class DataProduct extends BaseModel {
return this.mimeType && TEXT_MIME_TYPE_REGEX.test(this.mimeType);
}
+ get isImage() {
+ return this.mimeType && IMAGE_MIME_TYPE_REGEX.test(this.mimeType);
+ }
+
get mimeType() {
return this.productMetadata && this.productMetadata['mime-type'] ? this.productMetadata['mime-type'] : null;
}
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/output-displays/DefaultOutputDisplay.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/output-displays/DefaultOutputDisplay.vue
index b41cbfd..6ef5520 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/output-displays/DefaultOutputDisplay.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/output-displays/DefaultOutputDisplay.vue
@@ -1,11 +1,9 @@
<template>
<div>
- <data-product-viewer
- v-for="dp in dataProducts"
- :data-product="dp"
- :key="dp.productUri"
- :mime-type="fileMimeType"
- />
+ <div v-for="dp in dataProducts" :key="dp.productUri">
+ <img v-if="dp.isImage && dp.downloadURL" class="image-preview rounded" :src="dp.downloadURL" />
+ <data-product-viewer :data-product="dp" :mime-type="fileMimeType" />
+ </div>
</div>
</template>
@@ -47,3 +45,10 @@ export default {
}
};
</script>
+<style scoped>
+.image-preview {
+ display: block;
+ max-width: 100%;
+ max-height: 120px;
+}
+</style>