Merge pull request #332 from deltachat/custom_file_cells

tweak message design with file attachments

deltachat-ios/Controller/ChatViewController.swift

@@ -390,7 +390,7 @@ class ChatViewController: MessagesViewController {
             let cell = messagesCollectionView.dequeueReusableCell(MediaMessageCell.self, for: indexPath)
             cell.configure(with: message, at: indexPath, and: messagesCollectionView)
             return cell
-        case .photoText, .videoText:
+        case .photoText, .videoText, .fileText:
             let cell = messagesCollectionView.dequeueReusableCell(TextMediaMessageCell.self, for: indexPath)
             cell.configure(with: message, at: indexPath, and: messagesCollectionView)
             return cell

deltachat-ios/DC/Wrapper.swift

@@ -487,7 +487,17 @@ class DcMsg: MessageType {
         default:
             // TODO: custom views for audio, etc
             if let filename = self.filename {
-                return MessageKind.text("File: \(self.filename ?? "") (\(self.filesize) bytes)")
+                let fileSize = self.filesize / 1024
+                let fileString = "\(self.filename ?? "???") (\(self.filesize / 1024) kB)"
+                let attributedFileString = NSMutableAttributedString(string: fileString,
+                                                                     attributes: [NSAttributedString.Key.font: UIFont.italicSystemFont(ofSize: 13.0)])
+                if !text.isEmpty {
+                    attributedFileString.append(NSAttributedString(string: "\n\n",
+                                                                   attributes: [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 7.0)]))
+                    attributedFileString.append(NSAttributedString(string: text,
+                                                                   attributes: [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 16.0)]))
+                }
+                return MessageKind.fileText(Media(text: attributedFileString))
             }
             return MessageKind.text(text)
         }

deltachat-ios/MessageKit/Controllers/MessagesViewController.swift

@@ -284,7 +284,7 @@ UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {
             let cell = messagesCollectionView.dequeueReusableCell(MediaMessageCell.self, for: indexPath)
             cell.configure(with: message, at: indexPath, and: messagesCollectionView)
             return cell
-        case .photoText, .videoText:
+        case .photoText, .videoText, .fileText:
             let cell = messagesCollectionView.dequeueReusableCell(TextMediaMessageCell.self, for: indexPath)
             cell.configure(with: message, at: indexPath, and: messagesCollectionView)
             return cell
@@ -374,7 +374,7 @@ UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {
         let message = messagesDataSource.messageForItem(at: indexPath, in: messagesCollectionView)
 
         switch message.kind {
-        case .text, .attributedText, .emoji, .photo, .photoText, .videoText:
+        case .text, .attributedText, .emoji, .photo, .photoText, .videoText, .fileText:
             selectedIndexPathForMenu = indexPath
             return true
         default:
@@ -406,6 +406,10 @@ UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {
         case .photoText(let mediaItem), .videoText(let mediaItem):
             pasteBoard.image = mediaItem.image ?? mediaItem.placeholderImage
             pasteBoard.string = mediaItem.text?.string
+            pasteBoard.url = mediaItem.url
+        case .fileText(let mediaItem):
+            pasteBoard.url = mediaItem.url
+            pasteBoard.string = mediaItem.text?.string
         default:
             break
         }

deltachat-ios/MessageKit/Layout/MessagesCollectionViewFlowLayout.swift

@@ -193,7 +193,7 @@ open class MessagesCollectionViewFlowLayout: UICollectionViewFlowLayout {
             return emojiMessageSizeCalculator
         case .photo:
             return photoMessageSizeCalculator
-        case .photoText, .videoText:
+        case .photoText, .videoText, .fileText:
             return textMediaMessageSizeCalculator
         case .video:
             return videoMessageSizeCalculator

deltachat-ios/MessageKit/Layout/TextMediaMessageSizeCalculator.swift

@@ -60,7 +60,7 @@ open class TextMediaMessageSizeCalculator: MessageSizeCalculator {
 
             var messageContainerSize = CGSize(width: itemWidth, height: imageHeight)
             switch message.kind {
-            case .photoText(let mediaItem), .videoText(let mediaItem):
+            case .photoText(let mediaItem), .videoText(let mediaItem), .fileText(let mediaItem):
                 if let text = mediaItem.text {
                     let textHeight = text.height(withConstrainedWidth: maxTextWidth)
                     messageContainerSize.height += textHeight
@@ -73,7 +73,7 @@ open class TextMediaMessageSizeCalculator: MessageSizeCalculator {
         }
 
         switch message.kind {
-        case .photoText(let item), .videoText(let item):
+        case .photoText(let item), .videoText(let item), .fileText(let item):
             return sizeForMediaItem(maxImageWidth, item)
         default:
             fatalError("messageContainerSize received unhandled MessageDataType: \(message.kind)")
@@ -89,7 +89,7 @@ open class TextMediaMessageSizeCalculator: MessageSizeCalculator {
         let message = dataSource.messageForItem(at: indexPath, in: messagesLayout.messagesCollectionView)
 
         switch message.kind {
-        case .photoText, .videoText:
+        case .photoText, .videoText, .fileText:
             attributes.messageLabelInsets = messageLabelInsets(for: message)
             attributes.messageLabelFont = messageLabelFont
         default:

deltachat-ios/MessageKit/Models/MessageKind.swift

@@ -45,6 +45,9 @@ public enum MessageKind {
     /// A photo message with a textual description
     case photoText(MediaItem)
 
+    /// A file message with an optional text
+    case fileText(MediaItem)
+
     /// A video message.
     case video(MediaItem)
 

deltachat-ios/MessageKit/Views/Cells/TextMediaMessageCell.swift

@@ -34,6 +34,12 @@ open class TextMediaMessageCell: MessageContentCell {
         return playButtonView
     }()
 
+    open lazy var fileView: UIImageView = {
+        let fileView = UIImageView(image: UIImage(named: "ic_attach_file_36pt"))
+        fileView.translatesAutoresizingMaskIntoConstraints = false
+        return fileView
+    }()
+
     // MARK: - Methods
 
     open override func apply(_ layoutAttributes: UICollectionViewLayoutAttributes) {
@@ -56,7 +62,7 @@ open class TextMediaMessageCell: MessageContentCell {
     }
 
     /// Responsible for setting up the constraints of the cell's subviews.
-    open func setupConstraints() {
+    open func setupConstraints(for messageKind: MessageKind) {
         messageContainerView.removeConstraints(messageContainerView.constraints)
         let imageViewHeight = messageContainerView.frame.height - getMessageLabelHeight()
 
@@ -66,18 +72,27 @@ open class TextMediaMessageCell: MessageContentCell {
                                     imageView.constraintAlignTopTo(messageContainerView),
                                     imageView.heightAnchor.constraint(equalToConstant: imageViewHeight)
                                     ]
-
         messageContainerView.addConstraints(imageViewConstraints)
 
-        playButtonView.constraint(equalTo: CGSize(width: 35, height: 35))
-        let playButtonViewConstraints = [ playButtonView.constraintCenterXTo(imageView),
-                                          playButtonView.constraintCenterYTo(imageView)]
-        messageContainerView.addConstraints(playButtonViewConstraints)
-
         messageLabel.frame = CGRect(x: 0,
                                     y: messageContainerView.frame.height - getMessageLabelHeight(),
                                     width: messageContainerView.frame.width,
                                     height: getMessageLabelHeight())
+
+        switch messageKind {
+        case .videoText:
+            playButtonView.constraint(equalTo: CGSize(width: 35, height: 35))
+            let playButtonViewConstraints = [ playButtonView.constraintCenterXTo(imageView),
+                                              playButtonView.constraintCenterYTo(imageView)]
+            messageContainerView.addConstraints(playButtonViewConstraints)
+        case .fileText:
+            fileView.constraint(equalTo: CGSize(width: 35, height: 35))
+            let fileViewConstraints = [ fileView.constraintCenterXTo(imageView),
+                                                         fileView.constraintCenterYTo(imageView)]
+            messageContainerView.addConstraints(fileViewConstraints)
+        default:
+            break
+        }
     }
 
     open override func prepareForReuse() {
@@ -91,6 +106,7 @@ open class TextMediaMessageCell: MessageContentCell {
         super.setupSubviews()
         messageContainerView.addSubview(imageView)
         messageContainerView.addSubview(playButtonView)
+        messageContainerView.addSubview(fileView)
         messageContainerView.addSubview(messageLabel)
     }
 
@@ -102,31 +118,44 @@ open class TextMediaMessageCell: MessageContentCell {
         }
 
         switch message.kind {
-        case .photoText(let mediaItem):
-            configureImageView(for: mediaItem)
-            configureMessageLabel(for: mediaItem,
-                                  with: displayDelegate,
-                                  message: message,
-                                  at: indexPath,
-                                  in: messagesCollectionView)
-            playButtonView.isHidden = true
-        case .videoText(let mediaItem):
+        case .photoText(let mediaItem), .videoText(let mediaItem), .fileText(let mediaItem):
             configureImageView(for: mediaItem)
             configureMessageLabel(for: mediaItem,
                                   with: displayDelegate,
                                   message: message,
                                   at: indexPath,
                                   in: messagesCollectionView)
-            playButtonView.isHidden = false
+
         default:
             fatalError("Unexpected message kind in TextMediaMessageCell")
         }
-        setupConstraints()
+
+        configurePlayButtonView(for: message.kind)
+        configureFileView(for: message.kind)
+        setupConstraints(for: message.kind)
 
         displayDelegate.configureMediaMessageImageView(imageView, for: message, at: indexPath, in: messagesCollectionView)
     }
 
 
+    func configurePlayButtonView(for messageKind: MessageKind) {
+        switch messageKind {
+        case .videoText:
+            playButtonView.isHidden = false
+        default:
+            playButtonView.isHidden = true
+        }
+    }
+
+    func configureFileView(for messageKind: MessageKind) {
+        switch messageKind {
+        case .fileText:
+            fileView.isHidden = false
+        default:
+            fileView.isHidden = true
+        }
+    }
+
     func configureImageView(for mediaItem: MediaItem) {
         imageView.image = mediaItem.image ?? mediaItem.placeholderImage
     }