Finished video thumbnail feature (jessesquires#1823)

- Close jessesquires#628 
- Close jessesquires#709 
- Close jessesquires#1408 
- Close jessesquires#1496

Author: Lucashuang0802

CHANGELOG.md

@@ -23,7 +23,9 @@ This release closes the [8.0.0 milestone](https://github.com/jessesquires/JSQMes
 - Animated typing indicator. Typing indicator now animates like iMessage. (#1382) Thanks @radekcieciwa!
 - Dynamic text support. (#497, #1747) Thanks @MacMeDan!
 - Message cells now have a customizable accessory view. (#1519, #1719) Thanks @adubr!
-- Send button now can be turned on/off manually. (#1575 #1609) Thanks @sebastianludwig!
+- Send button now can be turned on/off manually. (#1575, #1609) Thanks @sebastianludwig!
+- Video message items now have a custom thumbnail option. (#628, #709, #1408, #1823) Thanks @weekwood, @benjaminhallock!
+- A new class `JSQMessagesVideoThumbnailFactory` now can generate thumbnail images from `AVURLAsset`. (#709, #1823) Thanks @weekwood, @Lucashuang0802!
 
 ### Fixes
 

JSQMessages.xcodeproj/project.pbxproj

@@ -106,6 +106,7 @@
 		88C00A501A44D4D800B004B3 /* JSQPhotoMediaItemTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 88C00A4F1A44D4D800B004B3 /* JSQPhotoMediaItemTests.m */; };
 		88C00A521A44D4E500B004B3 /* JSQVideoMediaItemTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 88C00A511A44D4E500B004B3 /* JSQVideoMediaItemTests.m */; };
 		88C4583019F5F7A0008FD427 /* JSQMessagesMediaViewBubbleImageMasker.m in Sources */ = {isa = PBXBuildFile; fileRef = 88C4582F19F5F7A0008FD427 /* JSQMessagesMediaViewBubbleImageMasker.m */; };
+		A04B0EBF1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.m in Sources */ = {isa = PBXBuildFile; fileRef = A04B0EBE1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.m */; };
 		BF10D6AA1D062AD10072D215 /* JSQMessagesTypingView.m in Sources */ = {isa = PBXBuildFile; fileRef = BF10D6A91D062AD10072D215 /* JSQMessagesTypingView.m */; };
 /* End PBXBuildFile section */
 
@@ -269,6 +270,8 @@
 		88C00A511A44D4E500B004B3 /* JSQVideoMediaItemTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = JSQVideoMediaItemTests.m; sourceTree = "<group>"; };
 		88C4582E19F5F7A0008FD427 /* JSQMessagesMediaViewBubbleImageMasker.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = JSQMessagesMediaViewBubbleImageMasker.h; sourceTree = "<group>"; };
 		88C4582F19F5F7A0008FD427 /* JSQMessagesMediaViewBubbleImageMasker.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = JSQMessagesMediaViewBubbleImageMasker.m; sourceTree = "<group>"; };
+		A04B0EBD1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = JSQMessagesVideoThumbnailFactory.h; sourceTree = "<group>"; };
+		A04B0EBE1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = JSQMessagesVideoThumbnailFactory.m; sourceTree = "<group>"; };
 		BF10D6A81D062AD10072D215 /* JSQMessagesTypingView.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = JSQMessagesTypingView.h; sourceTree = "<group>"; };
 		BF10D6A91D062AD10072D215 /* JSQMessagesTypingView.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = JSQMessagesTypingView.m; sourceTree = "<group>"; };
 /* End PBXFileReference section */
@@ -451,6 +454,8 @@
 				88A25F6B19D8E01A00924534 /* JSQMessagesTimestampFormatter.m */,
 				88A25F6C19D8E01A00924534 /* JSQMessagesToolbarButtonFactory.h */,
 				88A25F6D19D8E01A00924534 /* JSQMessagesToolbarButtonFactory.m */,
+				A04B0EBD1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.h */,
+				A04B0EBE1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.m */,
 			);
 			path = Factories;
 			sourceTree = "<group>";
@@ -741,6 +746,7 @@
 				88A25FCB19D8E01A00924534 /* JSQMessagesCollectionViewCell.m in Sources */,
 				88A25FBB19D8E01A00924534 /* JSQMessagesViewController.m in Sources */,
 				8885734D19DE55D000E89D20 /* NSUserDefaults+DemoSettings.m in Sources */,
+				A04B0EBF1D6ADE5800FBDC47 /* JSQMessagesVideoThumbnailFactory.m in Sources */,
 				544A32211CB2EE380084BFC0 /* JSQAudioMediaViewAttributes.m in Sources */,
 				883C11781A09FB100092A16D /* JSQMessagesCellTextView.m in Sources */,
 				88A25FB919D8E01A00924534 /* UIView+JSQMessages.m in Sources */,

JSQMessagesDemo/Base.lproj/Localizable.strings

@@ -21,6 +21,7 @@
 "Send photo" = "Send photo";
 "Send location" = "Send location";
 "Send video" = "Send video";
+"Send video thumbnail" = "Send video with thumbnail";
 "Custom Action" = "Custom Action";
 "OK" = "OK";
 

JSQMessagesDemo/DemoMessagesViewController.m

@@ -365,7 +365,7 @@ - (void)didPressAccessoryButton:(UIButton *)sender
                                                        delegate:self
                                               cancelButtonTitle:NSLocalizedString(@"Cancel", nil)
                                          destructiveButtonTitle:nil
-                                              otherButtonTitles:NSLocalizedString(@"Send photo", nil), NSLocalizedString(@"Send location", nil), NSLocalizedString(@"Send video", nil), NSLocalizedString(@"Send audio", nil), nil];
+                                              otherButtonTitles:NSLocalizedString(@"Send photo", nil), NSLocalizedString(@"Send location", nil), NSLocalizedString(@"Send video", nil), NSLocalizedString(@"Send video thumbnail", nil), NSLocalizedString(@"Send audio", nil), nil];
 
     [sheet showFromToolbar:self.inputToolbar];
 }
@@ -397,6 +397,10 @@ - (void)actionSheet:(UIActionSheet *)actionSheet didDismissWithButtonIndex:(NSIn
             break;
 
         case 3:
+            [self.demoData addVideoMediaMessageWithThumbnail];
+            break;
+            
+        case 4:
             [self.demoData addAudioMediaMessage];
             break;
     }

JSQMessagesDemo/DemoModelData.h

@@ -58,6 +58,8 @@ static NSString * const kJSQDemoAvatarIdWoz = @"309-41802-93823";
 
 - (void)addVideoMediaMessage;
 
+- (void)addVideoMediaMessageWithThumbnail;
+
 - (void)addAudioMediaMessage;
 
 @end

JSQMessagesDemo/DemoModelData.m

@@ -200,4 +200,16 @@ - (void)addVideoMediaMessage
     [self.messages addObject:videoMessage];
 }
 
+- (void)addVideoMediaMessageWithThumbnail
+{
+    // don't have a real video, just pretending
+    NSURL *videoURL = [NSURL URLWithString:@"file://"];
+    
+    JSQVideoMediaItem *videoItem = [[JSQVideoMediaItem alloc] initWithFileURL:videoURL isReadyToPlay:YES thumbnailImage:[UIImage imageNamed:@"goldengate"]];
+    JSQMessage *videoMessage = [JSQMessage messageWithSenderId:kJSQDemoAvatarIdSquires
+                                                   displayName:kJSQDemoAvatarDisplayNameSquires
+                                                         media:videoItem];
+    [self.messages addObject:videoMessage];
+}
+
 @end

JSQMessagesViewController/Factories/JSQMessagesVideoThumbnailFactory.h

@@ -0,0 +1,49 @@
+//
+//  JSQMessagesVideoThumbnailFactory.h
+//  JSQMessages
+//
+//  Created by Xi Huang on 8/22/16.
+//  Copyright © 2016 Hexed Bits. All rights reserved.
+//
+
+#import <AVFoundation/AVFoundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+/**
+ *  A completion handler block for a `JSQMessagesVideoThumbnailFactory`. See `customThumbnailWithVideoMediaAsset: withCompletionHandler:`.
+ */
+typedef void (^JSQMessagesVideoThumbnailCompletionBlock)(UIImage * _Nullable, NSError * _Nullable);
+
+/**
+ *  `JSQMessagesVideoThumbnailFactory` is a factory that provides a means for generating a thumbnail image with a given media item.
+ */
+@interface JSQMessagesVideoThumbnailFactory : NSObject
+
+/**
+ *  Generates and returns a thumbnail image for the specified video media asset with the default CMTimeMakeWithSeconds(1, 2).
+ *
+ *  The specified block is executed upon completion of generating the thumbnail image and is executed on the app’s main thread.
+ *
+ *  @param videoMediaAsset  The instance of AVURLAsset for the video media item.
+ *  @param completion       The block to call after the thumbnail has been generated.
+ */
++ (void)customThumbnailWithVideoMediaAsset:(AVURLAsset *)videoMediaAsset
+                     withCompletionHandler:(JSQMessagesVideoThumbnailCompletionBlock)completion;
+
+/**
+ *  Generates and returns a thumbnail image for the specified video media asset with a given CMTime.
+ *
+ *  The specified block is executed upon completion of generating the thumbnail image and is executed on the app’s main thread.
+ *
+ *  @param videoMediaAsset The instance of AVURLAsset for the video media item.
+ *  @param time            The CMTime struct for capturing the thumbnail image from the video media item.
+ *  @param completion      The block to call after the thumbnail has been generated.
+ */
++ (void)customThumbnailWithVideoMediaAsset:(AVURLAsset *)videoMediaAsset
+                                      time:(CMTime)time
+                     withCompletionHandler:(JSQMessagesVideoThumbnailCompletionBlock)completion;
+
+@end
+
+NS_ASSUME_NONNULL_END

JSQMessagesViewController/Factories/JSQMessagesVideoThumbnailFactory.m

@@ -0,0 +1,55 @@
+//
+//  JSQMessagesVideoThumbnailFactory.m
+//  JSQMessages
+//
+//  Created by Xi Huang on 8/22/16.
+//  Copyright © 2016 Hexed Bits. All rights reserved.
+//
+
+#import "JSQVideoMediaItem.h"
+
+#import "JSQMessagesVideoThumbnailFactory.h"
+#import "JSQMessagesBubbleImageFactory.h"
+
+#import "UIImage+JSQMessages.h"
+
+@implementation JSQMessagesVideoThumbnailFactory
+
++ (void)customThumbnailWithVideoMediaAsset:(AVURLAsset *)videoMediaAsset
+                     withCompletionHandler:(JSQMessagesVideoThumbnailCompletionBlock)completion {
+    
+    [JSQMessagesVideoThumbnailFactory customThumbnailWithVideoMediaAsset:videoMediaAsset
+                                                                    time:CMTimeMakeWithSeconds(1, 2)
+                                                   withCompletionHandler:completion];
+}
+
++ (void)customThumbnailWithVideoMediaAsset:(AVURLAsset *)videoMediaAsset
+                                      time:(CMTime)time
+                     withCompletionHandler:(JSQMessagesVideoThumbnailCompletionBlock)completion {
+    
+    NSParameterAssert(videoMediaAsset != nil);
+    
+    AVAssetImageGenerator *generate = [[AVAssetImageGenerator alloc] initWithAsset:videoMediaAsset];
+    generate.appliesPreferredTrackTransform = YES;
+    
+    if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPad) {
+        generate.maximumSize = CGSizeMake(315.0f, 225.0f);
+    }
+    else {
+        generate.maximumSize = CGSizeMake(210.0f, 150.0f);
+    }
+    [generate generateCGImagesAsynchronouslyForTimes:[NSArray arrayWithObject:[NSValue valueWithCMTime:time]]
+                                   completionHandler:^(CMTime requestedTime, CGImageRef im, CMTime actualTime, AVAssetImageGeneratorResult result, NSError *error){
+                                       
+                                       if (completion) {
+                                           if (result == AVAssetImageGeneratorSucceeded) {
+                                               completion([UIImage imageWithCGImage:im], nil);
+                                           }
+                                           else {
+                                               completion(nil, error);
+                                           }
+                                       }
+                                   }];
+}
+
+@end

JSQMessagesViewController/Model/JSQVideoMediaItem.h

@@ -33,6 +33,11 @@ NS_ASSUME_NONNULL_BEGIN
  */
 @property (nonatomic, strong, nullable) NSURL *fileURL;
 
+/**
+ *  Adding an image to mask behind the video.
+ */
+@property (nonatomic, strong, nullable) UIImage *thumbnailImage;
+
 /**
  *  A boolean value that specifies whether or not the video is ready to be played.
  * 
@@ -55,6 +60,23 @@ NS_ASSUME_NONNULL_BEGIN
  */
 - (instancetype)initWithFileURL:(nullable NSURL *)fileURL isReadyToPlay:(BOOL)isReadyToPlay;
 
+/**
+ *  Initializes and returns a video media item having the given fileURL.
+ *
+ *  @param fileURL          The URL that identifies the video resource.
+ *  @param isReadyToPlay    A boolean value that specifies if the video is ready to play.
+ *  @param thumbnailImage   The background thumbnail for the video.
+ *
+ *  @return An initialized `JSQVideoMediaItem` if successful, `nil` otherwise.
+ *
+ *  @discussion If the video must be downloaded from the network,
+ *  you may initialize a `JSQVideoMediaItem` with a `nil` fileURL or specify `NO` for
+ *  isReadyToPlay. Once the video has been saved to disk, or is ready to stream, you can
+ *  set the fileURL property or isReadyToPlay property, respectively. The background thumbnail
+ *  is optional.
+ */
+- (instancetype)initWithFileURL:(NSURL *)fileURL isReadyToPlay:(BOOL)isReadyToPlay thumbnailImage:(nullable UIImage *)thumbnailImage;
+
 @end
 
 NS_ASSUME_NONNULL_END

JSQMessagesViewController/Model/JSQVideoMediaItem.m

@@ -20,6 +20,7 @@
 
 #import "JSQMessagesMediaPlaceholderView.h"
 #import "JSQMessagesMediaViewBubbleImageMasker.h"
+#import "JSQMessagesVideoThumbnailFactory.h"
 
 #import "UIImage+JSQMessages.h"
 
@@ -36,12 +37,18 @@ @implementation JSQVideoMediaItem
 #pragma mark - Initialization
 
 - (instancetype)initWithFileURL:(NSURL *)fileURL isReadyToPlay:(BOOL)isReadyToPlay
+{
+    return [self initWithFileURL:fileURL isReadyToPlay:isReadyToPlay thumbnailImage:nil];
+}
+
+- (instancetype)initWithFileURL:(NSURL *)fileURL isReadyToPlay:(BOOL)isReadyToPlay thumbnailImage:(UIImage *)thumbnailImage
 {
     self = [super init];
     if (self) {
         _fileURL = [fileURL copy];
         _isReadyToPlay = isReadyToPlay;
         _cachedVideoImageView = nil;
+        _thumbnailImage = thumbnailImage;
     }
     return self;
 }
@@ -85,12 +92,25 @@ - (UIView *)mediaView
         UIImage *playIcon = [[UIImage jsq_defaultPlayImage] jsq_imageMaskedWithColor:[UIColor lightGrayColor]];
 
         UIImageView *imageView = [[UIImageView alloc] initWithImage:playIcon];
-        imageView.backgroundColor = [UIColor blackColor];
         imageView.frame = CGRectMake(0.0f, 0.0f, size.width, size.height);
         imageView.contentMode = UIViewContentModeCenter;
         imageView.clipsToBounds = YES;
         [JSQMessagesMediaViewBubbleImageMasker applyBubbleImageMaskToMediaView:imageView isOutgoing:self.appliesMediaViewMaskAsOutgoing];
-        self.cachedVideoImageView = imageView;
+        
+        if (_thumbnailImage) {
+            UIImageView *thumbnailImageView = [[UIImageView alloc] initWithImage:_thumbnailImage];
+            thumbnailImageView.frame = CGRectMake(0.0f, 0.0f, size.width, size.height);
+            thumbnailImageView.contentMode = UIViewContentModeCenter;
+            thumbnailImageView.clipsToBounds = YES;
+            [JSQMessagesMediaViewBubbleImageMasker applyBubbleImageMaskToMediaView:thumbnailImageView isOutgoing:self.appliesMediaViewMaskAsOutgoing];
+            imageView.backgroundColor = [UIColor clearColor];
+            [thumbnailImageView addSubview:imageView];
+            self.cachedVideoImageView = thumbnailImageView;
+        }
+        else {
+            imageView.backgroundColor = [UIColor blackColor];
+            self.cachedVideoImageView = imageView;
+        }
     }
 
     return self.cachedVideoImageView;
@@ -122,8 +142,8 @@ - (NSUInteger)hash
 
 - (NSString *)description
 {
-    return [NSString stringWithFormat:@"<%@: fileURL=%@, isReadyToPlay=%@, appliesMediaViewMaskAsOutgoing=%@>",
-            [self class], self.fileURL, @(self.isReadyToPlay), @(self.appliesMediaViewMaskAsOutgoing)];
+    return [NSString stringWithFormat:@"<%@: fileURL=%@, isReadyToPlay=%@, appliesMediaViewMaskAsOutgoing=%@>, thumbnailImage=%@",
+            [self class], self.fileURL, @(self.isReadyToPlay), @(self.appliesMediaViewMaskAsOutgoing), self.thumbnailImage];
 }
 
 #pragma mark - NSCoding
@@ -134,6 +154,7 @@ - (instancetype)initWithCoder:(NSCoder *)aDecoder
     if (self) {
         _fileURL = [aDecoder decodeObjectForKey:NSStringFromSelector(@selector(fileURL))];
         _isReadyToPlay = [aDecoder decodeBoolForKey:NSStringFromSelector(@selector(isReadyToPlay))];
+        _thumbnailImage = [aDecoder decodeObjectForKey:NSStringFromSelector(@selector(thumbnailImage))];
     }
     return self;
 }
@@ -143,14 +164,16 @@ - (void)encodeWithCoder:(NSCoder *)aCoder
     [super encodeWithCoder:aCoder];
     [aCoder encodeObject:self.fileURL forKey:NSStringFromSelector(@selector(fileURL))];
     [aCoder encodeBool:self.isReadyToPlay forKey:NSStringFromSelector(@selector(isReadyToPlay))];
+    [aCoder encodeBool:self.thumbnailImage forKey:NSStringFromSelector(@selector(thumbnailImage))];
 }
 
 #pragma mark - NSCopying
 
 - (instancetype)copyWithZone:(NSZone *)zone
 {
     JSQVideoMediaItem *copy = [[[self class] allocWithZone:zone] initWithFileURL:self.fileURL
-                                                                   isReadyToPlay:self.isReadyToPlay];
+                                                                   isReadyToPlay:self.isReadyToPlay
+                                                                  thumbnailImage:self.thumbnailImage];
     copy.appliesMediaViewMaskAsOutgoing = self.appliesMediaViewMaskAsOutgoing;
     return copy;
 }

README.md

@@ -74,6 +74,7 @@ Read the docs, [available here][docsLink] via [@CocoaDocs](https://twitter.com/C
 - Harlan Haskans ([**@harlanhaskins**](https://github.com/harlanhaskins))
 - Eli Burke ([**@eliburke**](https://github.com/eliburke))
 - Sebastian Ludwig ([**@sebastianludwig**](https://github.com/sebastianludwig))
+- Lucas Huang ([**@Lucashuang0802**](https://github.com/Lucashuang0802))
 
 ## Contributing