MessageMedia directive: Use cached thumbnail preview

src/directives/message_media.html

@@ -65,7 +65,7 @@
         <div class="circle"
              ng-class="{active: !ctrl.isDownloading()}"
              ng-if="!ctrl.downloaded"
-             ng-style="{'background-image': 'url({{ ctrl.message.thumbnail.preview | bufferToUrl:ctrl.thumbnailFormat }})' }">
+             ng-style="{'background-image': 'url({{ ctrl.getThumbnailPreviewUri() }})' }">
             <i class="material-icons md-24">file_download</i>
             <div class="loading" ng-class="{active: ctrl.isDownloading()}"></div>
         </div>
@@ -73,7 +73,7 @@
         <!-- File type indicator -->
         <div class="circle"
              ng-if="ctrl.downloaded && ctrl.message.thumbnail.preview !== undefined"
-             ng-style="{'background-image': 'url({{ ctrl.message.thumbnail.preview | bufferToUrl:ctrl.thumbnailFormat }})' }">
+             ng-style="{'background-image': 'url({{ ctrl.getThumbnailPreviewUri() }})' }">
         </div>
         <div class="circle"
              ng-if="ctrl.downloaded && ctrl.message.thumbnail.preview == undefined">

src/directives/message_media.ts

@@ -15,7 +15,7 @@
  * along with Threema Web. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import {bufferToUrl, logAdapter} from '../helpers';
+import {bufferToUrl, hasValue, logAdapter} from '../helpers';
 import {MediaboxService} from '../services/mediabox';
 import {MessageService} from '../services/message';
 import {WebClientService} from '../services/webclient';
@@ -73,7 +73,7 @@ export default [
                 let thumbnailPreviewUri = null;
                 this.getThumbnailPreviewUri = () => {
                     // Cache thumbnail preview URI
-                    if (thumbnailPreviewUri === null) {
+                    if (thumbnailPreviewUri === null && hasValue(this.message) && hasValue(this.message.thumbnail)) {
                         thumbnailPreviewUri = bufferToUrl(
                             (this.message as threema.Message).thumbnail.preview,
                             webClientService.appCapabilities.imageFormat.thumbnail,

src/helpers.ts

@@ -323,3 +323,10 @@ export function bufferToUrl(buffer: ArrayBuffer, mimeType: string, logWarning: (
 export function logAdapter(logFunc: (...msg: string[]) => void, logTag: string): ((msg: string) => void) {
     return (msg: string) => logFunc(logTag, msg);
 }
+
+/**
+ * Return whether a value is not null and not undefined.
+ */
+export function hasValue(val: any): boolean {
+    return val !== null && val !== undefined;
+}