diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-26 15:09:48 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-26 15:09:48 +0300 |
commit | 142890d5bbefa7b1e1b30f263f9ad67d9d496d29 (patch) | |
tree | 2c4de4059aba586f3204f983f17757dbf1643b6c /app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue | |
parent | bbede1e22c4dd615042a3e9c0d7e24afc83ca377 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue | 16 |
1 files changed, 13 insertions, 3 deletions
diff --git a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue index 55526dcc381..eb7e24734ce 100644 --- a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue +++ b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue @@ -28,6 +28,8 @@ export default { return { width: 0, height: 0, + renderedWidth: 0, + renderedHeight: 0, }; }, computed: { @@ -63,11 +65,14 @@ export default { this.height = contentImg.naturalHeight; this.$nextTick(() => { + this.renderedWidth = contentImg.clientWidth; + this.renderedHeight = contentImg.clientHeight; + this.$emit('imgLoaded', { width: this.width, height: this.height, - renderedWidth: contentImg.clientWidth, - renderedHeight: contentImg.clientHeight, + renderedWidth: this.renderedWidth, + renderedHeight: this.renderedHeight, }); }); } @@ -79,7 +84,12 @@ export default { <template> <div data-testid="image-viewer"> <div :class="innerCssClasses" class="position-relative"> - <img ref="contentImg" :src="path" @load="onImgLoad" /> <slot name="image-overlay"></slot> + <img ref="contentImg" :src="path" @load="onImgLoad" /> + <slot + name="image-overlay" + :rendered-width="renderedWidth" + :rendered-height="renderedHeight" + ></slot> </div> <p v-if="renderInfo" class="image-info"> <template v-if="hasFileSize"> |