diff options
| -rw-r--r-- | js/components/Message.vue | 15 | ||||
| -rw-r--r-- | js/components/MessageHTMLBody.vue | 46 | ||||
| -rwxr-xr-x | lib/Controller/MessagesController.php | 1 |
3 files changed, 54 insertions, 8 deletions
diff --git a/js/components/Message.vue b/js/components/Message.vue index d4b0f09b6..bc00be66f 100644 --- a/js/components/Message.vue +++ b/js/components/Message.vue @@ -16,7 +16,8 @@ </p> </div> <div class="mail-message-body"> - <MessageHTMLBody v-if="message.hasHtmlBody"/> + <MessageHTMLBody v-if="message.hasHtmlBody" + :url="htmlUrl"/> <MessagePlainTextBody v-else :body="message.body" :signature="message.signature"/> @@ -52,6 +53,15 @@ message: undefined, }; }, + computed: { + htmlUrl () { + return OC.generateUrl('/apps/mail/api/accounts/{accountId}/folders/{folderId}/messages/{id}/html', { + accountId: this.$route.params.accountId, + folderId: this.$route.params.folderId, + id: this.$route.params.messageId + }) + } + }, created () { this.fetchMessage() }, @@ -108,9 +118,11 @@ .mail-message-attachments { margin: 10px 10px 50px 30px; } + .mail-message-attachments { margin-top: 10px; } + #mail-content iframe { width: 100%; } @@ -131,6 +143,7 @@ color: rgba(0, 0, 0, .3) !important; opacity: 1; } + #mail-message-header .transparency a { color: rgba(0, 0, 0, .5) !important; } diff --git a/js/components/MessageHTMLBody.vue b/js/components/MessageHTMLBody.vue index 17fa25df8..5d8498805 100644 --- a/js/components/MessageHTMLBody.vue +++ b/js/components/MessageHTMLBody.vue @@ -6,11 +6,15 @@ <!--{{ t 'Show images from this sender' }}--> </button> </div> - <div class="icon-loading"> - <iframe :srcdoc="body" - sandbox="" - seamless> - </iframe> + <div v-if="loading" + class="icon-loading"/> + <div :class="{hidden: loading}" + id="message-container"> + <iframe id="message-frame" + ref="iframe" + @load="onMessageFrameLoad" + :src="url" + seamless/> </div> </div> </template> @@ -19,7 +23,35 @@ export default { name: "MessageHTMLBody", props: [ - 'body', - ] + 'url', + ], + data () { + return { + loading: true + } + }, + methods: { + onMessageFrameLoad () { + console.log('todo: resize', this.$refs.iframe) + this.loading = false + } + } }; </script> + +<style scoped> + #message-container { + position: relative; + width: 100%; + height: 0; + padding-bottom: 56.25%; + } + + #message-frame { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } +</style> diff --git a/lib/Controller/MessagesController.php b/lib/Controller/MessagesController.php index 989c93856..4a041e48a 100755 --- a/lib/Controller/MessagesController.php +++ b/lib/Controller/MessagesController.php @@ -199,6 +199,7 @@ class MessagesController extends Controller { try { $mailBox = $this->getFolder($accountId, $folderId); + /** @var IMAPMessage $m */ $m = $mailBox->getMessage($messageId, true); $html = $m->getHtmlBody($accountId, $folderId, $messageId, function ($cid) use ($m) { |