Set proper image caption

src/directives/mediabox.ts

@@ -31,6 +31,7 @@ export default [
             controllerAs: 'ctrl',
             controller: [function() {
                 this.imageDataUrl = null;
+                this.caption = '';
 
                 this.close = () => {
                     this.imageDataUrl = null;
@@ -40,6 +41,7 @@ export default [
                 mediaboxService.evtMediaChanged.attach((dataAvailable: boolean) => {
                     $rootScope.$apply(() => {
                         this.imageDataUrl = filter(mediaboxService.data, 'image/jpeg');
+                        this.caption = mediaboxService.caption;
                     });
                 });
             }],
@@ -50,7 +52,7 @@ export default [
                     <div class="inner">
                         <img ng-src="{{ ctrl.imageDataUrl }}">
                         <div class="caption">
-                            Image Caption
+                            {{ ctrl.caption }}
                         </div>
                     </div>
                 </div>

src/directives/message_media.ts

@@ -166,7 +166,13 @@ export default [
 
                                 switch (this.message.type) {
                                     case 'image':
-                                        mediaboxService.setMedia(buffer);
+                                        let caption;
+                                        if (message.caption) {
+                                            caption = message.caption;
+                                        } else {
+                                            caption = messageService.getFileName(message);
+                                        }
+                                        mediaboxService.setMedia(buffer, caption);
                                         break;
                                     case 'video':
                                         saveAs(new Blob([buffer]), messageService.getFileName(message));

src/services/mediabox.ts

@@ -37,6 +37,7 @@ export class MediaboxService {
      * The full-resolution media data.
      */
     public data: ArrayBuffer | null = null;
+    public caption: string = '';
 
     public static $inject = ['$log'];
     constructor($log: ng.ILogService) {
@@ -46,9 +47,10 @@ export class MediaboxService {
     /**
      * Update media data.
      */
-    public setMedia(data: ArrayBuffer) {
+    public setMedia(data: ArrayBuffer, caption: string) {
         this.$log.debug(this.logTag, 'Media data updated');
         this.data = data;
+        this.caption = caption;
         this.evtMediaChanged.post(data !== null);
     }
 
@@ -58,6 +60,7 @@ export class MediaboxService {
     public clearMedia() {
         this.$log.debug(this.logTag, 'Media data cleared');
         this.data = null;
+        this.caption = '';
         this.evtMediaChanged.post(false);
     }